<template>
|
<div class="customer-edit">
|
<el-dialog custom-class="comm-dialog"
|
center
|
width="850px"
|
:title="title"
|
:visible.sync="dialogVisible"
|
:modal-append-to-body="false"
|
:close-on-click-modal="false"
|
@close="cancal">
|
<el-form :model="loanForm"
|
:rules="rules"
|
ref="ruleForm"
|
label-width="100px"
|
class="demo-ruleForm"
|
inline>
|
<div class="_block">
|
<p class="section-title">开发商基本信息</p>
|
<div class="form">
|
<el-form-item label="省份"
|
prop="projectProvince">
|
<el-select v-model="loanForm.projectProvince"
|
filterable
|
clearable
|
placeholder="支持输入搜索选择"
|
@change="getprovince(loanForm.projectProvince,'projectcityList',loanForm,function(arr){projectcityList=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="城市"
|
prop="projectCity">
|
<el-select v-model="loanForm.projectCity"
|
filterable
|
clearable
|
placeholder="支持输入搜索选择">
|
<el-option v-for="(item,index) in projectcityList"
|
:key="index"
|
:label="item.itemname"
|
:value="item.itemno"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="项目名称"
|
prop="projectName">
|
<el-input v-model="loanForm.projectName"></el-input>
|
</el-form-item>
|
<el-form-item label="项目备案名"
|
prop="projectNameFiling">
|
<el-input v-model="loanForm.projectNameFiling"></el-input>
|
</el-form-item>
|
<el-form-item label="所属事业部"
|
prop="businessPart">
|
<el-select v-model="loanForm.businessPart"
|
filterable
|
placeholder="请选择">
|
<el-option label="是" value="1"></el-option>
|
<el-option label="否" value="0"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="关联返现项目"
|
prop="commissionProjectId">
|
<el-select v-model="loanForm.commissionProjectId"
|
filterable
|
placeholder="请选择">
|
<el-option label="是" value="1"></el-option>
|
<el-option label="否" value="0"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="是否支持自定义金额"
|
prop="useCustomize"
|
class="inline-label">
|
<el-select v-model="loanForm.useCustomize"
|
filterable
|
placeholder="请选择">
|
<el-option label="是" value="1"></el-option>
|
<el-option label="否" value="0"></el-option>
|
</el-select>
|
</el-form-item>
|
</div>
|
</div>
|
</el-form>
|
<div slot="footer"
|
class="dialog-footer popup-form-buttons">
|
<el-button class="comm-button"
|
size="small"
|
@click="cancal">取消</el-button>
|
<el-button class="comm-button"
|
size="small"
|
@click="submit"
|
type="primary">保存</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
<script>
|
// 返现佣金-项目管理-新增与编辑
|
import common from '@/utils/common';
|
import { addOrModifyHouseholdBagProject } from '@/api/comprehensiveTransaction';
|
import {
|
getDictionaryList,
|
getProvinceCodeList,
|
getCityCodeList,
|
getAreaCodeList,
|
} from '@comprehensive/serve/public';
|
export default {
|
props: {
|
dialogVisible: {
|
type: Boolean,
|
default: false,
|
},
|
title: {
|
type: String,
|
default: '新增',
|
},
|
info: {
|
type: Object,
|
default: () => ({}),
|
},
|
},
|
data() {
|
return {
|
loading: false,
|
model: null,
|
formRules: {},
|
formList: [],
|
loanForm: { projectCity: null },
|
loanArr: [],
|
provinceList: [],
|
projectcityList: [],
|
rules: {
|
projectProvince: [
|
{ required: true, message: '请选择', trigger: 'change' },
|
],
|
projectCity: [{ required: true, message: '请选择', trigger: 'change' }],
|
projectName: [
|
{ required: true, message: '请输入活动名称', trigger: 'blur' },
|
],
|
},
|
};
|
},
|
async created() {
|
// this.init();
|
// 获取省枚举值
|
getProvinceCodeList({}).then((res) => {
|
this.provinceList = res.result;
|
});
|
// // // 根据省获取市
|
// this.loanForm.collectionbankprovince
|
// ? (this.projectcityList = await common.qryCityCodeList(
|
// this.loanForm.collectionbankprovince
|
// ))
|
// : '';
|
this.getDictionary('businessPart', 'BusinessPart')
|
},
|
methods: {
|
// init() {
|
// const { info } = this;
|
// const model = addOrModifyHouseholdBagProject();
|
// this.model = model;
|
// const formList = model.getFormList({
|
// ...info,
|
// address: info.adress || info.address || '',
|
// });
|
// this.formList = formList;
|
// this.formRules = model.getFormRules(formList);
|
// // this.getOptions();
|
// },
|
|
getOptions() {
|
// const { info } = this;
|
// const conf = {
|
// status: 'MStatus',
|
// };
|
// const { status = '', province = '', city = '', regions = '' } = info;
|
// Object.keys(conf).forEach((key) =>
|
// this.getStatus(key, conf[key], status === '')
|
// );
|
this.getArea('province', '', province === '');
|
if (province !== '') {
|
this.getArea('city', province, city === '');
|
}
|
if (province !== '' && city !== '') {
|
this.getArea('regions', city, regions === '');
|
}
|
},
|
|
// 下拉字典表
|
async getDictionary(name, codeNo) {
|
const { result } = await getDictionaryList({ codeNo });
|
this.updateOptions(name, result, 'itemname', 'itemno', false);
|
},
|
|
// 邮寄状态
|
// async getStatus(name, codeNo, isResetValue = true) {
|
// const { result } = await getDictionaryList({ codeNo });
|
// this.updateOptions(name, result, 'itemname', 'itemno', isResetValue);
|
// },
|
|
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 === 'province') {
|
const { result } = await getProvinceCodeList();
|
this.updateOptions(name, result, 'itemname', 'itemno', isResetValue);
|
}
|
|
if (name === 'city') {
|
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 === 'province') {
|
this.getArea('city', info.value);
|
this.$set(formList, regionsIndex, {
|
...formList[regionsIndex],
|
options: [],
|
value: '',
|
});
|
}
|
|
if (info.name === 'city') {
|
this.getArea('regions', info.value);
|
}
|
}
|
},
|
|
async submit() {
|
this.$refs.ruleForm.validate((valid) => {
|
if (valid) {
|
this.loading = true;
|
addOrModifyHouseholdBagProject({ ...this.loanForm }).then((res) => {
|
if (res.code == '00') {
|
this.$emit('doAction', 'succ', res.result);
|
this.loading = false;
|
}
|
});
|
} else {
|
this.$message.warning(
|
'当前页面存在必填项未录入或数据录入错误,请检查!'
|
);
|
return false;
|
}
|
});
|
},
|
cancal() {
|
this.$refs.ruleForm.resetFields();
|
this.$emit('doAction', 'close');
|
},
|
},
|
computed: {
|
// 表单值信息
|
formValues() {
|
const { model, formList } = this;
|
return model.getFormValues(formList);
|
},
|
},
|
watch: {
|
info() {
|
// this.init();
|
},
|
},
|
};
|
</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;
|
}
|
}
|
.form-top {
|
& >>> .el-form-item__label {
|
width: auto !important;
|
line-height: 32px;
|
}
|
& >>> .el-form-item__content {
|
display: block;
|
width: 100px;
|
}
|
& >>> .action-btn {
|
display: inline-block;
|
}
|
}
|
.inline-label {
|
& >>> .el-form-item__label {
|
line-height: 1.4;
|
}
|
}
|
</style>
|
