<template>
|
<div class="dataBack" v-loading="loading">
|
<el-form id="enter-form" ref="form" :model="form" v-show="!loading">
|
<el-form-item label="项目贴息配置">
|
<el-radio-group v-model="form.discountType">
|
<el-collapse v-model="activeName" accordion>
|
<el-collapse-item name="0" disabled>
|
<template slot="title">
|
<el-radio label="0" :disabled="isDisabled">无折扣贴息</el-radio>
|
</template>
|
</el-collapse-item>
|
<el-collapse-item
|
v-for="(key, index) in tablesKey"
|
:key="index"
|
:name="key"
|
>
|
<template slot="title">
|
<el-radio :label="key" :disabled="isDisabled">折扣贴息{{ key }}</el-radio>
|
</template>
|
<div>
|
<el-table :data="tableData[key]" border style="width: 100%">
|
<!-- <el-table-column type="index"> </el-table-column> -->
|
<el-table-column
|
v-for="(item, idx) in headerTable"
|
:key="idx"
|
:prop="item.prop"
|
:label="item.label"
|
>
|
<template slot-scope="scope">
|
<div v-if="item.prop == 'minquantity'">
|
<span
|
style="margin-left: 10px"
|
>{{scope.row.minquantity}}笔 ≤ 月放款 ≤ {{scope.row.maxquantity}}笔</span
|
>
|
</div>
|
<div v-if="item.prop == 'repaymentmethod'">
|
<span style="margin-left: 10px">{{
|
scope.row.repaymentmethod
|
}}</span>
|
</div>
|
<div v-if="item.prop == 'discountperiods'">
|
<span style="margin-left: 10px">{{
|
scope.row.discountperiods
|
}}</span>
|
</div>
|
<div v-if="item.prop == 'discountrate'">
|
<span style="margin-left: 10px">{{
|
scope.row.discountrate
|
}}%</span>
|
</div>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</el-collapse-item>
|
</el-collapse>
|
</el-radio-group>
|
</el-form-item>
|
</el-form>
|
</div>
|
</template>
|
|
<script>
|
import { mapState } from "vuex";
|
import {
|
qryProjectDiscount,
|
updateProjectDiscount,
|
qryProjectDiscountList,
|
} from "@/api/area";
|
|
export default {
|
components: {},
|
props: ["nextChange"],
|
data: function () {
|
return {
|
loading: false,
|
writeAble: false,
|
form: {
|
discountType: "",
|
},
|
oldForm: {},
|
activeName: '1',
|
headerTable: [
|
{ label: "单月放款", prop: "minquantity" },
|
{ label: "还款方式", prop: "repaymentmethod" },
|
{ label: "贴息期限", prop: "discountperiods" },
|
{ label: "贴息费率", prop: "discountrate" },
|
],
|
tablesKey: [],
|
tableData: [],
|
};
|
},
|
computed: {
|
...mapState({
|
detailsParams: (state) => state.risk.detailsParams,
|
}),
|
isDisabled() {
|
console.log('router:', this.$route)
|
const route = this.$route.path
|
return route.indexOf('details') !==-1
|
}
|
},
|
created() {
|
this.qryProjectDiscountList();
|
this.initForm();
|
},
|
watch: {
|
"form.discountType": function (value, oldValue) {
|
if (value) {
|
// this.activeName = value
|
}
|
},
|
},
|
methods: {
|
handleChange(val) {
|
if (val) {
|
// this.form.discountType = val;
|
}
|
},
|
initForm() {
|
this.loading = true;
|
// 初始化表单
|
this.config = Object.assign({}, this.config, this.form);
|
Object.keys(this.config).forEach((key) => {
|
let params = {
|
visible: false,
|
required: false,
|
writeAble: false,
|
};
|
this.$set(this.config, key, params);
|
});
|
let params = {
|
objectType: this.detailsParams.objectType,
|
dataType: this.detailsParams.dataType,
|
projectFlag: this.detailsParams.projectFlag,
|
projectType: this.detailsParams.projectType,
|
serialno: this.detailsParams.objectNo,
|
};
|
qryProjectDiscount(params).then((res) => {
|
this.config = this._.merge(this.config, res.result);
|
Object.keys(this.form).forEach((key) => {
|
this.$set(this.form, key, this.config[key].value);
|
});
|
Object.assign(this.oldForm, this.form);
|
this.loading = false;
|
const discountType = this.form.discountType
|
this.activeName = parseInt(discountType) === 0 ? '' : discountType
|
});
|
},
|
qryProjectDiscountList() {
|
qryProjectDiscountList().then((res) => {
|
let data = res.result;
|
let tables = {};
|
data.map((item) => {
|
if (!(item.configtype in tables)) {
|
tables[item.configtype] = [];
|
tables[item.configtype].push(item);
|
} else {
|
tables[item.configtype].push(item);
|
}
|
});
|
this.tablesKey = Object.keys(tables);
|
this.tableData = tables;
|
});
|
},
|
submitForm() {
|
this.$refs["form"].validate((valid) => {
|
if (valid) {
|
let params = {
|
serialno: this.detailsParams.objectNo,
|
objecttype: this.detailsParams.objectType,
|
dataType: this.detailsParams.dataType,
|
isTempSave: false,
|
};
|
Object.assign(params, this.form);
|
updateProjectDiscount(params).then((res) => {
|
if (res.code === "00") {
|
// this.$message.success(res.result.resultsDesc)
|
this.$emit("handleNextPage", true);
|
}
|
});
|
} else {
|
this.$message.warning(
|
"当前页面存在必填项未录入或数据录入错误,请检查!"
|
);
|
return false;
|
}
|
});
|
},
|
// 保存草稿
|
handleSaveDraft() {
|
let params = {
|
serialno: this.detailsParams.objectNo,
|
objecttype: this.detailsParams.objectType,
|
dataType: this.detailsParams.dataType,
|
isTempSave: true,
|
};
|
Object.assign(params, this.form);
|
updateProjectDiscount(params).then((res) => {
|
if (res.code === "00") {
|
this.$message.success("保存成功");
|
this.oldForm = Object.assign(this.oldForm, this.form);
|
}
|
});
|
},
|
// 保存
|
handleSave() {
|
this.$refs["form"].validate((valid) => {
|
if (valid) {
|
let params = {
|
serialno: this.detailsParams.objectNo,
|
objecttype: this.detailsParams.objectType,
|
dataType: this.detailsParams.dataType,
|
isTempSave: true,
|
};
|
Object.assign(params, this.form);
|
updateProjectDiscount(params).then((res) => {
|
if (res.code === "00") {
|
this.$message.success("保存成功");
|
this.oldForm = Object.assign(this.oldForm, this.form);
|
}
|
});
|
} else {
|
// this.$message.warning('当前页面存在必填项未录入或数据录入错误,请检查!')
|
this.$message.warning(
|
"当前页面存在必填项未录入或数据录入错误,请检查!"
|
);
|
return false;
|
}
|
});
|
},
|
},
|
beforeRouteLeave(to, from, next) {
|
if (this.nextChange) {
|
for (const key in this.oldForm) {
|
if (this.oldForm.hasOwnProperty(key)) {
|
if (this.oldForm[key] != this.form[key]) {
|
this.$confirm(`当前页面有未保存的数据，是否放弃保存`, "提示", {
|
confirmButtonText: "是",
|
cancelButtonText: "否",
|
customClass: "pro_messages_box",
|
confirmButtonClass: "pro_messages_box_confirm",
|
cancelButtonClass: "pro_messages_box_cancel",
|
center: true,
|
})
|
.then(() => {
|
next();
|
})
|
.catch(() => {
|
this.$emit("notNext");
|
});
|
return;
|
}
|
}
|
}
|
}
|
next();
|
},
|
};
|
</script>
|
|
|
<style lang="stylus" scoped>
|
>>>.el-form {
|
margin-top: 100px !important;
|
|
.el-radio-group {
|
width: 800px;
|
}
|
.el-form-item {
|
align-items: start!important;
|
}
|
.el-table {
|
tr{
|
height 36px!important;
|
line-height 36px!important;
|
}
|
td {
|
border-right: 1px solid #eee!important;
|
}
|
}
|
}
|
|
>>> .el-form-item__label {
|
margin-right: 20px;
|
}
|
</style>
|
