|
|
<template>
|
|
|
<div class="content">
|
|
|
<span class="back-btn" @click="back"
|
|
|
><a-icon type="left" style="margin-right: 10px" />返回</span
|
|
|
>
|
|
|
<a-divider></a-divider>
|
|
|
<a-form-model
|
|
|
ref="ruleForm"
|
|
|
:model="form"
|
|
|
:rules="rules"
|
|
|
layout="vertical"
|
|
|
:wrapper-col="wrapperCol"
|
|
|
>
|
|
|
<a-form-model-item
|
|
|
><div class="cardTitle">关联账号</div></a-form-model-item
|
|
|
>
|
|
|
<a-form-model-item ref="tel" label="手机号" prop="tel">
|
|
|
<a-input
|
|
|
v-model="form.tel"
|
|
|
style="width: 60%"
|
|
|
placeholder="请输入手机号"
|
|
|
@blur="
|
|
|
() => {
|
|
|
$refs.tel.onFieldBlur();
|
|
|
}
|
|
|
"
|
|
|
/>
|
|
|
</a-form-model-item>
|
|
|
<a-form-model-item label="手机验证码" prop="code">
|
|
|
<a-input
|
|
|
placeholder="请输入验证码"
|
|
|
v-model="form.code"
|
|
|
style="width: 60%; margin-right: 10px"
|
|
|
/>
|
|
|
<a-button type="primary" @click="getCode">获取验证码</a-button>
|
|
|
</a-form-model-item>
|
|
|
<a-form-model-item
|
|
|
><div class="cardTitle">基础信息</div></a-form-model-item
|
|
|
>
|
|
|
<a-row>
|
|
|
<a-col :span="12">
|
|
|
<a-form-model-item label="企业名称" prop="companyName">
|
|
|
<a-input
|
|
|
v-model="form.companyName"
|
|
|
placeholder="请输入企业名称"
|
|
|
style="width: 130%"
|
|
|
/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
<a-col :span="12">
|
|
|
<a-form-model-item label="社会信用代码" prop="socialCreditCode">
|
|
|
<a-input
|
|
|
v-model="form.socialCreditCode"
|
|
|
placeholder="请输入社会信用代码"
|
|
|
style="width: 130%"
|
|
|
/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-row>
|
|
|
<a-col :span="12">
|
|
|
<a-form-model-item label="企业地址" prop="companyAddress">
|
|
|
<a-cascader
|
|
|
:options="city"
|
|
|
:field-names="cascaderConfig"
|
|
|
@change="companyChange"
|
|
|
placeholder="请选择"
|
|
|
style="width: 100%"
|
|
|
/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
<a-col :span="12">
|
|
|
<a-form-model-item label="详细地址" prop="companyAddressDetail">
|
|
|
<a-input
|
|
|
v-model="form.companyAddressDetail"
|
|
|
placeholder="请输入详细地址"
|
|
|
style="width: 130%"
|
|
|
/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-row>
|
|
|
<a-col :span="12">
|
|
|
<a-form-model-item label="法人姓名" prop="legalPersonName">
|
|
|
<a-input
|
|
|
v-model="form.legalPersonName"
|
|
|
placeholder="请输入法人姓名"
|
|
|
style="width: 130%"
|
|
|
/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
<a-col :span="12">
|
|
|
<a-form-model-item label="法人身份证号" prop="legalPersonIdCard">
|
|
|
<a-input
|
|
|
v-model="form.legalPersonIdCard"
|
|
|
placeholder="请输入法人身份证号"
|
|
|
style="width: 130%"
|
|
|
/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<!-- licenseTimeStart licenseTimeEnd -->
|
|
|
<a-row>
|
|
|
<a-col :span="12">
|
|
|
<a-form-model-item
|
|
|
label="营业执照有效期限开始时间"
|
|
|
prop="licenseTimeStart"
|
|
|
>
|
|
|
<a-date-picker v-model="form.licenseTimeStart" value-format="YYYY-MM-DD HH:mm:ss"/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
<a-col :span="12">
|
|
|
<a-form-model-item
|
|
|
label="营业执照有效期限结束时间（如长期可不选）"
|
|
|
prop="licenseTimeEnd"
|
|
|
>
|
|
|
<a-date-picker v-model="form.licenseTimeEnd" value-format="YYYY-MM-DD HH:mm:ss"/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-form-model-item label="法人身份证">
|
|
|
<span
|
|
|
><span style="color: #1f519b">请上传法人身份证正面照、反面照，</span
|
|
|
>文件大小不超过5mb，支持jpg、png格式</span
|
|
|
>
|
|
|
<a-row>
|
|
|
<a-col :span="12">
|
|
|
头像面
|
|
|
<!-- idCardFrontImgUrls -->
|
|
|
<commonUpload @handleChange='handleChange($event,1)'/>
|
|
|
</a-col>
|
|
|
<a-col :span="12">
|
|
|
国徽面
|
|
|
<!-- idCardBackImgUrls -->
|
|
|
<commonUpload @handleChange='handleChange($event,2)'/>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</a-form-model-item>
|
|
|
<a-form-model-item label="营业执照">
|
|
|
<!-- businessLicenseImgUrls -->
|
|
|
<span
|
|
|
><span style="color: #1f519b">请上传公司营业执照，</span
|
|
|
>文件大小不超过5mb，支持jpg、png格式</span
|
|
|
>
|
|
|
<a-row>
|
|
|
<a-col :span="12">
|
|
|
公司营业执照
|
|
|
<commonUpload @handleChange='handleChange($event,3)'/>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</a-form-model-item>
|
|
|
<!-- othersImgUrls -->
|
|
|
<a-form-model-item label="其他附件">
|
|
|
<span
|
|
|
><span style="color: #1f519b"
|
|
|
>如从事某些特定行业，需要上传对应的资质证书，</span
|
|
|
>文件大小不超过5mb，支持jpg、png格式</span
|
|
|
>
|
|
|
<a-row>
|
|
|
<a-col :span="12">
|
|
|
<commonUpload @handleChange='handleChange($event,4)'/>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</a-form-model-item>
|
|
|
<a-form-model-item label="联系人姓名" prop="contactsName">
|
|
|
<a-input style="width: 60%" v-model="form.contactsName"></a-input>
|
|
|
</a-form-model-item>
|
|
|
<a-form-model-item label="联系人电话" prop="contactsTel">
|
|
|
<a-input style="width: 60%" v-model="form.contactsTel"></a-input>
|
|
|
</a-form-model-item>
|
|
|
<a-form-model-item label="联系人邮箱" prop="contactsEmail">
|
|
|
<a-input style="width: 60%" v-model="form.contactsEmail"></a-input>
|
|
|
</a-form-model-item>
|
|
|
<a-form-model-item label="联系人地址" prop="contactsAddress">
|
|
|
<a-cascader
|
|
|
:options="city"
|
|
|
placeholder="请选择"
|
|
|
:field-names="cascaderConfig"
|
|
|
@change="contactChange"
|
|
|
style="width: 60%"
|
|
|
></a-cascader>
|
|
|
</a-form-model-item>
|
|
|
<a-form-model-item label="联系人详细地址" prop="contactsAddressDetail">
|
|
|
<a-input
|
|
|
style="width: 60%"
|
|
|
v-model="form.contactsAddressDetail"
|
|
|
></a-input>
|
|
|
</a-form-model-item>
|
|
|
</a-form-model>
|
|
|
<div style="text-align: center">
|
|
|
<a-button type="primary" @click="onSubmit"> 提交 </a-button>
|
|
|
<a-button style="margin-left: 10px" @click="resetForm"> 重置 </a-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { settledInsert } from "@/api/basic/console";
|
|
|
import { allCity } from "@/api/public";
|
|
|
import { form, rules, cascaderConfig } from "./depend/settledForm";
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
// 表单
|
|
|
labelCol: { span: 4 },
|
|
|
wrapperCol: { span: 10 },
|
|
|
cascaderConfig,
|
|
|
form,
|
|
|
rules,
|
|
|
city: [],
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
this.getCity();
|
|
|
},
|
|
|
methods: {
|
|
|
async getCity() {
|
|
|
let res = await allCity();
|
|
|
this.city = res.data;
|
|
|
},
|
|
|
// 获取验证码
|
|
|
getCode() {},
|
|
|
companyChange(data) {
|
|
|
this.form.companyAddress = data[2];
|
|
|
},
|
|
|
contactChange(data) {
|
|
|
this.form.contactsAddress = data[2];
|
|
|
},
|
|
|
handleChange(data,type) {
|
|
|
console.log(data);
|
|
|
switch (type) {
|
|
|
case 1:
|
|
|
this.form.idCardFrontImgUrls[0] = data[0].response.data
|
|
|
break;
|
|
|
case 2:
|
|
|
this.form.idCardBackImgUrls[0] = data[0].response.data
|
|
|
break;
|
|
|
case 3:
|
|
|
this.form.businessLicenseImgUrls[0] = data[0].response.data
|
|
|
break;
|
|
|
case 4:
|
|
|
this.form.othersImgUrls[0] = data[0].response.data
|
|
|
break;
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
},
|
|
|
onSubmit() {
|
|
|
this.$refs.ruleForm.validate(async (valid) => {
|
|
|
if (valid) {
|
|
|
let res = await settledInsert(this.form);
|
|
|
if (res.code === 200) {
|
|
|
this.$message.success(res.msg);
|
|
|
this.back()
|
|
|
} else {
|
|
|
this.$message.error(res.msg);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
back() {
|
|
|
this.$router.go(-1)
|
|
|
},
|
|
|
// 重置
|
|
|
resetForm() {
|
|
|
this.$refs.ruleForm.resetFields();
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
.content {
|
|
|
background: #fff;
|
|
|
padding-left: 125px;
|
|
|
padding-top: 48px;
|
|
|
}
|
|
|
.cardTitle {
|
|
|
margin-left: -10px;
|
|
|
margin-bottom: -10px;
|
|
|
}
|
|
|
/deep/.ant-col .ant-form-item-label {
|
|
|
margin-top: -10px;
|
|
|
}
|
|
|
.com-name{
|
|
|
font-size: 20px;
|
|
|
font-weight: 500;
|
|
|
line-height: 26px;
|
|
|
}
|
|
|
</style> |
