From e3a7392259f08628e026d1e8aa468007c8ee1c82 Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期日, 09 十月 2022 16:52:02 +0800 Subject: [PATCH] 样式管理 --- src/api/api.js | 17 src/assets/lang/zh.js | 24 src/store/index.js | 9 src/views/datamanage/styleDepTree.vue | 354 ++++++++++ src/views/datamanage/styleDirTree.vue | 354 ++++++++++ src/views/datamanage/versionManage.vue | 3 src/assets/lang/en.js | 25 src/views/datamanage/styleManage.vue | 1139 +++++++++++++++++++++------------- 8 files changed, 1,477 insertions(+), 448 deletions(-) diff --git a/src/api/api.js b/src/api/api.js index 3ddb3cc..554dd38 100644 --- a/src/api/api.js +++ b/src/api/api.js @@ -91,3 +91,20 @@ //璇锋眰鍦板潃 return request.post('/version/updateVersion', params); } + +//鏍峰紡绠$悊璇锋眰鍒楄〃 +export function select_Style_ByPageAndCount(params) { + return request.get('/Style/selectByPageAndCount', { params: params }); +} +//鏍峰紡绠$悊娣诲姞 +export function insertStyle(params) { + return request.post('/Style/insertStyle', params); +} +//鏍峰紡绠$悊鍒犻櫎 +export function deleteStyles(params) { + return request.get('/Style/deleteStyles', { params: params }); +} +//鏍峰紡绠$悊淇敼 +export function updateStyle(params) { + return request.post('/Style/updateStyle', params); +} diff --git a/src/assets/lang/en.js b/src/assets/lang/en.js index 4568101..637d232 100644 --- a/src/assets/lang/en.js +++ b/src/assets/lang/en.js @@ -17,6 +17,7 @@ upload: 'Upload', preservation: 'Preservation', close: 'Close', + see: 'See', }, dataManage: { dataManage: 'Data Manage', @@ -75,7 +76,29 @@ modifySuccessfully: 'modify successfully', tipsUp: 'Are you sure to save the changes?', }, - styleManage: 'styleManage', + styleManage: 'Style Manage', + styleObj: { + index: 'Index', + name: 'Name', + type: 'Type', + dirid: 'Directory ID', + depid: 'Unit ID', + ver: 'Edition', + status: 'State', + precision: 'Accuracy', + descr: 'Describe', + fileguid: 'Style file ID', + viewguid: 'Preview File ID', + createUser: 'Creator ID', + createTime: 'Creation Time', + updateUser: 'Updater ID', + updateTime: 'Update Time', + bak: 'Remarks', + deactivate: 'Stop Using', + enable: 'Start Using', + addStyleData: 'Add Style Data', + deInformation: 'Detailed Information', + }, }, operatManage: { operatManage: 'Operat Manage', diff --git a/src/assets/lang/zh.js b/src/assets/lang/zh.js index 5b3d1c9..12ef5dc 100644 --- a/src/assets/lang/zh.js +++ b/src/assets/lang/zh.js @@ -17,6 +17,7 @@ upload: '涓婁紶', preservation: '淇濆瓨', close: '鍏抽棴', + see: '鏌ョ湅', }, dataManage: { dataManage: '鏁版嵁绠$悊', @@ -76,6 +77,29 @@ tipsUp: '鏄惁纭畾淇濆瓨淇敼鍐呭?', }, styleManage: '鏍峰紡绠$悊', + styleObj: { + index: '搴忓彿', + name: '鍚嶇О', + type: '绫诲瀷', + dirid: '鐩綍ID', + depid: '鍗曚綅ID', + ver: '鐗堟湰', + status: '鐘舵��', + precision: '绮惧害', + descr: '鎻忚堪', + fileguid: '鏍峰紡鏂囦欢ID', + viewguid: '棰勮鏂囦欢ID', + createUser: '鍒涘缓浜篒D', + createTime: '鍒涘缓鏃堕棿', + updateUser: '鏇存柊浜篒D', + updateTime: '鏇存柊鏃堕棿', + bak: '澶囨敞', + deactivate: '鍋滅敤', + enable: '鍚敤', + addStyleData: '娣诲姞鏍峰紡鏁版嵁', + + deInformation: '璇︾粏淇℃伅', + }, }, operatManage: { operatManage: '杩愮淮绠$悊', diff --git a/src/store/index.js b/src/store/index.js index 9fc8327..8fac372 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -9,6 +9,8 @@ cataNode: {}, verCateNode: {}, verCateNodes: {}, + styleDirCateNodes: {}, + styleDepCateNodes: {}, }, mutations: { // 鑾峰彇瀹屾暣闈㈠寘灞戣矾寰� @@ -25,6 +27,13 @@ verChangeNodes(state, msg) { state.verCateNodes = msg; }, + //鏍峰紡绠$悊 + styleDepChangeNode(state, msg) { + state.styleDepCateNodes = msg; + }, + styleDirChangeNode(state, msg) { + state.styleDirCateNodes = msg; + }, }, actions: {}, modules: {}, diff --git a/src/views/datamanage/styleDepTree.vue b/src/views/datamanage/styleDepTree.vue new file mode 100644 index 0000000..423cdd8 --- /dev/null +++ b/src/views/datamanage/styleDepTree.vue @@ -0,0 +1,354 @@ +<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" + :props="defaultProps" + node-key="id" + :data="dirData" + :expand-on-click-node="false" + :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"> + <el-button type="text" size="mini" @click="() => append(data)"> + <i class="el-icon-circle-plus"></i> + </el-button> + <el-button + type="text" + size="mini" + @click="() => remove(node, data)" + > + <i class="el-icon-delete-solid"></i> + </el-button> + </span> + </span> + </el-tree> + <!-- <div style="margin-left:130px;"> + <el-button @click="sendChange">淇濆瓨</el-button> + </div> --> + </div> + </div> +</template> + +<script> +import { selectdepTab } from '../../api/api'; +export default { + name: 'catalogueTree', + props: ['showBtn'], + data() { + return { + draggable: false, + id: null, + showEdit: false, + showBread: false, + oriData: [], //鍘熷鏍戞暟鎹� + dirData: [], //el鏍戞暟鎹� + old_dirDat: [], //el鏍戞暟鎹�(鎷栧姩鍓�) + newData: [], //鎷栧姩鍚庡師濮嬫暟鎹� + breadList: [], //闈㈠寘灞戞暟缁� + breadLabel: '', //闈㈠寘灞戞枃瀛� + filterText: '', + defaultProps: { + children: 'children', + label: 'name', + }, + }; + }, + + methods: { + // 璇锋眰鐩綍鏍� + async getDirTree() { + this.selectData = []; + const data = await selectdepTab(); + if (data.code != 200) { + this.$message.error('涓嬫媺璋冪敤澶辫触'); + } else { + this.oriData = data.result; + this.newData = data.result; + this.dirData = this.treeData(data.result); + } + }, + treeData(source) { + let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕 + return cloneData.filter((father) => { + // 寰幆鎵�鏈夐」 + let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁 + 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; // 杩斿洖涓�绾ц彍鍗� + }); + }, + append(data) { + this.$prompt('璇疯緭鍏ュ悕绉�', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + }) + .then(({ value }) => { + const newChild = { + id: this.id + 1, + name: value, + pid: data.id, + // children: [], + oid: data.children ? data.children.length + 1 : 1, + }; + this.id = newChild.id; //淇敼鏂扮殑鏈�澶 + console.log(newChild); + + if (!data.children) { + this.$set(data, 'children', []); + } + data.children.push(newChild); + this.newData.push(newChild); + this.sendChange(); + }) + .catch(() => { + this.$message({ + type: 'info', + message: '鍙栨秷杈撳叆', + }); + }); + }, + remove(node, data) { + this.$confirm('姝ゆ搷浣滃皢鍒犻櫎璇ヨ妭鐐�, 鏄惁缁х画?', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning', + }) + .then(() => { + const parent = node.parent; + const children = parent.data.children || parent.data; + const index = children.findIndex((d) => d.id === data.id); + let res = children.splice(index, 1); + var std = []; + for (var i in res) { + std.push(res[i].id); + } + deleteDirTree(std); + this.getDirTree(); + this.$message({ + type: 'success', + message: '鍒犻櫎鎴愬姛!', + }); + }) + .catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�', + }); + }); + // this.dialogMessage="鏄惁鍒犻櫎" + // this.dialogFlag = 1; + // this.dialogFrom ={ + // node:node, + // val:data + // } + // this.dialogVisible=true;//鐩綍鏍戞洿鏀瑰脊绐� + // const parent = node.parent; + // const children = parent.data.children || parent.data; + // const index = children.findIndex((d) => d.id === data.id); + // let res = children.splice(index, 1); + // // console.log(res); + // // console.log(data); + // console.log(this.flaten(res)); + }, + flaten(arr) { + return arr.reduce((p, v, i) => { + for (let i = 0; i < p.length; i++) { + if (p[i].children) { + delete p[i].children; + } + } + return p.concat(v.children ? this.flaten(v.children).concat(v) : v); + }, []); + }, + handleNodeClick(data) { + // console.log(data); + this.$store.commit('styleDepChangeNode', 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; + } else { + pid = dropNode.data.pid; + } + } else { + pid = data.id; + } + let collection = { + id: item.id, + name: item.name, + pid, + oid: i + 1, + }; + paramData.push(collection); + }); + // console.log(paramData); + let arr = []; + this.oriData.forEach((e) => { + paramData.forEach((item) => { + if (item.id === e.id) { + e = item; + } + }); + arr.push(e); + }); + this.newData = arr; + this.sendChange(); + this.$message({ + type: 'success', + message: '鏇存敼鎴愬姛!', + }); + }) + .catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堟洿鏀�', + }); + this.dirData = this.old_dirDat; //灏嗗浠界殑dir閲嶆柊璧嬪�� + }); + }, + + sendChange() { + updateDirTree(this.newData).then((res) => { + console.log(res); + if (res.status == 200) { + this.$message({ + type: 'success', + message: '鏇存柊鎴愬姛!', + }); + } + }); + }, + }, + mounted() { + this.getDirTree(); + this.$bus.$on('clearTressLabel', (e) => { + this.breadLabel = ''; + }); + }, + watch: { + showBtn: { + immediate: true, + handler(val) { + if (val) { + this.showEdit = val; + this.draggable = val; + } + }, + }, + showBread: { + immediate: true, + handler(val) { + if (val) this.showBread = val; + }, + }, + }, +}; +</script> + +<style lang="less" scoped> +.wrap { + width: 98.5%; + height: 100%; + + .bread { + width: 100%; + height: 5%; + margin: 0 auto; + overflow: auto; + } + + .treeBox { + margin-top: 1%; + width: 100%; + height: 94%; + overflow: auto; + + .el-tree { + background: transparent; + font-size: 15px; + font-family: Microsoft YaHei; + font-weight: 400; + color: #000000; + + // /deep/ .el-tree-node__label { + // font-size: 18px; + // } + /deep/ .el-tree-node { + padding-top: 10px; + // padding-bottom: 10px; + } + + /deep/ .el-tree-node:focus > .el-tree-node__content { + background-color: #b9b9b9; + } + + /deep/ .el-tree-node__content:hover { + background-color: rgb(153, 153, 153); + } + + .btnBox { + margin-left: 5px; + + .el-button + .el-button { + margin-left: 5px; + } + } + } + } +} +</style> diff --git a/src/views/datamanage/styleDirTree.vue b/src/views/datamanage/styleDirTree.vue new file mode 100644 index 0000000..573ac76 --- /dev/null +++ b/src/views/datamanage/styleDirTree.vue @@ -0,0 +1,354 @@ +<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" + :props="defaultProps" + node-key="id" + :data="dirData" + :expand-on-click-node="false" + :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"> + <el-button type="text" size="mini" @click="() => append(data)"> + <i class="el-icon-circle-plus"></i> + </el-button> + <el-button + type="text" + size="mini" + @click="() => remove(node, data)" + > + <i class="el-icon-delete-solid"></i> + </el-button> + </span> + </span> + </el-tree> + <!-- <div style="margin-left:130px;"> + <el-button @click="sendChange">淇濆瓨</el-button> + </div> --> + </div> + </div> +</template> + +<script> +import { selectdirTab } from '../../api/api'; +export default { + name: 'catalogueTree', + props: ['showBtn'], + data() { + return { + draggable: false, + id: null, + showEdit: false, + showBread: false, + oriData: [], //鍘熷鏍戞暟鎹� + dirData: [], //el鏍戞暟鎹� + old_dirDat: [], //el鏍戞暟鎹�(鎷栧姩鍓�) + newData: [], //鎷栧姩鍚庡師濮嬫暟鎹� + breadList: [], //闈㈠寘灞戞暟缁� + breadLabel: '', //闈㈠寘灞戞枃瀛� + filterText: '', + defaultProps: { + children: 'children', + label: 'name', + }, + }; + }, + + methods: { + // 璇锋眰鐩綍鏍� + async getDirTree() { + this.selectData = []; + const data = await selectdirTab(); + if (data.code != 200) { + this.$message.error('涓嬫媺璋冪敤澶辫触'); + } else { + this.oriData = data.result; + this.newData = data.result; + this.dirData = this.treeData(data.result); + } + }, + treeData(source) { + let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕 + return cloneData.filter((father) => { + // 寰幆鎵�鏈夐」 + let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁 + 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; // 杩斿洖涓�绾ц彍鍗� + }); + }, + append(data) { + this.$prompt('璇疯緭鍏ュ悕绉�', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + }) + .then(({ value }) => { + const newChild = { + id: this.id + 1, + name: value, + pid: data.id, + // children: [], + oid: data.children ? data.children.length + 1 : 1, + }; + this.id = newChild.id; //淇敼鏂扮殑鏈�澶 + console.log(newChild); + + if (!data.children) { + this.$set(data, 'children', []); + } + data.children.push(newChild); + this.newData.push(newChild); + this.sendChange(); + }) + .catch(() => { + this.$message({ + type: 'info', + message: '鍙栨秷杈撳叆', + }); + }); + }, + remove(node, data) { + this.$confirm('姝ゆ搷浣滃皢鍒犻櫎璇ヨ妭鐐�, 鏄惁缁х画?', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning', + }) + .then(() => { + const parent = node.parent; + const children = parent.data.children || parent.data; + const index = children.findIndex((d) => d.id === data.id); + let res = children.splice(index, 1); + var std = []; + for (var i in res) { + std.push(res[i].id); + } + deleteDirTree(std); + this.getDirTree(); + this.$message({ + type: 'success', + message: '鍒犻櫎鎴愬姛!', + }); + }) + .catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�', + }); + }); + // this.dialogMessage="鏄惁鍒犻櫎" + // this.dialogFlag = 1; + // this.dialogFrom ={ + // node:node, + // val:data + // } + // this.dialogVisible=true;//鐩綍鏍戞洿鏀瑰脊绐� + // const parent = node.parent; + // const children = parent.data.children || parent.data; + // const index = children.findIndex((d) => d.id === data.id); + // let res = children.splice(index, 1); + // // console.log(res); + // // console.log(data); + // console.log(this.flaten(res)); + }, + flaten(arr) { + return arr.reduce((p, v, i) => { + for (let i = 0; i < p.length; i++) { + if (p[i].children) { + delete p[i].children; + } + } + return p.concat(v.children ? this.flaten(v.children).concat(v) : v); + }, []); + }, + handleNodeClick(data) { + // console.log(data); + this.$store.commit('styleDirChangeNode', 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; + } else { + pid = dropNode.data.pid; + } + } else { + pid = data.id; + } + let collection = { + id: item.id, + name: item.name, + pid, + oid: i + 1, + }; + paramData.push(collection); + }); + // console.log(paramData); + let arr = []; + this.oriData.forEach((e) => { + paramData.forEach((item) => { + if (item.id === e.id) { + e = item; + } + }); + arr.push(e); + }); + this.newData = arr; + this.sendChange(); + this.$message({ + type: 'success', + message: '鏇存敼鎴愬姛!', + }); + }) + .catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堟洿鏀�', + }); + this.dirData = this.old_dirDat; //灏嗗浠界殑dir閲嶆柊璧嬪�� + }); + }, + + sendChange() { + updateDirTree(this.newData).then((res) => { + console.log(res); + if (res.status == 200) { + this.$message({ + type: 'success', + message: '鏇存柊鎴愬姛!', + }); + } + }); + }, + }, + mounted() { + this.getDirTree(); + this.$bus.$on('clearTressLabel', (e) => { + this.breadLabel = ''; + }); + }, + watch: { + showBtn: { + immediate: true, + handler(val) { + if (val) { + this.showEdit = val; + this.draggable = val; + } + }, + }, + showBread: { + immediate: true, + handler(val) { + if (val) this.showBread = val; + }, + }, + }, +}; +</script> + +<style lang="less" scoped> +.wrap { + width: 98.5%; + height: 100%; + + .bread { + width: 100%; + height: 5%; + margin: 0 auto; + overflow: auto; + } + + .treeBox { + margin-top: 1%; + width: 100%; + height: 94%; + overflow: auto; + + .el-tree { + background: transparent; + font-size: 15px; + font-family: Microsoft YaHei; + font-weight: 400; + color: #000000; + + // /deep/ .el-tree-node__label { + // font-size: 18px; + // } + /deep/ .el-tree-node { + padding-top: 10px; + // padding-bottom: 10px; + } + + /deep/ .el-tree-node:focus > .el-tree-node__content { + background-color: #b9b9b9; + } + + /deep/ .el-tree-node__content:hover { + background-color: rgb(153, 153, 153); + } + + .btnBox { + margin-left: 5px; + + .el-button + .el-button { + margin-left: 5px; + } + } + } + } +} +</style> diff --git a/src/views/datamanage/styleManage.vue b/src/views/datamanage/styleManage.vue index 03eafdf..88c3eab 100644 --- a/src/views/datamanage/styleManage.vue +++ b/src/views/datamanage/styleManage.vue @@ -1,11 +1,19 @@ <template> <div class="authorityManagement_box"> - <My-bread :list="['鏁版嵁绠$悊', '鏍峰紡绠$悊']"></My-bread> + <My-bread + :list="[ + `${$t('dataManage.dataManage')}`, + `${$t('dataManage.styleManage')}`, + ]" + ></My-bread> <el-divider /> <div class="searchComp"> <el-form ref="ruleForm" :model="ruleForm" :inline="true"> - <el-form-item label="鍏抽敭瀛�" prop="name"> - <el-input v-model="ruleForm.name" placeholder="璇疯緭鍏�" /> + <el-form-item :label="$t('dataManage.vmobj.keyword')" prop="name"> + <el-input + v-model="ruleForm.name" + :placeholder="$t('common.pleaseInput')" + /> </el-form-item> <el-form-item> <el-button @@ -13,28 +21,28 @@ icon="el-icon-search" type="primary" size="small" - >鏌ヨ</el-button + >{{ $t('common.iquery') }}</el-button > <el-button @click="resetForm('ruleForm')" icon="el-icon-refresh" type="info" size="small" - >閲嶇疆</el-button + >{{ $t('common.empty') }}</el-button > <el-button @click="InsertFormdialog = true" icon="el-icon-edit" type="success" size="small" - >鏂板</el-button + >{{ $t('common.append') }}</el-button > <el-button @click="delStyleData" icon="el-icon-delete" type="danger" size="small" - >鍒犻櫎</el-button + >{{ $t('common.delete') }}</el-button > </el-form-item> </el-form> @@ -44,61 +52,113 @@ <div class="table_box"> <el-table :data="tableData" - border style="width: 100%" fit height="100%" @selection-change="handleSelectionChange" > <el-table-column type="selection" width="55" /> - <el-table-column width="50" type="index" label="搴忓彿" /> - <el-table-column min-width="70" prop="name" label="鏍峰紡鍚嶇О" /> - - <!-- <el-table-column min-width="70" prop="path" label="瀛樺偍鐩綍" /> --> - <el-table-column min-width="70" prop="type" label="绫诲瀷" /> - <!-- <el-table-column min-width="70" prop="img" label="鍥剧墖" /> --> <el-table-column - min-width="150" - prop="queryLevel" - label="鎵�灞炵洰褰�" + align="center" + type="index" + :label="$t('dataManage.styleObj.index')" + width="70px" + /> + <el-table-column align="center" prop="id" v-if="false" /> + <el-table-column + align="center" + prop="name" + :label="$t('dataManage.styleObj.name')" /> <el-table-column - min-width="100" - prop="create_time" - label="鍒涘缓鏃堕棿" + align="center" + prop="type" + :label="$t('dataManage.styleObj.type')" /> <el-table-column - min-width="100" - prop="create_user" - label="鍒涘缓浜哄憳" + align="center" + prop="dirName" + :label="$t('dataManage.styleObj.dirid')" /> - <el-table-column min-width="100" prop="up_time" label="鏇存柊鏃堕棿" /> - <el-table-column min-width="100" prop="up_user" label="鏇存柊浜哄憳" /> - <el-table-column min-width="70" prop="format" label="鏍煎紡" /> - <el-table-column min-width="100" prop="up_unit" label="涓婁紶鍗曚綅" /> - <el-table-column min-width="70" prop="status" label="鐘舵��" /> - <el-table-column min-width="70" prop="version" label="鐗堟湰" /> - <el-table-column min-width="70" prop="accuracy" label="绮惧害" /> - <el-table-column min-width="70" prop="remarks" label="澶囨敞" /> - <el-table-column min-width="100" label="鎿嶄綔"> + <el-table-column + align="center" + prop="depName" + :label="$t('dataManage.styleObj.depid')" + /> + <el-table-column + align="center" + prop="ver" + :label="$t('dataManage.styleObj.ver')" + /> + <el-table-column + align="center" + prop="status" + :label="$t('dataManage.styleObj.status')" + :formatter="formatStatus" + /> + <el-table-column + align="center" + prop="precision" + :label="$t('dataManage.styleObj.precision')" + /> + <el-table-column + align="center" + prop="descr" + :label="$t('dataManage.styleObj.descr')" + /> + <el-table-column + align="center" + prop="fileGuid" + :label="$t('dataManage.styleObj.fileguid')" + /> + <el-table-column + align="center" + prop="viewGuid" + :label="$t('dataManage.styleObj.viewguid')" + /> + <el-table-column + align="center" + prop="createUser" + :label="$t('dataManage.styleObj.createUser')" + /> + <el-table-column + align="center" + prop="createTime" + :label="$t('dataManage.styleObj.createTime')" + :formatter="formatTime" + /> + <el-table-column + align="center" + prop="updateUser" + :label="$t('dataManage.styleObj.updateUser')" + /> + <el-table-column + align="center" + prop="updateTime" + :label="$t('dataManage.styleObj.updateTime')" + :formatter="formatTime" + /> + <el-table-column + align="center" + prop="bak" + :label="$t('dataManage.styleObj.bak')" + /> + <el-table-column min-width="150" :label="$t('common.operate')"> <template slot-scope="scope"> - <el-link - :underline="false" + <el-button @click="showDetail(scope.$index, scope.row)" - >鏌ョ湅</el-link + type="primary" + plain + size="small" + >{{ $t('common.see') }}</el-button > - <el-link - :underline="false" + <el-button @click="handleEdit(scope.$index, scope.row)" - style="margin-left: 10px" - >淇敼</el-link + type="warning" + plain + size="small" + >{{ $t('common.update') }}</el-button > - <!-- <el-link - :underline="false" - @click="handleDelete(scope.$index, scope.row)" - style="margin-left: 10px" - >鍒犻櫎</el-link - > --> </template> </el-table-column> </el-table> @@ -110,9 +170,9 @@ <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" - :current-page="currentPage1" + :current-page="listData.pageIndex" :page-sizes="[10, 20, 50, 100]" - :page-size="pageNum" + :page-size="listData.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="count" > @@ -123,49 +183,84 @@ <div class="infoBox" v-show="showinfoBox"> <el-card class="box-card"> <div slot="header" class="clearfix"> - <span>璇︾粏淇℃伅</span> + <span>{{ $t('dataManage.styleObj.deInformation') }}</span> <div style="float: right; cursor: pointer" @click="closeDetial"> <i class="el-icon-close"></i> </div> </div> <div class="contentBox"> - <p>鏍峰紡鍚嶇О锛歿{ itemdetail.name }}</p> + <p> + <label> {{ $t('dataManage.styleObj.name') }}:</label> + <label class="boxlabel">{{ itemdetail.name }}</label> + </p> <el-divider></el-divider> <p> - 鏈嶅姟鍦板潃锛歿{ itemdetail.path }} - <el-link @click="ShowWindowFly(itemdetail.path)" :underline="false" type="primary" - >璇︽儏</el-link - > + <p> + <label> {{ $t('dataManage.styleObj.type') }}:</label> + <label class="boxlabel">{{ itemdetail.type }}</label> </p> - <el-divider></el-divider>銆� - <p>绫诲瀷锛歿{ itemdetail.type }}</p> - + </p> <el-divider></el-divider> - <p>缂╃暐鍥撅細<img id="showImg" src="" width="200px" height="100px" /></p> + <p> + <label> {{ $t('dataManage.styleObj.dirid') }}:</label> + <label class="boxlabel">{{ itemdetail.dirName }}</label> + </p> <el-divider></el-divider> - <p>鎵�灞炵洰褰曪細{{ itemdetail.queryLevel }}</p> - + <p> + <label> {{ $t('dataManage.styleObj.depid') }}:</label> + <label class="boxlabel">{{ itemdetail.depName }}</label> + </p> <el-divider></el-divider> - - <p>鏍煎紡锛歿{ itemdetail.format }}</p> + <p> + <label> {{ $t('dataManage.styleObj.ver') }}:</label> + <label class="boxlabel">{{ itemdetail.ver }}</label> + </p> <el-divider></el-divider> - <p>涓婁紶鍗曚綅锛歿{ itemdetail.up_unit }}</p> + <p> + <label> {{ $t('dataManage.styleObj.status') }}:</label> + <label class="boxlabel">{{ itemdetail.status }}</label> + </p> <el-divider></el-divider> - <p>鐘舵�侊細{{ itemdetail.status }}</p> + <p> + <label> {{ $t('dataManage.styleObj.descr') }}:</label> + <label class="boxlabel">{{ itemdetail.descr }}</label> + </p> <el-divider></el-divider> - <p>鐗堟湰锛歿{ itemdetail.version }}</p> + <p> + <label> {{ $t('dataManage.styleObj.fileguid') }}:</label> + <label class="boxlabel">{{ itemdetail.fileguid }}</label> + </p> <el-divider></el-divider> - <p>绮惧害锛歿{ itemdetail.accuracy }}</p> + <p> + <label> {{ $t('dataManage.styleObj.viewguid') }}:</label> + <label class="boxlabel">{{ itemdetail.viewguid }}</label> + </p> <el-divider></el-divider> - <p>澶囨敞锛歿{ itemdetail.remarks }}</p> + <p> + <label> {{ $t('dataManage.styleObj.createUser') }}:</label> + <label class="boxlabel">{{ itemdetail.createUser }}</label> + </p> <el-divider></el-divider> - <p>鍒涘缓鏃堕棿锛歿{ itemdetail.create_time }}</p> + <p> + <label> {{ $t('dataManage.styleObj.createTime') }}:</label> + <label class="boxlabel">{{ itemdetail.createTime }}</label> + </p> <el-divider></el-divider> - <p>鍒涘缓浜哄憳锛歿{ itemdetail.create_user }}</p> + <p> + <label> {{ $t('dataManage.styleObj.updateUser') }}:</label> + <label class="boxlabel">{{ itemdetail.updateUser }}</label> + </p> <el-divider></el-divider> - <p>鏇存柊鏃堕棿锛歿{ itemdetail.create_time }}</p> + <p> + <label> {{ $t('dataManage.styleObj.updateTime') }}:</label> + <label class="boxlabel">{{ itemdetail.updateTime }}</label> + </p> <el-divider></el-divider> - <p>鏇存柊浜哄憳锛歿{ itemdetail.create_user }}</p> + <p> + <label> {{ $t('dataManage.styleObj.bak') }}:</label> + <label class="boxlabel">{{ itemdetail.bak }}</label> + </p> + <el-divider></el-divider> </div> </el-card> </div> @@ -177,113 +272,107 @@ :visible.sync="dialogFormVisible" > <el-form :model="upform"> - <el-form-item label="鏍峰紡鍚嶇О" :label-width="formLabelWidth"> + <el-form-item + :label="$t('dataManage.styleObj.name')" + :label-width="formLabelWidth" + > <el-input v-model="upform.name" autocomplete="off"></el-input> </el-form-item> - - <el-form-item label="鏂囦欢璺緞" :label-width="formLabelWidth"> - <input - name="file1" - :accept="'.fly,.ttf,.emp,.edp'" - type="file" - id="flyFile" - multiple="multiple" - style="display: none" - @change="uploadflyFile" - /> - <el-row> - <el-col :span="22"> - <el-input v-model="upform.path" disabled class="firstInput" - /></el-col> - <el-col :span="2" - ><el-link - title="娣诲姞鏁版嵁" - :underline="false" - @click="getflyFile" - style="margin-left: 10px" - ><i class="el-icon-plus"></i - ></el-link> - </el-col> - </el-row> - </el-form-item> - <el-form-item label="鎵�灞炵洰褰�" :label-width="formLabelWidth"> - <el-row> - <el-col :span="22"> - <el-input - disabled - style="display: none" - v-model="upform.path_id" - autocomplete="off" - ></el-input> - <el-tooltip - :content=" - upform.queryLevel == '' ? '鏈�夋嫨鐩綍' : upform.queryLevel - " - placement="top-start" - > - <el-input - v-model="upform.queryLevel" - disabled - class="firstInput" - /> - </el-tooltip> - </el-col> - <el-col :span="2"> - <el-link - title="閫夋嫨鐩綍" - :underline="false" - @click="showCata = true" - style="margin-left: 10px" - ><i class="el-icon-plus"></i - ></el-link> - </el-col> - </el-row> - </el-form-item> - <el-form-item label="绫诲瀷" :label-width="formLabelWidth"> + <el-form-item + :label="$t('dataManage.styleObj.type')" + :label-width="formLabelWidth" + > <el-input v-model="upform.type" autocomplete="off"></el-input> </el-form-item> - <el-form-item label="鏍煎紡" :label-width="formLabelWidth"> - <el-input v-model="upform.format" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.dirid')" + :label-width="formLabelWidth" + > + <el-input + v-model="upform.dirValue" + disabled + autocomplete="off" + ></el-input + ><el-link + :underline="false" + @click="showDirTree(1)" + style="margin-left: 10px" + ><i class="el-icon-plus"></i + ></el-link> </el-form-item> - <el-form-item label="涓婁紶鍗曚綅" :label-width="formLabelWidth"> - <el-input v-model="upform.up_unit" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.depid')" + :label-width="formLabelWidth" + > + <el-input + v-model="upform.depValue" + disabled + autocomplete="off" + ></el-input> + <el-link + :underline="false" + @click="showDepTree(1)" + style="margin-left: 10px" + ><i class="el-icon-plus"></i + ></el-link> </el-form-item> - <el-form-item label="鐘舵��" :label-width="formLabelWidth"> - <el-input v-model="upform.status" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.ver')" + :label-width="formLabelWidth" + > + <el-input v-model="upform.ver" autocomplete="off"></el-input> </el-form-item> - <el-form-item label="鐗堟湰" :label-width="formLabelWidth"> - <el-input v-model="upform.version" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.status')" + :label-width="formLabelWidth" + > + <el-select + v-model="upform.status" + style="width: 745px" + :placeholder="$t('common.choose')" + > + <el-option + value="0" + :label="$t('dataManage.styleObj.deactivate')" + ></el-option> + <el-option + value="1" + :label="$t('dataManage.styleObj.enable')" + ></el-option> + </el-select> </el-form-item> - <el-form-item label="绮惧害" :label-width="formLabelWidth"> - <el-input v-model="upform.accuracy" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.precision')" + :label-width="formLabelWidth" + > + <el-input + v-model="upform.precision" + autocomplete="off" + ></el-input> </el-form-item> - <el-form-item label="澶囨敞" :label-width="formLabelWidth"> - <el-input v-model="upform.remarks" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.descr')" + :label-width="formLabelWidth" + > + <el-input v-model="upform.descr" autocomplete="off"></el-input> </el-form-item> - <el-form-item label="缂╃暐鍥�" :label-width="formLabelWidth"> - <input - name="file1" - :accept="'.jpg,.png'" - type="file" - id="imageFile" - multiple="multiple" - style="display: none" - @change="uploadFile" - /> - <el-row> - <el-col :span="22"> - <el-input v-model="upform.img" disabled class="firstInput" - /></el-col> - <el-col :span="2" - ><el-link - title="娣诲姞鏁版嵁" - :underline="false" - @click="getImageFile" - style="margin-left: 10px" - ><i class="el-icon-plus"></i - ></el-link> - </el-col> - </el-row> + <el-form-item + :label="$t('dataManage.styleObj.fileguid')" + :label-width="formLabelWidth" + > + <el-input v-model="upform.fileGuid" autocomplete="off"></el-input> + </el-form-item> + <el-form-item + :label="$t('dataManage.styleObj.viewguid')" + :label-width="formLabelWidth" + > + <el-input v-model="upform.viewGuid" autocomplete="off"></el-input> + </el-form-item> + <el-form-item + :label="$t('dataManage.styleObj.bak')" + :label-width="formLabelWidth" + > + <el-input v-model="upform.bak" autocomplete="off"></el-input> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> @@ -292,200 +381,348 @@ </div> </el-dialog> <el-dialog - title="娣诲姞鏁版嵁" - top="5vh" + :title="$t('dataManage.styleObj.addStyleData')" + top="2vh" style="overflow: hidden" :visible.sync="InsertFormdialog" > <el-form :model="insertform"> - <el-form-item label="鏍峰紡鍚嶇О" :label-width="formLabelWidth"> + <el-form-item + :label="$t('dataManage.styleObj.name')" + :label-width="formLabelWidth" + > <el-input v-model="insertform.name" autocomplete="off"></el-input> </el-form-item> - <el-form-item label="鏂囦欢璺緞" :label-width="formLabelWidth"> - <input - name="file1" - :accept="'.fly,.ttf,.emp,.edp'" - type="file" - id="flyFile" - multiple="multiple" - style="display: none" - @change="uploadflyFile" - /> - <el-row> - <el-col :span="22"> - <el-input v-model="insertform.path" disabled class="firstInput" - /></el-col> - <el-col :span="2" - ><el-link - title="娣诲姞鏁版嵁" - :underline="false" - @click="getflyFile" - style="margin-left: 10px" - ><i class="el-icon-plus"></i - ></el-link> - </el-col> - </el-row> - </el-form-item> - <el-form-item label="鎵�灞炵洰褰�" :label-width="formLabelWidth"> - <el-row> - <el-col :span="22"> - <el-input - disabled - style="display: none" - v-model="insertform.path_id" - autocomplete="off" - ></el-input> - <el-tooltip - :content=" - insertform.queryLevel == '' - ? '鏈�夋嫨鐩綍' - : insertform.queryLevel - " - placement="top-start" - > - <el-input - v-model="insertform.queryLevel" - disabled - class="firstInput" - /> - </el-tooltip> - </el-col> - <el-col :span="2"> - <el-link - title="閫夋嫨鐩綍" - :underline="false" - @click="showCata = true" - style="margin-left: 10px" - ><i class="el-icon-plus"></i - ></el-link> - </el-col> - </el-row> - </el-form-item> - <el-form-item label="绫诲瀷" :label-width="formLabelWidth"> + <el-form-item + :label="$t('dataManage.styleObj.type')" + :label-width="formLabelWidth" + > <el-input v-model="insertform.type" autocomplete="off"></el-input> </el-form-item> - <el-form-item label="鏍煎紡" :label-width="formLabelWidth"> - <el-input v-model="insertform.format" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.dirid')" + :label-width="formLabelWidth" + > + <el-input + v-model="insertform.dirValue" + disabled + autocomplete="off" + ></el-input + ><el-link + :underline="false" + @click="showDirTree(0)" + style="margin-left: 10px" + ><i class="el-icon-plus"></i + ></el-link> </el-form-item> - <el-form-item label="涓婁紶鍗曚綅" :label-width="formLabelWidth"> - <el-input v-model="insertform.up_unit" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.depid')" + :label-width="formLabelWidth" + > + <el-input + v-model="insertform.depValue" + disabled + autocomplete="off" + ></el-input> + <el-link + :underline="false" + @click="showDepTree(0)" + style="margin-left: 10px" + ><i class="el-icon-plus"></i + ></el-link> </el-form-item> - <el-form-item label="鐘舵��" :label-width="formLabelWidth"> - <el-input v-model="insertform.status" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.ver')" + :label-width="formLabelWidth" + > + <el-input v-model="insertform.ver" autocomplete="off"></el-input> </el-form-item> - <el-form-item label="鐗堟湰" :label-width="formLabelWidth"> - <el-input v-model="insertform.version" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.status')" + :label-width="formLabelWidth" + > + <el-select + v-model="insertform.status" + style="width: 745px" + :placeholder="$t('common.choose')" + > + <el-option + value="0" + :label="$t('dataManage.styleObj.deactivate')" + ></el-option> + <el-option + value="1" + :label="$t('dataManage.styleObj.enable')" + ></el-option> + </el-select> </el-form-item> - <el-form-item label="绮惧害" :label-width="formLabelWidth"> - <el-input v-model="insertform.accuracy" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.precision')" + :label-width="formLabelWidth" + > + <el-input + v-model="insertform.precision" + autocomplete="off" + ></el-input> </el-form-item> - <el-form-item label="澶囨敞" :label-width="formLabelWidth"> - <el-input v-model="insertform.remarks" autocomplete="off"></el-input> + <el-form-item + :label="$t('dataManage.styleObj.descr')" + :label-width="formLabelWidth" + > + <el-input v-model="insertform.descr" autocomplete="off"></el-input> </el-form-item> - <el-form-item label="缂╃暐鍥�" :label-width="formLabelWidth"> - <input - name="file1" - :accept="'.jpg,.png'" - type="file" - id="imageFile" - multiple="multiple" - style="display: none" - @change="uploadFile" - /> - <el-row> - <el-col :span="22"> - <el-input v-model="insertform.img" disabled class="firstInput" - /></el-col> - <el-col :span="2" - ><el-link - title="娣诲姞鏁版嵁" - :underline="false" - @click="getImageFile" - style="margin-left: 10px" - ><i class="el-icon-plus"></i - ></el-link> - </el-col> - </el-row> + <el-form-item + :label="$t('dataManage.styleObj.fileguid')" + :label-width="formLabelWidth" + > + <el-input v-model="insertform.fileGuid" autocomplete="off"></el-input> + </el-form-item> + <el-form-item + :label="$t('dataManage.styleObj.viewguid')" + :label-width="formLabelWidth" + > + <el-input v-model="insertform.viewGuid" autocomplete="off"></el-input> + </el-form-item> + <el-form-item + :label="$t('dataManage.styleObj.bak')" + :label-width="formLabelWidth" + > + <el-input v-model="insertform.bak" autocomplete="off"></el-input> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> - <el-button @click="InsertFormdialog = false">鍙� 娑�</el-button> + <el-button @click="insertFromDataClose">鍙� 娑�</el-button> <el-button type="primary" @click="insertFromData">纭� 瀹�</el-button> </div> </el-dialog> - <div class="leftTree" v-show="showCata"> - <div class="treeBox"><catalogueTree></catalogueTree></div> + <div class="leftTree" v-if="showDirCata"> + <div class="treeBox"> + <style-dir-tree></style-dir-tree> + </div> <div class="btnBox"> - <el-button type="primary" size="small" @click="selectCataName" - >纭畾</el-button - > - <el-button type="primary" size="small" @click="showCata = false" - >鍙栨秷</el-button - > + <el-button type="primary" size="small" @click="selectDirCataName">{{ + $t('common.confirm') + }}</el-button> + <el-button type="primary" size="small" @click="showDirCata = false">{{ + $t('common.close') + }}</el-button> + </div> + </div> + <div class="leftTree" v-if="showDepCata"> + <div class="treeBox"> + <style-dep-tree></style-dep-tree> + </div> + <div class="btnBox"> + <el-button type="primary" size="small" @click="selectDepCataName">{{ + $t('common.confirm') + }}</el-button> + <el-button type="primary" size="small" @click="showDepCata = false">{{ + $t('common.close') + }}</el-button> </div> </div> </div> </template> <script> -import $ from "jquery"; +import $ from 'jquery'; +import moment from 'moment'; +import MyBread from '../../components/MyBread.vue'; +import styleDirTree from './styleDirTree.vue'; +import styleDepTree from './styleDepTree.vue'; import { - StyleQuery, - StyleCounnt, - DeletestStyle, - InsertStyle, - UpdateStyle, -} from "../../api/api"; -import MyBread from "../../components/MyBread.vue"; -import catalogueTree from "../../components/catalogueTree.vue"; + select_Style_ByPageAndCount, + insertStyle, + deleteStyles, + updateStyle +} from '../../api/api'; export default { - name: "styleManage", - components: { MyBread, catalogueTree }, + name: 'styleManage', + components: { MyBread, styleDirTree, styleDepTree }, data() { return { dialogFormVisible: false, InsertFormdialog: false, showCata: false, upform: {}, - formLabelWidth: "100px", + formLabelWidth: '130px', showinfoBox: false, itemdetail: {}, ruleForm: { - name: "", + name: '', }, - tableData: [], - insertform: { - img: "", - path: "", - }, + backupData: [], - currentPage1: 0, - pageSize: 1, - pageNum: 10, - count: 0, - searchName: "", + + searchName: '', multipleSelection: [], upflag: false, + /** */ + showDirCata: false, + showDepCata: false, + tableData: [], + insertform: {}, + dirFlag: null, + depFlag: null, + count: 0, + listData: { + name: null, + depName: null, + pageIndex: 1, + pageSize: 10, + }, }; }, created() { - this.startFromData(); + this.getRoleTabelData(); }, methods: { + handleSelectionChange(val) { + this.multipleSelection = val; + }, + + handleSizeChange(val) { + this.listData.pageSize = val; + this.getRoleTabelData(); + }, + handleCurrentChange(val) { + this.listData.pageIndex = val; + this.getRoleTabelData(); + }, + async delStyleData() { + var std = []; + for (var i in this.multipleSelection) { + std.push(this.multipleSelection[i].id); + } + const data = await deleteStyles({ ids: std.toString() }); + if (data.code == 200) { + this.$message({ + message: '鍒犻櫎鎴愬姛锛�', + type: 'success', + }); + this.getRoleTabelData(); + } else { + this.$message({ + message: '鍒犻櫎澶辫触锛�', + type: 'warning', + }); + } + }, + showDirTree(res) { + this.dirFlag = res; + this.showDirCata = true; + }, + showDepTree(res) { + this.depFlag = res; + this.showDepCata = true; + }, + selectDepCataName() { + this.showDepCata = false; + console.log(this.depFlag) + switch (this.depFlag) { + case 0: + // var data = this.$store.state.styleDirCateNodes; + this.insertform.depValue = this.$store.state.styleDepCateNodes.name; + this.insertform.depid = this.$store.state.styleDepCateNodes.id; + break; + case 1: + this.upform.depValue = this.$store.state.styleDepCateNodes.name; + this.upform.depid = this.$store.state.styleDepCateNodes.id; + break; + } + }, + selectDirCataName() { + this.showDirCata = false; + switch (this.dirFlag) { + case 0: + // var data = this.$store.state.styleDirCateNodes; + this.insertform.dirValue = this.$store.state.styleDirCateNodes.name; + this.insertform.dirid = this.$store.state.styleDirCateNodes.id; + break; + case 1: + this.upform.dirValue = this.$store.state.styleDirCateNodes.name; + this.upform.dirid = this.$store.state.styleDirCateNodes.id; + break; + } + }, + insertFromDataClose() { + this.InsertFormdialog = false; + this.insertform = {}; + }, + async insertFromData() { + if (this.insertform.dirid == null || this.insertform.depid == null) { + this.$message({ + message: '璇烽�夋嫨鏍峰紡鎵�灞炵殑鐩綍鎴栧崟浣�', + type: 'warning', + }); + return; + } + const data = await insertStyle(this.insertform); + if (data.code == 200) { + this.InsertFormdialog = false; + this.insertform = {}; + this.$message({ + message: '娣诲姞鎴愬姛锛�', + type: 'success', + }); + this.getRoleTabelData(); + } else { + this.$message({ + message: '娣诲姞澶辫触锛�', + type: 'warning', + }); + } + }, + async getRoleTabelData() { + if (this.listData.tab == '') { + delete this.listData.tab; + } + const data = await select_Style_ByPageAndCount(this.listData); + if (data.code != 200) { + this.$message.error('鍒楄〃璋冪敤澶辫触'); + } + this.tableData = data.result; + this.count = data.count; + }, + formatTime(row, column) { + let date = row[column.property]; + return this.formomentTime(date); + }, + formomentTime(date) { + if (date === undefined || date === null) { + return; + } + return moment(parseInt(date)).format('YYYY-MM-DD HH:mm:ss'); + }, + formatStatus(row, column) { + let date = row[column.property]; + if (date === undefined || date === null) { + return ''; + } + switch (date) { + case 1: + return '鍚敤'; + break; + case 0: + return '鍋滅敤'; + break; + } + }, + /** */ getflyFile() { - $("#flyFile").click(); + $('#flyFile').click(); }, getImageFile() { - $("#imageFile").click(); + $('#imageFile').click(); }, uploadflyFile() { - var val = document.getElementById("flyFile").files; + var val = document.getElementById('flyFile').files; if (!val || !val.length) return; if (!val || !val.length) return; var formData = new FormData(); - formData.append("file0", val[0]); - var res = $.ajax(serverUrl + "Style/Upload", { - type: "post", + formData.append('file0', val[0]); + var res = $.ajax(serverUrl + 'Style/Upload', { + type: 'post', data: formData, async: false, cache: false, @@ -507,12 +744,12 @@ }, //鍥剧墖涓婁紶 uploadFile() { - var val = document.getElementById("imageFile").files; + var val = document.getElementById('imageFile').files; if (!val || !val.length) return; var formData = new FormData(); - formData.append("file0", val[0]); - var res = $.ajax(serverUrl + "Style/Upload", { - type: "post", + formData.append('file0', val[0]); + var res = $.ajax(serverUrl + 'Style/Upload', { + type: 'post', data: formData, async: false, cache: false, @@ -541,8 +778,8 @@ this.insertform.path_id = this.$store.state.cataNode.id; } - this.$store.commit("changeCata", ""); //娓呯┖state鐨勯潰鍖呭睉 - this.$store.commit("changeNode", ""); //娓呯┖state鐨勮妭鐐瑰璞� + this.$store.commit('changeCata', ''); //娓呯┖state鐨勯潰鍖呭睉 + this.$store.commit('changeNode', ''); //娓呯┖state鐨勮妭鐐瑰璞� this.showCata = false; }, startFromData() { @@ -552,19 +789,10 @@ this.getStyleData(this.pageNum, this.pageSize, this.searchName); this.getStyleDataCount(this.searchName); }, - insertFromData() { - this.InsertFormdialog = false; - InsertStyle(this.insertform).then((res) => {}); - this.insertform = { - img: "", - path: "", - }; - this.startFromData(); - }, + // 璇锋眰鏁版嵁 getStyleData(size, index, name) { StyleQuery(size, index, name).then((res) => { - console.log(res); this.tableData = res.data; }); }, @@ -575,35 +803,39 @@ }); }, addstyle() { - this.$router.push("/addstyle"); + this.$router.push('/addstyle'); }, - updateForm() { - var that = this; - this.$confirm("鏄惁淇濆瓨淇敼?", "鎻愮ず", { - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷", - type: "warning", - }) - .then(() => { - this.dialogFormVisible = false; - this.upflag = false; - UpdateStyle(that.upform).then((res) => { - that.startFromData(); - }); - - this.$message({ - message: "淇敼鎴愬姛", - type: "success", - }); - }) - .catch(() => { - that.upflag = false; + async updateForm() { + if (this.upform.dirid == null || this.upform.depid == null) { + this.$message({ + message: '璇烽�夋嫨鏍峰紡鎵�灞炵殑鐩綍鎴栧崟浣�', + type: 'warning', }); + return; + } + const data = await updateStyle(this.upform); + if (data.code == 200) { + this.dialogFormVisible = false; + this.upform = {}; + this.$message({ + message: '淇敼鎴愬姛锛�', + type: 'success', + }); + this.getRoleTabelData(); + } else { + this.$message({ + message: '淇敼澶辫触锛�', + type: 'warning', + }); + } + + }, removeUpdate() { this.upflag = false; this.dialogFormVisible = false; + this.upform={} }, submitForm(formName) { this.$refs[formName].validate((valid) => { @@ -611,26 +843,18 @@ this.searchName = this.ruleForm.name.trim(); this.startFromData(); } else { - console.log("error submit!!"); + console.log('error submit!!'); return false; } }); }, resetForm(formName) { - this.tableData = this.backupData; - this.$refs[formName].resetFields(); - this.searchName = ""; - this.startFromData(); }, showDetail(index, row) { - console.log(index, row); - var value = serverUrl + row.img; - - var img = document.getElementById("showImg"); - - img.setAttribute("src", value); this.showinfoBox = true; this.itemdetail = row; + this.itemdetail.createTime = this.formomentTime(this.itemdetail.createTime); + this.itemdetail.updateTime = this.formomentTime(this.itemdetail.updateTime); }, closeDetial() { this.showinfoBox = false; @@ -638,65 +862,36 @@ }, handleEdit(index, row) { + this.upflag = true; this.dialogFormVisible = true; this.upform = row; + this.upform.depValue = row.depName; + this.upform.dirValue = row.dirName; }, handleDelete(index, row) { - this.$confirm("纭畾鏄惁鍒犻櫎?", "鎻愮ず", { - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷", - type: "warning", + this.$confirm('纭畾鏄惁鍒犻櫎?', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning', }) .then(() => { DeletestStyle([row.id]); this.$message({ - type: "success", - message: "鍒犻櫎鎴愬姛!", + type: 'success', + message: '鍒犻櫎鎴愬姛!', }); this.startFromData(); }) - .catch(() => {}); + .catch(() => { }); }, // 鑾峰彇澶氶�� - handleSelectionChange(val) { - this.multipleSelection = val; - }, - delStyleData() { - var std = []; - for (var i in this.multipleSelection) { - std.push(this.multipleSelection[i].id); - } - this.$confirm("纭畾鏄惁鍒犻櫎鎵�閫夊唴瀹�?", "鎻愮ず", { - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷", - type: "warning", - }) - .then(() => { - DeletestStyle(std); - this.$message({ - type: "success", - message: "鍒犻櫎鎴愬姛!", - }); - this.startFromData(); - }) - .catch(() => {}); - }, - handleSizeChange(val) { - this.pageNum = val; - this.getStyleData(this.pageNum, 1, this.searchName); - this.getStyleDataCount(this.searchName); - }, - handleCurrentChange(val) { - this.pageSize = val; - this.getStyleData(this.pageNum, this.pageSize, this.searchName); - this.getStyleDataCount(this.searchName); - }, + ShowWindowFly(res) { window.open( - ifreamUrl+"/LFWeb/poper.html?name="+res, - "", - "height=800, width=1500, top=150, left=350, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no" + ifreamUrl + '/LFWeb/poper.html?name=' + res, + '', + 'height=800, width=1500, top=150, left=350, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no' ); }, }, @@ -714,6 +909,7 @@ .el-input { width: 745px; } + .searchComp { margin: 10px auto; background: #fff; @@ -731,7 +927,7 @@ z-index: 10; z-index: 9999; top: 100px; - left: 600px; + left: 800px; width: 400px; height: 600px; background: #f0f2f5; @@ -761,53 +957,53 @@ margin: 0 auto; overflow: auto; background: #fff; - .el-table { - height: 100%; - // overflow: auto; - } - .el-table /deep/ .el-table__header-wrapper tr th { - background-color: rgb(255, 255, 255) !important; - color: rgb(0, 0, 0); - } - // 淇敼姣忚鏍峰紡锛� - .el-table /deep/ .el-table__row { - background-color: rgba(255, 255, 255) !important; - color: rgb(0, 0, 0); - } - .el-table /deep/ .el-table__body tr.current-row > td { - background-color: rgb(211, 211, 211) !important; - } - .el-table /deep/ .el-table__body tr:hover > td { - background-color: rgb(211, 211, 211) !important; - } - // 淇敼琛ㄦ牸姣忚杈规鐨勬牱寮忥細 - .el-table /deep/ td, - .el-table /deep/ th.is-leaf { - border-bottom: 1px solid #eee; - border-right: 1px solid #eee; - } - .el-table /deep/ .el-table__cell { - padding: 0; - } - // 璁剧疆琛ㄦ牸姣忚鐨勯珮搴︼細 - .el-table /deep/ .el-table__header tr, - .el-table /deep/ .el-table__header th { - height: 40px; - } - .el-table__body tr, - .el-table__body td { - height: 40px; - padding: 0; - } - // 璁剧疆琛ㄦ牸杈规棰滆壊锛� + // .el-table { + // height: 100%; + // // overflow: auto; + // } + // .el-table /deep/ .el-table__header-wrapper tr th { + // background-color: rgb(255, 255, 255) !important; + // color: rgb(0, 0, 0); + // } + // // 淇敼姣忚鏍峰紡锛� + // .el-table /deep/ .el-table__row { + // background-color: rgba(255, 255, 255) !important; + // color: rgb(0, 0, 0); + // } + // .el-table /deep/ .el-table__body tr.current-row > td { + // background-color: rgb(211, 211, 211) !important; + // } + // .el-table /deep/ .el-table__body tr:hover > td { + // background-color: rgb(211, 211, 211) !important; + // } + // // 淇敼琛ㄦ牸姣忚杈规鐨勬牱寮忥細 + // .el-table /deep/ td, + // .el-table /deep/ th.is-leaf { + // border-bottom: 1px solid #eee; + // border-right: 1px solid #eee; + // } + // .el-table /deep/ .el-table__cell { + // padding: 0; + // } + // // 璁剧疆琛ㄦ牸姣忚鐨勯珮搴︼細 + // .el-table /deep/ .el-table__header tr, + // .el-table /deep/ .el-table__header th { + // height: 40px; + // } + // .el-table__body tr, + // .el-table__body td { + // height: 40px; + // padding: 0; + // } + // // 璁剧疆琛ㄦ牸杈规棰滆壊锛� - .el-table--border::after, - .el-table--group::after { - width: 0; - } - .el-table::before { - height: 0; - } + // .el-table--border::after, + // .el-table--group::after { + // width: 0; + // } + // .el-table::before { + // height: 0; + // } // a { // color: #000; // } @@ -838,7 +1034,60 @@ // margin-bottom: 10px; font-size: 14px; } + .boxlabel { + margin-left: 10px; + } + } + /* 鏁翠綋鏍峰紡 */ + .contentBox::-webkit-scrollbar { + width: 6px; + height: 6px; + } + + /* 婊氬姩鏉� */ + .contentBox::-webkit-scrollbar-thumb { + background-color: #b3d8ff; + border-radius: 6px; + } + + /* 婊氬姩鏉¢紶鏍囩粡杩囨牱寮� */ + .contentBox::-webkit-scrollbar-thumb:hover { + background-color: #b3d8ff; + border-radius: 6px; + } + + /* 婊氬姩鏉¤建閬� */ + .contentBox::-webkit-scrollbar-track-piece { + -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); + border-radius: 10px; + background: #ededed; } } } </style> +<style> +/* 鏁翠綋鏍峰紡 */ +.el-table__body-wrapper::-webkit-scrollbar { + width: 6px; + height: 6px; +} + +/* 婊氬姩鏉� */ +.el-table__body-wrapper::-webkit-scrollbar-thumb { + background-color: #b3d8ff; + border-radius: 6px; +} + +/* 婊氬姩鏉¢紶鏍囩粡杩囨牱寮� */ +.el-table__body-wrapper::-webkit-scrollbar-thumb:hover { + background-color: #66b1ff; + border-radius: 8px; +} + +/* 婊氬姩鏉¤建閬� */ +.el-table__body-wrapper::-webkit-scrollbar-track-piece { + -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); + border-radius: 10px; + background: #ededed; +} +</style> diff --git a/src/views/datamanage/versionManage.vue b/src/views/datamanage/versionManage.vue index c23135d..77cc835 100644 --- a/src/views/datamanage/versionManage.vue +++ b/src/views/datamanage/versionManage.vue @@ -307,9 +307,8 @@ this.listData.name = this.ruleForm.name; this.listData.depName = this.$store.state.verCateNode.name; - console.log(this.listData); const data = await select_Ver_ByPageAndCount(this.listData); - console.log(data); + if (data.code != 200) { this.$message.error('鍒楄〃璋冪敤澶辫触'); } -- Gitblit v1.9.3