<template>
  <view>
    <view class="container">
      <view v-if="list.status !== 'empty'">
        <view class="record" v-for="(item, index) in list.data" :key="item.id">
          <view class="left">
            <view class="title">
              奖金提现
              <span class="subtltle" :class="[item.is_success ? 'subtltle_arrival' : '']">{{ item.is_success ? '已通过' : '待审核' }}</span>
            </view>
            <view class="date"
              >订单编号 {{ item.order_num }}
              <span
                @click="onCopy(item, index)"
                style="margin-left: 8rpx; padding: 0 12rpx; background: #ececec; border-radius: 20rpx; font-size: 22rpx; text-align: center; color: #666666; line-height: 32rpx"
                >复制</span
              ></view
            >
            <view class="date">{{ item.created }}</view>
          </view>
          <view class="right">
            <view class="number">￥{{ getPrice(item.amount) }}.00</view>
          </view>
        </view>
        <LoadMore :status="list.status" />
      </view>

      <view v-if="list.status === 'empty'" class="data_none">
        <image mode="aspectFill" class="data_img" src="/static/pic_wushuju@2x.png" />
        <view class="data_title">暂无数据</view>
      </view>
    </view>
  </view>
</template>

<script>
import { createList, getList } from '@/utils/list';
import LoadMore from '@/components/LoadMore';
import { myCopy } from '@/utils/util';

export default {
  components: { LoadMore },
  data() {
    return {
      record: [],

      list: createList(),
    };
  },

  onLoad(query) {
    this.fetchList();
  },

  async onPullDownRefresh() {
    this.list = createList();
    await this.fetchList();
    uni.stopPullDownRefresh();
  },

  onReachBottom() {
    this.fetchList();
  },

  methods: {
    async fetchList() {
      await getList(this, 'list', ['/api/withdrawal_record/list', {}]);
    },

    onCopy(item, index) {
      myCopy(item.order_num);
    },
  },
};
</script>

<style scoped lang="scss">
@import 'index.scss';
</style>
