<template>
|
<div class="customer-edit">
|
<el-dialog :title="title"
|
:visible="dialogVisible"
|
:modal-append-to-body="false"
|
:close-on-click-modal="false"
|
custom-class="comm-dialog"
|
center
|
width="850px"
|
@close="$emit('doAction', 'close')">
|
<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 addHouseholdBagPayRec from '@comprehensive/model/addHouseholdBagPayRec';
|
import qryHouseholdBagApplyCustList from '@comprehensive/model/qryHouseholdBagApplyCustList';
|
|
import {
|
getProvinceCodeList,
|
getCityCodeList,
|
getAreaCodeList,
|
} from '@comprehensive/serve/public';
|
import getDictionaryList from '@comprehensive/model/getDictionaryList'
|
import getApplyListAll from '@comprehensive/model/getApplyListAll';
|
|
|
export default {
|
components: {
|
EditForm,
|
},
|
props: {
|
dialogVisible: {
|
type: Boolean,
|
default: false
|
},
|
title: {
|
type: String,
|
default: '新增'
|
},
|
info: {
|
type: Object,
|
default: () => ({}),
|
},
|
},
|
data() {
|
return {
|
loading: false,
|
model: null,
|
formRules: {},
|
formList: [],
|
};
|
},
|
created() {
|
this.init();
|
},
|
methods: {
|
init() {
|
const { info } = this;
|
const model = addHouseholdBagPayRec();
|
this.model = model;
|
const formList = model.getFormList({
|
...info,
|
address: info.adress || info.address || '',
|
});
|
this.formList = formList;
|
this.formRules = model.getFormRules(formList);
|
// this.getOptions();
|
this.getApplyListAll()
|
this.getRepayTypeList();
|
// this.qryHouseholdBagApplyCustList();
|
},
|
|
|
// 查询项目管理列表
|
async getApplyListAll() {
|
const res = await getApplyListAll().request({});
|
const { list } = res;
|
this.updateValue('projectSerialno', { options: list });
|
},
|
|
// 支付方式
|
async getRepayTypeList() {
|
const res = await getDictionaryList().request({
|
codeNo: 'HouseholdAppBagPayMethod'
|
})
|
const { list } = res
|
this.updateValue('payMethod', { options: list })
|
},
|
|
// 关联客户下拉列表
|
async qryHouseholdBagApplyCustList(projectSerialno) {
|
let { formValues } = this
|
const res = await qryHouseholdBagApplyCustList().request({
|
projectSerialno: projectSerialno
|
})
|
const { list } = res
|
this.updateValue('houseBagSerialno', { options: list })
|
},
|
|
// 更新表单数据
|
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 });
|
if(info.name === 'projectSerialno') {
|
if(info.value != preInfo.value) {
|
const findIdx = formList.findIndex(
|
({ name }) => name === 'houseBagSerialno'
|
)
|
this.$set(formList, findIdx, { ...formList[findIdx], value: '' });
|
}
|
this.qryHouseholdBagApplyCustList(info.value);
|
}
|
}
|
},
|
|
async submit() {
|
const { model, info } = this;
|
let formInfo = this.$refs.contractForm.validate();
|
if (formInfo) {
|
if('serialno' in info) {
|
formInfo.serialno = info.serialno
|
}
|
this.loading = true;
|
await model.request({
|
...formInfo,
|
});
|
this.$emit('doAction', 'succ');
|
this.loading = false;
|
}
|
},
|
},
|
computed: {
|
// 表单值信息
|
formValues() {
|
const { model, formList } = this;
|
return model.getFormValues(formList);
|
},
|
},
|
watch: {
|
info() {
|
this.init();
|
},
|
},
|
};
|
</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>
|
