<template>
|
<div class="product">
|
<div v-for="(item,index) in loanEnterpriseArr" :key="index">
|
<el-form
|
:model="loanEnterpriseForm[index]"
|
:rules="rules"
|
ref="loanEnterpriseForm"
|
size="small"
|
inline
|
label-width="165px"
|
>
|
<div class="_block">
|
<p class="title">
|
<span></span>
|
基本信息
|
</p>
|
<div class="form">
|
<el-form-item label="客户编号" v-if="item.customerid.visible" prop="customerid">
|
<el-input
|
v-model="loanEnterpriseForm[index].customerid"
|
:disabled="!item.customerid.writeAble"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="借款企业名称" v-if="item.customername.visible" prop="customername">
|
<el-input
|
v-model="loanEnterpriseForm[index].customername"
|
:disabled="!item.customername.writeAble"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="组织机构代码" v-if="item.organizationcode.visible" prop="organizationcode">
|
<el-input
|
v-model="loanEnterpriseForm[index].organizationcode"
|
:disabled="!item.organizationcode.writeAble"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="统一社会信用代码" v-if="item.reditcode.visible" prop="reditcode">
|
<el-input
|
v-model="loanEnterpriseForm[index].reditcode"
|
:disabled="!item.reditcode.writeAble"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="行业" v-if="item.industrytype.visible" prop="industrytype">
|
<el-select
|
v-model="loanEnterpriseForm[index].industrytype"
|
:disabled="!item.industrytype.writeAble"
|
clearable
|
filterable
|
placeholder="支持输入搜索选择"
|
>
|
<el-option
|
v-for="item in industrytypeList"
|
:key="item.itemno"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="企业类别" v-if="item.enterprisecategory.visible" prop="enterprisecategory">
|
<el-select
|
v-model="loanEnterpriseForm[index].enterprisecategory"
|
:disabled="!item.enterprisecategory.writeAble"
|
clearable
|
filterable
|
placeholder="支持输入搜索选择"
|
>
|
<el-option
|
v-for="item in enterprisecategoryList"
|
:key="item.itemno"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="注册时间" v-if="item.registerdate.visible" prop="registerdate">
|
<el-date-picker
|
v-model="loanEnterpriseForm[index].registerdate"
|
type="date"
|
format="yyyy/MM/dd"
|
value-format="yyyy/MM/dd"
|
size="small"
|
placeholder="选择日期"
|
:disabled="!item.registerdate.writeAble"
|
></el-date-picker>
|
</el-form-item>
|
<el-form-item label="企业电话" v-if="item.companytel.visible" prop="companytel">
|
<el-input
|
v-model="loanEnterpriseForm[index].companytel"
|
:disabled="!item.companytel.writeAble"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="企业地址(省)" v-if="item.companyprovince.visible" prop="companyprovince">
|
<el-select
|
v-model="loanEnterpriseForm[index].companyprovince"
|
filterable
|
clearable
|
placeholder="支持输入搜索选择"
|
:disabled="!item.companyprovince.writeAble"
|
@change="getprovince(loanEnterpriseForm[index].companyprovince,'companycityList',loanEnterpriseForm[index],function(arr){companycityList=arr})"
|
>
|
<el-option
|
v-for="(item,index) in provinceList"
|
:key="index"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="企业地址(市)" v-if="item.companycity.visible" prop="companycity">
|
<el-select
|
v-model="loanEnterpriseForm[index].companycity"
|
filterable
|
clearable
|
:disabled="!item.companycity.writeAble"
|
placeholder="支持输入搜索选择"
|
@change="getcity(loanEnterpriseForm[index].companycity,'companycountyList',loanEnterpriseForm[index],function(arr){companycountyList=arr})"
|
>
|
<el-option
|
v-for="(item,index) in companycityList"
|
:key="index"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="企业地址(区)" v-if="item.companycounty.visible" prop="companycounty">
|
<el-select
|
v-model="loanEnterpriseForm[index].companycounty"
|
filterable
|
clearable
|
:disabled="!item.companycounty.writeAble"
|
placeholder="支持输入搜索选择"
|
>
|
<el-option
|
v-for="(item,index) in companycountyList"
|
:key="index"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
label="企业地址(街道/小区名/单元/房号)"
|
v-if="item.companyaddress.visible"
|
prop="companyaddress">
|
<el-input
|
maxlength="100"
|
v-model="loanEnterpriseForm[index].companyaddress"
|
:disabled="!item.companyaddress.writeAble"
|
></el-input>
|
</el-form-item>
|
</div>
|
</div>
|
<div class="_block">
|
<p class="title">
|
<span></span>
|
法定代表人名称
|
</p>
|
<div class="form">
|
<el-form-item label="法定代表人名称" v-if="item.corporatename.visible" prop="corporatename">
|
<el-input
|
maxlength="50"
|
v-model="loanEnterpriseForm[index].corporatename"
|
:disabled="!item.corporatename.writeAble"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="证件类型" v-if="item.corporatecerttype.visible" prop="corporatecerttype">
|
<el-select
|
v-model="loanEnterpriseForm[index].corporatecerttype"
|
filterable
|
clearable
|
placeholder="支持输入搜索选择"
|
:disabled="!item.corporatecerttype.writeAble"
|
>
|
<el-option
|
v-for="item in certtypeList"
|
:key="item.itemno"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="证件号码" v-if="item.corporatecertid.visible" prop="corporatecertid">
|
<el-input
|
v-model="loanEnterpriseForm[index].corporatecertid"
|
:disabled="!item.corporatecertid.writeAble"
|
@blur="loanEnterpriseForm[index].corporatecertid=loanEnterpriseForm[index].corporatecertid.toUpperCase()"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="手机号码" v-if="item.corporatephone.visible" prop="corporatephone">
|
<el-input
|
v-model="loanEnterpriseForm[index].corporatephone"
|
:disabled="!item.corporatephone.writeAble"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="常住地址(省)" v-if="item.corporateprovince.visible" prop="corporateprovince">
|
<el-select
|
v-model="loanEnterpriseForm[index].corporateprovince"
|
filterable
|
clearable
|
placeholder="支持输入搜索选择"
|
:disabled="!item.corporateprovince.writeAble"
|
@change="getprovince(loanEnterpriseForm[index].corporateprovince,'corporatecityList',loanEnterpriseForm[index],function(arr){corporatecityList=arr})"
|
>
|
<el-option
|
v-for="(item,index) in provinceList"
|
:key="index"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="常住地址(市)" v-if="item.corporatecity.visible" prop="corporatecity">
|
<el-select
|
v-model="loanEnterpriseForm[index].corporatecity"
|
filterable
|
clearable
|
:disabled="!item.corporatecity.writeAble"
|
placeholder="支持输入搜索选择"
|
@change="getcity(loanEnterpriseForm[index].corporatecity,'corporatecountyList',loanEnterpriseForm[index],function(arr){corporatecountyList=arr})"
|
>
|
<el-option
|
v-for="(item,index) in corporatecityList"
|
:key="index"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="常住地址(区)" v-if="item.corporatecounty.visible" prop="corporatecounty">
|
<el-select
|
v-model="loanEnterpriseForm[index].corporatecounty"
|
filterable
|
clearable
|
:disabled="!item.corporatecounty.writeAble"
|
placeholder="支持输入搜索选择"
|
>
|
<el-option
|
v-for="(item,index) in corporatecountyList"
|
:key="index"
|
:label="item.itemname"
|
:value="item.itemno"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
label="常住地址(街道/小区名/单元/房号)"
|
v-if="item.corporateaddress.visible"
|
prop="corporateaddress">
|
<el-input
|
maxlength="100"
|
v-model="loanEnterpriseForm[index].corporateaddress"
|
:disabled="!item.corporateaddress.writeAble"
|
></el-input>
|
</el-form-item>
|
</div>
|
</div>
|
</el-form>
|
</div>
|
<div class="fixedBtn">
|
<el-button
|
size="medium"
|
plain
|
@click="saveDraft(loanEnterpriseForm)"
|
v-if="applyInfo.phaseNo=='0040'"
|
>保存草稿</el-button>
|
<el-button
|
size="medium"
|
plain
|
v-if="applyInfo.phaseNo>'0040'&&writeAble"
|
@click="save(loanEnterpriseForm)"
|
>保存</el-button>
|
<el-button
|
size="medium"
|
type="primary"
|
@click="submit(loanEnterpriseForm)"
|
v-if="applyInfo.phaseNo=='0040'"
|
>下一步</el-button>
|
<el-button
|
size="medium"
|
type="primary"
|
@click="nextPage()"
|
v-else
|
>下一页</el-button>
|
</div>
|
</div>
|
</template>
|
<script>
|
import{
|
qryEntInfoPre,
|
getDictionaryList,
|
getProvinceCodeList,
|
saveEntInfoPre
|
} from '@/api/product'
|
import common from "@/utils/common";
|
export default {
|
data () {
|
return {
|
applyInfo: this.$store.state.product.applyInfo,
|
applyMenu: this.$store.state.product.applyMenu,
|
initialArr: [],
|
loanEnterpriseArr:[],
|
loanEnterpriseForm:[],
|
industrytypeList:[],
|
enterprisecategoryList:[],
|
provinceList:[],
|
companycityList:[],
|
companycountyList:[],
|
corporatecityList:[],
|
corporatecountyList:[],
|
certtypeList:[],
|
rules:{},
|
writeAble:false
|
}
|
},
|
async created () {
|
this.$parent._data.loading = true;
|
const result = await this.qryEntInfoPre()
|
this.getEntInfoPreData(result)
|
this.writeAble = this.loanEnterpriseArr[0].companytel.writeAble
|
this.industrytypeList = await this.qryDictionaryList("IndustryType");
|
this.enterprisecategoryList = await this.qryDictionaryList("EnterpriseCategory");
|
this.certtypeList = await this.qryDictionaryList("CertType");
|
this.qryProvinceCodeList();
|
this.$parent._data.loading = false;
|
},
|
methods: {
|
// 查询借款企业信息
|
qryEntInfoPre(){
|
const obj = {
|
applySerialNo: this.applyInfo.serialNo,
|
customerId: this.applyInfo.customerid
|
}
|
return new Promise(resolve=>{
|
qryEntInfoPre(obj).then(res=>{
|
resolve(res.result)
|
})
|
})
|
},
|
// 对返回的数据进二次处理
|
getEntInfoPreData(result){
|
this.initialArr = []
|
this.loanEnterpriseForm = []
|
this.loanEnterpriseArr = [result]
|
this.loanEnterpriseArr.forEach(async (val,index) => {
|
const obj = {}
|
for (const key in val) {
|
this.rules[key] = [];
|
// 自定义规则校验
|
switch (key) {
|
case "companytel":
|
this.rules[key].push(common.validate("telephone"));
|
break;
|
case "corporatecertid":
|
this.rules[key].push({ validator: (rule, value, callback) => common.checkCertid(this.loanEnterpriseForm[index].corporatecerttype,value,callback), trigger: 'change' });
|
break;
|
case "corporatephone":
|
this.rules[key].push(common.validate("phone"));
|
break;
|
default:
|
break;
|
}
|
// 必填校验
|
if (val[key].required) {
|
this.rules[key].push({
|
required: true,
|
message: `请输入${val[key].filedDescription}`,
|
trigger: "change"
|
});
|
}
|
obj[key] = val[key].value;
|
}
|
this.loanEnterpriseForm.push(obj);
|
this.initialArr.push(JSON.parse(JSON.stringify(obj)))
|
// 根据省获取市
|
this.loanEnterpriseForm[index].corporateprovince
|
? (this.corporatecityList = await common.qryCityCodeList(
|
this.loanEnterpriseForm[index].corporateprovince
|
))
|
: "";
|
this.loanEnterpriseForm[index].companyprovince
|
? (this.companycityList = await common.qryCityCodeList(
|
this.loanEnterpriseForm[index].companyprovince
|
))
|
: "";
|
// 根据市获取区
|
this.loanEnterpriseForm[index].corporatecity
|
? (this.corporatecountyList = await common.qryAreaCodeList(
|
this.loanEnterpriseForm[index].corporatecity
|
))
|
: "";
|
this.loanEnterpriseForm[index].companycity
|
? (this.companycountyList = await common.qryAreaCodeList(
|
this.loanEnterpriseForm[index].companycity
|
))
|
: "";
|
});
|
},
|
// 字典接口
|
qryDictionaryList(code) {
|
return new Promise(resolve => {
|
getDictionaryList({
|
codeNo: code
|
}).then(res => {
|
resolve(res.result);
|
});
|
});
|
},
|
// 获取省枚举值
|
qryProvinceCodeList() {
|
getProvinceCodeList({}).then(res => {
|
this.provinceList = res.result;
|
});
|
},
|
// 下一页
|
nextPage() {
|
// 调用父组件的查询左侧tab的方法
|
this.$parent.updateApplyTabTree('借款企业信息');
|
},
|
// 保存草稿
|
async saveDraft(array){
|
// tempsaveflag值为1代表是保存
|
this.$parent._data.loading = true;
|
array[0].tempsaveflag = '1'
|
const res = await saveEntInfoPre(array[0])
|
this.$parent._data.loading = false;
|
if(res.code == '00'){
|
// 保存草稿需要调用父组件的查询左侧tab的方法
|
this.$message.success('保存成功')
|
this.$parent.getApplyTabTree();
|
// 保存成功后重新查询
|
const result = await this.qryEntInfoPre()
|
this.getEntInfoPreData(result)
|
}
|
},
|
// 保存
|
async save(array){
|
this.$refs.loanEnterpriseForm[0].validate(async valid=>{
|
if(valid){
|
// tempsaveflag值为1代表是保存
|
this.$parent._data.loading = true;
|
array[0].tempsaveflag = '1'
|
const res = await saveEntInfoPre(array[0])
|
this.$parent._data.loading = false;
|
if(res.code == '00'){
|
// 保存成功后重新查询
|
this.$message.success('保存成功')
|
const result = await this.qryEntInfoPre()
|
this.getEntInfoPreData(result)
|
}
|
}
|
})
|
},
|
// 提交/下一步
|
async submit(array){
|
this.$refs.loanEnterpriseForm[0].validate(async valid=>{
|
if(valid){
|
// tempsaveflag值为1代表是保存
|
this.$parent._data.loading = true;
|
array[0].tempsaveflag = '0'
|
const res = await saveEntInfoPre(array[0])
|
this.$parent._data.loading = false;
|
if(res.code == '00'){
|
// 保存成功后重新查询
|
const result = await this.qryEntInfoPre()
|
this.getEntInfoPreData(result)
|
this.nextPage()
|
}
|
}
|
})
|
}
|
},
|
beforeRouteLeave(to, from, next) {
|
!this.loanEnterpriseForm.length||common.compareFormData(this.initialArr,this.loanEnterpriseForm,next)?next():''
|
}
|
}
|
</script>
|
