<template>
  <view class="write-off-list">
      <view class="wol-btn" hover-class="hover-active" @click="scanCode">
          <image mode="aspectFit" src="/static/images/icon/scan_code_btn.png"></image>
      </view>
      <view class="wol-bar">今日核销订单({{orderList.length || 0}})</view>
      <view class="wol-list">
          <view class="wl-item" v-for="e in orderList" :key="e.id">
              <view class="wi-header">
                  <view>{{e.stadium_name || '-'}}</view>
                  <view>{{ZH_status(e.pay_type || '')}}</view>
              </view>
              <view class="wi-info">
                  <view class="wi-line">
                      <view>订单编号：</view>
                      <view>
                          <view>{{e.order_no || '-'}}</view>
                      </view>
                  </view>
                  <view class="wi-line">
                      <view>用户昵称：</view>
                      <view>
                          <view>{{e.nickname || '-'}} </view>
                      </view>
                  </view>
                  <view class="wi-line">
                      <view>支付时间：</view>
                      <view>
                          <view>{{e.pay_time || '-'}}</view>
                      </view>
                  </view>
                  <view class="wi-line">
                      <view> 预定日期：</view>
                      <view>
                          <view>{{ZH_order_date(e.date || '') || '-'}}</view>
                      </view>
                  </view>
                  <view class="wi-line">
                      <view>预定场次：</view>
                      <view>
                          <view  v-for="k in e.sessions" :key="k.id">{{k.venue_name+' '}}{{' '+k.duration}} </view>
                      </view>
                  </view>
              </view>
              <view class="wi-total">
                  <view>核销时间：{{e.verify_time || '-'}}</view>
                  <view>共{{e.sessions.length || 0}}场次</view>
              </view>
          </view>
      </view>
  </view>
</template>

<script>
import { API } from '../../../js/api';
import { servers } from '../../../js/server';
import util from '../../../utils/util'
export default {
    computed: {
        ZH_status(){
            return status=> (['未支付','待使用','已使用','已失效','已退款'][status] || '-') // 订单状态[-1已作废0未支付1已支付待使用2已使用3已失效4已退款]
        },
        ZH_order_date(){
            return date => {
                if(!date)return '-'
                let _date = date.replace(/\-/gi,'/');
                return `${util.get_zh_date(_date)}   ${util.get_zh_day(_date)}`;
            }
        },
    },
    data(){
        return {
            orderList: []
        }
    },
    onLoad(){
        this.getOrderList(true);
    },
    methods: {
        scanCode(){
            uni.scanCode({
                success: res=>{
                    let { result } = res;

                    if(
                        res.scanType !== 'QR_CODE' || 
                        result.indexOf('brand_id') == -1 || 
                        result.indexOf('stadium_id') == -1 || 
                        result.indexOf('verify_code') == -1
                    ){
                        return util.showNone('无法识别！');
                    }

                    util.routeTo(`/pages/write_off/confirm/confirm?query=${res.result}`,'nT');
                },
                fail: err=>{
                    if(err.errMsg&&err.errMsg.indexOf('cancel')!=-1)return;
                    console.log(err)
                    util.showNone('扫码失败！')
                }
            })
            
        },
        // confirm 页刷新列表
        getOrderList(isLoad){  
            if(isLoad)util.showLoad();
            servers.get({
                url: API.verifiedOrderList,
                data: {
                    status: 1, // 只获取待使用订单
                },
                failMsg: '获取订单列表失败！'
            })
            .then(res=>{
                if(isLoad)util.hideLoad();
                let _list = res.list || [];
                this.orderList = _list;
            })
            .catch(util.hideLoad)
        }
    }
}
</script>

<style lang="scss" scoped>
    @import "../../../style/public.scss";
    .write-off-list{
        padding-top: 24upx;
        .wol-btn{
            margin: 0 auto 24upx;
            height: 360upx;
            width: 702upx;
            border-radius: 10upx;
            background-color: #fff;
            @include centerFlex(center);
            >image{
                width: 172upx;
                height: 172upx;
            }
        }
        .wol-bar{
            margin: 0 auto 24upx;
            height: 112upx;
            width: 702upx;
            border-radius: 10upx;
            line-height: 112upx;
            text-align: center;
            font-size: 32upx;
            font-weight: 500;
            color: #1a1a1a;
            background-color: #fff;
        }
        .wol-list{
            padding: 0 24upx;
            .wl-item{
                margin-bottom: 24upx;
                >view{
                    padding: 0 20upx;
                    background-color: #fff;
                }
                .wi-header{
                    height: 96upx;
                    border-bottom: 2upx solid #D8D8D8;
                    border-radius: 10upx 10upx 0 0;
                    @include centerFlex(space-between);
                    >view{
                        &:first-child{
                            flex-grow: 1;
                            line-height: 40upx;
                            font-size: 28upx;
                            color: #1a1a1a;
                            @include textHide(1);
                        }
                        &+view{
                            flex-shrink: 0;
                            margin-left: 20upx;
                            line-height: 40upx;
                            font-size: 28upx;
                            color: #9c9c9f;
                        }
                    }
                }
                .wi-info{
                    padding: 20upx;
                    border-bottom: 2upx solid #D8D8D8;
                    .wi-line{
                        display: flex;
                        view{
                            margin-bottom: 6upx;
                            line-height: 34upx;
                            font-size: 24upx;
                            color: #9c9c9f;
                            &:first-child{
                                flex-shrink: 0;
                            }
                            &+view{
                                flex-grow: 1;
                                >view{
                                    @include textHide(1);
                                }
                            }
                        }

                    }
                }
                .wi-total{
                    height: 90upx;
                    border-radius: 0 0 10upx 10upx;
                    @include centerFlex(space-between);
                    >view{
                        font-size: 24upx;
                        color: #1a1a1a;
                    }

                }
            }
        }
    }
</style>