From 6f07da9344da3c3a2c099c33c3e98fb9e247fdeb Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期三, 09 八月 2023 15:48:43 +0800 Subject: [PATCH] 项目管理修改批量上传功能 --- src/views/datamanage/catalogueManage.vue | 471 +++++++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 362 insertions(+), 109 deletions(-) diff --git a/src/views/datamanage/catalogueManage.vue b/src/views/datamanage/catalogueManage.vue index b6db35b..a6a4fe1 100644 --- a/src/views/datamanage/catalogueManage.vue +++ b/src/views/datamanage/catalogueManage.vue @@ -2,7 +2,7 @@ <div class="subpage_Box"> <My-bread :list="[ `${$t('dataManage.dataManage')}`, - `${$t('dataManage.catalogueManage')}`, + `${$t('dataManage.projectManagement')}`, ]"></My-bread> <el-divider /> <div class="mainBox"> @@ -21,8 +21,19 @@ :expand-on-click-node="false" :default-expanded-keys="expandData" @node-click="handleNodeClick" + @node-contextmenu="openTreeMenu" > </el-tree> + <div + class="right_menu box_divm" + id="menu" + v-show="showRightMenu" + > + <ul> + <li @click="setMenuDataCopy">澶嶅埗</li> + <li @click="setMenuDataPaste">绮樿创</li> + </ul> + </div> </div> </div> <div class="cataLog_rightContent right subpage_Div"> @@ -53,7 +64,7 @@ type="info" size="small" @click="setDirectoryDownload" - >{{ $t("shuJuGuanLi.butten.directoryDownload") }}</el-button> + >{{ $t("shuJuGuanLi.butten.folderDownload") }}</el-button> </el-form-item> <el-form-item> @@ -77,7 +88,7 @@ type="success" icon="el-icon-plus" size="small" - >{{ $t("shuJuGuanLi.butten.uploadFile") }}</el-button> + >{{ $t("shuJuGuanLi.butten.uploads") }}</el-button> </el-upload> </el-form-item> <el-form-item> @@ -145,27 +156,27 @@ > <el-form-item prop="name" - :label="$t('dataManage.dataUpObj.directoryName')" + :label="$t('dataManage.dataUpObj.name')" :label-width="formLabelWidth" > <el-input v-model="itemdetail.name" size="small" style=" max-width: 420px" - :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueone')" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueName')" clearable /> <!-- style="max-width: 400px"--> </el-form-item> <el-form-item - :label="$t('dataManage.dataUpObj.catalogDescription')" + :label="$t('dataManage.dataUpObj.explain')" :label-width="formLabelWidth" > <el-input v-model="itemdetail.descr" type="textarea" style=" max-width: 420px" - :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueone')" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueexplain')" clearable /> </el-form-item> @@ -176,6 +187,7 @@ <el-select style="width: 420px" v-model="itemdetail.checks" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueexamine')" multiple > <el-option @@ -204,7 +216,7 @@ v-model="itemdetail.exts" type="textarea" style=" max-width: 420px" - :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueone')" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuesuffix')" clearable /> </el-form-item> @@ -228,7 +240,6 @@ disabled type="textarea" style=" max-width: 420px" - :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueone')" autosize /> </el-form-item> @@ -304,22 +315,24 @@ :rules="rules" > <el-form-item - :label="$t('dataManage.dataUpObj.directoryName')" + :label="$t('dataManage.dataUpObj.name')" prop="name" :label-width="formLabelWidth" > <el-input v-model="ruleForm.name" autocomplete="off" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueName')" ></el-input> </el-form-item> <el-form-item - :label="$t('dataManage.dataUpObj.catalogDescription')" + :label="$t('dataManage.dataUpObj.explain')" :label-width="formLabelWidth" > <el-input v-model="ruleForm.descr" autocomplete="off" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueexplain')" ></el-input> </el-form-item> <el-form-item @@ -331,6 +344,7 @@ type="textarea" resize="none" style="height: 100%; overflow: auto" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuesuffix')" /> </el-form-item> <el-form-item @@ -347,6 +361,7 @@ v-model="ruleForm.checks" multiple style="width:100%;" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueexamine')" > <el-option v-for="item in options" @@ -371,12 +386,13 @@ /> </el-form-item> <el-form-item - :label="$t('dataManage.dataUpObj.catalogRemarks')" + :label="$t('dataManage.dataUpObj.Remarks')" :label-width="formLabelWidth" > <el-input v-model="ruleForm.bak" autocomplete="off" + :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueRemarks')" ></el-input> </el-form-item> </el-form> @@ -394,11 +410,32 @@ >{{ $t("common.preservation") }}</el-button> </div> </el-dialog> + <iframe id="Iframe1" src="" style="display: none; border: 0; padding: 0; height: 0; width: 0" ></iframe> + <div + class="loadBox" + v-if="loadDialogVisible" + > + <div style="widht:100%; margin:20px; color:white"> + <div style="margin-left:99%"> + <!-- <el-link + @click="setloadDialogVisible()" + style="color:white" + > X</el-link> --> + </div> + </div> + <div + v-loading="true" + element-loading-background="rgba(0, 0, 0, 0.0) " + element-loading-text="鐩綍涓婁紶涓�,璇风瓑寰�..." + style="margin: 0px 20px;widht:100%;height:calc(100% - 80px); " + > + </div> + </div> </div> </template> @@ -519,9 +556,84 @@ } ], + currentData: null, + showRightMenu: false, + checksData: null, + checksCopyData: null, + loadDialogVisible: false }; }, methods: { + // 澶嶅埗 + setMenuDataCopy() { + this.checksCopyData = this.checksData; + }, + //绮樿创 + setMenuDataPaste() { + if (!this.checksCopyData) { + return this.$message('鏈�変腑瑕佸鍒剁殑鑺傜偣'); + } + var val = this.$refs.tree.getNode(this.checksCopyData).data; + + var level = this.$refs.tree.getNode(this.checksData).data.level + 1; + this.setInsertCopyData([val], this.checksData, level); + }, + setInsertCopyData(val, pid, level) { + for (var i in val) { + var data = val[i]; + var pchildNodes = []; + + if (this.$refs.tree.getNode(pid) && this.$refs.tree.getNode(pid).childNodes) { + pchildNodes = this.$refs.tree.getNode(pid).childNodes + } + var orderNum = this.getMaxOrderNum(pchildNodes); + var obj = { + bak: data.bak, + level: level, + orderNum: orderNum + 1, + pid: pid, + checks: data.checks, + name: data.name, + descr: data.descr, + exts: data.exts, + } + insertDir(obj).then((res) => { + if (res.code == 200) { + this.getDirTree(); + if (data.children && data.children.length > 0) { + + this.setInsertCopyData(data.children, res.result, level + 1) + } + } + }) + } + }, + + + + + + handleNodeClick(data, node) { + this.showRightMenu = false; + document.removeEventListener('click', this.closeRightMenu) + this.layerFormInline(data) + + }, + //鍙抽敭鑿滃崟 + openTreeMenu(event, data, node, obj) { + this.showRightMenu = true; + let menu = document.getElementById('menu') + menu.style.left = event.clientX + 20 + 'px' + menu.style.top = event.clientY + 'px' + document.addEventListener('click', this.closeRightMenu) + this.checksData = data.id; + console.log(this.checksData) + }, + closeRightMenu() { + this.showRightMenu = false; + document.removeEventListener('click', this.closeRightMenu) + + }, setTemplateDownload() { var url = window.location.href; var testurl = window.location.origin + "/"; @@ -588,9 +700,8 @@ } this.tableData = arr; + this.setInsertData(this.tableData); - - }, getNameAndPname(res, result, flag) { var chLevel = null; @@ -616,26 +727,22 @@ } }, setInsertData(res) { - var list = this.excelData(res); - if (list.length != 0) { if (list[0].pname != null) { return this.$message.error("涓婁紶鏁版嵁閿欒锛岀涓�鏉℃暟鎹笉涓虹┖"); } - this.getAllNodeId(res); } }, async getAllNodeId(res) { + this.loadDialogVisible = true; for (let i = 0; i < res.length; i++) { var val = res[i]; - if (val.pname == null) { val.orderNum = this.dirList[this.dirList.length - 1].orderNum + 1; val.pid = 0; } else { - this.tableData.filter((child) => { if (child.tid == val.sid) { val.pid = child.id; @@ -646,6 +753,9 @@ const data = await insertDir(val); if (data.code != 200) { + this.$message.error("鐩綍涓婁紶澶辫触" + data.msg); + this.loadDialogVisible = false; + break; } this.tableData.filter((child) => { @@ -655,12 +765,15 @@ } }); this.itemaName = data.result; - this.getDirTree(); + // this.getDirTree(); // if (res[i].children) { // this.getAllNodeId(res[i].children); // } } + this.getDirTree(); + this.loadDialogVisible = false; + }, excelData(source) { let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕 @@ -686,34 +799,54 @@ }, // 璇锋眰鐩綍鏍� - getDirTree() { + async getDirTree() { //鑾峰彇鐩綍鏍戞渶澶D锛屾柊寤鸿妭鐐逛娇鐢� // queryMaxId().then((res) => { // this.id = res.data; // }); // 鑾峰彇鐩綍鏍戞暟鎹� - queryDirTree().then((res) => { - // console.log(res); - if (res.code == 200) { - this.oriData = res.result; - this.newData = res.result; - this.dirList = this.treeData(res.result); - // this.$nextTick(() => { + const data = await queryDirTree(); - // this.expandData=[15] - // this.$refs.tree.setCurrentKey(15); + if (data.code != 200) { + return this.$message.error("椤圭洰鍒楄〃鏌ヨ澶辫触"); + } + this.oriData = data.result; + this.newData = data.result; + this.dirList = this.treeData(data.result); - // }); - if (this.itemaName != null) { - this.$nextTick(() => { - this.expandData = [this.itemaName]; - this.$refs.tree.setCurrentKey(this.itemaName); - }); - } - } else { - console.log("鎺ュ彛鎶ラ敊"); - } + + var cdata; + if (this.currentData) { + var rs = JSON.parse(this.currentData); + cdata = this.$refs.tree.getNode(rs.id).data; + } else { + cdata = this.dirList[this.dirList.length - 1] + } + this.$nextTick(() => { + this.expandData = [cdata.id]; + this.$refs.tree.setCurrentKey(cdata.id); + this.layerFormInline(cdata) }); + + + // queryDirTree().then((res) => { + // // console.log(res); + + + // if (res.code == 200) { + + + // // this.$nextTick(() => { + + // // this.expandData=[15] + // // this.$refs.tree.setCurrentKey(15); + + // // }); + + // } else { + // console.log("鎺ュ彛鎶ラ敊"); + // } + // }); }, handleClose() { this.$confirm("鍏抽棴鍚庢棤娉曚繚瀛橈紝鏄惁鍏抽棴?") @@ -727,12 +860,19 @@ return cloneData.filter((father) => { // 寰幆鎵�鏈夐」 let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁 + if (branchArr.length > 0) { + branchArr.sort(function (a, b) { + return a.orderNum - b.orderNum + }) + } + 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 == 0; // 杩斿洖涓�绾ц彍鍗� }); }, + //鍚戜笂鍚戜笅绉诲姩 setEditNode(res) { let node = this.$refs.tree.getCurrentNode(); let pchildNodes = this.$refs.tree.getNode(node.id).parent.childNodes; @@ -747,19 +887,25 @@ if (currentId != 0) { const tempChildrenNodex1 = pchildNodes[currentId - 1]; const tempChildrenNodex2 = pchildNodes[currentId]; - tempChildrenNodex2.orderNum = - pchildNodes[currentId - 1].data.orderNum; - tempChildrenNodex1.orderNum = pchildNodes[currentId].data.orderNum; - var arr = []; + // tempChildrenNodex2.orderNum = + // pchildNodes[currentId - 1].data.orderNum; + // tempChildrenNodex1.orderNum = pchildNodes[currentId].data.orderNum; + + const arr = []; this.oriData.filter((res) => { if (res.id == tempChildrenNodex2.data.id) { - res.orderNum = tempChildrenNodex2.orderNum; + // res.orderNum = tempChildrenNodex2.orderNum; arr.push(res); } else if (res.id == tempChildrenNodex1.data.id) { - res.orderNum = tempChildrenNodex1.orderNum; + // res.orderNum = tempChildrenNodex1.orderNum; arr.push(res); } }); + + const orderNum = arr[1].orderNum + arr[1].orderNum = arr[0].orderNum + arr[0].orderNum = orderNum + this.newData = arr; this.sendChange(); } else { @@ -773,19 +919,23 @@ if (currentId < pchildNodes.length - 1) { const tempChildrenNodex1 = pchildNodes[currentId + 1]; const tempChildrenNodex2 = pchildNodes[currentId]; - tempChildrenNodex2.orderNum = - pchildNodes[currentId + 1].data.orderNum; - tempChildrenNodex1.orderNum = pchildNodes[currentId].data.orderNum; - var arr = []; + // tempChildrenNodex2.orderNum = + // pchildNodes[currentId + 1].data.orderNum; + // tempChildrenNodex1.orderNum = pchildNodes[currentId].data.orderNum; + + const arr = []; this.oriData.filter((res) => { if (res.id == tempChildrenNodex2.data.id) { - res.orderNum = tempChildrenNodex2.orderNum; + // res.orderNum = tempChildrenNodex2.orderNum; arr.push(res); } else if (res.id == tempChildrenNodex1.data.id) { - res.orderNum = tempChildrenNodex1.orderNum; + // res.orderNum = tempChildrenNodex1.orderNum; arr.push(res); } }); + const orderNum = arr[1].orderNum + arr[1].orderNum = arr[0].orderNum + arr[0].orderNum = orderNum this.newData = arr; this.sendChange(); } else { @@ -813,17 +963,33 @@ }); }); }, + insertStart() { + this.ruleForm = { + level: null, + orderNum: null, + pid: null, + name: "", + descr: "", + bak: "", + checks: [] + } + }, setNewNode(res) { + this.insertStart(); + var node = this.$refs.tree.getCurrentNode(); + this.newNode = node; var id, lever, orderNum; if (res == 1) { //鏂板鍚岀骇 id = this.itemdetail.pid; - orderNum = this.getMaxOrderNum(this.newNode.parent.childNodes); + let pchildNodes = this.$refs.tree.getNode(this.newNode.id).parent.childNodes + orderNum = this.getMaxOrderNum(pchildNodes); lever = this.itemdetail.level; } else if (res == 2) { //鏂板瀛愮骇 id = this.itemdetail.id; - orderNum = this.getMaxOrderNum(this.newNode.childNodes); + let pchildNodes = this.$refs.tree.getNode(this.newNode.id).childNodes + orderNum = this.getMaxOrderNum(pchildNodes); lever = this.itemdetail.level + 1; } @@ -842,7 +1008,6 @@ val = val + 1; return val; }, - append(node, data) { this.dialogFormVisible = true; this.ruleForm.pid = data.id; @@ -854,7 +1019,7 @@ this.ruleForm = {}; this.$nextTick(() => { this.ruleForm = {}; - this.$refs[formName].resetFields(); + // this.$refs[formName].resetFields(); }); }, submitForm(formName) { @@ -863,7 +1028,13 @@ if (valid) { this.fullscreenLoading = true; var val = this.ruleForm; - val.checks = this.ruleForm.checks.toString() + if (this.ruleForm.checks) { + val.checks = this.ruleForm.checks.toString() + } else { + val.checks = '' + } + // var val = JSON.parse(JSON.stringify(this.ruleForm)) + // this.itemdetail = val insertDir(val) .then((res) => { setTimeout(() => { @@ -874,9 +1045,9 @@ message: "娣诲姞鎴愬姛", type: "success", }); - this.itemaName = res.result; - this.itemdetail = {}; - this.ruleForm = {}; + + // this.itemdetail = {}; + // this.ruleForm = {}; this.dialogFormVisible = false; this.$refs[formName].resetFields(); this.getDirTree(); @@ -926,6 +1097,12 @@ type: "success", message: "鍒犻櫎鎴愬姛!", }); + let pchildNodes = this.$refs.tree.getNode(this.itemdetail.id).parent; + if (pchildNodes.data.id) { + this.currentData = JSON.stringify(pchildNodes.data) + } else { + this.currentData = null + } this.itemdetail = {}; this.getDirTree(); @@ -938,8 +1115,8 @@ } }) .catch(() => { - this.$message.error("鍒犻櫎澶辫触"); - this.itemdetail = {}; + // this.$message.error("鍒犻櫎澶辫触"); + // this.itemdetail = {}; }); //閲嶇疆瑕佸垹闄ょ殑瀛怚D this.delChildIDs = []; @@ -1011,8 +1188,7 @@ } item.orderNum = i + 1; }); - // console.log(nodeData); - //鏇存柊鍘熷鏁翠綋鏁版嵁 + let arr = []; this.oriData.forEach((e) => { nodeData.forEach((item) => { @@ -1028,19 +1204,25 @@ this.dirList = this.old_dirDat; //灏嗗浠界殑dir閲嶆柊璧嬪�� }); }, - sendChange() { - updateDirTrees(this.newData) - .then((res) => { - if (res.code == 200) { - this.getDirTree(); - return; - } else { - this.$message.error("淇敼澶辫触锛岃閲嶈瘯锛�"); - } - }) - .catch(() => { - this.$message.error("淇敼澶辫触锛岃閲嶈瘯锛�"); - }); + async sendChange() { + const data = await updateDirTrees(this.newData) + + if (data.code != 200) { + return this.$message.error("绉诲姩澶辫触"); + } + this.getDirTree(); + // this.getLayerTree() + // .then((res) => { + // if (res.code == 200) { + // + // return; + // } else { + // this.$message.error("绉诲姩澶辫触锛岃閲嶈瘯锛�"); + // } + // }) + // .catch(() => { + // this.$message.error("绉诲姩澶辫触锛岃閲嶈瘯锛�"); + // }); }, setDirectoryDownload() { @@ -1048,18 +1230,21 @@ console.log(url) $("#Iframe1").attr("src", url).click() }, - handleNodeClick(data, node) { - // console.log(data); + + layerFormInline(data) { if (data.pid == 0) { this.directoryData = data; this.directoryFlag = true; } else { this.directoryFlag = false; } - this.newNode = node; + + this.newNode = this.$refs.tree.getNode(data.id); this.backUpData = JSON.stringify(data); - var val = JSON.parse(JSON.stringify(data)); + var val = this.$refs.tree.getNode(data.id).data; this.itemdetail = val; + this.currentData = JSON.stringify(data) + var checks = []; if (val.checks) { if (val.checks.indexOf(',') > -1) { @@ -1067,6 +1252,8 @@ for (var i in value) { checks.push(value[i]) } + } else if (val.checks.indexOf('[]') > -1) { + } else { checks.push(val.checks) } @@ -1074,38 +1261,62 @@ } else { this.itemdetail.checks = [] } - }, - updCata(formName) { - this.$nextTick(() => { - this.$refs[formName].validate((valid) => { - if (valid) { - this.fullscreenLoading = true; - var val = this.itemdetail - var value = this.itemdetail.checks.toString() - val.checks = value; - updateDirTree(val) - .then((res) => { - setTimeout(() => { - this.fullscreenLoading = false; - if (res.code == 200) { - this.getDirTree(); - this.itemdetail = {}; - this.dialogFormVisible = false; - } - }, 500); - }) - .catch((res) => { - this.$message.error("淇敼澶辫触锛岃閲嶈瘯锛�"); - this.fullscreenLoading = false; - }); - } else { - return false; - } - }); + async updCata(formName) { + this.fullscreenLoading = true; + var val = JSON.parse(JSON.stringify(this.itemdetail)); + val.orderNum = this.newNode.data.orderNum; + + var value = this.itemdetail.checks.toString() + val.checks = value; + const data = await updateDirTree(val); + this.currentData = JSON.stringify(this.itemdetail) + + if (data.code != 200) { + this.fullscreenLoading = false; + return this.$message.error("淇敼澶辫触"); + } + this.$message({ + message: '淇敼鎴愬姛', + type: 'success' }); + this.fullscreenLoading = false; + this.getDirTree(); + + // this.$nextTick(() => { + // this.$refs[formName].validate((valid) => { + // if (valid) { + // + + // var val = this.itemdetail + // var value = this.itemdetail.checks.toString() + // val.checks = value; + // + // let res = JSON.parse(JSON.stringify(this.itemdetail)); + // this.itemdetail = res; + // + // updateDirTree(val) + // .then((res) => { + // setTimeout(() => { + // this.fullscreenLoading = false; + // if (res.code == 200) { + // this.getDirTree(); + // // this.itemdetail = {}; + // this.dialogFormVisible = false; + // } + // }, 500); + // }) + // .catch((res) => { + // this.$message.error("淇敼澶辫触锛岃閲嶈瘯锛�"); + // this.fullscreenLoading = false; + // }); + // } else { + // return false; + // } + // }); + // }); }, reset(formName) { this.itemdetail = {}; @@ -1232,6 +1443,48 @@ } } } + .right_menu { + position: fixed; + display: block; + z-index: 10000; + padding: 10px; + border: 1px solid #ebeef5; + border-radius: 4px; + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); + ul { + width: 100%; + height: 100%; + list-style: none; + margin: 0; + padding: 0; + border-radius: 2%; + li { + margin: 0 0 1px 0; + color: rgb(77, 77, 73); + text-align: center; + font-size: 14px; + padding: 4%; + width: 100%; + height: 9.7%; + float: left; + } + li:hover { + color: #409eff !important; + } + } + } +} +.loadBox { + z-index: 2002; + background: rgba(0, 0, 0, 0.2); + width: 100%; + height: 100%; + top: 0; + left: 0; + position: absolute; + .el-loading-mask { + background: transparent !important; + } } .btnBox { position: absolute; -- Gitblit v1.9.3