<template>
  <v-container>
    <v-data-table
      :headers="headers"
      :items="orders"
      :items-per-page="5"
      class="elevation-1"
    />
  </v-container>
</template>

<script>
import { getVipOrder } from '@/api/user/user'

export default {
  data() {
    return {
      headers: [
        {
          text: '套餐',
          align: 'start',
          sortable: false,
          value: 'plan'
        },
        { text: '单价', value: 'price' },
        { text: '数量', value: 'num' },
        { text: '交易状态', value: 'status' },
        { text: '创建时间', value: 'createdAt' }
      ],
      orders: []
    }
  },
  created() {
    this.windowSize = { x: window.innerWidth, y: window.innerHeight }
    getVipOrder().then(res => {
      if (res.code === 0) {
        this.orders = []
        const resData = res.data
        for (const item of resData) {
          this.orders.push(item)
        }
      }
    })
  },
  methods: {
    onResize() {
      this.windowSize = { x: window.innerWidth, y: window.innerHeight }
      if (this.windowSize.x < 700) {
        this.cols = 12
      } else {
        this.cols = 5
      }
    }
  }
}
</script>

<style>

</style>
