From 06db187ba24525929e39a88e65b72f229405f33e Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期一, 09 十月 2023 15:12:10 +0800
Subject: [PATCH] 标准请码-左侧树渲染-右侧表单渲染
---
Source/UBCS-WEB/src/views/code/codeApply.vue | 310 +++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 308 insertions(+), 2 deletions(-)
diff --git a/Source/UBCS-WEB/src/views/code/codeApply.vue b/Source/UBCS-WEB/src/views/code/codeApply.vue
index a18b614..0475372 100644
--- a/Source/UBCS-WEB/src/views/code/codeApply.vue
+++ b/Source/UBCS-WEB/src/views/code/codeApply.vue
@@ -1,10 +1,316 @@
<template>
- <p>缂栫爜鐢宠</p>
+ <el-row>
+ <el-col :span="4">
+ <basic-container>
+ <avue-tree ref="tree"
+ v-model="form"
+ :data="TreeData"
+ :option="TreeOption"
+ style="height: calc(100vh - 150px)"
+ @node-click="nodeClick">
+ </avue-tree>
+ </basic-container>
+ </el-col>
+ <el-col :span="20">
+ <basic-container>
+ <div style="height: calc(100vh - 150px)">
+ <FormTemplate
+ key="masterForm" data-key="masterForm"
+ v-bind="$attrs"
+ :type="type"
+ :TreeValue="TreeValue"
+ :eventList="eventList"
+ ref="FormTemplate"
+ @getFormData="getFormData"
+ ></FormTemplate>
+ <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
+ <el-tab-pane label="鐮佸�肩敵璇�" name="codeApply" v-if="showCodeApply">
+ <FormTemplate
+ key="codeApplyForm" data-key="codeApplyForm"
+ secDTOListv-bind="$attrs"
+ :type="type"
+ :selfColumnType="selfColumnType"
+ :selfColumnConfig="selfColumnConfig"
+ ref="CodeApply"
+ @getFormData="getCodeApplyFormData"
+ @referConfigDataUpdate="referConfigDataUpdate"
+ ></FormTemplate>
+ </el-tab-pane>
+ </el-tabs>
+ </div>
+ </basic-container>
+ </el-col>
+ </el-row>
</template>
<script>
+import {getAuthTree,getUsedTemplateByClassifyOid,getCodeRule} from '@/api/code/codeApply.js'
+
export default {
-name: "codeApply"
+ name: "codeApply",
+ components: { FormTemplate: () => import('@/components/FormTemplate/FormTemplate') },
+ data() {
+ return {
+ codeClassifyOid:'',
+ type:'add',
+ TreeValue:'',
+ dialogVisible:true,
+ setForm:{},
+ secVOList: [],
+ codeRuleOid: "",
+ activeName: "codeApply",
+ showCodeApply: false,
+ eventList:[],
+ form: {},
+ TreeData:[],
+ TreeOption: {
+ defaultExpandAll: false,
+ addBtn: 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",
+ },
+ },
+ },
+ }
+ },
+ created() {
+ this.getTreeData()
+ },
+ methods:{
+ getFormData(form) {
+ this.form = form;
+ },
+ //瀹氫箟涓�涓慨鏀规暟鎹睘鎬у悕鐨勬柟娉�
+ ModifyProperties(obj, oldName, newName) {
+ for (let key in obj) {
+ if (key === oldName) {
+ obj[newName] = obj[key];
+ delete obj[key];
+ }
+ if (typeof obj[key] === 'object') {
+ this.ModifyProperties(obj[key], oldName, newName);
+ }
+ }
+ },
+ getTreeData(){
+ getAuthTree({
+ 'library': 'XH',
+ 'systemOid': '061261BF-2736-4589-12F7-0DFA79121222',
+ 'systemId': '02'
+ }).then(res => {
+ // console.log(res);
+ this.TreeData=res.data;
+ this.ModifyProperties(this.TreeData, 'name', 'label');
+ // console.log( this.codeClassifyOid)
+
+ });
+ },
+ nodeClick(row){
+ // console.log(row)
+ this.TreeValue=row.text.split(" ")[0].trim();
+ this.codeClassifyOid = row.oid;
+ getUsedTemplateByClassifyOid({ 'codeClassifyOid': this.codeClassifyOid,templateOid:' 97e979919a1f1dca67290e85fee22688' }).then((res) => {
+ console.log('===res',res)
+ if (res.data.code === 200) {
+ this.$nextTick(() => {
+ this.eventList=res.data.data.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;
+ });
+ this.getCodeRule()
+ },
+ 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.showCodeApply = true;
+ that.activeName = "codeApply";
+ this.$nextTick(() => {
+ that.$refs.CodeApply.templateRender(that.secVOList, this.TreeValue);
+ });
+ } else {
+ that.showCodeApply = false;
+ }
+ }
+ });
+ },
+ getType(item) {
+ return this.selfColumnType[item.sectype];
+ },
+ 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 [];
+ }
+ },
+ 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 false;
+ }
+ }
+ }
+ },
+ // 鍙傜収缁勪欢鏁版嵁鍙樻洿
+ 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);
+ },
+ getCodeApplyFormData(codeApplyForm) {
+ this.codeApplyForm = codeApplyForm;
+ },
+ }
}
</script>
--
Gitblit v1.9.3