<template>
  <view class="container">
    <u-sticky style="margin-top: 15rpx; margin-left: 20rpx" bgColor="#fff">
      <u-tabs lineWidth="40" :list="list" :current="current" @change="handlerChangeItem" />
    </u-sticky>

    <!-- 订单 -->
    <view>
      <view v-if="init_list.length > 0"> 1111111111 </view>
      <view v-else style="margin-top: 40rpx">
        <u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" />
      </view>
    </view>
  </view>
</template>

<script>
import { userOrdersApi } from '@/api/client/order';
export default {
  data() {
    return {
      current: 0,
      type: 'ALL',
      size: 20,
      list: [
        {
          name: '全部',
          type: 'ALL',
        },
        {
          name: '待付款',
          type: 'WAIT_PAY',
        },
        {
          name: '已付款',
          type: 'WAIT_EVALUATE',
        },
        {
          name: '待评价',
          type: 'CANCELLED',
        },
      ],
      init_list: [],
    };
  },
  mounted() {
    this.userOrdersPage();
  },

  methods: {
    handlerChangeItem(data) {
      this.current = data.index;
      this.type = data.type;
      this.userOrdersPage(this.type);
    },

    async userOrdersPage(type) {
      let orderStatus = type == undefined ? 'ALL' : `${type}`;
      let res = await userOrdersApi({
        orderStatus,
        size: this.size,
      });

      if ((res.code = 200 && res.data)) {
        this.init_list = res.data;
      }
    },
  },
};
</script>

<style lang="scss" scoped>
::deep .u-tabs__wrapper__nav__item__text {
  font-size: 30px;
}
</style>
