<template>
    <div class="page">
        <div class="audit-message" v-if="companyInfo.companyAudit.status == 2">
            <p class="title">审核拒绝</p>
            <div class="message">
                <p>拒绝原因</p>
                {{ companyInfo.companyAudit.auditMessage }}
            </div>
        </div>
        <view class="image-wrap">
            <div class="title" v-if="companyInfo.companyAudit.status == 2">重新提交</div>
            <image
                v-if="companyInfo.companyAudit.licensePath"
                :src="evn.APP_IMAGE_BASE_API + companyInfo.companyAudit.licensePath"
                mode=""
            />
            <view>注：接受拍摄复印件，黑白复印需要加盖公章，大小不超过10M</view>
        </view>
        <view class="content-wrap">
            <view class="item">
                <view class="label"> 企业全称 </view>
                <view class="content">
                    {{ companyInfo.companyAudit.companyName }}
                </view>
            </view>
            <view class="item">
                <view class="label"> 信用代码 </view>
                <view class="content">
                    <input
                        :disabled="companyInfo.companyAudit.status != 2"
                        type="text"
                        v-model="companyInfo.companyAudit.creditCode"
                    />
                </view>
            </view>
            <view class="item">
                <view class="label"> 有效期 </view>
                <view class="content">
                    <wd-radio-group v-model="radio" shape="dot" inline :disabled="companyInfo.companyAudit.status != 2">
                        <wd-radio :value="1">长期</wd-radio>
                        <wd-radio :value="2">具体时间</wd-radio>
                    </wd-radio-group>
                </view>
            </view>
            <view class="item">
                <view class="label"> 日期 </view>
                <wd-calendar
                    v-model="companyInfo.licenseValidityPeriod"
                    :disabled="radio == 1 && companyInfo.companyAudit.status != 2"
                    :min-date="new Date().getTime()"
                    :max-date="new Date('2059/01/01').getTime()"
                    use-default-slot
                >
                    <view :class="`content ${radio == 1 ? 'disabled' : ''}`">
                        {{
                            (companyInfo.licenseValidityPeriod &&
                                dayjs(companyInfo.licenseValidityPeriod).format("YYYY-MM-DD")) ||
                            "请选择"
                        }}
                    </view>
                </wd-calendar>
            </view>
        </view>

        <view class="btn-wrap" v-if="companyInfo.companyAudit.status == 2">
            <button class="bottom-btn" @tap="submit">提交</button>
        </view>
    </div>
</template>

<script setup>
import { useCompanyInfoStore } from "./companyInfo";
import evn from "@/utils/config";
import { ref } from "vue";
import dayjs from "dayjs";
import { resubmitCompanyApi } from "@/api/user";
const { companyInfo } = useCompanyInfoStore();
const radio = ref(1);
if (companyInfo.licenseValidityPeriod == 4102329600000) {
    radio.value = 1;
} else {
    radio.value = 2;
}

const submit = () => {
    console.log(companyInfo);

    let { companyName: name, creditCode, licenseValidityPeriod, licensePath } = companyInfo.companyAudit;

    if (radio.value == 1) {
        licenseValidityPeriod = "2099-12-31";
    }
    resubmitCompanyApi({ name, creditCode, licenseValidityPeriod, licensePath }).then(res => {
        if (res.code == 200) {
            uni.showToast({
                title: "提交成功",
                icon: "none"
            });
            uni.switchTab({
                url: "/pages/user/index"
            });
        } else {
            uni.showToast({
                title: res.message,
                icon: "error"
            });
        }
    });
};
</script>

<style lang="scss" scoped>
.page {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.audit-message {
    .title {
        height: 80rpx;
        line-height: 80rpx;
        color: #ffffff;
        text-align: center;
        background-color: #ff5113;
    }
    .message {
        padding: 32rpx;
        font-size: 24rpx;
        font-weight: normal;
        line-height: 36rpx;
        color: #ff5113;
        background: #ff511316;
        p {
            margin-bottom: 16rpx;
            font-size: 32rpx;
            font-weight: 600;
        }
    }
}
.image-wrap {
    padding: 32rpx;
    border-bottom: 16rpx solid #f3f4f8;
    .title {
        margin-bottom: 16px;
        font-size: 32rpx;
        font-weight: 600;
        color: #1b2026;
    }
    image {
        width: 686rpx;
        height: 381.56rpx;
        border-radius: 12rpx;
    }
    view {
        margin-top: 36rpx;
        font-size: 24rpx;
        line-height: 36rpx;
        color: #a3a7b3;
    }
}
.content-wrap {
    flex: 1;
    padding: 0 32rpx;
    .item {
        display: flex;
        padding: 32rpx 0;
        border-bottom: 2rpx solid #f3f4f8;
        .label {
            flex: 0 0 184rpx;
            font-size: 24rpx;
            line-height: 36rpx;
            color: #77818f;
        }
        .content {
            font-size: 28rpx;
            line-height: 36rpx;
            color: #1b2026;
            .van-radio-group {
                display: flex;
                gap: 30rpx;
            }
        }
        .disabled {
            color: #cccccc;
        }
    }
}
.btn-wrap {
    padding: 16rpx 0;
    border-top: 2rpx solid rgb(31 35 41 / 15%);
}
.sumbit-error {
    position: relative;
    box-sizing: border-box;
    width: 600rpx;
    padding: 0 32rpx 32rpx;
    border-radius: 10rpx;
    image {
        position: absolute;
        top: 20rpx;
        right: 20rpx;
        width: 30rpx;
        height: 30rpx;
    }
    .title {
        padding: 32rpx 0;
        font-size: 36rpx;
        font-weight: 600;
        line-height: 54rpx;
        color: #1b2026;
        text-align: center;
    }
    .info {
        font-family: "PingFang SC";
        font-size: 24rpx;
        line-height: 48rpx;
        text {
            color: #1f86ff;
        }
    }
    .btn {
        padding: 24rpx;
        padding-right: 36rpx;
        margin-top: 32rpx;
        border: 2rpx solid #dfe1e5;
        border-radius: 8rpx;
        .t1 {
            font-size: 28rpx;
            font-weight: 500;
            line-height: 36rpx;
            color: #1b2026;
        }
        .t2 {
            margin-top: 8rpx;
            font-size: 24rpx;
            line-height: 36rpx;
            color: #a3a7b3;
        }
        .arrow {
            border-color: #77818f;
        }
    }
}
</style>
