<template>
    <div class="page">
        <NavBar backgroundBox="#FFFFFF" :showIcon="true" :showTitle="true" title="企业信息"></NavBar>
        <view class="image-wrap">
            <image v-if="pinias.formData.licensePath" :src="evn.APP_IMAGE_BASE_API + pinias.formData.licensePath" mode="" />
            <view>注：接受拍摄复印件，黑白复印需要加盖公章，大小不超过10M</view>
        </view>
        <view class="content-wrap">
            <view class="item">
                <view class="label"> 企业全称 </view>
                <view class="content">
                    {{ pinias.formData.name }}
                </view>
            </view>
            <view class="item">
                <view class="label"> 信用代码 </view>
                <view class="content">
                    {{ pinias.formData.creditCode }}
                </view>
            </view>
            <view class="item">
                <view class="label"> 公司地址 </view>
                <view class="content">
                    {{ pinias.formData.location }}
                </view>
            </view>
            <view class="item">
                <view class="label"> 是否人资机构 </view>
                <view class="content">
                    <wd-radio-group v-model="isHumanResources" @change="change" shape="dot" inline>
                        <wd-radio :value="1">是</wd-radio>
                        <wd-radio :value="2">否</wd-radio>
                    </wd-radio-group>
                </view>
            </view>
            <view class="image-upload">
                <image
                    v-if="isHumanResources == 1 && pinias.formData.humanResourcesLicensePath"
                    :src="evn.APP_IMAGE_BASE_API + pinias.formData.humanResourcesLicensePath"
                    mode=""
                />

                <image
                    v-else-if="isHumanResources == 1 && pinias.formData.humanResourcesLicensePath == ''"
                    @click="chooseImage('album')"
                    src="@/static/image/businessLicense/businessLicenseUpload2.png"
                    mode=""
                />
            </view>
            <!-- <view class="item">
                <view class="label"> 有效期 </view>
                <view class="content">
                    <wd-radio-group v-model="radio" shape="dot" inline>
                        <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="pinias.formData.licenseValidityPeriod"
                    :disabled="radio == 1"
                    :min-date="new Date().getTime()"
                    :max-date="new Date('2059/01/01').getTime()"
                    use-default-slot
                >
                    <view :class="`content ${radio == 1 ? 'disabled' : ''}`">
                        {{
                            (pinias.formData.licenseValidityPeriod && dayjs(pinias.formData.licenseValidityPeriod).format("YYYY-MM-DD")) ||
                            "请选择"
                        }}
                    </view>
                </wd-calendar>
            </view> -->
        </view>
        <wd-tabbar
            @tap="submit"
            custom-style="display: flex;justify-content: center !important;z-index:1;"
            fixed
            placeholder
            safeAreaInsetBottom
        >
            <view class="foot-btn">提交审核</view>
        </wd-tabbar>
        <!-- 申请错误 -->
        <!-- <van-popup show="{{ showSubmitError }}" custom-style="border-radius:12rpx">
           
        </van-popup> -->
        <wd-overlay :show="show" @click="show = false">
            <view class="popup-wrapper">
                <view class="block" @click.stop="">
                    <view class="sumbit-error">
                        <image src="@/static/image/icon/delete2.png" @tap="show = false" />
                        <view class="title">企业已存在</view>
                        <view class="info">
                            您在注册的<text>“{{ companyName }}”</text>已在乐业观山湖认证，请核对企业名称是否正确
                        </view>
                        <view class="btn flex-between" @tap="navigateTo('/pages/user/businessLicense/fillIn')">
                            <view class="text">
                                <view class="t1">修改公司名称</view>
                                <view class="t2">这不是我的企业</view>
                            </view>
                            <view class="arrow"></view>
                        </view>
                        <view
                            class="btn flex-between"
                            @tap="
                                navigateTo(
                                    `/pages/user/businessLicense/appeal?name=${companyName}&companyCreditCode=${companyCreditCode}`
                                )
                            "
                        >
                            <view class="text">
                                <view class="t1">申述资质被冒用</view>
                                <view class="t2">确定没有注册过乐业观山湖</view>
                            </view>
                            <view class="arrow"></view>
                        </view>
                    </view>
                </view>
            </view>
        </wd-overlay>
    </div>
</template>

<script setup>
import evn from "@/utils/config";
import { useDefineStore } from "./store";
import { uploadFiles } from "@/utils/fileUpload";
import { ref } from "vue";
import { registerCompanyApi, companyCheck } from "@/api/user";

const pinias = useDefineStore();
const show = ref(false);
// console.log(pinias.formData);
const id = ref("");
const companyName = ref("");
const companyCreditCode = ref("");
const radio = ref(1);
const navigateTo = url => {
    uni.navigateTo({
        url
    });
};
const isHumanResources = ref(1);
/* 选择图片 */
const chooseImage = sourceType => {
    uni.chooseImage({
        sourceType: [sourceType],
        count: 1,
        success: async ({ tempFiles }) => {
            const res = await uploadFiles(tempFiles);
            pinias.setFormDataKey("humanResourcesLicensePath", res[0].key);
            isHumanResources.value = 1;
        }
    });
};
function change({ value }) {
    isHumanResources.value = value;
    if (value == 2) {
        pinias.setFormDataKey("humanResourcesLicensePath", "");
    }
}
const submit = () => {
    const params = { ...pinias.formData };
    const { name, creditCode } = pinias.formData;
    if (isHumanResources.value == 1) {
        if (params.humanResourcesLicensePath == "") {
            xma.showToast({
                title: "请上人力资源证"
            });
            return;
        }
    } else {
        params.humanResourcesLicensePath == "";
    }
    companyCheck({ name, creditCode }).then(company => {
        if (company.code == 200) {
            if (!company.data) {
                xma.showLoading({
                    title: "提交中...",
                    mask: true
                });
                registerCompanyApi(params).then(res => {
                    xma.hideLoading();
                    if (res.code == 200) {
                        uni.switchTab({
                            url: "/pages/user/index"
                        });
                    }
                });
            } else {
                show.value = true;
                // id.value = company.data.id;
                companyCreditCode.value = creditCode;
                companyName.value = name;
            }
        }
    });
};
</script>

<style lang="scss" scoped>
.page {
    display: flex;
    flex-direction: column;
}
.image-wrap {
    padding: 32rpx;
    border-bottom: 16rpx solid #f3f4f8;
    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;
        align-items: center;
        .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;
                align-items: center;
                gap: 30rpx;
            }
        }
        .disabled {
            color: #cccccc;
        }
    }
    .image-upload {
        .t2 {
            margin-top: 16rpx;
        }
        image {
            width: 686rpx;
            height: 386rpx;
            margin-top: 84rpx;
        }
    }
}
.foot-btn {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 622rpx;
    height: 80rpx;
    color: #ffffff;
    background: #1f86ff;
    border-radius: 12rpx;
}
.btn-wrap {
    padding: 16rpx 0;
    border-top: 2rpx solid rgb(31 35 41 / 15%);
}
.popup-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    .sumbit-error {
        position: relative;
        box-sizing: border-box;
        width: 600rpx;
        padding: 0 32rpx 32rpx;
        background-color: #ffffff;
        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>
