<template>
    <view class="">
        <view class="content">
            <u--form labelPosition="left" :model="formData" :rules="rules" ref="formOne">
                <view class="card">
                    <view class="card_title">认证信息</view>
                    <u-form-item label="用工单位名称" labelWidth="100" prop="comname" borderBottom ref="item1">
                        <u--input v-model="formData.comname" placeholder="请输入用工单位名称"></u--input>
                    </u-form-item>
                    <u-form-item label="统一信用代码" labelWidth="100" prop="companyTid" borderBottom ref="item1">
                        <u--input v-model="formData.companyTid" placeholder="请输入统一信用代码"></u--input>
                    </u-form-item>
                    <u-form-item label="法人姓名" labelWidth="100" prop="masterName" borderBottom ref="item1">
                        <u--input v-model="formData.masterName" placeholder="请输入法人姓名"></u--input>
                    </u-form-item>
                    <u-form-item label="法人身份证号" labelWidth="100" prop="masterIdentity" borderBottom ref="item1">
                        <u--input v-model="formData.masterIdentity" placeholder="请输入法人身份证号"></u--input>
                    </u-form-item>
                    <u-form-item label="所在地区" labelWidth="100" prop="cityId" borderBottom ref="item1"
                        @click="showAddress = true; hideKeyboard()">
                        <PickerList placeholder="请选择所在地区" :columns="dic.addressColumn" :visibel="showAddress"
                            v-model="formData.cityId" @cancel="showAddress = false">
                        </PickerList>
                    </u-form-item>
                    <u-form-item label="详细地址" labelWidth="100" prop="companyAddress" borderBottom ref="item1">
                        <u--input v-model="formData.companyAddress" placeholder="请输入详细地址"></u--input>
                    </u-form-item>
                    <u-form-item label="用工单位性质" labelWidth="100" prop="nature" borderBottom ref="item1"
                        @click="showJobCompanyNature = true; hideKeyboard()">
                        <PickerList placeholder="请选择企业性质" :columns="[xzDic]" :visibel="showJobCompanyNature"
                            labelName="dictValue" valueName="dictKey" v-model="formData.nature"
                            @cancel="showJobCompanyNature = false">
                        </PickerList>
                    </u-form-item>
                    <u-form-item label="所属行业" labelWidth="100" prop="tradeId" borderBottom ref="item1"
                        @click="showjobCompanyIndustry = true; hideKeyboard()">
                        <PickerList placeholder="请选择所属行业" :columns="dic.tradeArr" labelName="name" valueName="id"
                            :visibel="showjobCompanyIndustry" v-model="formData.tradeId"
                            @cancel="showjobCompanyIndustry = false">
                        </PickerList>
                    </u-form-item>
                    <u-form-item label="用工单位介绍" labelWidth="100" labelPosition="top" prop="companyDesc" borderBottom
                        ref="item1">
                        <u--textarea v-model="formData.companyDesc" placeholder="请输入用工单位介绍" count
                            maxlength="200"></u--textarea>
                    </u-form-item>
                </view>
                <view class="card">
                    <view class="card_title">联系人信息</view>
                    <u-form-item label="联系人" labelWidth="100" prop="manager" borderBottom ref="item1">
                        <u--input v-model="formData.manager" placeholder="请输入联系人"></u--input>
                    </u-form-item>
                    <u-form-item label="手机号码" labelWidth="100" prop="telphone" borderBottom ref="item1">
                        <u--input v-model="formData.telphone" placeholder="请输入手机号码"></u--input>
                    </u-form-item>
                </view>

                <view class="card">
                    <view class="card_title">证件资料</view>
                    <view class="card_content">
                        <u-form-item labelWidth="100" prop="identityUrl4Id">
                            <UploadIdNumber v-model="formData.identityUrl4Id" contentStyle="marginTop: 30rpx"
                                backImg="/static/img/idcard.png">
                            </UploadIdNumber>
                        </u-form-item>
                        <u-form-item labelWidth="100" prop="identityUrl5Id">
                            <UploadIdNumber v-model="formData.identityUrl5Id" backImg="/static/img/backidcard1.png">
                            </UploadIdNumber>
                        </u-form-item>
                        <u-form-item labelWidth="100" prop="authUrlId">
                            <UploadIdNumber v-model="formData.authUrlId" backImg="/static/img/businessLicense.jpg">
                            </UploadIdNumber>
                        </u-form-item>
                    </view>
                </view>

                <view class="card">
                    <u-button type="primary" text="提交" customStyle="margin-top: 50px" @click="submit"></u-button>
                    <u-button type="error" text="重置" customStyle="margin-top: 10px" @click="reset"></u-button>
                </view>
            </u--form>
        </view>
    </view>
</template>

<script>
    import UploadIdNumber from './uploadIdNumber.vue';
    import dic from '@/common/dic.js'
    import PickerList from './pickerList.vue';
    import {
        addInviteCompanyAuth,
        getInviteCompanyAuthInfo,
        getDictionary2
    } from '@/api/userrecruit.js'
    import {
        mapState
    } from 'vuex'
    const rules = {
        comname: {
            type: 'string',
            required: true,
            message: '请输入用工单位',
            trigger: ['change']
        },
        companyTid: {
            type: 'string',
            required: true,
            max: 18,
            min: 18,
            message: '请输入18位统一信用代码',
            trigger: ['change']
        },
        masterName: {
            type: 'string',
            required: true,
            message: '请输入法人姓名',
            trigger: ['change']
        },
        masterIdentity: {
            type: 'string',
            required: true,
            pattern: /^[1-9]\d{5}(19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[Xx\d]$/,
            message: '请输入法人身份证号',
            trigger: ['change']
        },
        cityId: {
            type: 'string',
            required: true,
            message: '请选择所在地区',
            trigger: ['change']
        },
        companyAddress: {
            type: 'string',
            required: true,
            message: '请输入详细地址',
            trigger: ['change']
        },
        nature: {
            type: 'string',
            required: true,
            message: '请选择企业性质',
            trigger: ['change']
        },
        tradeId: {
            type: 'string',
            required: true,
            message: '请选择行业',
            trigger: ['change']
        },
        companyDesc: {
            type: 'string',
            min: 20,
            required: true,
            message: '请输入企业介绍（最少20个字符）',
            trigger: ['change']
        },
        manager: {
            type: 'string',
            required: true,
            message: '请输入联系人',
            trigger: ['change']
        },
        telphone: {
            type: 'string',
            required: true,
            pattern: /^1[3-9]{1}[0-9]{9}$/,
            message: '请输入手机号码',
            trigger: ['change']
        },
        identityUrl4Id: {
            type: 'string',
            required: true,
            message: '请上传法人身份证（人像）',
            trigger: ['change']
        },
        identityUrl5Id: {
            type: 'string',
            required: true,
            message: '请上传法人身份证（国徽）',
            trigger: ['change']
        },
        authUrlId: {
            type: 'string',
            required: true,
            message: '请上传企业营业执照',
            trigger: ['change']
        },
    }
    export default {
        components: {
            UploadIdNumber,
            PickerList
        },
        data() {
            return {
                showAddress: false,
                showJobCompanyNature: false,
                showjobCompanyIndustry: false,
                dic,
                xzDic: [],
                formData: {},
                rules
            };
        },
        onLoad(options) {
            if (options.reviewStatus === '9') {
                this.getInfo()
            }
            this.getDictInfo()
        },
        computed: {
            ...mapState({
                authInfo: (state) => state.auth.authInfo,
                userInfo: (state) => state.user.userInfo
            }),
        },
        created() {
            this.formData.manager = this.authInfo.realName
            this.formData.idNumber = this.authInfo.idNumber
        },
        methods: {
            hideKeyboard() {
                uni.hideKeyboard()
            },
            async submit() {
                let params = {
                    ...this.formData,
                    nature: Number(this.formData.nature),
                    cityId: Number(this.formData.cityId),
                    tradeId: Number(this.formData.tradeId),
                }
                const _this = this
                this.$refs.formOne.validate().then(async (res) => {
                    let params = {
                        ..._this.formData,
                        nature: Number(_this.formData.nature),
                        cityId: Number(_this.formData.cityId),
                        tradeId: Number(_this.formData.tradeId),
                        manager: _this.authInfo.realName,
                        idNumber: _this.authInfo.idNumber,
                        companyName: dic.addressColumn[0].filter((item) => item.value == _this
                            .formData.cityId)[0].label
                    }
                    console.log(params)
                    let resData = await addInviteCompanyAuth(params)
                    if (resData.data.code === 200) {
                        uni.navigateBack(1)
                        _this.$api.sleep(1000).then(() => {
                            _this.$api.msg('已完成企业信息认证')
                        })
                    }
                }).catch(errors => {
                    if (/[\u4e00-\u9fff]/.test(errors.message)) {
                        _this.$api.msg(errors.message)
                    }
                })
            },
            async getInfo() {
                let params = {
                    idNumber: this.authInfo.idNumber
                }
                let resData = await getInviteCompanyAuthInfo(params)
                if (resData.data.code === 200) {
                    console.log(resData.data.data)
                    this.formData = {
                        ...resData.data.data,
                        nature: String(resData.data.data.nature),
                        cityId: String(resData.data.data.cityId),
                        tradeId: String(resData.data.data.tradeId),
                    }
                }
            },
            reset() {
                const _this = this
                uni.showModal({
                    content: '重置将清空表单，确定重置吗？',
                    success() {
                        _this.formData = {}
                    },
                })
            },
            async getDictInfo() {
                let resData = await getDictionary2()
                if (resData.data.code === 200) {
                    this.xzDic = resData.data.data
                }
            }
        },
    }
</script>

<style lang="scss" scoped>
    .content {
        padding: 24rpx;

        .card {
            .card_title {
                font-weight: bold;
                margin-top: 20rpx;
            }

            .card_content {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
            }
        }
    }
</style>