From f8fe13b6f7d8ad1ae53e7bf6a6cf83f584d52a4d Mon Sep 17 00:00:00 2001
From: fujunling <2984387807@qq.com>
Date: 星期二, 06 六月 2023 17:39:24 +0800
Subject: [PATCH] 动态表单组件重构
---
Source/UBCS-WEB/src/components/Tree/classifyTrees.vue | 859 +++++++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 803 insertions(+), 56 deletions(-)
diff --git a/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue b/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue
index 7bda38b..f3d1fd1 100644
--- a/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue
+++ b/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue
@@ -1,57 +1,378 @@
+<!--suppress ALL -->
<template>
<el-container>
-<!-- 宸︿晶鑿滃崟-->
- <el-aside >
- <basic-container>
- <avue-tree ref="tree" v-model="form" :data="Treedata" :option="Treeoption" @node-click=" nodeClick"
- @del="rowDel" @save="rowSave" @check-change="checkChange" style="height: 754px" >
+ <!-- 宸︿晶鑿滃崟-->
+ <el-aside>
+ <basic-container style="height: 85vh; max-height: 155vh; overflow-y: scroll;">
+ <div>
+ <div style="display: flex;justify-content: space-around">
+ <el-button plain size="small" type="primary" @click="TreeAdd">娣诲姞</el-button>
+ <el-button plain size="small" type="primary" @click="ExportExcel">瀵煎嚭</el-button>
+ <el-button plain size="small" type="primary" @click="ImportExcel">瀵煎叆</el-button>
+ <el-button plain size="small" type="primary" @click="flushed">鍒锋柊</el-button>
+ </div>
+ <div style="display: flex;justify-content: space-around;margin-top: 5px;margin-bottom: 5px">
+ </div>
+ </div>
+ <!-- 鏍戣妭鐐规坊鍔犲璇濇-->
+ <el-dialog :title="this.TreeFlag ? '娣诲姞鍒嗙被' :'娣诲姞涓婚搴�'" :visible.sync="TreeAddFormVisible" append-to-body
+ style="width: 1700px;margin: auto">
+ <el-form :model="TreeAddform">
+ <el-form-item :label="this.TreeFlag ? '鍒嗙被缂栧彿锛�' :'涓婚搴撶紪鍙凤細'" label-width="150px" style="display: inline-block">
+ <el-input v-model="TreeAddform.id" autocomplete="off" style="width: 170px"></el-input>
+ </el-form-item>
+ <el-form-item :label="this.TreeFlag ? '鍒嗙被鍚嶇О锛�' :'涓婚搴撳悕绉帮細'" label-width="100px" style="display: inline-block">
+ <el-input v-model="TreeAddform.name" autocomplete="off" style="width: 170px"></el-input>
+ </el-form-item>
+ <el-form-item label="鎻忚堪锛�" label-width="150px">
+ <el-input v-model="TreeAddform.description" autocomplete="off" style="width: 585px"></el-input>
+ </el-form-item>
+ <el-form-item v-show="this.TreeFlag==false" label="瀛樺偍鐨勪笟鍔$被鍨嬶細" label-width="150px">
+ <el-input v-model="TreeAddform.btmtypename" autocomplete="off" style="width: 585px"></el-input>
+ </el-form-item>
+ <el-form-item label="缂栫爜瑙勫垯锛�" label-width="150px">
+ <el-input v-model="TreeAddform.coderuleoidName" autocomplete="off" style="width: 585px"></el-input>
+ </el-form-item>
+ <el-form-item label="鍏抽敭灞炴�ф煡璇㈣鍒欙細" label-width="150px">
+ <el-input v-model="TreeAddform.codekeyattrrepeatoidName" autocomplete="off"
+ style="width: 585px"></el-input>
+ </el-form-item>
+ <el-form-item label="鐩镐技鏌ヨ瑙勫垯锛�" label-width="150px">
+ <el-input v-model="TreeAddform.codeResembleRuleOidName" autocomplete="off"
+ style="width: 585px"></el-input>
+ </el-form-item>
+ </el-form>
+ <div slot="footer" class="dialog-footer">
+ <el-button @click="TreeAddFormVisible = false">鍙� 娑�</el-button>
+ <el-button type="primary" @click="TreeAddHandler">纭� 瀹�</el-button>
+ </div>
+ </el-dialog>
+ <!-- 淇敼瀵硅瘽妗�-->
+ <el-dialog :visible.sync="TreeEditFormVisible" append-to-body title="淇敼鍒嗙被">
+ <classifyTreeform ref="childForm" :loneTreeNewForm="TreeList" :nodeList="nodeList"></classifyTreeform>
+ </el-dialog>
+ <avue-tree ref="tree" v-model="CloneTreeAvueform" v-loading="loading" :data="CloneTreedata" :defaultExpandAll="false"
+ :option="Treeoption"
+ style="height: 80.5vh;padding-top: 5px;padding-bottom: 30px"
+ @node-click=" nodeClick"
+ @check-change="checkChange"
+ >
</avue-tree>
</basic-container>
</el-aside>
<el-main>
- <basic-container>
-<!-- 鍙充晶琛ㄦ牸-->
+ <basic-container style="height: 85vh; max-height: 155vh; ">
+ <!-- 鍙充晶琛ㄦ牸-->
<avue-tabs :option="tabOption" @change="handleChange"></avue-tabs>
<span v-if="type.prop==='tab1'">
- <avue-crud v-model="crudForm" :data="this.Formlist" :option="this.crudTreeOption" style="height: 700px"></avue-crud>
+ <classifyTreeform ref="childForm" :TreeNewForm="TreeList" :nodeList="nodeList"></classifyTreeform>
</span>
<span v-else-if="type.prop==='tab2'">
-<!-- 濡傛灉鏄〃鏍煎姞琛ㄥ崟灏卞啀娆″紩鍏ヨ繖涓猚lassifyTreeform缁勪欢锛岄噷闈㈡槸琛ㄥ崟鐨勫唴瀹癸紝娌$敤灏卞垹闄ゆ帀銆傛妸涓婇潰tab鏍忎篃鍒犻櫎浜�-->
- <classifyTreeform ref="childForm" :nodeList="nodeList" :TreeNewForm="TreeList"></classifyTreeform>
- <template-pro></template-pro>
+ <basic-container>
+ <avue-crud v-model="crudForm" v-loading="FormLoing" :data="this.Formlist" :option="this.crudTreeOption"
+ @row-save="CrudRowSave"
+ @row-del="CrudRowDel"
+ @row-update="CrudRowUpdata"
+ :before-close="beforeClose"
+ >
+ <template slot="menuLeft">
+ <el-button plain size="small" type="primary" @click="FindFormVisible = true;">鏌ヨ</el-button>
+ <el-button plain size="small" type="primary" @click="TemRefresh">鍒锋柊</el-button>
+ <el-button plain size="small" type="primary" @click="TreeEdit">淇敼</el-button>
+ <el-button plain size="small" type="primary" @click="TreeDel">鍒犻櫎</el-button>
+ <el-button plain size="small" type="primary" @click="Enable">鍚敤</el-button>
+ <el-button plain size="small" type="primary" @click="Deactivate">鍋滅敤</el-button>
+ <el-button plain size="small" type="primary" @click="CloneBtn">浠庡叾瀹冩ā鏉垮厠闅�</el-button>
+ <div style="display: inline-block"> <el-input v-model="FindText" placeholder="璇疯緭鍏ュ叧閿瓧鎸夊洖杞︽煡璇�"
+ size="small"
+ @keyup.enter.native="EnterFind"></el-input></div>
+ <!-- 鏌ヨ瀵硅瘽妗�-->
+ <el-dialog :visible.sync="FindFormVisible" append-to-body title="楂樼骇鏌ヨ">
+ <div>
+ <el-button size="small" type="primary" @click="AdvQueries">鏌ヨ</el-button>
+ <el-button size="small" type="primary">閲嶇疆</el-button>
+ </div>
+ <div style="padding-left: 80px;margin-top: 15px;">
+ <template v-for="(value, key) in FindSelect">
+ <div style="display: flex;justify-content: space-around;width: 85%;margin-bottom: 15px">
+ <el-select v-model="FindSelect[key]" placeholder="璇烽�夋嫨" style="width: 28%"
+ @change="handleSelectChange(key)">
+ <el-option label="妯℃澘缂栧彿" value="0"></el-option>
+ <el-option label="妯℃澘鍚嶇О" value="1"></el-option>
+ <el-option label="妯℃澘鎻忚堪" value="2"></el-option>
+ <el-option label="鐗堟湰鍙�" value="3"></el-option>
+ <el-option label="鐘舵��" value="4"></el-option>
+ </el-select>
+ <el-select v-model="condition[0]" placeholder="璇烽�夋嫨" style="width: 15%">
+ <el-option label="鍖呭惈" value="0"></el-option>
+ <el-option label="绛変簬" value="1"></el-option>
+ </el-select>
+ <el-input v-model="QueryArray[key]" style="width: 49%"></el-input>
+ <span> <i class="el-icon-delete" style="font-size: 22px;margin-top:8px;margin-left: 10px"/></span>
+ </div>
+ </template>
+ </div>
+ </el-dialog>
+ <!-- 妯℃澘鍏嬮殕 -->
+ <el-dialog :visible.sync="CloneVisible" append-to-body title="鍏嬮殕妯℃澘">
+ <el-container>
+ <el-aside width="300px">
+ <div style="margin-bottom: 5px"><el-tag>涓婚搴撳垎绫�</el-tag></div>
+ <!-- 鍏嬮殕妯℃澘鐨勬爲 娌跨敤棣栭〉鏍戠殑loading鍜宱ption锛屼絾鏄痙ata鍜寁-model缁戝畾鐨勬暟鎹垱寤轰竴涓柊鐨勫彉閲忥紝鍙﹀鐐瑰嚮鏂规硶涔熸槸閲嶆柊鑾峰彇鏉ユ搷浣滃厠闅嗘ā鏉跨殑鏁版嵁-->
+ <avue-tree ref="tree" v-model="TreeAvueform" v-loading="loading" :data="Treedata"
+ :defaultExpandAll="false"
+ :option="Treeoption"
+ style="height: 50.5vh;margin-right: 10px"
+ @node-click="ClonenodeClick"
+ >
+ </avue-tree>
+ </el-aside>
+ <el-container>
+ <el-main>
+ <div style="padding-left: 10px;height: 50.5vh">
+ <div style="margin: 8px 0;display: flex">
+ <el-select v-model="Clonevalue" size="small" style="width: 130px;">
+ <el-option
+ v-for="item in this.CloneSelectOptions"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ <el-input v-model="CloneFind" size="small" style="width: 40%;margin-left: 15px" placeholder="杈撳叆鍊煎悗鎸夊洖杞﹁繘琛屾ā绯婃煡璇�"></el-input>
+ <el-button size="small" type="primary" plain style="margin-left: 10px" @click="CloneEnterFind" @keyup.enter.native="CloneEnterFind">鏌ヨ</el-button>
+ </div>
+ <avue-crud v-model="ClonecrudForm" v-loading="FormLoing" :data="this.CloneFormlist"
+ :option="this.ClonecrudTreeOption"
+ @selection-change="selectionChange"
+ ></avue-crud>
+ </div>
+ </el-main>
+ </el-container>
+ </el-container >
+ <div style="display: flex; justify-content: flex-end; align-items: center;margin-top: 10px" >
+ <el-button size="small " type="primary" @click="Clonehandler">纭畾</el-button>
+ <el-button size="small" @click="CloneVisible=false" >鍙栨秷</el-button>
+ </div>
+ <el-dialog
+ width="30%"
+ title="鍏嬮殕妯℃澘"
+ :visible.sync="CloneinnerVisible"
+ append-to-body>
+ <div>
+ <avue-form :option="CloneOption" @submit="Clonesubmit" v-model="CloneModel"></avue-form>
+ </div>
+ </el-dialog>
+ </el-dialog>
+ </template>
+ </avue-crud>
+
+ </basic-container>
+ <templatePro :ProData="this.ProData"></templatePro>
</span>
</basic-container>
</el-main>
</el-container>
</template>
-
<script>
//杩欓噷澹版槑涓�浜涜彍鍗曠粍浠剁敤娉曪細棣栧厛甯冨眬鍒嗕负宸︿晶鑿滃崟鍙充晶琛ㄦ牸锛屽彲鑳戒細鏈夊彸渚ab鏍忓姞琛ㄥ崟鐨勬儏鍐点�傛墍浠ュ彟澶栧紩鍏ヤ簡涓�涓彸渚ц〃鍗曠殑缁勪欢"classifyTreeform"銆�
//棣栧厛鐖剁粍浠惰皟鐢ㄥ瓙缁勪欢鑿滃崟锛岄�氳繃provide浼犻�掑弬鏁般�傛湁Treeoption宸︿晶鏍戞柊澧炶〃鍗曢」 Treedata宸︿晶鏍戣妭鐐归厤缃」 crudTreeOption鍙充晶琛ㄦ牸閰嶇疆椤� crudTreeData鍙充晶琛ㄦ牸鏄剧ず鍐呭
//鍏朵腑琛ㄦ牸鐨勯厤缃」鐩存帴鐖朵紶瀛愪紶閫掕繃鏉ュ氨琛岋紝鐩存帴:option=浼犻�掔殑鍙傛暟鍚嶏紝閲岄潰鏁版嵁鏄剧ず鐨勫唴瀹瑰洜涓烘槸鍜屽乏渚ц仈鍔ㄧ殑锛屾墍浠ラ噸鏂颁竴涓狥ormlist锛岄�氳繃鐐瑰嚮鏍戣妭鐐逛笅鏍囨潵鍔ㄦ�佹覆鏌撳彸渚ц〃鏍硷紝涓嬮潰鏂规硶閮芥湁鍏蜂綋娉ㄩ噴
//鐒跺悗鍐嶈鍙充晶鐨勮〃鍗曪紝涓撻棬瀹氫箟浜嗕竴涓粍浠讹紝閫氳繃鐖朵紶瀛愬啀鎶婅〃鍗曟暟鎹甌reeList浼犻�掕繃鍘伙紝浼犻�掑墠鍦�10deCLi1ck鏂规硶閲岄潰渚夸簡澶勭悊涔熸槸涓�涓仈鍔ㄧ殑鏁堟灉锛岃〃鍗曠殑閰嶇疆椤瑰湪鍝釜瀛愮粍浠舵垨鑰呯埗缁勪欢鍐欓兘鍙互銆�
+import {
+ getAtrrList,
+ TreeSave,
+ TreeDel,
+ TreeCheckDel,
+ TreeObjcet,
+ TreeEnable,
+ TreeDeactivate,
+ importClassify,
+ gridCodeClassifyTemplate,
+ getObjectByOid,
+ gridCodeClassifyTemplateAttr,
+ gridCodeClassifyFindTemplate,
+ addSave,
+ deleteData,
+ editSave,
+ copy
+} from "@/api/template/templateAttr";
+import done from "@/views/work/done";
+
export default {
name: "classifyTrees.vue",
//浣跨敤inject鎺ユ敹鍙傛暟
- //Treeoption宸︿晶鏍戞柊澧炶〃鍗曢」 Treedata宸︿晶鏍戣妭鐐归厤缃」 crudTreeOption鍙充晶琛ㄦ牸閰嶇疆椤� crudTreeData鍙充晶琛ㄦ牸鏄剧ず鍐呭
+ //Treeoption宸︿晶鏍戞柊澧炶〃鍗曢」 Treedata宸︿晶鏍戣妭鐐� 閰嶇疆椤� crudTreeOption鍙充晶琛ㄦ牸閰嶇疆椤� crudTreeData鍙充晶琛ㄦ牸鏄剧ず鍐呭
//Treeform鍙充晶琛ㄥ崟閰嶇疆椤�
- inject: ['crudTreeOption',"crudTreeData", "Treedata", "Treeoption"],
+ inject: ['crudTreeOption', "crudTreeData"],
data() {
return {
+ //妯℃澘灞炴�у睍绀哄唴瀹�
+ ProData: [],
+ //鍥炶溅閿悳绱㈢粦瀹氬��
+ FindText: "",
+ //楂樼骇鏌ヨ瀵硅瘽妗�
+ FindFormVisible: false,
+ //鍏嬮殕妯℃澘瀵硅瘽妗�
+ CloneVisible: false,
+ CloneinnerVisible:false,
+ //楂樼骇鏌ヨ涓嬫媺妗�
+ FindSelect: {
+ id: "0",
+ name: "1",
+ description: "2",
+ revisionValue: "3",
+ lcStatus: "4"
+ },
+ //楂樼骇鏌ヨ鏉′欢
+ condition: ["0", "0", "0", "0", "0"],
+ //楂樼骇鏌ヨ 绛変簬/涓嶇瓑浜�
+ Equalto: "0",
+ //楂樼骇鏌ヨ 杈撳叆妗嗘暟鎹�
+ QueryArray: {
+ id: "",
+ name: "",
+ description: "",
+ revisionValue: "",
+ lcStatus: ""
+ },
+ //鍋滅敤鍚敤鎺ユ敹鏁扮粍
+ FlagObj: {},
+ //淇敼瀵硅瘽妗�
+ TreeEditFormVisible: false,
+ //娣诲姞瀵硅瘽妗�
+ TreeAddFormVisible: false,
+ //褰撳墠鐐瑰嚮椤�
+ nodeClickList: "",
+ ClonenodeClickList:"",
+ //鍒嗙被鍜屼富棰樺簱鐘舵��
+ TreeFlag: false,
+ //鏍戝姞杞�
+ loading: false,
+ FormLoing: false,
+ TreeAddform: {
+ id: "",
+ name: "",
+ description: "",
+ //鐩镐技鏌ヨ瑙勫垯
+ codeResembleRuleOidName: "",
+ //鍏抽敭灞炴�ф煡璇㈣鍒�
+ codekeyattrrepeatoidName: "",
+ //缂栫爜瑙勫垯
+ coderuleoidName: "",
+ //瀛樺偍鐨勪笟鍔$被鍨�
+ btmtypename: ""
+ },
+ //avue-tree鏁版嵁锛屾殏鏃舵病鏈変綔鐢紝閲岄潰鍔熻兘鐢╡lement鍐欎簡锛屽彧鐢╝vue鐨勪竴涓爲缁勪欢涓嶇敤鍐呯疆琛ㄥ崟浜嗐��
+ TreeAvueform: {},
+ //鍏嬮殕鏍�
+ CloneTreeAvueform:{},
+ Treedata: [],
+ CloneTreedata:[],
+ Treeoption: {
+ addBtn: false,
+ editBtn: false,
+ delBtn: false,
+ defaultExpandAll: false,
+ menu: false,
+ // //杩欎釜鏄閫�
+ // multiple: true,
+ },
+ //妯℃澘绠$悊form
crudForm: "",
- form: {},
- //鍔ㄦ�佸垏鎹㈠鐞嗚繃鐨勮〃鏍兼暟鎹�
+ //鍏嬮殕妯℃澘form
+ ClonecrudForm: "",
+ //鍔ㄦ�佸垏鎹㈠鐞嗚繃鐨勬ā鏉胯〃鏍兼暟鎹�
Formlist: [],
+ //鍏嬮殕妯℃澘鏁版嵁
+ CloneFormlist: [],
+ //鍏嬮殕妯℃澘涓嬫媺妗唙alue
+ Clonevalue: "0",
+ //鍏嬮殕妯℃澘鎼滅储杈撳叆妗�
+ CloneFind:"",
+ //鍏嬮殕妯℃澘涓嬫媺妗嗘暟鎹�
+ CloneSelectOptions: [{
+ value: '0',
+ label: '妯℃澘缂栧彿'
+ },
+ {
+ value: '1',
+ label: '妯℃澘鍚嶇О'
+ },
+ ],
+ //鍏嬮殕妯℃澘纭琛ㄥ崟鏁版嵁
+ CloneOption:{
+ column:[
+ {
+ label:'妯℃澘缂栧彿',
+ prop:'id',
+ rules: [{
+ required: true,
+ message: "璇疯緭鍏ユā鏉跨紪鍙�",
+ trigger: "blur"
+ }]
+ }, {
+ label:'妯℃澘鍚嶇О',
+ prop:'name',
+ rules: [{
+ required: true,
+ message: "璇疯緭鍏ユā鏉垮悕绉�",
+ trigger: "blur"
+ }]
+ },
+ {
+ label:'鎻忚堪',
+ prop:'desc',
+ type:'textarea',
+ span:24
+ }
+ ]
+ },
+ //鍏嬮殕妯℃澘鍙屽悜缁戝畾鏁版嵁
+ CloneModel:[],
+ CloneSelect:[],
+ //鍏嬮殕妯℃澘option
+ ClonecrudTreeOption: {
+ index: true,
+ border: true,
+ menu: false,
+ addBtn: false,
+ selection: true,
+ header: false,
+ height: 430,
+ column: [
+ {
+ label: "妯℃澘缂栧彿",
+ prop: "id"
+ },
+ {
+ label: "妯℃澘鍚嶇О",
+ prop: "name",
+ },
+ {
+ label: "妯℃澘鎻忚堪",
+ prop: "description"
+ },
+ {
+ label: "鐗堟湰鍙�",
+ prop: "revisionSeq",
+ display: false
+ },
+ {
+ label: "鐘舵��",
+ prop: "lcStatusText",
+ display: false
+ }
+ ]
+ },
//tab鐘舵��
type: {},
//Tab閰嶇疆椤�
tabOption: {
column: [{
- icon: 'el-icon-info',
label: '鍩烘湰淇℃伅',
prop: 'tab1',
}, {
- icon: 'el-icon-warning',
label: '妯℃澘绠$悊',
prop: 'tab2',
}]
@@ -61,50 +382,130 @@
{
name: "娴嬭瘯1",
sex: "鐢�",
- value:0
+ value: 0
},
{
name: "娴嬭瘯2",
sex: "濂�",
- value:1
+ value: 1
}
],
//浼犻�掔粰瀛愮粍浠跺姩鎬佹覆鏌撶殑鏁版嵁
- TreeList:{}
+ TreeList: {},
+ codeClassifyOid: ""
}
},
//tab鏍忛粯璁ゆ槸琛ㄦ牸
mounted() {
this.type = this.tabOption.column[0];
+ this.getAttr();
},
methods: {
- nodeClick(data) {
- //鐐瑰嚮宸︿晶鏍戝彸渚у姩鎬佺殑鏂规硶
- this.Formlist = this.crudTreeData[data.value].column
- this.nodeList=data.value
- this.TreeList = this.Treeform.find(item => {
- return item.value == data.value
- });
- console.log(data)
+ //鍒嗙被鏍戞暟鎹鐞�
+ getAttr() {
+ getAtrrList().then(res => {
+ this.Treedata = res.data;
+ this.CloneTreedata = res.data;
+ this.Treedata.forEach((item) => {
+ for (let i = 0; i < this.Treedata.length; i++) {
+ this.Treedata[i].value = i;
+ }
+ })
+ //璋冪敤淇敼灞炴�у悕鏂规硶
+ this.ModifyProperties(this.Treedata, 'text', 'label');
+ this.ModifyProperties(this.CloneTreedata, 'text', 'label');
+ }).catch(res => {
+ this.$message.error(res)
+ })
},
- //tab鏍忓垏鎹�
- handleChange(column) {
- this.type = column
+ //瀹氫箟涓�涓慨鏀规暟鎹睘鎬у悕鐨勬柟娉�
+ 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);
+ }
+ }
},
- // 宸︽爲澶氶��
- checkChange(val) {
- console.log(val)
+ //鏍戣妭鐐规坊鍔犳寜閽�
+ TreeAdd() {
+ this.TreeAddFormVisible = true;
+ // 鍒ゆ柇褰撳墠鏄惁鏈夌偣鍑诲瓙椤�
+ if (this.nodeClickList !== "") {
+ this.TreeFlag = true
+ }
},
- //鍒犻櫎
- rowDel(row, index, done) {
- console.log(row)
- this.$confirm('姝ゆ搷浣滃皢姘镐箙鍒犻櫎, 鏄惁缁х画?', '鎻愮ず', {
+ //鏍戣妭鐐规坊鍔犱簨浠�
+ TreeAddHandler() {
+ const data = this.TreeAddform
+ this.$set(data, "parentCodeClassifyOid", this.nodeClickList.oid)
+ TreeSave(data).then(() => {
+ this.$message({
+ type: 'success',
+ message: '娣诲姞鎴愬姛!'
+ });
+ this.getAttr();
+ this.TreeAddFormVisible = false
+ this.TreeAddform = ""
+ }).catch(res => {
+ this.$message({
+ type: 'warning',
+ message: res
+ });
+ })
+ },
+ //鏍戣妭鐐瑰垹闄ゆ寜閽�
+ TreeDel() {
+ this.$confirm('鏄惁鍒犻櫎褰撳墠閫夋嫨鐨勫垎绫伙紝灏嗕細鎶婂瓙鍒嗙被涓�骞跺垹闄わ紝濡傛灉瀛樺湪缂栫爜鏁版嵁灏嗕笉鑳借鍒犻櫎锛屾槸鍚︾户缁紵', '鎻愮ず', {
confirmButtonText: '纭畾',
cancelButtonText: '鍙栨秷',
- type: 'warning'
+ type: 'warning',
+ customClass: 'my-messagebox',
}).then(() => {
- this.$message.success('鍒犻櫎鎴愬姛')
- done();
+ TreeCheckDel(this.nodeClickList).then(res => {
+ if (res.data.data) {
+ TreeDel(this.nodeClickList).then(() => {
+ this.$message({
+ type: 'success',
+ message: '鍒犻櫎鎴愬姛!'
+ });
+ this.getAttr();
+ }).catch(res => {
+ this.$message({
+ type: 'warning',
+ message: res
+ });
+ })
+ } else {
+ this.$confirm('褰撳墠鏁版嵁鍖呭惈鏈変笅绾ф暟鎹紝瑕佸垹闄ょ殑璇濅細鍜屼笅绾ф暟鎹竴璧峰垹闄わ紝浣犵‘璁ょ户缁�?', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning',
+ customClass: 'my-messageboxs',
+ }).then(() => {
+ TreeDel(this.nodeClickList).then(() => {
+ this.$message({
+ type: 'success',
+ message: '鍒犻櫎鎴愬姛!'
+ });
+ this.getAttr();
+ }).catch(res => {
+ this.$message({
+ type: 'warning',
+ message: res
+ });
+ })
+ }).catch(() => {
+ this.$message({
+ type: 'info',
+ message: '宸插彇娑堝垹闄�'
+ });
+ });
+ }
+ })
}).catch(() => {
this.$message({
type: 'info',
@@ -112,25 +513,371 @@
});
});
},
- //娣诲姞
- rowSave(node,data,done,loading) {
- this.$message.success('鏂板鍥炶皟')
- // this.form.id = new Date().getTime();
- // this.form.value=new Date().getTime();
- // this.form.children=[];
- console.log(this.form)
- // console.log("Type",node,data,done,loading)
- // console.log(node,"node")
- // console.log("data",data)
- // console.log("done",done)
- // console.log("loading",loading)
- done();
+ //淇敼鍥炲~
+ TreeEdit() {
+ if (this.nodeClickList == "") {
+ this.$message({
+ type: 'warning',
+ message: '璇峰厛浠庢爲涓婇�夋嫨涓�鏉℃暟鎹�!'
+ });
+ } else {
+ this.TreeEditFormVisible = true
+ }
+ },
+ //鏍戝埛鏂�
+ flushed() {
+ this.loading = true
+ this.getAttr()
+ setTimeout(() => {
+ this.loading = false;
+ this.nodeClickList = ""
+ }, 600);
+ },
+ //鍚敤鍜屽仠鐢ㄩ兘鍏堝垽鏂姸鎬�
+ //鍚敤
+ Enable() {
+ if (this.FlagObj.lcStatus == "Enabled") {
+ this.$message({
+ type: 'warning',
+ message: '褰撳墠鍒嗙被涓嶆槸鍋滅敤鐘舵��'
+ });
+ } else {
+ this.$confirm('鏄惁灏嗗瓙鍒嗙被涓�骞跺惎鐢紵', '鎻愮ず', {
+ confirmButtonText: '鏄�',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(() => {
+ TreeEnable(this.nodeClickList).then((res) => {
+ this.$message({
+ type: 'success',
+ message: '鍚敤鎴愬姛!'
+ });
+ this.getAttr()
+ })
+ }).catch(() => {
+ this.$message({
+ type: 'info',
+ message: '宸插彇娑堝惎鐢�'
+ });
+ });
+ }
+ },
+ //鍋滅敤
+ Deactivate() {
+ if (this.FlagObj.lcStatus === "Disabled") {
+ this.$message({
+ type: 'warning',
+ message: '褰撳墠鍒嗙被涓嶆槸鍚敤鐘舵��!'
+ });
+ } else {
+ this.$confirm('鏄惁鍋滅敤褰撳墠鍒嗙被锛屽仠鐢ㄥ悗锛屽瓙鍒嗙被涔熷皢涓嶈兘琚娇鐢紝鏄惁缁х画锛�', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(() => {
+ TreeDeactivate(this.nodeClickList).then((res) => {
+ this.$message({
+ type: 'success',
+ message: '鍋滅敤鎴愬姛!'
+ });
+ this.nodeClickList['flag'] = true;
+ this.getAttr()
+ })
+ }).catch(() => {
+ this.$message({
+ type: 'info',
+ message: '宸插彇娑堝仠鐢�'
+ });
+ });
+ }
+ },
+ //鏍戠偣鍑讳簨浠�
+ async nodeClick(data) {
+ //瀹氫箟涓�涓ā鏉垮睘鎬d锛屾暟鎹槸妯℃澘绠$悊琛ㄦ牸閲岄潰鐨刼id
+ this.nodeClickList = data
+ console.log(data.oid)
+ try {
+ await TreeObjcet(data.oid).then(res => {
+ this.FlagObj = res.data.data
+ }).catch(res => {
+ this.$message.error(res)
+ })
+ //妯℃澘绠$悊琛ㄦ牸鏁版嵁
+ await gridCodeClassifyTemplate({'conditionMap[codeclassifyoid]': data.oid}).then(res => {
+ this.Formlist = res.data.data.filter(item => {
+ if (item.codeclassifyoid != "") {
+ this.codeClassifyOid = item.codeclassifyoid
+ return item.codeclassifyoid == this.nodeClickList.oid
+ }
+ })
+ gridCodeClassifyTemplateAttr({'conditionMap[classifyTemplateOid]': this.Formlist[0].oid}).then(res => {
+ this.ProData = res.data.data
+ console.log(this.ProData)
+ }).catch(res => {
+ this.$message.error(res)
+ })
+ }).catch(res => {
+ console.log(res)
+ })
+ // 鍩烘湰淇℃伅琛ㄥ崟鏁版嵁
+ await getObjectByOid(this.nodeClickList.oid).then(res => {
+ this.TreeList = res.data.data
+ // eslint-disable-next-line no-const-assig
+ }).catch(res => {
+ this.$message.error(res)
+ })
+ } catch (error) {
+ console.log(error)
+ }
+ },
+ //鍏嬮殕妯℃澘鏍戠殑鐐瑰嚮鍒囨崲鏁版嵁
+ async ClonenodeClick(data){
+ this.ClonenodeClickList=data;
+ console.log("aaa",this.ClonenodeClickList.oid)
+ await gridCodeClassifyTemplate({'conditionMap[codeclassifyoid]': data.oid}).then(res=>{
+ this.CloneFormlist = res.data.data.filter(item => {
+ if (item.codeclassifyoid != "") {
+ this.codeClassifyOid = item.codeclassifyoid
+ return item.codeclassifyoid == this.ClonenodeClickList.oid
+ }
+ })
+ })
+ },
+ //tab鏍忓垏鎹�
+ handleChange(column) {
+ this.type = column;
+ },
+ // //楂樼骇鏌ヨ鎸夐挳
+ // handleSelectChange(key) {
+ // const selectedValue = this.FindSelect[key];
+ // console.log(selectedValue)
+ // console.log(this.QueryArray[0])
+ // switch (this.FindSelect[key]) {
+ // case '0':
+ // this.QueryArray[key] = '';
+ // this.$set(this.QueryArray, key, '');
+ // // 濡傛灉閫変腑鐨勬槸妯℃澘缂栧彿锛岀浉搴旂殑杈撳叆妗嗗弻鍚戠粦瀹氬叧绯讳负 QueryArray.id
+ // this.$set(this.QueryArray, 'id', this.QueryArray[key]);
+ // break;
+ // case '1':
+ // this.QueryArray[key] = '';
+ // this.$set(this.QueryArray, key, '');
+ // // 濡傛灉閫変腑鐨勬槸妯℃澘鍚嶇О锛岀浉搴旂殑杈撳叆妗嗗弻鍚戠粦瀹氬叧绯讳负 QueryArray.name
+ // this.$set(this.QueryArray, 'name', this.QueryArray[key]);
+ // break;
+ // case '2':
+ // this.QueryArray[key] = '';
+ // this.$set(this.QueryArray, key, '');
+ // // 濡傛灉閫変腑鐨勬槸妯℃澘鎻忚堪锛岀浉搴旂殑杈撳叆妗嗗弻鍚戠粦瀹氬叧绯讳负 QueryArray.description
+ // this.$set(this.QueryArray, 'description', this.QueryArray[key]);
+ // break;
+ // case '3':
+ // this.QueryArray[key] = '';
+ // this.$set(this.QueryArray, key, '');
+ // // 濡傛灉閫変腑鐨勬槸鐗堟湰鍙凤紝鐩稿簲鐨勮緭鍏ユ鍙屽悜缁戝畾鍏崇郴涓� QueryArray.revisionValue
+ // this.$set(this.QueryArray, 'revisionValue', this.QueryArray[key]);
+ // break;
+ // case '4':
+ // this.QueryArray[key] = '';
+ // this.$set(this.QueryArray, key, '');
+ // // 濡傛灉閫変腑鐨勬槸鐘舵�侊紝鐩稿簲鐨勮緭鍏ユ鍙屽悜缁戝畾鍏崇郴涓� QueryArray.lcStatus
+ // this.$set(this.QueryArray, 'lcStatus', this.QueryArray[key]);
+ // break;
+ // }
+ // },
+ AdvQueries() {
+ this.FindFormVisible = false
+ //濡傛灉鍏ㄩ儴涓虹┖ allEmpty涓簍rue
+ const allEmpty = Object.values(this.QueryArray).every(value => !value);
+ //濡傛灉鍏ㄩ儴涓虹┖锛岀偣鍑绘煡璇㈠嚭鐜版墍鏈夋暟鎹�
+ if (allEmpty) {
+ gridCodeClassifyTemplate().then(res => {
+ this.Formlist = res.data.data
+ })
+ } else {
+ //榛樿鏄瓑浜�
+ gridCodeClassifyFindTemplate({'conditionMap[id]': this.QueryArray.id},
+ {'conditionMap[name]': this.QueryArray.name},
+ {'conditionMap[description]': this.QueryArray.description},
+ {'conditionMap[revisionValue]': this.QueryArray.revisionValue},
+ {'conditionMap[lcStatus]': this.QueryArray.lcStatus}
+ ).then(res => {
+ this.Formlist = res.data.data
+ })
+ }
+ },
+ //妯℃澘绠$悊娓叉煋
+ CrudRend() {
+ gridCodeClassifyTemplate({'conditionMap[codeclassifyoid]': this.nodeClickList.oid}).then(res => {
+ this.Formlist = res.data.data
+ })
},
+ //妯℃澘绠$悊琛ㄦ牸娣诲姞
+ CrudRowSave(row,done) {
+ if (this.nodeClickList.length <= 0) {
+ this.$message({
+ type: 'warning',
+ message: '璇峰厛浠庢爲涓婇�夋嫨涓�鏉℃暟鎹�!'
+ });
+ } else {
+ let codeClassifyOid = this.codeClassifyOid
+ this.$set(row, "codeclassifyoid", codeClassifyOid)
+ addSave(row).then(res => {
+ this.$message({
+ type: "success",
+ message: "娣诲姞鎴愬姛!"
+ });
+ done(row)
+ this.CrudRend()
+ }).catch(res => {
+ this.$message({
+ type: 'info',
+ message: res
+ });
+ })
+ }
+ },
+ //妯℃澘绠$悊淇敼
+ CrudRowUpdata(row,index,done) {
+ editSave(row).then((res) => {
+ this.CrudRend()
+ this.$message({
+ type: "success",
+ message: "鎿嶄綔鎴愬姛!"
+ });
+ done()
+ }).catch(res => {
+ console.log(res)
+ })
+ },
+ //妯℃澘绠$悊鍒犻櫎
+ CrudRowDel(row) {
+ deleteData(row).then(res => {
+ this.CrudRend()
+ }).catch(res => {
+ this.$message({
+ type: 'info',
+ message: res
+ });
+ })
+ },
+ //妯℃澘绠$悊琛ㄦ牸鏌ヨ
+ EnterFind() {
+ console.log(this.Formlist)
+ if (this.FindText == "") {
+ gridCodeClassifyTemplate().then(res => {
+ this.Formlist = res.data.data
+ })
+ } else {
+ gridCodeClassifyTemplate().then(res => {
+ this.Formlist = res.data.data.filter(item => {
+ return item.name.includes(this.FindText)
+ })
+ })
+ }
+ },
+ //鍏嬮殕妯℃澘鏌ヨ
+ CloneEnterFind(){
+ gridCodeClassifyTemplate().then(res => {
+ this.CloneFormlist = res.data.data.filter(item => {
+ if(this.Clonevalue == 0){
+ return item.id.includes(this.CloneFind)
+ }else if(this.Clonevalue == 1){
+ return item.name.includes(this.CloneFind)
+ }
+ })
+ })
+ },
+ //鍏嬮殕妯℃澘閫夋嫨纭畾
+ Clonehandler(){
+ if(this.CloneSelect.length <= 0){
+ this.$message({
+ type: 'warning',
+ message: '璇烽�夋嫨瑕佸厠闅嗙殑妯℃澘!'
+ });
+ }else if(this.CloneSelect.length >1){
+ this.$message({
+ type: 'warning',
+ message: '鍙兘閫夋嫨涓�鏉℃暟鎹�!'
+ });
+ } else {
+ this.CloneinnerVisible=true;
+
+ }
+ },
+ //鐐瑰嚮浠庡叾瀹冩ā鏉垮厠闅�
+ CloneBtn(){
+ if(this.nodeClickList.length <= 0){
+ this.$message({
+ type: 'warning',
+ message: '璇峰厛浠嶽涓婚搴撳垎绫汇�戞爲涓婇�夋嫨涓�鏉℃暟鎹�!'
+ });
+ }else {
+ this.CloneVisible=true;
+ }
+ },
+ //鍏嬮殕妯℃澘鍗曢�夋鏀瑰彉
+ selectionChange(row){
+ this.CloneSelect=row;
+ //鍙屽悜缁戝畾锛屾彁浜よ〃鍗曡緭鍏ユ鍥炲~涓婂綋鍓嶉�夋嫨鐨勬暟鎹�
+ this.CloneModel.id=row[0].id;
+ this.CloneModel.name=row[0].name;
+ //杩欓噷鏈夌偣缁曪紝CloneSelect鏄垜閫夋嫨妗嗛�夋嫨鐨勬暟鎹�傜瓑浜巘his.nodeClickList.oid鏄洜涓猴紝鍏嬮殕妯℃澘浼犻�掓暟鎹鎶婂綋鍓嶉�夋嫨鏍戠殑oid浼犻�掔粰鍚庣銆傝�屼笉鏄綋鍓嶈鍏嬮殕妯℃澘鐨刼id
+ this.CloneSelect[0].codeclassifyoid=this.nodeClickList.oid
+ },
+ //鍏嬮殕琛ㄥ崟鎻愪氦
+ Clonesubmit(row,done){
+ //閲嶆柊璧嬪�糃loneSelect浼犻�掔殑鏁版嵁涓鸿緭鍏ユ鍙互淇敼鐨勬暟鎹紝CloneModel鎻愪氦琛ㄥ崟杈撳叆妗嗗弻鍚戠粦瀹氭暟鎹�
+ this.CloneSelect[0].id=this.CloneModel.id;
+ this.CloneSelect[0].name=this.CloneModel.name;
+ copy(this.CloneSelect[0]).then(res=>{
+ //鍥犱负鏄祵濂楀脊绐楁墍浠ユ墜鍔ㄥ叧闂瑿loneinnerVisible锛孋loneVisible涓や釜寮圭獥銆�
+ this.CloneinnerVisible=false
+ this.CloneVisible=false
+ this.$message.success("澶嶅埗鎴愬姛")
+ this.CrudRend()
+ done(row)
+ }).catch(res=>{
+ done(res)
+ })
+ },
+ //鍒锋柊
+ TemRefresh() {
+ this.FormLoing = true
+ if (this.nodeClickList.oid != "") {
+ gridCodeClassifyTemplate({'conditionMap[codeclassifyoid]': this.nodeClickList.oid}).then(res => {
+ this.Formlist = res.data.data.filter(item => {
+ return item.codeclassifyoid == this.nodeClickList.oid
+ })
+ })
+ } else {
+ this.FormLoing = true
+ }
+ setTimeout(() => {
+ this.FormLoing = false
+ }, 600);
+ },
}
}
</script>
-<style lang="scss">
+<style lang="scss" scoped>
+.el-form {
+ display: flex;
+ flex-wrap: wrap; /* 璁剧疆鍙崲琛岋紝浠ヤ究鍦ㄥ皬灞忓箷璁惧涓婁娇鐢ㄥ琛屽竷灞� */
+}
+.el-form-item {
+ flex: 1; /* 璁剧疆鍏冪礌鍗犳嵁1浠界┖闂� */
+ margin-right: 1rem; /* 璁剧疆鍏冪礌涔嬮棿鐨勯棿璺� */
+}
+
+.my-messagebox {
+ width: 700px;
+}
+
+.my-messageboxs {
+ width: 500px;
+}
</style>
--
Gitblit v1.9.3