From d2570148ec3884de3af721bd99c4b7acbbdee075 Mon Sep 17 00:00:00 2001 From: 田源 <lastanimals@163.com> Date: 星期二, 09 五月 2023 17:07:26 +0800 Subject: [PATCH] 前端代码提交 --- Source/UBCS-WEB/src/components/Tree/classifyTrees.vue | 259 ++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 190 insertions(+), 69 deletions(-) diff --git a/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue b/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue index f38af3b..e439208 100644 --- a/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue +++ b/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue @@ -6,17 +6,25 @@ <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">淇敼</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">鍚敤</el-button> + <el-button plain size="small" type="primary" @click="Enable">鍚敤</el-button> </div> <div style="display: flex;justify-content: space-around;margin-top: 5px;margin-bottom: 5px"> - <el-button plain size="small" type="primary">鍋滅敤</el-button> - <el-button plain size="small" type="primary">瀵煎嚭</el-button> - <el-button plain size="small" type="primary">瀵煎叆</el-button> + <el-button plain size="small" type="primary" @click="Deactivate">鍋滅敤</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> + <el-upload + multiple + :limit="3" + :on-preview="handlePreview" + action="https://jsonplaceholder.typicode.com/posts/" + :file-list="fileList"> + <el-button size="small" type="primary" @click="importExcel">鐐瑰嚮涓婁紶</el-button> + </el-upload> <!-- 鏍戣妭鐐规坊鍔犲璇濇--> <el-dialog :title="this.TreeFlag ? '娣诲姞鍒嗙被' :'娣诲姞涓婚搴�'" :visible.sync="TreeAddFormVisible" append-to-body style="width: 1700px;margin: auto"> @@ -50,12 +58,18 @@ <el-button type="primary" @click="TreeAddHandler">纭� 瀹�</el-button> </div> </el-dialog> - <avue-tree ref="tree" v-model="TreeAvueform" v-loading="loading" :data="Treedata" :option="Treeoption" :defaultExpandAll="false" - style="height: 80.5vh;padding-top: 5px;padding-bottom: 30px" +<!-- 淇敼瀵硅瘽妗�--> + <el-dialog title="淇敼鍒嗙被" :visible.sync="TreeEditFormVisible" append-to-body> + <classifyTreeform ref="childForm" :TreeNewForm="TreeList" :nodeList="nodeList"></classifyTreeform> + </el-dialog> + <avue-tree ref="tree" v-model="TreeAvueform" v-loading="loading" :data="Treedata" :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> @@ -63,25 +77,26 @@ <!-- 鍙充晶琛ㄦ牸--> <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> + + <avue-crud v-model="crudForm" :data="this.Formlist" :option="this.crudTreeOption" + ></avue-crud> + <templatePro></templatePro> </span> <span v-else-if="type.prop==='tab2'"> +<!-- 濡傛灉鏄〃鏍煎姞琛ㄥ崟灏卞啀娆″紩鍏ヨ繖涓猚lassifyTreeform缁勪欢锛岄噷闈㈡槸琛ㄥ崟鐨勫唴瀹癸紝娌$敤灏卞垹鎺夈�傛妸涓婇潰鐨則ab鏍忎篃鍒犻櫎浜�--> <!-- 濡傛灉鏄〃鏍煎姞琛ㄥ崟灏卞啀娆″紩鍏ヨ繖涓猚lassifyTreeform缁勪欢锛岄噷闈㈡槸琛ㄥ崟鐨勫唴瀹癸紝娌$敤灏卞垹闄ゆ帀銆傛妸涓婇潰tab鏍忎篃鍒犻櫎浜�--> - <classifyTreeform ref="childForm" :TreeNewForm="TreeList" :nodeList="nodeList"></classifyTreeform> - <template-pro></template-pro> + <classifyTreeform ref="childForm" :TreeNewForm="TreeList" :nodeList="nodeList"></classifyTreeform> </span> </basic-container> </el-main> </el-container> </template> - <script> //杩欓噷澹版槑涓�浜涜彍鍗曠粍浠剁敤娉曪細棣栧厛甯冨眬鍒嗕负宸︿晶鑿滃崟鍙充晶琛ㄦ牸锛屽彲鑳戒細鏈夊彸渚ab鏍忓姞琛ㄥ崟鐨勬儏鍐点�傛墍浠ュ彟澶栧紩鍏ヤ簡涓�涓彸渚ц〃鍗曠殑缁勪欢"classifyTreeform"銆� //棣栧厛鐖剁粍浠惰皟鐢ㄥ瓙缁勪欢鑿滃崟锛岄�氳繃provide浼犻�掑弬鏁般�傛湁Treeoption宸︿晶鏍戞柊澧炶〃鍗曢」 Treedata宸︿晶鏍戣妭鐐归厤缃」 crudTreeOption鍙充晶琛ㄦ牸閰嶇疆椤� crudTreeData鍙充晶琛ㄦ牸鏄剧ず鍐呭 //鍏朵腑琛ㄦ牸鐨勯厤缃」鐩存帴鐖朵紶瀛愪紶閫掕繃鏉ュ氨琛岋紝鐩存帴:option=浼犻�掔殑鍙傛暟鍚嶏紝閲岄潰鏁版嵁鏄剧ず鐨勫唴瀹瑰洜涓烘槸鍜屽乏渚ц仈鍔ㄧ殑锛屾墍浠ラ噸鏂颁竴涓狥ormlist锛岄�氳繃鐐瑰嚮鏍戣妭鐐逛笅鏍囨潵鍔ㄦ�佹覆鏌撳彸渚ц〃鏍硷紝涓嬮潰鏂规硶閮芥湁鍏蜂綋娉ㄩ噴 //鐒跺悗鍐嶈鍙充晶鐨勮〃鍗曪紝涓撻棬瀹氫箟浜嗕竴涓粍浠讹紝閫氳繃鐖朵紶瀛愬啀鎶婅〃鍗曟暟鎹甌reeList浼犻�掕繃鍘伙紝浼犻�掑墠鍦�10deCLi1ck鏂规硶閲岄潰渚夸簡澶勭悊涔熸槸涓�涓仈鍔ㄧ殑鏁堟灉锛岃〃鍗曠殑閰嶇疆椤瑰湪鍝釜瀛愮粍浠舵垨鑰呯埗缁勪欢鍐欓兘鍙互銆� -import {getAtrrList,TreeSave,TreeDel} from "@/api/template/templateAttr"; +import {getAtrrList, TreeSave, TreeDel, TreeCheckDel,TreeObjcet,TreeEnable,TreeDeactivate,importClassify,gridCodeClassifyTemplateAttr} from "@/api/template/templateAttr"; export default { name: "classifyTrees.vue", @@ -91,12 +106,17 @@ inject: ['crudTreeOption', "crudTreeData"], data() { return { + fileList:[], + FlagObj:{}, + //淇敼瀵硅瘽妗� + TreeEditFormVisible:false, + //娣诲姞瀵硅瘽妗� TreeAddFormVisible: false, //褰撳墠鐐瑰嚮椤� nodeClickList: "", - // 鍒嗙被鍜屼富棰樺簱鐘舵�� + //鍒嗙被鍜屼富棰樺簱鐘舵�� TreeFlag: false, - // 鏍戝姞杞� + //鏍戝姞杞� loading: false, TreeAddform: { id: "", @@ -115,13 +135,13 @@ TreeAvueform: {}, Treedata: [], Treeoption: { - addBtn:false, - editBtn:false, - delBtn:false, + addBtn: false, + editBtn: false, + delBtn: false, defaultExpandAll: false, - menu:false, - //杩欎釜鏄閫� - multiple:true, + menu: false, + // //杩欎釜鏄閫� + // multiple: true, }, crudForm: "", //鍔ㄦ�佸垏鎹㈠鐞嗚繃鐨勮〃鏍兼暟鎹� @@ -161,13 +181,27 @@ mounted() { this.type = this.tabOption.column[0]; this.getAttr(); + console.log(this.fileList) }, methods: { + ExportExcel(){ + console.log(this.fileList) + }, + importExcel(){ + + }, + handlePreview(file) { + debugger + console.log(file); + importClassify(file.raw).then(res=>{ + console.log(res) + }) + }, //鍒嗙被鏍戞暟鎹鐞� getAttr() { getAtrrList().then(res => { this.Treedata = res.data; - this.Treedata.forEach((item, value) => { + this.Treedata.forEach(() => { for (let i = 0; i < this.Treedata.length; i++) { this.Treedata[i].value = i; } @@ -199,41 +233,63 @@ } }, //鏍戣妭鐐规坊鍔犱簨浠� - TreeAddHandler(){ - const data=this.TreeAddform - this.$set(data,"parentCodeClassifyOid",this.nodeClickList.oid) + TreeAddHandler() { + const data = this.TreeAddform + this.$set(data, "parentCodeClassifyOid", this.nodeClickList.oid) console.log(data) - TreeSave(data).then(res=>{ - console.log(res) - }).catch(res=>{ - console.log(res) + TreeSave(data).then(() => { + this.$message({ + type: 'success', + message: '娣诲姞鎴愬姛!' + }); + this.getAttr(); + this.TreeAddFormVisible = false + this.TreeAddform="" + }).catch(res => { + this.$message({ + type: 'warning', + message: res + }); }) }, //鏍戣妭鐐瑰垹闄ゆ寜閽� - TreeDel(){ - const oid=this.nodeClickList.oid - if(this.nodeClickList !==""){ - this.$confirm('鏄惁鍒犻櫎褰撳墠閫夋嫨鐨勫垎绫伙紝灏嗕細鎶婂瓙鍒嗙被涓�骞跺垹闄わ紝濡傛灉瀛樺湪缂栫爜鏁版嵁灏嗕笉鑳借鍒犻櫎锛屾槸鍚︾户缁紵', '鎻愮ず', { - confirmButtonText: '纭畾', - cancelButtonText: '鍙栨秷', - type: 'warning', - customClass: 'my-messagebox', - }).then(() => { - if(this.nodeClickList.children.length > 0){ + TreeDel() { + this.$confirm('鏄惁鍒犻櫎褰撳墠閫夋嫨鐨勫垎绫伙紝灏嗕細鎶婂瓙鍒嗙被涓�骞跺垹闄わ紝濡傛灉瀛樺湪缂栫爜鏁版嵁灏嗕笉鑳借鍒犻櫎锛屾槸鍚︾户缁紵', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning', + customClass: 'my-messagebox', + }).then(() => { + 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(JSON.parse(oid)).then(()=>{ + TreeDel(this.nodeClickList).then(() => { this.$message({ type: 'success', message: '鍒犻櫎鎴愬姛!' }); - }).catch(res=>{ + this.getAttr(); + }).catch(res => { this.$message({ - type: 'error', + type: 'warning', message: res }); }) @@ -243,35 +299,95 @@ message: '宸插彇娑堝垹闄�' }); }); - }else { - TreeDel(oid).then(()=>{ - this.$message({ - type: 'success', - message: '鍒犻櫎鎴愬姛!' - }); - }).catch(res=>{ - this.$message({ - type: 'error', - message: res - }); - }) } - }).catch(() => { - this.$message({ - type: 'info', - message: '宸插彇娑堝垹闄�' - }); + }) + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�' }); + }); + }, + //淇敼鍥炲~ + 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); + console.log(this.fileList) + // 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)=>{ + console.log(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)=>{ + console.log(res) + this.$message({ + type: 'success', + message: '鍋滅敤鎴愬姛!' + }); + this.nodeClickList['flag']=true; + this.getAttr() + }) + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝仠鐢�' + }); + }); + } }, nodeClick(data) { //鐐瑰嚮宸︿晶鏍戝彸渚у姩鎬佺殑鏂规硶 @@ -281,7 +397,15 @@ // return item.value == data.value // }); this.nodeClickList = data - console.log(data) + TreeObjcet(data.oid).then(res=>{ + console.log("object",res) + this.FlagObj=res.data.data + }) + gridCodeClassifyTemplateAttr(data.oid).then(res=>{ + console.log(res) + }).catch(res=>{ + console.log(res) + }) }, //tab鏍忓垏鎹� handleChange(column) { @@ -291,8 +415,6 @@ checkChange(val) { console.log(val) }, - - } } </script> @@ -302,7 +424,6 @@ display: flex; flex-wrap: wrap; /* 璁剧疆鍙崲琛岋紝浠ヤ究鍦ㄥ皬灞忓箷璁惧涓婁娇鐢ㄥ琛屽竷灞� */ } - .el-form-item { flex: 1; /* 璁剧疆鍏冪礌鍗犳嵁1浠界┖闂� */ margin-right: 1rem; /* 璁剧疆鍏冪礌涔嬮棿鐨勯棿璺� */ -- Gitblit v1.9.3