<template>
    <view class="check-in">
        <view class="head row bothSide verCenter">
            <view class="row verCenter">
                <text class="iconfont icon-riqi1"></text>
                <text class="tt">报关日期选择</text>
            </view>
            <view class="time-box">
                <picker mode="date" :value="date" fields="month" @change="bindDateChange">
                    <view class="row verCenter">
                        <view class="uni-input">{{ date }}</view>
                        <text class="iconfont icon-sanjiaoxing3"></text>
                    </view>
                </picker>
            </view>
        </view>
        <view class="title row verCenter">
            <text class="arrow"></text>
            <text class="tt">报关单列表</text>
        </view>
        <view class="uni-table">
            <view class="uni-th row">
                <text class="row verCenter rowCenter">报关时间</text>
                <text class="row verCenter rowCenter">查车确认</text>
                <text class="row verCenter rowCenter">通关确认</text>
                <text class="row verCenter rowCenter">入库确认</text>
                <text class="row verCenter rowCenter">未来</text>
            </view>
            <template v-if="list.length > 0">
                <view class="uni-tr row verCenter" v-for="(item, index) in list" :key="index">
                    <text class="row verCenter rowCenter">{{ item.date || '-' }}</text>
                    <text class="row verCenter rowCenter">{{ item.car_confirm_time || '-' }}</text>
                    <text class="row verCenter rowCenter">{{ item.pass_customs_time || '-' }}</text>
                    <text class="row verCenter rowCenter">{{ item.sz_getgoods_time || '-' }}</text>
                    <text class="row verCenter rowCenter">{{ item.no_num }}</text>
                </view>
            </template>
            <template v-else>
                <view class="uni-tr row verCenter"><text class="row verCenter rowCenter" style="flex:0 0 100%">暂无数据</text></view>
            </template>
        </view>
    </view>
</template>

<script>
import { API } from '@/util/api.js';
export default {
    data() {
        const currentDate = this.getDate({
            format: true
        });
        return {
            date: currentDate,
            list: []
        };
    },
    onShow() {
        this.getData();
    },
    methods: {
        bindDateChange: function(e) {
            this.date = e.detail.value;
            this.getData();
        },
        getDate() {
            const date = new Date();
            let year = date.getFullYear();
            let month = date.getMonth() + 1;
            let day = date.getDate();
            month = month > 9 ? month : '0' + month;
            day = day > 9 ? day : '0' + day;
            return `${year}-${month}`;
        },
        getData() {
            this.request(API.getCustomsDeclarationAndReceiptStatistics, 'GET', { date: this.date }, true).then(res => {
                if (res.err_code === 0) {
                    if (res.data.length > 0) {
                        this.is_loading = false;
                        this.list = res.data;
                    } else {
                        this.list = [];
                    }
                } else {
                    uni.showToast({
                        title: res.err_msg,
                        icon: 'error'
                    });
                }
            });
        }
    }
};
</script>

<style lang="scss">
@import '../../assets/css/declaration/checkIn.scss';
</style>