From 1494c7949d90e1e8407b71606947dc8d9cb60778 Mon Sep 17 00:00:00 2001 From: lxl <lixuliang_hd@126.com> Date: 星期三, 12 十月 2022 10:58:38 +0800 Subject: [PATCH] 1 --- src/components/catalogueTree.vue | 115 +++++++++++++-------------------------------------------- 1 files changed, 27 insertions(+), 88 deletions(-) diff --git a/src/components/catalogueTree.vue b/src/components/catalogueTree.vue index 75b3536..756d757 100644 --- a/src/components/catalogueTree.vue +++ b/src/components/catalogueTree.vue @@ -1,10 +1,5 @@ <template> <div class="wrap"> - <div class="bread"> - <el-breadcrumb separator="el-icon-arrow-right"> - <el-breadcrumb-item>{{ breadLabel }}</el-breadcrumb-item> - </el-breadcrumb> - </div> <div class="treeBox"> <el-tree ref="tree" @@ -15,12 +10,11 @@ :default-expanded-keys="[1, 2, 3, 4, 5, 6, 7, 8, 9]" :draggable="draggable" @node-drag-start="handleDragStart" - @node-click="handleNodeClick" @node-drop="handleDrop" > <span class="custom-tree-node" slot-scope="{ node, data }"> <span>{{ node.label }}</span> - <span class="btnBox" v-show="showEdit"> + <span class="btnBox"> <el-button type="text" size="mini" @click="() => append(data)"> <i class="el-icon-circle-plus"></i> </el-button> @@ -34,10 +28,8 @@ </span> </span> </el-tree> - <!-- <div style="margin-left:130px;"> - <el-button @click="sendChange">淇濆瓨</el-button> - </div> --> </div> + <button @click="sendChange">淇濆瓨</button> </div> </template> @@ -45,25 +37,20 @@ import { queryDirTree, queryMaxId, - updateDirTree, - deleteDirTree, + updateDirTrees, + // deleteDirTree, } from "../api/api"; export default { name: "catalogueTree", props: ["showBtn"], data() { return { - draggable: false, + draggable: true, id: null, - showEdit: false, - showBread: false, oriData: [], //鍘熷鏍戞暟鎹� dirData: [], //el鏍戞暟鎹� old_dirDat: [], //el鏍戞暟鎹�(鎷栧姩鍓�) newData: [], //鎷栧姩鍚庡師濮嬫暟鎹� - breadList: [], //闈㈠寘灞戞暟缁� - breadLabel: "", //闈㈠寘灞戞枃瀛� - filterText: "", defaultProps: { children: "children", label: "name", @@ -75,17 +62,16 @@ // 璇锋眰鐩綍鏍� getDirTree() { //鑾峰彇鐩綍鏍戞渶澶D锛屾柊寤鸿妭鐐逛娇鐢� - queryMaxId().then((res) => { - this.id = res.data; - }); + // queryMaxId().then((res) => { + // this.id = res.data; + // }); // 鑾峰彇鐩綍鏍戞暟鎹� queryDirTree().then((res) => { // console.log(res); - if (res.status == 200) { - this.oriData = res.data; - this.newData = res.data; - this.dirData = this.treeData(res.data); - // console.log(this.treeData(this.dirData)); + if (res.code == 200) { + this.oriData = res.result; + this.newData = res.result; + this.dirData = this.treeData(res.result); } else { console.log("鎺ュ彛鎶ラ敊"); } @@ -99,7 +85,7 @@ branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊� // 灞炰簬鍚屼竴瀵硅薄闂锛屼緥濡傦細浠� a=b銆乧=1 锛岀劧鍚庡啀浠� b.c=c 锛� 閭d箞 a.c=b.c=c=1 锛涘悓鐞嗭紝鍚庣画浠� c.d=2 ,閭d箞 a.c.d 涔熸槸=2锛� // 鐢辨寰幆澶氭鍚庯紝灏辫兘褰㈡垚鐩稿簲鐨勬爲褰㈡暟鎹粨鏋� - return father.pid == -1; // 杩斿洖涓�绾ц彍鍗� + return father.pid == 0; // 杩斿洖涓�绾ц彍鍗� }); }, append(data) { @@ -113,7 +99,7 @@ name: value, pid: data.id, // children: [], - oid: data.children ? data.children.length + 1 : 1, + orderNum: data.children ? data.children.length + 1 : 1, }; this.id = newChild.id; //淇敼鏂扮殑鏈�澶 console.log(newChild); @@ -123,7 +109,7 @@ } data.children.push(newChild); this.newData.push(newChild); - this.sendChange(); + // this.sendChange(); }) .catch(() => { this.$message({ @@ -147,7 +133,7 @@ for (var i in res) { std.push(res[i].id); } - deleteDirTree(std); + // deleteDirTree(std); this.getDirTree(); this.$message({ type: "success", @@ -185,73 +171,39 @@ return p.concat(v.children ? this.flaten(v.children).concat(v) : v); }, []); }, - handleNodeClick(data) { - // console.log(data); - this.$store.commit("changeNode", data); - this.breadList = []; - this.getTreeNode(this.$refs.tree.getNode(data.id)); - }, - getTreeNode(node) { - if (node && node.label) { - this.breadList.unshift(node.label); - this.getTreeNode(node.parent); //閫掑綊 - this.breadLabel = this.breadList.join(">"); - this.$store.commit("changeCata", this.breadLabel); - } - }, handleDragStart(node, ev) { this.old_dirDat = JSON.parse(JSON.stringify(this.dirData)); //灏嗗浠界殑dir閲嶆柊璧嬪�� }, - handleDrop(draggingNode, dropNode, dropType, ev) { - // console.log("琚嫋鎷借妭鐐�", draggingNode); - // console.log("杩涘叆鐨勮妭鐐�", dropNode); - // console.log("鏀剧疆浣嶇疆", dropType); - // console.log("浜嬩欢", ev); - // if (dropType !== "inner") { - // // 1.淇敼鐖惰妭鐐筽id - // draggingNode.data.pid = dropNode.data.pid; - // dropNode.parent.childNodes.forEach((item, index) => { - // // 2.淇敼鑷韩椤哄簭oid - // item.data.oid = index + 1; - // }); - // } - // // console.log(draggingNode.data.id); - // let res = this.oriData.filter((item) => item.id == draggingNode.data.id); - // console.log(res); this.$confirm("姝ゆ搷浣滃皢淇濆瓨鐩綍鏇存敼, 鏄惁缁х画?", "鎻愮ず", { confirmButtonText: "纭畾", cancelButtonText: "鍙栨秷", type: "warning", }) .then(() => { - let paramData = []; + //鐖惰妭鐐� let data = dropType != "inner" ? dropNode.parent.data : dropNode.data; + // 鐖惰妭鐐逛腑鍏ㄩ儴瀛愯妭鐐� let nodeData = dropNode.level == 1 && dropType != "inner" ? data : data.children; - let pid = ""; + //鍙樻洿鑺傜偣 nodeData.forEach((item, i) => { if (dropType != "inner") { if (draggingNode.data.pid === dropNode.data.pid) { - pid = item.pid; + item.pid = item.pid; } else { - pid = dropNode.data.pid; + item.pid = dropNode.data.pid; } } else { - pid = data.id; + item.pid = data.id; } - let collection = { - id: item.id, - name: item.name, - pid, - oid: i + 1, - }; - paramData.push(collection); + item.orderNum = i + 1; }); - // console.log(paramData); + // console.log(nodeData); + //鏇存柊鍘熷鏁翠綋鏁版嵁 let arr = []; this.oriData.forEach((e) => { - paramData.forEach((item) => { + nodeData.forEach((item) => { if (item.id === e.id) { e = item; } @@ -259,11 +211,6 @@ arr.push(e); }); this.newData = arr; - this.sendChange(); - this.$message({ - type: "success", - message: "鏇存敼鎴愬姛!", - }); }) .catch(() => { this.$message({ @@ -273,9 +220,8 @@ this.dirData = this.old_dirDat; //灏嗗浠界殑dir閲嶆柊璧嬪�� }); }, - sendChange() { - updateDirTree(this.newData).then((res) => { + updateDirTrees(this.newData).then((res) => { console.log(res); if (res.status == 200) { this.$message({ @@ -294,15 +240,8 @@ immediate: true, handler(val) { if (val) { - this.showEdit = val; this.draggable = val; } - }, - }, - showBread: { - immediate: true, - handler(val) { - if (val) this.showBread = val; }, }, }, -- Gitblit v1.9.3