<template>
    <div class="artNeed">
        <div class="breadcrumb">
            <span style="display:inline-block">当前位置：</span>
            <el-breadcrumb separator="/" style="display: inline-block;">
                <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                <el-breadcrumb-item>注册</el-breadcrumb-item>
                <el-breadcrumb-item><span style="color:#EA2D2D">企业认证</span></el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="form-panel">
            <div class="title">企业认证</div>
            <el-form
                :model="formData"
                :rules="rules"
                ref="form"
                label-width="180px"
                label-position="right"
                style="margin: 0 0 0 200px;"
            >
                <el-form-item label="单位名称" prop="orgName">
                    <el-input v-model="formData.orgName" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="单位性质" prop="orgType">
                    <el-input v-model="formData.orgType" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="上市公司" prop="publicCompany">
                    <el-radio v-model="formData.publicCompany" :label="true">是</el-radio>
                    <el-radio v-model="formData.publicCompany" :label="false">否</el-radio>
                </el-form-item>
                <el-form-item label="隶属单位" prop="parentOrg">
                    <el-input v-model="formData.parentOrg" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="所在地" prop="address">
                    <el-input v-model="formData.address" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="详细地址" prop="addressDetail">
                    <el-input v-model="formData.addressDetail" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item v-model="formData.intro" label="企业介绍" prop="intro">
                    <el-input
                        v-model="formData.intro"
                        placeholder="请输入企业介绍，不超过500字"
                        maxlength="500"
                        type="textarea"
                        :rows="10"
                        resize="none"
                    ></el-input>
                </el-form-item>
                <el-form-item label="营业执照" prop="license">
                    <single-upload v-model="formData.license"></single-upload>
                </el-form-item>
                <el-form-item label="联系人" prop="contactName">
                    <el-input v-model="formData.contactName" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="身份证号" prop="contactIdNo">
                    <el-input v-model="formData.contactIdNo" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="手机号" prop="contactPhone">
                    <el-input v-model="formData.contactPhone" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="电子邮箱" prop="contactEmail">
                    <el-input v-model="formData.contactEmail" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="信息报送承诺书扫描件" prop="attach">
                    <span style="font-size:14px;font-weight:normal;" slot="label">
                        信息报送承诺书扫描件
                    </span>
                    <file-upload v-model="formData.attach" single> </file-upload>
                    <div style="color:#616367;font-size:12px;margin-top:14px">请下载承诺书填好并加盖公章后上传</div>
                    <div
                        style="color:#EA2D2D;font-szie:13px;margin-top:30px;cursor:pointer;text-decoration: underline;"
                    >
                        下载信息报送承诺书
                    </div>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" size="medium" @click="submit" :loading="loading">提交信息</el-button>
                    <el-button size="medium">返回登录</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
<script>
export default {
    name: 'auth',
    data() {
        return {
            radio: '1',
            formData: {
                publicCompany: false
            },
            rules: {
                orgName: [{ required: true, message: '请输入单位名称', trigger: 'blur' }],
                orgType: [{ required: true, message: '请输入单位性质', trigger: 'blur' }],
                address: [{ required: true, message: '请输入所在地', trigger: 'blur' }],
                addressDetail: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
                intro: [{ required: true, message: '请输入企业介绍', trigger: 'blur' }],
                license: [{ required: true, message: '请上传营业执照', trigger: 'blur' }],
                contactName: [{ required: true, message: '请输入联系人', trigger: 'blur' }],
                contactIdNo: [{ required: true, message: '请输入身份证', trigger: 'blur' }],
                contactEmail: [{ required: true, message: '请输入邮箱', trigger: 'blur' }],
                contactPhone: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
                attach: [{ required: true, message: '请上传信息报送承诺书扫描件', trigger: 'blur' }]
            },
            loading: false
        };
    },
    methods: {
        submit() {
            this.$refs.form.validate(valid => {
                if (!valid) return;
                this.loading = true;
                this.$http
                    .post('/orgInfo/apply', this.formData, { body: 'json' })
                    .then(res => {
                        this.loading = false;
                        this.$router.replace({ name: 'result', query: { type: 'apply' } });
                    })
                    .catch(e => {
                        this.loading = false;
                        this.$message.error(e.error || '提交失败');
                    });
            });
        }
    }
};
</script>
<style lang="less" scoped></style>
