<template>
    <view class="cert-page">
        <u-navbar
            class="navbarHeigth"
            back-icon-color="#000000"
            :background="background"
            title-color="#000"
            :border-bottom="false"
            title="我的证件"
            title-bold="true"
        ></u-navbar>
        <view class="content-cody">
            <u-cell-group :border="false">
                <u-cell-item v-for="(item, index) in list" :title="item.name" :value="item.isUploadName" :arrow="true" :key="index"
                 :value-style="{'color': item.color,'padding-left':'30rpx','padding-right':'30rpx'}" @click="toDetail(item.keyName)" 
                 :title-style="{'padding-left':'20rpx'}">
                    <u-icon slot="icon" size="32" name="checkmark-circle" :color="item.iconColor"></u-icon>
                </u-cell-item>
            </u-cell-group>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                list: {
                    id_card: {
                        name: "身份证",
                        isUpload: false,
                        isUploadName: "未上传",
                        keyName: "id_card",
                        color: "#999999",
                        desc: ['身份证人像面', '身份证国徽面'],
                        data: {}
                    },
                    electrician_certificate: {
                        name: "电工证",
                        isUpload: false,
                        isUploadName: "未上传",
                        keyName: "electrician_certificate",
                        color: "#999999",
                        desc: ['电工证正面'],
                        data: {}
                    },
                    driver_license: {
                        name: "驾驶证",
                        isUpload: false,
                        isUploadName: "未上传",
                        keyName: "driver_license",
                        color: "#999999",
                        desc: ['驾驶证正面'],
                        data: {}
                    },
                    driving_license: {
                        name: "行驶证",
                        isUpload: false,
                        isUploadName: "未上传",
                        keyName: "driving_license",
                        color: "#999999",
                        desc: ['行驶证正面'],
                        data: {}
                    },
                    vehicle: {
                        name: "车辆照",
                        isUpload: false,
                        isUploadName: "未上传",
                        keyName: "vehicle",
                        color: "#999999",
                        desc: ['车辆正面/看到车牌', '车辆侧面/看到外观'],
                        data: {}
                    },
                    high_sky_license: {
                        name: "高空证",
                        isUpload: false,
                        isUploadName: "未上传",
                        keyName: "high_sky_license",
                        color: "#999999",
                        desc: ['高空证正面'],
                        data: {}
                    },
                    refrigeration_license: {
                        name: "制冷证",
                        isUpload: false,
                        isUploadName: "未上传",
                        keyName: "refrigeration_license",
                        color: "#999999",
                        desc: ['制冷证正面'],
                        data: {}
                    },
                    business_license: {
                        name: "营业执照",
                        isUpload: false,
                        isUploadName: "未上传",
                        keyName: "business_license",
                        color: "#999999",
                        desc: ['营业执照正面'],
                        data: {}
                    },
                },
                isRuZhu: false,
            }
        },
        onLoad() {
			getApp().trackPage('我的证件列表页')
            let that = this;
            this.$u.api
                .getCertList()
                .then((res) => {
                    if(res.code != 200){
                        return
                    }
                    this.isRuZhu = true
                    for(let key in this.list){
                        if(res.data.length <= 0){
                            this.list[key].data = {}
                        }else{
                            let getData = res.data[key];
                            this.list[key].isUpload = getData.status;
                            this.list[key].isUploadName = getData.status == 1 ? '已上传' : '未上传';
                            this.list[key].color = getData.status != 1 ? "#999999" : "#2272FF";
                            this.list[key].iconColor = getData.status != 1 ? "#999999" : "#2272FF";
                            this.list[key].data = getData;
                        }
                    }
                }).catch((err) => {
                    this.isRuZhu = false;
                });
        },
        methods: {
            isUpload(typeBool) {
                return typeBool ? '已上传' : '未上传'
            },
            toDetail(key) {
                let data = null;
                if(!this.isRuZhu){
                    uni.showToast({
                        icon: "none",
                        title: "您当前未入驻，暂无法上传证件",
                    });
                    return
                    // data = {
                    //     type: key,
                    //     url: "",
                    //     desc: this.list[key].desc,
                    //     status: 0,
                    //     type_key: key
                    // }
                }else{
                    data = this.list[key].data;
                    data.desc = this.list[key].desc;
                }
                if(data.status != 1){
                    wx.navigateTo({
                        url: '/pages/mine/cert/upload?type=' + data.type_key
                    });
                }else{
                    wx.navigateTo({
                        url: '/pages/mine/cert/detail',
                        success: function(res) {
                            res.eventChannel.emit('acceptDataFromCert', data)
                        }
                    });
                }
            }
        }
    }
</script>

<style>
    .cert-page {
        font-size: 28rpx;
        margin: 30rpx;
        height: 100vh;
        display: flex;
        flex-direction: column;
    }
    .content-cody {
        padding: 30rpx;
        background-color: #ffffff;
        border-radius: 12rpx;
        height: 82vh;
    }
    .rightBlue {
        color: #007AFF;
    }
    
    .u-cell {
        padding: 26rpx 0 !important;
    }
</style>
