<template>
|
<div>
|
<CreateForms
|
ref="financeForms"
|
:isReset="true"
|
:isView="isView"
|
:screenWidth="screenWidth"
|
:isShowBorder="isShowBorder"
|
:formItems="formItems"
|
:defValues="defValues"
|
:formRules="formRules"
|
@handleSelOnChange="handleSelOnChange"
|
@handleInputChange="handleInputChange"
|
/>
|
</div>
|
</template>
|
|
<script>
|
import CreateForms from "@/views/components/CreateForms";
|
|
import {
|
getDictionaryList,
|
getProvinceCodeList,
|
getCityCodeList,
|
getAreaCodeList
|
} from "@/http/api.js";
|
|
import { enterpriseCusBasicInfo } from "../config/formItem.config";
|
import { enterpriseCusBasicInfoDefault } from "../config/defValues.config";
|
import { stockInfoRules } from "../config/rules.config";
|
export default {
|
components: {
|
CreateForms
|
},
|
props: {
|
formItems: {
|
type: Array,
|
default: () => []
|
},
|
defValues: {
|
type: Object,
|
default: () => {}
|
},
|
formRules: {
|
type: Object,
|
default: () => {}
|
},
|
isView: {
|
type: String,
|
default: ""
|
},
|
isShowBorder: {
|
type: String,
|
default: ""
|
},
|
addorupdate: {
|
type: [String],
|
default: ""
|
},
|
screenWidth: {
|
type: Number,
|
default: () => {
|
return 1280;
|
}
|
}
|
},
|
data() {
|
return {
|
// formItems: [...enterpriseCusBasicInfo],
|
// defValues: { ...enterpriseCusBasicInfoDefault },
|
// formRules: { ...stockInfoRules },
|
tempProvince: "",
|
tempCity: ""
|
};
|
},
|
created() {
|
this.init();
|
},
|
watch:{
|
"defValues.companyProvince": {
|
handler(value, oldValue) {
|
if (value) {
|
this.getCityCodeList("companyCity", value);
|
}
|
if (value !== oldValue && oldValue) {
|
this.defValues.companyCity = "";
|
}
|
}
|
},
|
"defValues.companyCity": {
|
handler(value, oldValue) {
|
if (value) {
|
this.getAreaCodeList("companyCounty", value);
|
}
|
if (value !== oldValue && oldValue) {
|
this.defValues.companyCounty = "";
|
}
|
}
|
},
|
},
|
methods: {
|
init() {
|
const { formItems } = this;
|
formItems.forEach(({ name }) => {
|
if (name === "industryType" || name === "enterpriseCategory") {
|
this.getDictionaryList(name);
|
}
|
if (name === "companyProvince") {
|
this.getProvinceCodeList(name);
|
}
|
});
|
},
|
async getDictionaryList(name) {
|
const codeNo = name.substring(0, 1).toUpperCase() + name.substring(1);
|
const { result } = await getDictionaryList({ codeNo });
|
const list = result.map(item => {
|
return {
|
label: item.itemname,
|
value: item.itemno
|
};
|
});
|
this.updateValue(name, { options: list });
|
},
|
async getProvinceCodeList(name) {
|
const { result } = await getProvinceCodeList({});
|
const list = result.map(item => {
|
return {
|
label: item.itemName,
|
value: item.itemNo
|
};
|
});
|
this.updateValue(name, { options: list });
|
},
|
async getCityCodeList(name, value) {
|
const { result } = await getCityCodeList({
|
codeNo: "AreaCode",
|
itmeNo: value
|
});
|
const list = result.map(item => {
|
return {
|
label: item.itemName,
|
value: item.itemNo
|
};
|
});
|
this.updateValue(name, { options: list });
|
},
|
async getAreaCodeList(name, value) {
|
const { result } = await getAreaCodeList({
|
codeNo: "AreaCode",
|
itmeNo: value
|
});
|
const list = result.map(item => {
|
return {
|
label: item.itemName,
|
value: item.itemNo
|
};
|
});
|
this.updateValue(name, { options: list });
|
},
|
updateValue(index, info = "") {
|
const { formItems } = this;
|
const nameIndex = formItems.findIndex(({ name }) => name === index);
|
if (nameIndex > -1 && info !== "") {
|
const preInfo = formItems[nameIndex];
|
this.$set(formItems, nameIndex, { ...preInfo, ...info });
|
}
|
if (info === "") {
|
const preInfo = formItems[nameIndex];
|
this.$set(formItems, nameIndex, {
|
...preInfo,
|
value: info
|
});
|
}
|
},
|
handleSelOnChange(name, value) {
|
if (name === "companyProvince") {
|
// const { tempProvince } = this;
|
// if (tempProvince !== value) {
|
// this.tempProvince = value;
|
// this.updateValue("companyCity");
|
// }
|
this.getCityCodeList("companyCity", value);
|
}
|
if (name === "companyCity") {
|
this.getAreaCodeList("companyCounty", value);
|
}
|
},
|
handleInputChange() {}
|
}
|
};
|
</script>
|
|
<style scoped>
|
</style>
|
