<template>
|
<div v-if="isNew" style="min-width: 1200px;overflow: scroll;">
|
<div class="left">
|
<LeftMenus :menuItems="menuItems" @jump="jump" @backList="backList" />
|
</div>
|
<div class="right" @scroll="onScroll" ref="proMange">
|
<div
|
class="scroll_pro_item"
|
:id="`${item.name}_id`"
|
v-for="(item, index) in menuItems.slice(0, 4)"
|
:key="index"
|
>
|
<ModuleTitle :title="item.label" />
|
<div
|
v-if="!!item.children && item.children.length > 0"
|
style="background: #fff;"
|
>
|
<div
|
class="item_set_class"
|
v-for="(child, index) in item.children"
|
:key="index"
|
>
|
<template v-if="!child.isHide">
|
<MenusTitle :title="child.label" />
|
<CreateForms
|
:edit="type === 'edit'"
|
v-if="child.type === 'FORMS'"
|
:screenWidth="screenWidth"
|
:ref="child.name"
|
:formItems="child.formItems"
|
:defValues="child.defValues"
|
:formRules="child.formRules"
|
@handleSelOnChange="handleSelOnChange"
|
@handleElmentChange="handleElmentChange"
|
/>
|
</template>
|
</div>
|
</div>
|
<ProCustomersList
|
v-if="item.name === 'PROCUSTOMERSLIST'"
|
ref="customersList"
|
:edit="type === 'edit'"
|
/>
|
<ProDimensionList
|
v-if="item.name === 'PRODIMENSIONLIST'"
|
ref="dimensionList"
|
:screenWidth="screenWidth"
|
:edit="type === 'edit'"
|
/>
|
<el-row v-if="item.name === 'IMAGESDOC'" style="margin-left:2px;">
|
<el-col :span="12">
|
<FileUpload
|
:fileInfo="proDocFileInfo"
|
:isUpload="true"
|
@beforeAvatarUpload="beforeAvatarUpload"
|
@handleImageClick="handleImageClick"
|
@handleUpload="handleUpload"
|
@handleDelete="handleDelete"
|
/>
|
</el-col>
|
<el-col :span="12">
|
<FileUpload
|
:fileInfo="otherFileInfo"
|
:isUpload="true"
|
@beforeAvatarUpload="beforeAvatarUpload"
|
@handleImageClick="handleImageClick"
|
@handleUpload="handleUpload"
|
@handleDelete="handleDelete"
|
/>
|
</el-col>
|
</el-row>
|
<el-row class="right_opreat">
|
<el-button
|
class="save_button"
|
@click="handleSave"
|
:disabled="subLoading"
|
>保存草稿</el-button
|
>
|
<el-button
|
type="primary"
|
class="submit_button"
|
@click="submitForm"
|
:loading="subLoading"
|
>提交</el-button
|
>
|
</el-row>
|
</div>
|
<el-dialog
|
custom-class="product_submit_dialog"
|
:visible.sync="commitDialogVisible"
|
:before-close="handleClose"
|
width="400px"
|
center
|
>
|
<div class="messageCheck">
|
<i class="el-icon-success checkSuccess"></i>
|
<div class="tip">提交成功</div>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="enterMessages">确 定</el-button>
|
</span>
|
</el-dialog>
|
<el-dialog
|
title="产品定义变更保存确认"
|
:visible.sync="dialogBackVisible"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:destroy-on-close="true"
|
width="450"
|
center
|
custom-class="pricing_dialog back_dialog"
|
>
|
<div>产品定义信息已发生变更，请确认是否需要保存草稿</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="handleBackNonclick">不保存直接返回</el-button>
|
<el-button type="primary" @click="handleBackclick"
|
>保存并返回</el-button
|
>
|
</span>
|
</el-dialog>
|
</div>
|
</div>
|
</template>
|
<script>
|
import { PRODUCTMANAGEMENUS } from "../utils/menusConfig.js";
|
import { rmoney } from "../utils/currency";
|
import {
|
PRODUCTOPTIONS,
|
PRODUCTOPTIONSENUM
|
} from "../utils/optionsQueryConfig.js";
|
import LeftMenus from "../components/LeftMenus.vue";
|
import ModuleTitle from "../components/ModuleTitle.vue";
|
import MenusTitle from "../components/MenusTitle.vue";
|
import FileUpload from "../components/FileUpload.vue";
|
import CreateForms from "../components/CreateForms.vue";
|
import ProCustomersList from "./components/ProCustomersList.vue";
|
import ProDimensionList from "./components/productDimension/ProDimensionList.vue";
|
import {
|
qryDropDownOptionBatch,
|
initProductInfo,
|
saveProductInfo,
|
qryProductImageInfo,
|
addFileForProductInfo,
|
delFileForProductInfo,
|
productFlowSubmit,
|
qryProductDetailInfo,
|
qryInputUserInfo
|
} from "../api/productManage.api.js";
|
export default {
|
data() {
|
return {
|
screenWidth: document.documentElement.clientWidth || 1280, // 屏幕宽度
|
menuItems: [...PRODUCTMANAGEMENUS(true)],
|
optionsMap: {},
|
serialno: "",
|
productid: "",
|
newWindow: null,
|
type: "",
|
subLoading: false,
|
isChange: false,
|
domLength: 0,
|
objecttype: this.$route.query.objecttype || "",
|
detailData: {},
|
typeno: "",
|
oldTypeNo: "",
|
proDocFileInfo: {
|
required: false,
|
description: "产品资料",
|
count: 0,
|
key: "productInfo"
|
},
|
otherFileInfo: {
|
required: false,
|
description: "其他资料",
|
count: 0,
|
key: "productOtherInfo"
|
},
|
isNew: true,
|
isProSave: false,
|
dialogBackVisible: false,
|
isBaseForm: false,
|
isAmountForm: false,
|
isBusinessForm: false,
|
isShowxingForm: false,
|
isZhiyongForm: false,
|
isShouxingzhiyongForm: false,
|
commitDialogVisible: false, // 提交弹框
|
mergeCreditStatus:null
|
};
|
},
|
components: {
|
LeftMenus,
|
ModuleTitle,
|
MenusTitle,
|
CreateForms,
|
FileUpload,
|
ProCustomersList,
|
ProDimensionList
|
},
|
computed: {
|
SERIALNO() {
|
return this.$route.query.serialno;
|
},
|
PRODUCTID() {
|
return this.$route.query.productid;
|
},
|
OBJECTTYPE() {
|
return this.$route.query.objecttype;
|
},
|
OPRETYPE() {
|
return this.$route.query.type;
|
}
|
},
|
mounted() {
|
window.addEventListener("scroll", this.onScroll);
|
window.addEventListener("resize", this.getScreenWidth);
|
this.$router.afterEach((to, from) => {
|
if (from.name === "dimensionEdit" || from.name === "dimensionAdd") {
|
this.$nextTick(() => {
|
const offsetTop = this.$refs.proMange.children[2].offsetTop;
|
window.scrollTo({
|
top: offsetTop - 50,
|
behavior: "smooth"
|
});
|
});
|
} else {
|
this.$nextTick(() => {
|
window.scrollTo({
|
top: 10,
|
behavior: "smooth"
|
});
|
});
|
}
|
});
|
},
|
async activated() {
|
this.isNew = true;
|
this.dialogBackVisible = false;
|
if (this.OPRETYPE === "edit") {
|
window.scrollTo({
|
top: 0,
|
behavior: "smooth"
|
});
|
this.serialno = this.SERIALNO;
|
this.productid = this.PRODUCTID;
|
this.objecttype = this.OBJECTTYPE;
|
this.typeno = this.PRODUCTID;
|
this.type = this.OPRETYPE;
|
await this.getOptions();
|
this.oldTypeNo !== this.typeno && (await this.getProductDetailInfo());
|
this.oldTypeNo !== this.typeno && (await this.getProductImageInfo());
|
} else {
|
this.getOptions();
|
!this.oldTypeNo && (await this.getInputUserInfo());
|
}
|
this.$refs.dimensionList[0] &&
|
this.$refs.dimensionList[0].getProductDimensionsList();
|
this.domLength =
|
(this.$refs.proMange && this.$refs.proMange.outerHTML.length) || 75000;
|
},
|
destroyed() {
|
window.removeEventListener("scroll", this.onScroll);
|
window.removeEventListener("resize", this.getScreenWidth);
|
},
|
deactivated() {
|
this.oldTypeNo = this.typeno;
|
},
|
methods: {
|
// 返回列表
|
backList(type) {
|
const newDomLength = this.$refs.proMange.outerHTML.length;
|
if (newDomLength < this.domLength && type !== "submit") {
|
this.dialogBackVisible = true;
|
} else {
|
this.handleBackNonclick();
|
}
|
},
|
handleBackNonclick() {
|
this.$nextTick(() => {
|
window.scrollTo({
|
top: 0,
|
behavior: "smooth"
|
});
|
});
|
const baseForm = this.$refs.BASEINFO[0];
|
const amountForm = this.$refs.PROAMOUNTINFO[0];
|
const businessForm = this.$refs.PROBUSINESSINFO[0];
|
const showxinForm = this.$refs.SHOWXING[0];
|
const zhiyongForm = this.$refs.ZHIYONG[0];
|
const shouxingzhiyongForm = this.$refs.SHOWXINGZHIYONG[0];
|
baseForm.$refs["createForm"].resetFields();
|
amountForm.$refs["createForm"].resetFields();
|
businessForm.$refs["createForm"].resetFields();
|
showxinForm && showxinForm.$refs["createForm"].resetFields();
|
zhiyongForm && zhiyongForm.$refs["createForm"].resetFields();
|
shouxingzhiyongForm &&shouxingzhiyongForm.$refs["createForm"].resetFields();
|
/** start返回列表设置为原始默认值 */
|
this.menuItems = [...PRODUCTMANAGEMENUS(true)];
|
this.optionsMap = {};
|
this.serialno = "";
|
this.productid = "";
|
this.type = "";
|
this.objecttype = "";
|
this.detailData = {};
|
this.typeno = "";
|
this.oldTypeNo = "";
|
this.proDocFileInfo = {
|
required: false,
|
description: "产品资料",
|
count: 0,
|
key: "productInfo"
|
};
|
this.otherFileInfo = {
|
required: false,
|
description: "其他资料",
|
count: 0,
|
key: "productOtherInfo"
|
};
|
this.isNew = false;
|
this.isBaseForm = false;
|
this.isAmountForm = false;
|
this.isBusinessForm = false;
|
this.isShowxingForm = false;
|
this.isZhiyongForm = false;
|
this.isShouxingzhiyongForm = false;
|
this.commitDialogVisible = false;
|
this.dialogBackVisible = false;
|
/** end返回列表设置为原始默认值 */
|
this.$refs.customersList[0].restTable();
|
this.$router.push({ name: "productList" });
|
},
|
async handleBackclick() {
|
this.dialogBackVisible = false;
|
await this.handleSave("backList");
|
},
|
// 维度元素change事件
|
handleElmentChange(elments) {
|
this.$refs.dimensionList[0].restTable(elments);
|
this.handleSave();
|
},
|
// 控制支用授信显示
|
clounmIsHide(name,value){
|
if(name === 'mergeCreditLoan' && value == 0){
|
this.menuItems.forEach(item=>{
|
if(item.name == "BASEINFO" && item.children){
|
return item.children.forEach(res=>{
|
if(res.name =='SHOWXINGZHIYONG'){
|
res.isHide = true
|
}
|
if(res.name =='ZHIYONG'){
|
res.isHide = false
|
}
|
if(res.name =='SHOWXING'){
|
res.isHide = false
|
}
|
return res
|
})
|
}
|
return item
|
})
|
}
|
if(name === 'mergeCreditLoan' && value == 1){
|
this.menuItems.forEach(item=>{
|
if(item.name == "BASEINFO" && item.children){
|
return item.children.forEach(res=>{
|
if(res.name =='SHOWXINGZHIYONG'){
|
res.isHide = false
|
}
|
if(res.name =='ZHIYONG'){
|
res.isHide = true
|
}
|
if(res.name =='SHOWXING'){
|
res.isHide = true
|
}
|
return res
|
})
|
}
|
return item
|
})
|
}
|
this.$set(this.menuItems)
|
},
|
handleSelOnChange(name, value) {
|
const baseForm = this.$refs.BASEINFO[0];
|
const amountForm = this.$refs.PROAMOUNTINFO[0];
|
if(name === 'mergeCreditLoan'){
|
this.mergeCreditStatus = value
|
}
|
this.clounmIsHide(name, value)
|
if (name === "suitableflow") {
|
const suitablefObj = this.getOptionItems("suitableflow").find(item => {
|
// 这里的userList就是上面遍历的数据源
|
return item.value === value;
|
});
|
baseForm.formValues.suitableflow = suitablefObj.value;
|
baseForm.formValues.suitableflowname = suitablefObj.label;
|
}
|
if (name === "attribute3") {
|
const newFormItems = [...baseForm.formItems].map(form => {
|
const newForm = { ...form };
|
const checkForms = [
|
"attribute22",
|
"attribute23",
|
"attribute17",
|
"attribute18"
|
];
|
if (
|
checkForms.includes(newForm.name) &&
|
(newForm.name === "attribute22" || newForm.name === "attribute23")
|
) {
|
newForm.show = value === "M";
|
baseForm.formValues.attribute17 = "";
|
baseForm.formValues.attribute18 = "";
|
baseForm.$refs["createForm"].clearValidate([
|
"attribute17",
|
"attribute18"
|
]);
|
} else if (
|
checkForms.includes(newForm.name) &&
|
(newForm.name === "attribute17" || newForm.name === "attribute18")
|
) {
|
newForm.show = value === "D";
|
baseForm.formValues.attribute22 = "";
|
baseForm.formValues.attribute23 = "";
|
baseForm.$refs["createForm"].clearValidate([
|
"attribute22",
|
"attribute23"
|
]);
|
}
|
return newForm;
|
});
|
this.handleShowContrl(
|
"BASEINFO",
|
"BASEINFO",
|
"formItems",
|
newFormItems
|
);
|
return;
|
}
|
if (name === "attribute12") {
|
const newFormItems = [...amountForm.formItems].map(form => {
|
const newForm = { ...form };
|
if (newForm.name === "attribute15") {
|
amountForm.$refs["createForm"].clearValidate([
|
"attribute15",
|
"attribute13"
|
]);
|
amountForm.formValues.attribute15 = "";
|
newForm.show = value === "1";
|
}
|
return newForm;
|
});
|
this.handleShowContrl(
|
"BASEINFO",
|
"PROAMOUNTINFO",
|
"formItems",
|
newFormItems
|
);
|
}
|
if (name === "attribute24") {
|
const probusinessForm = this.$refs.PROBUSINESSINFO[0];
|
const newFormItems = [...probusinessForm.formItems].map(form => {
|
const newForm = { ...form };
|
if (newForm.name === "defaultdueday") {
|
probusinessForm.$refs["createForm"].clearValidate([
|
"defaultdueday"
|
]);
|
probusinessForm.formValues.defaultdueday = "";
|
newForm.show = value == "3";
|
}
|
return newForm;
|
});
|
this.handleShowContrl(
|
"BASEINFO",
|
"PROBUSINESSINFO",
|
"formItems",
|
newFormItems
|
);
|
}
|
},
|
// 处理联动的显示或隐藏
|
handleShowContrl(parentName, updateName, childName, value) {
|
const updateFormItems = [...this.menuItems].map(menus => {
|
const newMenu = { ...menus };
|
if (newMenu.name === parentName) {
|
const newChildren = [...newMenu.children].map(childs => {
|
const newChilds = { ...childs };
|
if (newChilds.name === updateName) {
|
newChilds[childName] = value;
|
}
|
return newChilds;
|
});
|
newMenu.children = newChildren;
|
}
|
return newMenu;
|
});
|
this.$set(this, "menuItems", updateFormItems);
|
},
|
// 获取子元素
|
getChildItem(name, childName, itemName) {
|
const { menuItems } = this;
|
const parents = menuItems.filter(parent => parent.name === name)[0];
|
const children = parents.children.filter(
|
child => child.name === childName
|
)[0];
|
return children[itemName];
|
},
|
// 查询产品详情信息
|
async getProductDetailInfo() {
|
const params = {
|
serialno: this.serialno,
|
showoldvalue: false
|
};
|
const loading = this.$loading({
|
lock: true,
|
text: "加载中",
|
background: "hsla(0,0%,100%,.9)"
|
});
|
const detailsRes = await qryProductDetailInfo(params);
|
if (!detailsRes || detailsRes.code !== "00") {
|
return false;
|
}
|
setTimeout(() => {
|
loading.close();
|
}, 1500);
|
let detailData = {};
|
Object.getOwnPropertyNames(detailsRes.result).forEach(key => {
|
detailData[key] = detailsRes.result[key].value;
|
if (key === "attribute13") {
|
detailData[key] =
|
detailsRes.result[key].value &&
|
detailsRes.result[key].value.split(",");
|
}
|
if(key === 'mergeCreditLoan'){
|
this.mergeCreditStatus = detailsRes.result[key].value
|
this.clounmIsHide('mergeCreditLoan',detailsRes.result[key].value)
|
}
|
});
|
const baseFormItems = this.getChildItem(
|
"BASEINFO",
|
"BASEINFO",
|
"formItems"
|
);
|
const amountFormItems = this.getChildItem(
|
"BASEINFO",
|
"PROAMOUNTINFO",
|
"formItems"
|
);
|
const proFormItems = this.getChildItem(
|
"BASEINFO",
|
"PROBUSINESSINFO",
|
"formItems"
|
);
|
const baseDefValues = this.getChildItem(
|
"BASEINFO",
|
"BASEINFO",
|
"defValues"
|
);
|
const amountValues = this.getChildItem(
|
"BASEINFO",
|
"PROAMOUNTINFO",
|
"defValues"
|
);
|
const businessValues = this.getChildItem(
|
"BASEINFO",
|
"PROBUSINESSINFO",
|
"defValues"
|
);
|
|
const showxingValues = this.getChildItem(
|
"BASEINFO",
|
"SHOWXING",
|
"defValues"
|
);
|
const zhiyongValues = this.getChildItem(
|
"BASEINFO",
|
"ZHIYONG",
|
"defValues"
|
);
|
const shouxingzhiyongValues = this.getChildItem(
|
"BASEINFO",
|
"SHOWXINGZHIYONG",
|
"defValues"
|
);
|
const newFormsItems = [...baseFormItems].map(form => {
|
const newForm = { ...form };
|
if (newForm.name === "attribute22" || newForm.name === "attribute23") {
|
newForm.show = detailData.attribute3 === "M";
|
} else if (
|
newForm.name === "attribute17" ||
|
newForm.name === "attribute18"
|
) {
|
newForm.show = detailData.attribute3 === "D";
|
}
|
if (newForm.name === "attribute15") {
|
newForm.show = detailData.attribute12 === "1";
|
}
|
return newForm;
|
});
|
|
const newProFormsItems = [...proFormItems].map(form => {
|
const newForm = { ...form };
|
if (newForm.name === "defaultdueday") {
|
newForm.show = detailData.attribute24 === "3";
|
}
|
return newForm;
|
});
|
|
const newAmountFormItems = [...amountFormItems].map(form => {
|
const newForm = { ...form };
|
if (newForm.name === "attribute15") {
|
newForm.show = detailData.attribute12 === "1";
|
}
|
return newForm;
|
});
|
const checkeds = detailData.elementname
|
? detailData.elementname.split(";").filter(Boolean)
|
: "";
|
const transferVal = checkeds
|
? checkeds.map(sel => {
|
const selObj = this.getOptionItems("elementname").filter(el =>
|
el.label.includes(sel.trim())
|
);
|
return selObj[0] && selObj[0].value;
|
})
|
: [];
|
this.$refs.dimensionList[0].restTable(transferVal);
|
const baseForm = this.$refs.BASEINFO[0];
|
baseForm.transferVal = transferVal;
|
this.handleShowContrl("BASEINFO", "BASEINFO", "formItems", newFormsItems);
|
this.handleShowContrl(
|
"BASEINFO",
|
"PROAMOUNTINFO",
|
"formItems",
|
newAmountFormItems
|
);
|
this.handleShowContrl("BASEINFO", "BASEINFO", "defValues", {
|
...baseDefValues,
|
...detailData,
|
attribute16: parseInt(detailData.attribute16)
|
});
|
this.handleShowContrl("BASEINFO", "PROAMOUNTINFO", "defValues", {
|
...amountValues,
|
...detailData
|
});
|
this.handleShowContrl(
|
"BASEINFO",
|
"PROBUSINESSINFO",
|
"formItems",
|
newProFormsItems
|
);
|
this.handleShowContrl("BASEINFO", "PROBUSINESSINFO", "defValues", {
|
...businessValues,
|
...detailData
|
});
|
this.handleShowContrl("BASEINFO", "SHOWXING", "defValues", {
|
...showxingValues,
|
...detailData
|
});
|
this.handleShowContrl("BASEINFO", "ZHIYONG", "defValues", {
|
...zhiyongValues,
|
...detailData
|
});
|
this.handleShowContrl("BASEINFO", "SHOWXINGZHIYONG", "defValues", {
|
...shouxingzhiyongValues,
|
...detailData
|
});
|
},
|
getScreenWidth() {
|
this.$set(this, "screenWidth", document.body.offsetWidth);
|
},
|
// 获取用户基本信息
|
async getInputUserInfo() {
|
const userInfoRes = await qryInputUserInfo();
|
if (userInfoRes && userInfoRes.code === "00") {
|
const newDefValues = {
|
...this.getChildItem("BASEINFO", "BASEINFO", "defValues"),
|
...userInfoRes.result
|
};
|
this.handleShowContrl(
|
"BASEINFO",
|
"BASEINFO",
|
"defValues",
|
newDefValues
|
);
|
}
|
},
|
async getOptions() {
|
const params = [...PRODUCTOPTIONS];
|
const res = await qryDropDownOptionBatch(params);
|
if (res.code !== "00") {
|
return false;
|
}
|
this.optionsMap = res.result;
|
const itemMenus = [...this.menuItems].map(item => {
|
const newItem = { ...item };
|
if (newItem.name === "BASEINFO") {
|
const newChildren = newItem.children.map(child => {
|
const newChild = { ...child };
|
const newFormItems = newChild.formItems.map(forms => {
|
const newForms = { ...forms };
|
const readonlyFields = [
|
"inputuser",
|
"inputtime",
|
"updateuser",
|
"updatetime"
|
];
|
if (!readonlyFields.includes(newForms.name)) {
|
newForms.readonly = false;
|
if (newForms.name === "typeno" && this.type === "edit") {
|
newForms.readonly = true;
|
}
|
}
|
if (newForms.options) {
|
newForms.options = [...this.getOptionItems(forms.name)];
|
}
|
return newForms;
|
});
|
newChild.formItems = newFormItems;
|
return newChild;
|
});
|
newItem.children = newChildren;
|
}
|
return newItem;
|
});
|
this.$set(this, "menuItems", itemMenus);
|
},
|
// 初始化产品信息
|
async initProduct(params, from, filedata, key) {
|
const proRes = await initProductInfo(params);
|
if (!proRes || proRes.code !== "00") {
|
return false;
|
}
|
const itemMenus = [...this.menuItems].map(item => {
|
const newItem = { ...item };
|
if (newItem.name === "BASEINFO") {
|
const newChildren = newItem.children.map(child => {
|
const newChild = { ...child };
|
const newFormItems = newChild.formItems.map(forms => {
|
const newForms = { ...forms };
|
if (newForms.name === "typeno") {
|
newForms.readonly = true;
|
}
|
return newForms;
|
});
|
newChild.formItems = newFormItems;
|
return newChild;
|
});
|
newItem.children = newChildren;
|
}
|
return newItem;
|
});
|
this.$set(this, "menuItems", itemMenus);
|
this.serialno = proRes.result.serialno;
|
this.objecttype = proRes.result.objecttype;
|
if (from === "dimension") {
|
this.$router.push({
|
name: "dimensionAdd",
|
query: {
|
typeno: params.typeno,
|
objectno: proRes.result.serialno
|
}
|
});
|
}
|
if (from === "customer") {
|
this.$refs.customersList[0].handleAddCus();
|
}
|
this.getProductImageInfo("init", filedata, key);
|
return proRes.result;
|
},
|
// 获取产品影像信息
|
async getProductImageInfo(isInit, filedata, key) {
|
const proImageRes = await qryProductImageInfo({
|
objectno: this.typeno
|
});
|
if (proImageRes.code !== "00") {
|
return "";
|
}
|
this.$set(
|
this,
|
"proDocFileInfo",
|
proImageRes.result.filter(item => item.key === "productInfo")[0]
|
);
|
this.$set(
|
this,
|
"otherFileInfo",
|
proImageRes.result.filter(item => item.key === "productOtherInfo")[0]
|
);
|
if (isInit === "init") {
|
this.handleUpload(filedata, key);
|
}
|
},
|
getOptionItems(name) {
|
const { optionsMap } = this;
|
return optionsMap[PRODUCTOPTIONSENUM[name]];
|
},
|
// 保存草稿
|
async handleSave(type, from, filedata, key) {
|
await this.validateBase();
|
const { isBaseForm } = this;
|
if (!isBaseForm) {
|
return false;
|
}
|
const _this = this.$refs.BASEINFO[0];
|
const { typeno } = _this.formValues;
|
this.typeno = this.productid = typeno;
|
_this.$refs["createForm"].validateField("typeno", async errorMessage => {
|
if (errorMessage) {
|
this.$message.error(errorMessage);
|
return false;
|
}
|
const { serialno } = this;
|
!serialno &&
|
(await this.initProduct(
|
{
|
typeno
|
},
|
from,
|
filedata,
|
key
|
));
|
this.serialno && (await this.saveProduct(false, type));
|
});
|
},
|
// 保存产品信息
|
async saveProduct(checkflag, type) {
|
const {
|
inputuser,
|
inputtime,
|
updateuser,
|
updatetime,
|
...params
|
} = this.getProParams(checkflag);
|
const res = await saveProductInfo(params);
|
if (res.code !== "00") {
|
return false;
|
}
|
this.isProSave = true;
|
if (type === "backList") {
|
this.dialogBackVisible = false;
|
this.handleBackNonclick();
|
}
|
if (!checkflag && type !== "init") {
|
this.$message({
|
message: "草稿已保存",
|
type: "success"
|
});
|
}
|
},
|
// 获取显示表单对应的value值
|
getFormItemsValue(forms, values) {
|
const showForms = forms.filter(form => form.show !== false);
|
let formsValue = {};
|
showForms.forEach(form => {
|
formsValue[form.name] = values[form.name];
|
});
|
return formsValue;
|
},
|
// 获取保存产品信息params
|
getProParams(checkflag) {
|
const { serialno } = this;
|
// 获取基本信息表单
|
const baseForm = this.$refs.BASEINFO[0];
|
// 获取额度信息表单
|
const amountForm = this.$refs.PROAMOUNTINFO[0];
|
// 获取业务信息表单
|
const businessForm = this.$refs.PROBUSINESSINFO[0];
|
// 获取授信信息表单
|
const showxinForm = this.$refs.SHOWXING[0];
|
// 获取支用信息表单
|
const zhiyongForm = this.$refs.ZHIYONG[0];
|
// 获取授信支用信息表单
|
const shouxingzhiyongForm = this.$refs.SHOWXINGZHIYONG[0];
|
const {
|
typeno,
|
typename,
|
attribute2,
|
attribute3,
|
attribute22,
|
attribute23,
|
attribute17,
|
attribute18,
|
elementname,
|
attribute16,
|
suitableflow,
|
suitableflowname,
|
attribute5,
|
attribute6,
|
attribute19
|
} = baseForm.formValues;
|
const {
|
attribute7,
|
attribute11,
|
attribute8,
|
attribute10,
|
attribute12,
|
attribute15,
|
attribute13,
|
minsingleloansum,
|
maxsingleloansum,
|
mincreditsum,
|
maxcreditsum
|
} = amountForm.formValues;
|
const {
|
customerBaseConfirmWay,
|
attribute21,
|
attribute14,
|
attribute4,
|
attribute24,
|
mergeCreditLoan,
|
defaultdueday
|
} = businessForm.formValues;
|
const {
|
creditthereview,
|
creditthefinal,
|
creditpreapproved
|
} = this.mergeCreditStatus == 0 ? showxinForm.formValues : {};
|
const {
|
disbursethereviewsum,
|
disbursethefinalsum,
|
disbursepreapproved,
|
disburseautopay
|
} = this.mergeCreditStatus == 0 ?zhiyongForm.formValues : {};
|
const {
|
thereviewsum,
|
thefinalsum,
|
preapproved,
|
autopay
|
} = this.mergeCreditStatus == 1 ? shouxingzhiyongForm.formValues : {};
|
const otherParams = {
|
typeno,
|
typename,
|
attribute2,
|
attribute3,
|
attribute22,
|
attribute23,
|
attribute17,
|
attribute18,
|
elementname,
|
attribute16,
|
suitableflow,
|
suitableflowname,
|
attribute5,
|
attribute6,
|
attribute19,
|
attribute7,
|
attribute11,
|
attribute8,
|
attribute10,
|
attribute12,
|
attribute15,
|
minsingleloansum: rmoney(minsingleloansum),
|
maxsingleloansum: rmoney(maxsingleloansum),
|
mincreditsum: rmoney(mincreditsum),
|
maxcreditsum: rmoney(maxcreditsum),
|
attribute13: attribute13.toString(),
|
customerBaseConfirmWay,
|
attribute21,
|
attribute14,
|
attribute4,
|
attribute24,
|
mergeCreditLoan,
|
thereviewsum,
|
thefinalsum,
|
preapproved,
|
serialno,
|
checkflag,
|
disbursethereviewsum,
|
disbursethefinalsum,
|
disbursepreapproved,
|
disburseautopay,
|
autopay,
|
creditthereview,
|
creditthefinal,
|
creditpreapproved,
|
defaultdueday
|
};
|
return otherParams;
|
},
|
async submitForm() {
|
await this.validateBase();
|
await this.validateAmount();
|
await this.validateBusiness();
|
if(this.mergeCreditStatus == 0){
|
await this.validateShowxing();
|
await this.validateZhiyong();
|
this.isShouxingzhiyongForm = true
|
}else{
|
await this.validateShowxingzhiyong();
|
this.isShowxingForm = true
|
this.isZhiyongForm = true
|
}
|
|
const {
|
isBaseForm,
|
isAmountForm,
|
isBusinessForm,
|
isShowxingForm,
|
isZhiyongForm,
|
isShouxingzhiyongForm
|
} = this;
|
if (
|
!isBaseForm ||
|
!isAmountForm ||
|
!isBusinessForm ||
|
!isShowxingForm ||
|
!isZhiyongForm ||
|
!isShouxingzhiyongForm
|
) {
|
return false;
|
}
|
const { serialno } = this;
|
serialno && (await this.handleSubmitproductFlow());
|
},
|
// 产品流程提交
|
async handleSubmitproductFlow() {
|
this.subLoading = true;
|
const { serialno, objecttype } = this;
|
const params = {
|
objectNo: serialno,
|
objectType: objecttype
|
};
|
await this.saveProduct(true);
|
const subRes = await productFlowSubmit(params);
|
this.subLoading = false;
|
if (!subRes || subRes.code !== "00") {
|
return false;
|
}
|
this.commitDialogVisible = true;
|
},
|
enterMessages() {
|
this.commitDialogVisible = false;
|
this.backList("submit");
|
},
|
handleClose() {
|
this.enterMessages();
|
},
|
// 校验基本信息
|
validateBase() {
|
const baseForm = this.$refs.BASEINFO[0];
|
baseForm.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
this.isBaseForm = true;
|
} else {
|
this.isBaseForm = false;
|
this.$message.error("请完基本信息必填项！");
|
return false;
|
}
|
});
|
},
|
// 校验额度信息
|
validateAmount() {
|
// 获取额度信息表单
|
const amountForm = this.$refs.PROAMOUNTINFO[0];
|
amountForm.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
this.isAmountForm = true;
|
} else {
|
this.isAmountForm = false;
|
this.$message.error("请完善额度信息必填项！");
|
return false;
|
}
|
});
|
},
|
// 校验业务信息
|
validateBusiness() {
|
// 获取业务信息表单
|
const businessForm = this.$refs.PROBUSINESSINFO[0];
|
businessForm.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
this.isBusinessForm = true;
|
} else {
|
this.isBusinessForm = false;
|
this.$message.error("请完善业务信息必填项！");
|
return false;
|
}
|
});
|
},
|
// 校验授信信息
|
validateShowxing() {
|
// 获取业务信息表单
|
const shouxingForm = this.$refs.SHOWXING[0];
|
shouxingForm.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
this.isShowxingForm = true;
|
} else {
|
this.isShowxingForm = false;
|
this.$message.error("请完善授信信息必填项！");
|
return false;
|
}
|
});
|
},
|
// 校验授信信息
|
validateZhiyong() {
|
// 获取业务信息表单
|
const zhiyongForm = this.$refs.ZHIYONG[0];
|
zhiyongForm.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
this.isZhiyongForm = true;
|
} else {
|
this.isZhiyongForm = false;
|
this.$message.error("请完善支用信息必填项！");
|
return false;
|
}
|
});
|
},
|
// 校验授信信息
|
validateShowxingzhiyong() {
|
// 获取业务信息表单
|
const shouxingzhiyongForm = this.$refs.SHOWXINGZHIYONG[0];
|
shouxingzhiyongForm.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
this.isShouxingzhiyongForm = true;
|
} else {
|
this.isShouxingzhiyongForm = false;
|
this.$message.error("请完善授信&支用信息必填项！");
|
return false;
|
}
|
});
|
},
|
// 上传前事件
|
async beforeAvatarUpload(file, key) {
|
// const fileType = file.name.substring(file.name.lastIndexOf('.') + 1)
|
const { typeno } = this;
|
if (!typeno) {
|
await this.handleSave("init", "upload", file, key);
|
return false;
|
}
|
return !!typeno;
|
},
|
// 上传文件
|
handleUpload(fileData, key) {
|
if (!fileData || !this.typeno) {
|
return false;
|
}
|
const { proDocFileInfo, otherFileInfo } = this;
|
const { docNo = "", docType = "" } =
|
key === "productInfo" ? proDocFileInfo : otherFileInfo;
|
const { objecttype } = this;
|
const formData = new FormData();
|
formData.append("file", fileData);
|
formData.append("docNo", docNo);
|
formData.append("docType", docType);
|
formData.append("objectNo", this.typeno);
|
formData.append("objectType", objecttype);
|
addFileForProductInfo(formData).then(res => {
|
if (res.code === "00") {
|
this.$message.success("上传成功！");
|
this.getProductImageInfo();
|
}
|
});
|
},
|
// 删除文件
|
handleDelete(attachmentno) {
|
this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
let params = {
|
attachmentno
|
};
|
delFileForProductInfo(params).then(res => {
|
if (res.code === "00") {
|
this.$message.success("删除成功！");
|
this.getProductImageInfo();
|
}
|
});
|
})
|
.catch(() => {});
|
},
|
// 点击图片预览
|
async handleImageClick(file, fileInfo, objectno, typeno) {
|
const { attachmentno, docno } = file;
|
const { objectNo, docType } = fileInfo;
|
const objecttype = "jbo.app.BUSINESS_TYPE";
|
const routeStr = location.href.includes("#") ? "#/" : "";
|
const query = `attachmentno=${attachmentno}&serialno=${docno}&objectno=${objectNo}&objecttype=${objecttype}&typeno=${docType}&from=PRO`;
|
let baseUrl = process.env.VUE_APP_HOST_PATH;
|
if (location.hostname === "fin.pengyouph.com") {
|
baseUrl = process.env.VUE_APP_XXXFINTECH_API_HOST;
|
}
|
this.newWindow = window.open(
|
`${location.origin}${baseUrl}${routeStr}file-view?${query}`,
|
"newwindow",
|
"height=700px, width=800px, top=100px,left=400px, toolbar=no, menubar=no, scrollbars=yes, resizable=no,location=no, status=no"
|
);
|
},
|
jump(index) {
|
const { menuItems } = this;
|
const items = document.querySelectorAll(".scroll_pro_item");
|
items.forEach((item, i) => {
|
this.$set(this.menuItems, i, {
|
...menuItems[i],
|
isActive: index === i
|
});
|
if (i === index) {
|
items[index].scrollIntoView({
|
block: "start", // 默认跳转到顶部
|
behavior: "smooth" // 滚动的速度
|
});
|
}
|
});
|
},
|
onScroll(e) {
|
const scrollItems = document.querySelectorAll(".scroll_pro_item");
|
const { menuItems } = this;
|
for (let i = scrollItems.length - 1; i >= 0; i--) {
|
// 判断滚动条滚动距离是否大于当前滚动项可滚动距离
|
const judge =
|
e.target.scrollingElement.scrollTop + 50 >=
|
scrollItems[i].offsetTop - scrollItems[0].offsetTop;
|
if (judge) {
|
scrollItems.forEach((item, index) => {
|
this.$set(this.menuItems, index, {
|
...menuItems[index],
|
isActive: index === i
|
});
|
});
|
break;
|
}
|
}
|
const scrollTop =
|
document.documentElement.scrollTop || document.body.scrollTop;
|
// 变量windowHeight是可视区的高度
|
const windowHeight =
|
document.documentElement.clientHeight || document.body.clientHeight;
|
// 变量scrollHeight是滚动条的总高度
|
const scrollHeight =
|
document.documentElement.scrollHeight || document.body.scrollHeight;
|
// 滚动条到底部的条件
|
if (scrollTop + windowHeight === scrollHeight) {
|
const newMenuItems = [...this.menuItems].map((item, i) => {
|
const newItem = { ...item };
|
newItem.isActive = i === 3;
|
return newItem;
|
});
|
this.menuItems = newMenuItems;
|
}
|
}
|
}
|
};
|
</script>
|
<style lang="stylus" scoped>
|
.left {
|
width: 160px;
|
height: 100%;
|
position: fixed;
|
outline: 1px solid #eee;
|
border-right: 1px solid #eee;
|
background: #fff;
|
z-index: 999;
|
top: 0;
|
left: 0;
|
min-width: 160px;
|
}
|
.right {
|
position: absolute;
|
width: calc(100% - 220px);
|
padding: 20px 20px;
|
background: #f9f9f9;
|
left: 160px;
|
right: 10px;
|
min-width: 1060px;
|
top: 0;
|
& >>> .el-dialog__wrapper {
|
z-index: 2006;
|
& .product_submit_dialog {
|
& .el-dialog__footer {
|
& .dialog-footer {
|
& .el-button--default {
|
width: 120px;
|
height: 30px;
|
border-radius: 4px;
|
line-height: 2px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
}
|
}
|
}
|
}
|
}
|
& >>> .pricing_dialog {
|
width: 1000px;
|
& .el-dialog__footer {
|
& .dialog-footer {
|
& .el-button--default {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
border-radius: 4px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
& span {
|
margin-left: -9px;
|
}
|
}
|
& .el-button--primary {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
background: #0081f0;
|
border-color: #0081f0;
|
border-radius: 4px;
|
margin-left: 40px;
|
}
|
}
|
}
|
}
|
& >>> .back_dialog {
|
width: 450px;
|
& .el-dialog__body {
|
text-align: center;
|
}
|
}
|
}
|
.scroll_pro_item {
|
min-height: 200px;
|
background: rgba(249, 249, 249, 1);
|
padding-bottom: 10px;
|
}
|
.item_set_class {
|
padding-left: 14px;
|
}
|
.right_opreat {
|
position: fixed;
|
width: calc(100% - 220px);
|
text-align: center;
|
line-height: 80px;
|
background: #fff;
|
z-index: 6;
|
bottom: 0;
|
& .el-button--default {
|
width: 120px;
|
height: 30px;
|
margin-left: -80px;
|
line-height: 7px;
|
border-radius: 4px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
}
|
& .el-button--primary {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
background: #0081f0;
|
border-color: #0081f0;
|
border-radius: 4px;
|
margin-left: 40px;
|
}
|
}
|
.messageCheck {
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
}
|
.checkSuccess {
|
font-size: 80px;
|
color: rgb(82, 196, 26);
|
}
|
.tip {
|
margin-top: 10px;
|
font-size: 20px;
|
}
|
</style>
|
