<template>
|
<div class="customer-edit">
|
<el-dialog :title="title"
|
:visible.sync="dialogVisible"
|
:modal-append-to-body="true"
|
:close-on-click-modal="false"
|
:before-close="handleClose"
|
custom-class="comm-dialog"
|
center
|
width="1250px">
|
<p class="section-title">开发商基本信息</p>
|
<div v-if="dialogVisible">
|
<EditForm ref="contractForm"
|
column="3"
|
:inline="true"
|
:list="formList"
|
:formValues="formValues"
|
:formRules="formRules"
|
:key="info.mailingNo || '1'"
|
@updateValue="updateValue"></EditForm>
|
</div>
|
<!-- 编辑项目 -->
|
<div v-show="showServiceConfig">
|
<HouseholdBagServiceConfig ref="HouseholdBagServiceConfig"
|
:dialogVisible="showServiceConfig"
|
:serialno="serialno"
|
:powerControl="powerControl" />
|
</div>
|
<div slot="footer"
|
class="dialog-footer popup-form-buttons">
|
<el-button class="comm-button"
|
size="small"
|
@click="handleClose">{{this.powerControl.addControl? '取消' : '关闭'}}</el-button>
|
<el-button class="comm-button"
|
size="small"
|
@click="handleSubmit(showServiceConfig)"
|
type="primary"
|
v-if="this.editType != 3">保存</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
<script>
|
// 返现佣金-项目管理-新增与编辑
|
import HouseholdBagServiceConfig from '@comprehensive/components/HouseholdBagServiceConfig';
|
import EditForm from '../components/EditForm';
|
import addOrModifyHouseholdBagProject from '@comprehensive/model/addOrModifyHouseholdBagProject';
|
import queryCommissionPorjectAll from '@comprehensive/model/queryCommissionPorjectAll';
|
|
import {
|
getDictionaryList,
|
getProvinceCodeList,
|
getCityCodeList,
|
getAreaCodeList,
|
} from '@comprehensive/serve/public';
|
import { qryHouseholdBagProjectInfo } from '@/api/comprehensiveTransaction';
|
export default {
|
components: {
|
EditForm,
|
HouseholdBagServiceConfig,
|
},
|
props: {
|
dialogVisible: {
|
type: Boolean,
|
default: false,
|
},
|
editType: {
|
default: 1, // 1 '新增', 2 编辑 3 查看
|
},
|
info: {
|
type: Object,
|
default: () => ({}),
|
},
|
powerControl: {
|
type: Object,
|
default: () => ({}),
|
},
|
},
|
data() {
|
return {
|
loading: false,
|
model: null,
|
formRules: {},
|
projectInfo: {},
|
formList: [],
|
serialno: '',
|
showServiceConfig: false,
|
};
|
},
|
created() {
|
// this.init();
|
},
|
methods: {
|
init() {
|
const { info } = this;
|
this.serialno = info.serialno;
|
const model = addOrModifyHouseholdBagProject();
|
this.model = model;
|
const formList = model.getFormList({});
|
this.formList = formList;
|
this.formRules = model.getFormRules(formList);
|
this.editType != 1 && this.getProjectBaseInfo();
|
this.showServiceConfig = this.editType != 1;
|
this.getOptions();
|
},
|
getOptions() {
|
const { info } = this;
|
const {
|
projectProvince = '',
|
projectCity = '',
|
regions = '',
|
} = info;
|
this.getArea('projectProvince', '', projectProvince === '');
|
if (projectProvince !== '') {
|
this.getArea('projectCity', projectProvince, projectCity === '');
|
}
|
if (projectProvince !== '' && projectCity !== '') {
|
this.getArea('regions', projectCity, regions === '');
|
}
|
|
this.queryCommissionPorjectAll();
|
setTimeout(() => {
|
this.getDictionary('businessPart', 'BusinessPart');
|
}, 200);
|
|
if (this.editType == 3) {
|
// 查看-不可编辑
|
setTimeout(() => {
|
this.formList.map(item => {
|
this.updateValue(item.name, { attrs: ['disabled'] });
|
})
|
}, 100);
|
}
|
},
|
|
// 获取项目信息
|
getProjectBaseInfo() {
|
qryHouseholdBagProjectInfo({
|
projectSerialNo: this.serialno,
|
}).then((res) => {
|
const data = res.result;
|
const formList = this.model.getFormList({
|
...data,
|
address: data.adress || data.address || '',
|
});
|
this.projectInfo = data;
|
this.formList = formList;
|
});
|
},
|
|
// 下拉字典表
|
async getDictionary(name, codeNo) {
|
const { result } = await getDictionaryList({ codeNo });
|
console.log('businessPart', result)
|
this.updateOptions(name, result, 'itemname', 'itemno', false);
|
},
|
|
// 开发商下拉列表
|
async queryCommissionPorjectAll() {
|
const res = await queryCommissionPorjectAll().request({});
|
const { list } = res;
|
this.updateValue('commissionProjectId', { options: list });
|
},
|
|
updateOptions(name, list, labelKey, valueKey, isResetValue = true) {
|
const valueObj = isResetValue ? { value: '' } : {};
|
this.updateValue(name, {
|
options: list.map((item) => ({
|
label: item[labelKey],
|
value: item[valueKey],
|
})),
|
...valueObj,
|
});
|
},
|
|
async getArea(name, itmeNo, isResetValue = true) {
|
if (name === 'projectProvince') {
|
const { result } = await getProvinceCodeList();
|
this.updateOptions(name, result, 'itemname', 'itemno', isResetValue);
|
}
|
|
if (name === 'projectCity') {
|
const { result } = await getCityCodeList({
|
codeNo: 'AreaCode',
|
itmeNo,
|
});
|
this.updateOptions(name, result, 'itemname', 'itemno', isResetValue);
|
}
|
|
if (name === 'regions') {
|
const { result } = await getAreaCodeList({
|
codeNo: 'AreaCode',
|
itmeNo,
|
});
|
this.updateOptions(name, result, 'itemname', 'itemno', isResetValue);
|
}
|
},
|
// 更新表单数据
|
updateValue(index, info) {
|
const { formList } = this;
|
if (isNaN(index)) {
|
// index is name
|
index = formList.findIndex(({ name }) => name === index);
|
}
|
if (!isNaN(index) && index > -1) {
|
const preInfo = formList[index];
|
this.$set(formList, index, { ...preInfo, ...info });
|
const regionsIndex = formList.findIndex(
|
({ name }) => name === 'regions'
|
);
|
|
if (info.name === 'projectProvince') {
|
this.getArea('projectCity', info.value);
|
this.$set(formList, regionsIndex, {
|
...formList[regionsIndex],
|
options: [],
|
value: '',
|
});
|
}
|
|
if (info.name === 'projectCity') {
|
this.getArea('regions', info.value);
|
}
|
}
|
},
|
|
async handleSubmit(flag) {
|
const { model, info } = this;
|
let formInfo = this.$refs.contractForm.validate();
|
if (formInfo) {
|
if ('serialno' in info) {
|
formInfo.serialno = info.serialno;
|
this.serialno = info.serialno;
|
}
|
this.loading = true;
|
const res = await model.request({
|
...formInfo,
|
serialno: this.serialno,
|
});
|
if (res.code == '00' && !flag) {
|
this.serialno = res.serialno;
|
this.showServiceConfig = true;
|
setTimeout(() => {
|
this.$refs.HouseholdBagServiceConfig &&
|
this.$refs.HouseholdBagServiceConfig.init();
|
}, 100);
|
}
|
flag && this.$emit('doAction', 'succ');
|
this.loading = false;
|
}
|
},
|
handleClose() {
|
this.$emit('doAction', 'close');
|
},
|
},
|
computed: {
|
// 表单值信息
|
formValues() {
|
const { model, formList } = this;
|
return model.getFormValues(formList);
|
},
|
title() {
|
const {editType} = this;
|
return editType == 1 ? '新增' : editType == 2 ? '编辑' : '查看'
|
}
|
},
|
watch: {
|
dialogVisible(newV) {
|
if (newV) {
|
this.init();
|
// this.$refs.contractForm && this.$refs.contractForm.resetFields();
|
} else {
|
this.showServiceConfig = false;
|
// this.$refs.contractForm.resetFields();
|
}
|
},
|
showServiceConfig(newV) {
|
if (newV) {
|
setTimeout(() => {
|
this.$refs.HouseholdBagServiceConfig.init();
|
}, 100);
|
}
|
},
|
},
|
};
|
</script>
|
<style lang="postcss" scoped>
|
.section-title {
|
margin: 30px 0 20px 0;
|
padding: 0 0 0 10px;
|
border-left: solid 2px #0081f0;
|
line-height: 16px;
|
font-size: 14px;
|
color: #222222;
|
}
|
.disable-input {
|
background-color: #f5f7fa;
|
border: 1px solid #f5f7fa;
|
border-radius: 4px;
|
color: #c0c4cc;
|
cursor: pointer;
|
width: 190px;
|
height: 32px;
|
line-height: 32px;
|
padding: 0 15px;
|
display: flex;
|
justify-content: space-between;
|
& p {
|
flex: 1;
|
}
|
& >>> .el-icon-tickets {
|
line-height: 34px;
|
}
|
}
|
.customer-edit {
|
& >>> .el-dialog__header {
|
padding-bottom: 0;
|
}
|
& >>> .el-dialog__body {
|
padding-top: 0;
|
}
|
& >>> .el-dialog {
|
width: 950px;
|
}
|
}
|
</style>
|
