<template>
|
<div class="customer-edit">
|
<el-dialog :title="title"
|
:visible.sync="dialogVisible"
|
:modal-append-to-body="false"
|
:close-on-click-modal="false"
|
:before-close="handleClose"
|
custom-class="comm-dialog"
|
center
|
width="850px">
|
<EditForm ref="contractForm"
|
column="2"
|
:inline="true"
|
:list="formList"
|
:formValues="formValues"
|
:formRules="formRules"
|
:key="info.mailingNo || '1'"
|
@updateValue="updateValue"></EditForm>
|
<div slot="footer"
|
class="dialog-footer popup-form-buttons">
|
<el-button class="comm-button"
|
size="small"
|
@click="$emit('doAction', 'close')">取消</el-button>
|
<el-button class="comm-button"
|
size="small"
|
@click="submit"
|
type="primary">保存</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
<script>
|
// 返现开发商-新增与编辑
|
import EditForm from '../components/EditForm';
|
import addOrModifyCommissionTransferFlow from '@comprehensive/model/addOrModifyCommissionTransferFlow';
|
import queryCommissionPorjectAll from '@comprehensive/model/queryCommissionPorjectAll';
|
export default {
|
components: {
|
EditForm,
|
},
|
props: {
|
dialogVisible: {
|
type: Boolean,
|
default: false,
|
},
|
title: {
|
type: String,
|
default: '新增',
|
},
|
info: {
|
type: Object,
|
default: () => ({}),
|
},
|
commissionDeveloperAll: {
|
type: Array,
|
default: () => ([]),
|
},
|
// commissionPorjectAll: {
|
// type: Array,
|
// default: () => ([]),
|
// },
|
commissionTaxiSourceAll: {
|
type: Array,
|
default: () => ([]),
|
},
|
},
|
data() {
|
return {
|
loading: false,
|
model: null,
|
formRules: {},
|
formList: [],
|
commissionPorjectAll: []
|
};
|
},
|
created() {
|
this.init();
|
},
|
methods: {
|
init() {
|
const { info } = this;
|
const model = addOrModifyCommissionTransferFlow();
|
this.model = model;
|
const formList = model.getFormList({
|
...info,
|
address: info.adress || info.address || '',
|
});
|
this.formList = formList;
|
this.formRules = model.getFormRules(formList);
|
// this.setOptions();
|
},
|
|
setOptions() {
|
this.updateValue('developerId', { options: this.commissionDeveloperAll });
|
// this.updateValue('projectId', { options: this.commissionPorjectAll });
|
this.updateValue('taxiSourceId', { options: this.commissionTaxiSourceAll });
|
},
|
// 更新表单数据 info->当前选项初始值
|
updateValue(index, info, flag) {
|
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 });
|
if (preInfo.name === 'developerId' && formList[index].value) {
|
this.queryCommissionPorjectAll(formList[index].value)
|
if(info.value != preInfo.value && info.value) {
|
this.$set(formList, 2, { ...formList[2], value: '' });
|
this.$set(formList, 3, { ...formList[3], value: '' });
|
}
|
}
|
if (preInfo.name === 'projectId') {
|
const infoFind = this.commissionPorjectAll.find(item => {
|
return item.value === formList[index].value
|
})
|
// 设置项目别名
|
infoFind && this.updateValue('projectAlias', { value: infoFind.projectAlias });
|
}
|
}
|
},
|
|
// 项目下拉列表
|
async queryCommissionPorjectAll(developerId) {
|
const res = await queryCommissionPorjectAll().request({developerId});
|
const { list } = res;
|
console.log(list)
|
this.commissionPorjectAll = list;
|
this.updateValue('projectId', { options: list });
|
},
|
async submit() {
|
const { model, info } = this;
|
let formInfo = this.$refs.contractForm.validate();
|
console.log('--', formInfo)
|
if (formInfo) {
|
// if ('serialno' in info) {
|
// formInfo.serialno = info.serialno;
|
// }
|
this.loading = true;
|
await model.request({
|
...formInfo,
|
});
|
this.$emit('doAction', 'succ');
|
this.loading = false;
|
}
|
},
|
handleClose(done) {
|
this.$emit('doAction', 'close')
|
}
|
},
|
computed: {
|
// 表单值信息
|
formValues() {
|
const { model, formList } = this;
|
return model.getFormValues(formList);
|
},
|
},
|
watch: {
|
info() {
|
},
|
dialogVisible(newV) {
|
if(newV) {
|
console.log(newV)
|
this.init();
|
this.setOptions()
|
}
|
}
|
},
|
};
|
</script>
|
<style lang="postcss" scoped>
|
.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>
|
