<template>
|
<el-dialog
|
v-if="dialogVisible"
|
v-dialogDrag
|
:title="title"
|
:visible.sync="dialogVisible"
|
:width="width"
|
append-to-body
|
class="avue-dialog avue-dialog--top"
|
top="-5vh"
|
@opened="openDialog"
|
>
|
<FormTemplate
|
v-if="dialogVisible" key="masterForm"
|
ref="FormTemplate"
|
v-bind="$attrs"
|
:TreeValue="TreeValue"
|
:eventList="eventList"
|
:rowOid="rowOid"
|
:status="status"
|
:templateOid="templateOid"
|
:type="type"
|
data-key="masterForm"
|
@dataYearCode="dataYearHandler"
|
@getFormData="getFormData"
|
@isShow="isShowHandler"
|
></FormTemplate>
|
<div
|
v-if="
|
type !== 'detail' &&
|
dialogVisible &&
|
(showCodeApply || showResembleQuery) &&
|
type !== 'preview'
|
"
|
class="tab_box"
|
>
|
<el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
|
<el-tab-pane v-if="showCodeApply" label="码值申请" name="codeApply">
|
<FormTemplate
|
key="codeApplyForm" ref="CodeApply"
|
:selfColumnConfig="selfColumnConfig"
|
:selfColumnType="selfColumnType"
|
:type="type"
|
data-key="codeApplyForm"
|
secDTOListv-bind="$attrs"
|
@attrList="attrListForm"
|
@getFormData="getCodeApplyFormData"
|
@referConfigDataUpdate="referConfigDataUpdate"
|
></FormTemplate>
|
</el-tab-pane>
|
<el-tab-pane
|
v-if="showResembleQuery"
|
label="相似项查询"
|
name="resembleQuery"
|
>
|
<ResembleQuery
|
ref="resembleQueryRef"
|
v-bind="$attrs"
|
:codeClassifyOid="codeClassifyOid"
|
:column="this.resembleTableColumn"
|
:form="this.form"
|
:hasResemble="this.hasResemble"
|
:templateOid="templateOid"
|
></ResembleQuery>
|
</el-tab-pane>
|
</el-tabs>
|
</div>
|
<template #footer>
|
<div v-if="type !== 'detail'" class="">
|
<el-button size="small" @click="close()">取 消</el-button>
|
<el-button
|
:loading="submitBtnLoading"
|
size="small"
|
type="primary"
|
@click="submit()"
|
>{{ submitText }}
|
</el-button
|
>
|
<el-button
|
v-if="showResembleQuery"
|
size="small"
|
type="primary"
|
@click="resembleQuerySubmit"
|
>相似像查询
|
</el-button
|
>
|
</div>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script>
|
import {getCodeRule, getFormTemplate} from "@/api/formTemplate.js";
|
import FormTemplate from "./FormTemplate";
|
import ResembleQuery from "./ResembleQuery";
|
|
export default {
|
name: "FormTemplateDialog",
|
components: {ResembleQuery, FormTemplate},
|
props: {
|
status: {
|
type: String,
|
default: "",
|
},
|
visible: {
|
type: Boolean,
|
default: false,
|
},
|
TreeValue: {
|
type: String,
|
default: "",
|
},
|
type: {
|
type: String,
|
default: "add",
|
},
|
title: {
|
type: String,
|
default: "编码申请",
|
},
|
width: {
|
type: String,
|
default: "80%",
|
},
|
rowOid: "",
|
codeClassifyOid: {
|
type: String,
|
default: "",
|
},
|
templateOid: {
|
type: String,
|
default: "",
|
},
|
submitText: {
|
type: String,
|
default: "确 定",
|
},
|
setForm: {
|
type: Object,
|
default: () => ({}),
|
},
|
},
|
data() {
|
return {
|
isSeriesType: {},
|
attrList: [],
|
eventList: [],
|
//码值的第二种只读隐藏情况
|
codeValueApplyStatus: '',
|
loading: false,
|
submitBtnLoading: false,
|
hasResemble: false,
|
resembleTableColumn: [],
|
secVOList: [],
|
form: {},
|
codeApplyForm: {},
|
activeName: "codeApply",
|
showCodeApply: false,
|
showResembleQuery: false,
|
selfColumnType: {
|
codefixedsec: "combox",//固定码段
|
codeclassifysec: "refer",//分类码段
|
codevariablesec: "text",//可变码段
|
coderefersec: "refer",//引用码段
|
codeattrsec: "text",
|
codelevelsec: "text",
|
codedatesec: "date"
|
},
|
selfColumnConfig: {
|
function: {
|
required: this.isRequired,
|
dicData: this.getOptionList,
|
type: this.getType,
|
referConfig: this.getReferConfig,
|
readOnly: this.getDisabled,
|
},
|
exchange: {
|
text: "name",
|
field: "oid",
|
prop: "oid",
|
showField: "name",
|
parentClassifySecOid: "parentClassifySecOid",
|
label: "name",
|
maxlength: "codeSecLength",
|
data: "fixedValueVOList",
|
dateFormate: "codeDateFormatStr"
|
},
|
directVoluation: {
|
search: true,
|
props: {
|
label: "id",
|
value: "id",
|
},
|
},
|
},
|
defaultKeys: [
|
"oid",
|
"id",
|
"name",
|
"description",
|
"revisionoid",
|
"nameoid",
|
"btmname",
|
"lastr",
|
"firstr",
|
"lastv",
|
"firstv",
|
"creator",
|
"createtime",
|
"lastModifier",
|
"lastmodifytime",
|
"revisionrule",
|
"revisionseq",
|
"revisionvalue",
|
"versionrule",
|
"versionseq",
|
"versionvalue",
|
"lcstatus",
|
"ts",
|
"owner",
|
"checkinby",
|
"checkintime",
|
"checkoutby",
|
"checkouttime",
|
"copyfromversion",
|
"secretgrade",
|
],
|
codeRuleOid: "",
|
isShowStatus: ""
|
};
|
},
|
created() {
|
},
|
computed: {
|
dialogVisible: {
|
get() {
|
return this.visible;
|
},
|
set(val) {
|
this.$emit("update:visible", val);
|
},
|
},
|
},
|
watch: {
|
codeApplyForm: {
|
handler(newval, oldval) {
|
// console.log('newval',newval)
|
}
|
}
|
},
|
methods: {
|
openDialog() {
|
//新增和修改共同调用
|
this.getFormTemplate();
|
if (this.type === "add" || (this.type !== "add" && this.status === "amend")) {
|
this.getCodeRule();
|
return;
|
}
|
},
|
close() {
|
this.dialogVisible = false;
|
},
|
// 接口获取表单数据
|
getFormTemplate() {
|
//新增和修改共同调用
|
getFormTemplate({
|
templateOid: this.templateOid,
|
codeClassifyOid: this.codeClassifyOid,
|
})
|
.then((res) => {
|
if (res.status === 200) {
|
this.hasResemble =
|
res.data.resembleTableVO &&
|
res.data.resembleTableVO.cols &&
|
res.data.resembleTableVO.cols.length > 0;
|
this.resembleTableColumn = res.data.resembleTableVO.cols || [];
|
if (this.hasResemble) {
|
this.activeName = "resembleQuery";
|
this.showResembleQuery = true;
|
} else {
|
this.showResembleQuery = false;
|
}
|
//传递表单上方区域数据 （新增和修改）
|
this.$nextTick(() => {
|
this.$refs.FormTemplate.templateRender(
|
res.data.formDefineVO.items
|
);
|
this.eventList = res.data.templateVO.attributes
|
// this.$refs.FormTemplate.$emit('eventList', res.data.templateVO.attributes);
|
if (Object.keys(this.setForm).length > 0) {
|
this.$refs.FormTemplate.form = this.setForm;
|
}
|
});
|
}
|
})
|
.catch(() => {
|
this.loading = false;
|
});
|
},
|
// 获取码值申请数据
|
getCodeRule() {
|
let that = this;
|
getCodeRule({codeClassifyOid: that.codeClassifyOid}).then((res) => {
|
if (res.data && res.data.code === 200) {
|
that.codeRuleOid = res.data.data.oid;
|
const typeList = [
|
//属性码段 只读
|
"codeattrsec",
|
//可变码段
|
"codevariablesec",
|
//固定码段
|
"codefixedsec",
|
//分类码段
|
"codeclassifysec",
|
//日期码段 只读
|
"codedatesec",
|
//引用码段
|
"coderefersec",
|
//层级码段 只读
|
"codelevelsec",
|
//流水码段 隐藏
|
];
|
that.secVOList = (res.data.data.secVOList || []).filter((item) =>
|
typeList.includes(item.secType)
|
);
|
if (that.secVOList.length > 0 && that.type === "add" ||(that.type !== "add" && that.status === "amend")) {
|
that.showCodeApply = true;
|
that.activeName = "codeApply";
|
|
this.$nextTick(() => {
|
that.$refs.CodeApply.templateRender(that.secVOList, this.TreeValue);
|
});
|
} else {
|
that.showCodeApply = false;
|
}
|
}
|
});
|
},
|
getFormData(form) {
|
this.form = form;
|
//属性码段赋值
|
if (this.attrList) {
|
this.attrList.forEach(item => {
|
if (this.form.hasOwnProperty(item.referAttributeId)) {
|
this.codeApplyForm[item.oid] = this.form[item.referAttributeId];
|
}
|
})
|
}
|
|
},
|
//系列号规则
|
isShowHandler(val) {
|
this.isShowStatus = val;
|
|
this.secVOList.forEach(item => {
|
if (item.name === "系列号") {
|
this.$set(item, "readOnly", val)
|
}
|
})
|
if (this.$refs.CodeApply) { // 添加一个判断语句，检查对象是否为undefined
|
this.$refs.CodeApply.changeChildItem(this.secVOList, this.TreeValue, this.type);
|
}
|
},
|
//年代号
|
dataYearHandler(val) {
|
const readOnlyValue = val && Object.values(val).every(value => value !== '');
|
|
this.secVOList.forEach(item => {
|
if (item.name === "年代号") {
|
const year = readOnlyValue ? val.value.slice(0, 4) : item.codeDateValue;
|
this.codeApplyForm[item.oid] = year;
|
this.$set(item, "readOnly", readOnlyValue);
|
}
|
});
|
|
if (this.$refs.CodeApply) {
|
this.$refs.CodeApply.changeChildItem(this.secVOList, this.TreeValue, this.type);
|
}
|
},
|
//属性码段赋值
|
attrListForm(attrListForm) {
|
this.attrList = attrListForm;
|
},
|
getCodeApplyFormData(codeApplyForm) {
|
// console.log("codeApplyForm",codeApplyForm)
|
this.codeApplyForm = codeApplyForm;
|
},
|
// 参照组件数据变更
|
referConfigDataUpdate(data) {
|
const {field} = data;
|
let childItems = [];
|
this.secVOList = this.secVOList.map((item) => {
|
if (item.parentClassifySecOid === field) {
|
this.$refs.CodeApply.form[item.oid] = undefined;
|
this.$refs.CodeApply.form[item.name] = undefined;
|
item.readOnly = false;
|
item.referConfig.extraParams.parentClassifyValueOid = data.value;
|
item.referConfig.reloadData = true;
|
childItems.push(item)
|
}
|
return item;
|
});
|
//this.$refs.CodeApply.templateRender(this.secVOList,this.TreeValue);
|
this.$refs.CodeApply.changeChildItem(childItems, this.TreeValue, this.type);
|
},
|
resembleQuerySubmit() {
|
this.activeName = "resembleQuery";
|
this.$refs.resembleQueryRef.resembleQuery(this.form);
|
},
|
handleClick() {
|
if (this.activeName === "resembleQuery") {
|
this.resembleQuerySubmit();
|
}
|
},
|
async submit() {
|
// 进行表单校验
|
const formValidate = await this.$refs.FormTemplate.validate();
|
if (!formValidate) return;
|
let codeValidate = true;
|
// 进行码值申请校验
|
// if (this.showCodeApply) {
|
// codeValidate = await this.$refs.CodeApply.validate();
|
// if (!codeValidate) {
|
// this.activeName = "codeApply";
|
// return false;
|
// }
|
// }
|
let resembleQueryList = [];
|
if (this.showResembleQuery && this.$refs.resembleQueryRef) {
|
// 进行相似项查询
|
resembleQueryList = await this.$refs.resembleQueryRef.resembleQuery(
|
this.form
|
);
|
}
|
if (resembleQueryList.length > 0) {
|
await this.$confirm(
|
`该物料已有${resembleQueryList.length}条相似数据，是否继续保存？`,
|
"需要您确认",
|
{
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
}
|
);
|
}
|
// 排除一些字段
|
const noData = this.status ? [
|
"jiliangdwname",
|
"materialtypeText",
|
"morengongysname",
|
"$caigouwl",
|
"$xiaoshouwl",
|
"$shifoupihaoguanli",
|
"lcstatus_text",
|
"hesuanfenleiname",
|
"$kucunwl",
|
"lastmodifier"
|
] : [
|
"jiliangdwname",
|
"materialtypeText",
|
"morengongysname",
|
"$caigouwl",
|
"$xiaoshouwl",
|
"$shifoupihaoguanli",
|
"lcstatus_text",
|
"hesuanfenleiname",
|
"$kucunwl",
|
"oldcode",
|
"lastmodifier"
|
];
|
|
let resForm = {};
|
const {defaultValue, formValue} = this.getDefaultValueAndFormValues(
|
this.form
|
);
|
noData.forEach((item) => {
|
this.$delete(formValue, item);
|
});
|
const keys = Object.keys(formValue);
|
keys.forEach((item, index) => {
|
keys.forEach((itm, idx) => {
|
if ((item === ('$' + itm)) && idx !== index) {
|
this.$delete(formValue, keys[index]);
|
}
|
})
|
});
|
|
resForm.data = formValue;
|
resForm = Object.assign({}, resForm, defaultValue);
|
resForm.secDTOList = this.secVOList.map((item) => {
|
return {
|
secOid: item.oid,
|
secValue: this.codeApplyForm[item.oid],
|
};
|
});
|
resForm.codeClassifyOid = this.codeClassifyOid;
|
resForm.codeRuleOid = this.codeRuleOid;
|
resForm.templateOid = this.templateOid;
|
this.$emit("submit", resForm);
|
},
|
getDefaultValueAndFormValues(form) {
|
let defaultValue = {};
|
let formValue = {};
|
for (const key in form) {
|
if (Object.hasOwnProperty.call(form, key)) {
|
const element = form[key];
|
if (this.defaultKeys.includes(key)) {
|
defaultValue[key] = element;
|
} else {
|
formValue[key] = element;
|
}
|
}
|
}
|
return {
|
defaultValue,
|
formValue,
|
};
|
},
|
getType(item) {
|
return this.selfColumnType[item.secType];
|
},
|
getReferConfig(item) {
|
let params = {};
|
if (item.secType == "codeclassifysec") {
|
//分类码段
|
params = {
|
isMuti: false,
|
type: "grid",
|
tableConfig: {
|
limit: -1,
|
cols: [
|
{
|
field: "id",
|
title: "英文名称",
|
sort: true,
|
width: 150,
|
},
|
{
|
field: "name",
|
title: "中文名称",
|
sort: true,
|
width: 150,
|
},
|
{
|
field: "description",
|
title: "描述",
|
width: 250,
|
},
|
],
|
queryColumns: [
|
{
|
field: "id",
|
title: "英文名称",
|
},
|
{
|
field: "name",
|
title: "中文名称",
|
},
|
],
|
},
|
url: "api/ubcs-code/ubcs-code/mdmEngineController/listCodeClassifyValueBySecOid",
|
extraParams: {
|
classifySecOid: item.oid,
|
parentClassifyValueOid: item.parentClassifySecOid
|
? this.codeApplyForm[item.parentClassifySecOid]
|
: "",
|
},
|
};
|
} else if (item.secType == "coderefersec") {
|
//引用码段
|
params = JSON.parse(item.referValueInfo);
|
}
|
return params;
|
},
|
getDisabled(item) {
|
if (item.secType === "codeclassifysec") {
|
if (item.parentClassifySecOid) {
|
if (!this.codeApplyForm[item.parentClassifySecOid]) {
|
return true;
|
} else {
|
return item.readOnly || false;
|
}
|
} else {
|
return item.readOnly || false;
|
}
|
} else {
|
return item.readOnly || false;
|
}
|
},
|
isRequired(item) {
|
return item.nullableFlag != "true";
|
},
|
//默认值
|
getOptionList(item) {
|
if (
|
Array.isArray(item.fixedValueVOList) &&
|
item.fixedValueVOList.length > 0
|
) {
|
const configAttr = {
|
key: "id",
|
value: "id",
|
};
|
const optionList = item.fixedValueVOList.map((item) => {
|
for (const key in configAttr) {
|
if (Object.hasOwnProperty.call(configAttr, key)) {
|
const element = configAttr[key];
|
item[key] = item[element];
|
}
|
}
|
return item;
|
});
|
return optionList;
|
} else {
|
return [];
|
}
|
},
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.key_attr_icon {
|
font-size: 24px;
|
position: relative;
|
top: 2px;
|
color: red;
|
}
|
|
// 解决swich组件不垂直居中的问题
|
/deep/ .el-switch {
|
vertical-align: baseline;
|
}
|
</style>
|
