From 87c914ffe57995f1a9844fa19cbd4fe19ca7b91a Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期四, 29 九月 2022 18:47:21 +0800 Subject: [PATCH] 角色管理新增,删除,修改 --- src/api/api.js | 45 ++ src/assets/lang/zh.js | 155 ++++--- src/assets/lang/en.js | 169 ++++---- src/views/userManage/roleDepTree.vue | 351 ++++++++++++++++++ src/views/userManage/roleManage.vue | 410 +++++++++++++++++++-- 5 files changed, 924 insertions(+), 206 deletions(-) diff --git a/src/api/api.js b/src/api/api.js index 3596062..2f67fd9 100644 --- a/src/api/api.js +++ b/src/api/api.js @@ -6,30 +6,61 @@ * @LastEditors: 鐜嬫棴 * @LastEditTime: 2022-04-19 20:29:30 */ -import request from "@/utils/request"; +import request from '@/utils/request'; //瀛楀吀绠$悊鍒楄〃 export function selectByPageAndCount(params) { //璇锋眰鍦板潃 - return request.get("/dict/selectByPageAndCount", {params:params}); + return request.get('/dict/selectByPageAndCount', { params: params }); } //瀛楀吀绠$悊鍒楄〃 export function selectDictTab(params) { //璇锋眰鍦板潃 - return request.get("/dict/selectDictTab", {params:params}); + return request.get('/dict/selectDictTab', { params: params }); } //瀛楀吀绠$悊鍒楄〃鍒犻櫎 export function deleteDicts(params) { //璇锋眰鍦板潃 - return request.get("/dict/deleteDicts", {params:params}); + return request.get('/dict/deleteDicts', { params: params }); } //瀛楀吀绠$悊鍒楄〃缂栬緫 export function updateDict(params) { //璇锋眰鍦板潃 - return request.post("/dict/updateDict", params); + return request.post('/dict/updateDict', params); } //瀛楀吀绠$悊鏂板 export function insertDict(params) { //璇锋眰鍦板潃 - return request.post("/dict/insertDict", params); -} \ No newline at end of file + return request.post('/dict/insertDict', params); +} + +//瑙掕壊绠$悊鍒楄〃 +export function select_Role_ByPageAndCount(params) { + //璇锋眰鍦板潃 + return request.get('/role/selectByPageAndCount', { params: params }); +} +//瑙掕壊绠$悊鏂板 +export function insertRole(params) { + //璇锋眰鍦板潃 + return request.post('/role/insertRole', params); +} +//瑙掕壊绠$悊鍒犻櫎 +export function deleteRole(params) { + //璇锋眰鍦板潃 + return request.get('/role/deleteRole', { params: params }); +} +//瑙掕壊绠$悊淇敼 +export function updateRole(params) { + //璇锋眰鍦板潃 + return request.post('/role/updateRole', params); +} +//缁勭粐鏈烘瀯鍒楄〃 +export function selectdepTab(params) { + //璇锋眰鍦板潃 + return request.get('/dep/selectDepAll', { params: params }); +} +//缁勭粐鏈烘瀯鏍规嵁id鏌ヨ +export function selectDep(params) { + //璇锋眰鍦板潃 + return request.get('/dep/selectDep', { params: params }); +} diff --git a/src/assets/lang/en.js b/src/assets/lang/en.js index c3fe8d7..8fa9a3a 100644 --- a/src/assets/lang/en.js +++ b/src/assets/lang/en.js @@ -27,40 +27,40 @@ SpatialData: 'SpatialData', versionManage: 'versionManage', dictionaryManage: 'dictionaryManage', - dictionaryManageObj:{ - tableName:"table name", - selectTableName:"select table name", - add:"add", - del:"delete", - number:"number", - fieldName:"field name", - fieldAliasName:"field alias name", - fieldType:"field Type", - fieldLength:"field length", - FieldPrecision:"Field Precision", - rangeAssociationTable:"range association table", - remark:"remark", - creationTime:"creation time", - createPersonnel:"create personnel", - updateTime:"update time", - updatePersonnel:"update personnel", - operation:"operation", - lookOver:"look over", - revamp:"revamp", - particulars:"particulars", - tableAliasName:"table alias name", - cancel:"cancel", - confirm:"confirm", - tips:"tips", - deletedSuccessfully:"deleted successfully", - DeleteFailed:"delete failed", - tipsDelete:"Are you sure you want to delete the selected content?", - FailedAdd:"Failed to add", - NewSuccess:"Successfully added", - tipsAdd:"Are you sure you want to add it?", - failModify:"fail to modify", - modifySuccessfully:"modify successfully", - tipsUp:"Are you sure to save the changes?", + dictionaryManageObj: { + tableName: 'table name', + selectTableName: 'select table name', + add: 'add', + del: 'delete', + number: 'number', + fieldName: 'field name', + fieldAliasName: 'field alias name', + fieldType: 'field Type', + fieldLength: 'field length', + FieldPrecision: 'Field Precision', + rangeAssociationTable: 'range association table', + remark: 'remark', + creationTime: 'creation time', + createPersonnel: 'create personnel', + updateTime: 'update time', + updatePersonnel: 'update personnel', + operation: 'operation', + lookOver: 'look over', + revamp: 'revamp', + particulars: 'particulars', + tableAliasName: 'table alias name', + cancel: 'cancel', + confirm: 'confirm', + tips: 'tips', + deletedSuccessfully: 'deleted successfully', + DeleteFailed: 'delete failed', + tipsDelete: 'Are you sure you want to delete the selected content?', + FailedAdd: 'Failed to add', + NewSuccess: 'Successfully added', + tipsAdd: 'Are you sure you want to add it?', + failModify: 'fail to modify', + modifySuccessfully: 'modify successfully', + tipsUp: 'Are you sure to save the changes?', }, styleManage: 'styleManage', }, @@ -378,45 +378,45 @@ fv9: 'Other', }, orgManage: 'Org Manage', - orgManageObj:{ - companyName:"companyName", - flatType:"flatType", - inquire:"inquire", - delete:"delete", - add:"add", - num:"num", - phone:"phone", - operate:"operate", - edit:"edit", - unitInformation:"unitInformation", - userList:"userList", - username:"username", - ChineseNameUsername:"ChineseName username", - phoneNumberToTeceiveShortMessages:"phoneNumber to teceiveShort messages", - status:"status", - confirm:"confirm", - close:"close", - administrativeDvisionsList:"administrativeDvisions List", - name:"name", - coding:"coding", - codeOfAdministrativeDivision:"code of administrative division", - LevelForExaminationAndApproval:"Level for examination and approval", - seaAreaUseClass:"seaAreaUseClass", - reset:"reset", - immediatelyCreate:"immediatelyCreate", - pinyinInitials:"pinyinInitials", - abbreviation:"abbreviation", - unitCode:"unitCode", - organizationCode:"organizationCode", - companyAdministrator:"companyAdministrator", - picture:"picture", - division:"division", - EMail:"EMail", - fax:"fax", - postalCode:"postalCode", - website:"website", - cmpanyAddress:"cmpanyAddress", - companyIntroduction:"companyIntroduction", + orgManageObj: { + companyName: 'companyName', + flatType: 'flatType', + inquire: 'inquire', + delete: 'delete', + add: 'add', + num: 'num', + phone: 'phone', + operate: 'operate', + edit: 'edit', + unitInformation: 'unitInformation', + userList: 'userList', + username: 'username', + ChineseNameUsername: 'ChineseName username', + phoneNumberToTeceiveShortMessages: 'phoneNumber to teceiveShort messages', + status: 'status', + confirm: 'confirm', + close: 'close', + administrativeDvisionsList: 'administrativeDvisions List', + name: 'name', + coding: 'coding', + codeOfAdministrativeDivision: 'code of administrative division', + LevelForExaminationAndApproval: 'Level for examination and approval', + seaAreaUseClass: 'seaAreaUseClass', + reset: 'reset', + immediatelyCreate: 'immediatelyCreate', + pinyinInitials: 'pinyinInitials', + abbreviation: 'abbreviation', + unitCode: 'unitCode', + organizationCode: 'organizationCode', + companyAdministrator: 'companyAdministrator', + picture: 'picture', + division: 'division', + EMail: 'EMail', + fax: 'fax', + postalCode: 'postalCode', + website: 'website', + cmpanyAddress: 'cmpanyAddress', + companyIntroduction: 'companyIntroduction', }, userAuditing: 'User Auditing', UA: { @@ -442,16 +442,23 @@ }, roleManage: 'Role Manage', RM: { - roleName: 'roleName', - ownedSystem: 'ownedSystem', - add: 'add', - query: 'query', - reset: 'reset', - index: 'index', + roleName: 'RoleName', + ownedSystem: 'Affiliated unit', + add: 'Add', + query: 'Query', + reset: 'Reset', + index: 'Index', Permission: 'Permission', resourcePermission: 'Resource Permission', - groupSetting: 'groupSetting', - one: 'one', + groupSetting: 'GroupSetting', + one: 'One', + describe: 'Describe', + remarks: 'Remarks', + creationtime: 'Creation Time', + creationuser: 'Creation Personne', + updateontime: 'Update Time', + updateonuser: 'Update Personnel', + insertRole: 'Add role information', }, groupManage: 'groupManage', GM: { diff --git a/src/assets/lang/zh.js b/src/assets/lang/zh.js index 1387777..24bb436 100644 --- a/src/assets/lang/zh.js +++ b/src/assets/lang/zh.js @@ -27,40 +27,40 @@ SpatialData: '绌洪棿鏁版嵁绠$悊', versionManage: '鐗堟湰绠$悊', dictionaryManage: '瀛楀吀绠$悊', - dictionaryManageObj:{ - tableName:"琛ㄥ悕绉�", - selectTableName:"閫夋嫨琛ㄥ悕绉�", - add:"鏂板", - del:"鍒犻櫎", - number:"缂栧彿", - fieldName:"瀛楁鍚嶇О", - fieldAliasName:"瀛楁鏄剧ず鍚嶇О", - fieldType:"瀛楁绫诲瀷", - fieldLength:"瀛楁闀垮害", - FieldPrecision:"瀛楁绮惧害", - rangeAssociationTable:"鍊煎煙鍏宠仈琛�", - remark:"澶囨敞", - creationTime:"鍒涘缓鏃堕棿", - createPersonnel:"鍒涘缓浜哄憳", - updateTime:"鏇存柊鏃堕棿", - updatePersonnel:"鏇存柊浜哄憳", - operation:"鎿嶄綔", - lookOver:"鏌ョ湅", - revamp:"淇敼", - particulars:"璇︾粏淇℃伅", - tableAliasName:"琛ㄦ樉绀哄悕绉�", - cancel:"鍙� 娑�", - confirm:"纭� 瀹�", - tips:"鎻愮ず", - deletedSuccessfully:"鍒犻櫎鎴愬姛!", - DeleteFailed:"鍒楄〃鍒犻櫎澶辫触", - tipsDelete:"纭畾鏄惁鍒犻櫎鎵�閫夊唴瀹�?", - NewSuccess:"鏂板鎴愬姛", - FailedAdd:"鏂板澶辫触", - tipsAdd:"鏄惁纭畾娣诲姞?", - failModify:"淇敼澶辫触", - modifySuccessfully:"淇敼鎴愬姛", - tipsUp:"鏄惁纭畾淇濆瓨淇敼鍐呭?", + dictionaryManageObj: { + tableName: '琛ㄥ悕绉�', + selectTableName: '閫夋嫨琛ㄥ悕绉�', + add: '鏂板', + del: '鍒犻櫎', + number: '缂栧彿', + fieldName: '瀛楁鍚嶇О', + fieldAliasName: '瀛楁鏄剧ず鍚嶇О', + fieldType: '瀛楁绫诲瀷', + fieldLength: '瀛楁闀垮害', + FieldPrecision: '瀛楁绮惧害', + rangeAssociationTable: '鍊煎煙鍏宠仈琛�', + remark: '澶囨敞', + creationTime: '鍒涘缓鏃堕棿', + createPersonnel: '鍒涘缓浜哄憳', + updateTime: '鏇存柊鏃堕棿', + updatePersonnel: '鏇存柊浜哄憳', + operation: '鎿嶄綔', + lookOver: '鏌ョ湅', + revamp: '淇敼', + particulars: '璇︾粏淇℃伅', + tableAliasName: '琛ㄦ樉绀哄悕绉�', + cancel: '鍙� 娑�', + confirm: '纭� 瀹�', + tips: '鎻愮ず', + deletedSuccessfully: '鍒犻櫎鎴愬姛!', + DeleteFailed: '鍒楄〃鍒犻櫎澶辫触', + tipsDelete: '纭畾鏄惁鍒犻櫎鎵�閫夊唴瀹�?', + NewSuccess: '鏂板鎴愬姛', + FailedAdd: '鏂板澶辫触', + tipsAdd: '鏄惁纭畾娣诲姞?', + failModify: '淇敼澶辫触', + modifySuccessfully: '淇敼鎴愬姛', + tipsUp: '鏄惁纭畾淇濆瓨淇敼鍐呭?', }, styleManage: '鏍峰紡绠$悊', }, @@ -377,45 +377,45 @@ fv9: '鍏朵粬', }, orgManage: '缁勭粐鏈烘瀯绠$悊', - orgManageObj:{ - companyName:"鍗曚綅鍚嶇О", - flatType:"鍗曚綅绫诲瀷", - inquire:"鏌ヨ", - delete:"娓呴櫎", - add:"鏂板", - num:"搴忓彿", - phone:"鑱旂郴鐢佃瘽", - operate:"鎿嶄綔", - edit:"缂栬緫", - unitInformation:"鍗曚綅淇℃伅", - userList:"鐢ㄦ埛-鍒楄〃", - username:"鐢ㄦ埛鍚嶇О", - ChineseNameUsername:"涓枃鍚嶃�愮敤鎴峰悕銆�", - phoneNumberToTeceiveShortMessages:"鎵嬫満鍙枫�愭帴鏀剁煭淇°��", - status:"鐘舵��", - confirm:"纭畾", - close:"鍏抽棴", - administrativeDvisionsList:"琛屾斂鍖哄垝-鍒楄〃", - name:"鍖哄煙鍚嶇О", - coding:"缂栫爜", - codeOfAdministrativeDivision:"琛屾斂鍖哄垝浠g爜", - LevelForExaminationAndApproval:"瀹℃壒绾у埆", - seaAreaUseClass:"娴峰煙浣跨敤绛夌骇", - reset:"閲嶇疆", - immediatelyCreate:"绔嬪嵆鍒涘缓", - pinyinInitials:"鎷奸煶棣栧瓧姣�", - abbreviation:"鍗曚綅绠�绉�", - unitCode:"鍗曚綅缂栫爜", - organizationCode:"鍗曚綅缁勭粐鏈烘瀯浠g爜", - companyAdministrator:"鍗曚綅绠$悊鍛�", - picture:"鍥剧墖", - division:"鎵�灞炲尯鍒�", - EMail:"E-Mail鍦板潃", - fax:"浼犵湡", - postalCode:"閭斂缂栫爜", - website:"缃戝潃", - cmpanyAddress:"鍗曚綅鍦板潃", - companyIntroduction:"鍗曚綅浠嬬粛", + orgManageObj: { + companyName: '鍗曚綅鍚嶇О', + flatType: '鍗曚綅绫诲瀷', + inquire: '鏌ヨ', + delete: '娓呴櫎', + add: '鏂板', + num: '搴忓彿', + phone: '鑱旂郴鐢佃瘽', + operate: '鎿嶄綔', + edit: '缂栬緫', + unitInformation: '鍗曚綅淇℃伅', + userList: '鐢ㄦ埛-鍒楄〃', + username: '鐢ㄦ埛鍚嶇О', + ChineseNameUsername: '涓枃鍚嶃�愮敤鎴峰悕銆�', + phoneNumberToTeceiveShortMessages: '鎵嬫満鍙枫�愭帴鏀剁煭淇°��', + status: '鐘舵��', + confirm: '纭畾', + close: '鍏抽棴', + administrativeDvisionsList: '琛屾斂鍖哄垝-鍒楄〃', + name: '鍖哄煙鍚嶇О', + coding: '缂栫爜', + codeOfAdministrativeDivision: '琛屾斂鍖哄垝浠g爜', + LevelForExaminationAndApproval: '瀹℃壒绾у埆', + seaAreaUseClass: '娴峰煙浣跨敤绛夌骇', + reset: '閲嶇疆', + immediatelyCreate: '绔嬪嵆鍒涘缓', + pinyinInitials: '鎷奸煶棣栧瓧姣�', + abbreviation: '鍗曚綅绠�绉�', + unitCode: '鍗曚綅缂栫爜', + organizationCode: '鍗曚綅缁勭粐鏈烘瀯浠g爜', + companyAdministrator: '鍗曚綅绠$悊鍛�', + picture: '鍥剧墖', + division: '鎵�灞炲尯鍒�', + EMail: 'E-Mail鍦板潃', + fax: '浼犵湡', + postalCode: '閭斂缂栫爜', + website: '缃戝潃', + cmpanyAddress: '鍗曚綅鍦板潃', + companyIntroduction: '鍗曚綅浠嬬粛', }, userAuditing: '鐢ㄦ埛瀹℃牳', UA: { @@ -443,7 +443,7 @@ roleManage: '瑙掕壊绠$悊', RM: { roleName: '瑙掕壊鍚嶇О', - ownedSystem: '鎵�灞炵郴缁�', + ownedSystem: '鎵�灞炲崟浣�', add: '鏂板', query: '鏌ヨ', reset: '娓呴櫎', @@ -453,6 +453,13 @@ groupSetting: '缇ょ粍璁剧疆', operate: '鎿嶄綔', one: '涓�寮犲浘', + describe: '鎻忚堪', + remarks: '澶囨敞', + creationtime: '鍒涘缓鏃堕棿', + creationuser: '鍒涘缓浜哄憳', + updateontime: '淇敼鏃堕棿', + updateonuser: '淇敼浜哄憳', + insertRole: '娣诲姞瑙掕壊淇℃伅', }, groupManage: '缇ょ粍绠$悊', GM: { diff --git a/src/views/userManage/roleDepTree.vue b/src/views/userManage/roleDepTree.vue new file mode 100644 index 0000000..5bc0272 --- /dev/null +++ b/src/views/userManage/roleDepTree.vue @@ -0,0 +1,351 @@ +<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('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; + } 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(); + }, + 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/userManage/roleManage.vue b/src/views/userManage/roleManage.vue index 2cff3e6..7d0137e 100644 --- a/src/views/userManage/roleManage.vue +++ b/src/views/userManage/roleManage.vue @@ -16,29 +16,34 @@ :label="$t('userManage.RM.ownedSystem')" prop="ownedSystem" > - <el-select v-model="roleForm.ownedSystem"> - <el-option :label="$t('userManage.RM.one')" value="one" /> - </el-select> + <el-input + v-model="roleForm.value" + :disabled="true" + :placeholder="$t('common.pleaseInput')" + /> + <el-button style="margin-left: 20px" @click="showDepTree(1)">{{ + $t('common.choose') + }}</el-button> </el-form-item> <br /> <el-form-item> - <el-button + <el-button @click="InsertFormdialog = true" ><i class="el-icon-circle-plus-outline"></i> {{ - $t("userManage.RM.add") + $t('userManage.RM.add') }}</el-button > </el-form-item> <el-form-item> <el-button ><i class="el-icon-search"></i> {{ - $t("userManage.RM.query") + $t('userManage.RM.query') }}</el-button > </el-form-item> <el-form-item> <el-button @click="resetForm('ruleForm')" ><i class="el-icon-delete"></i> {{ - $t("userManage.RM.reset") + $t('userManage.RM.reset') }}</el-button > </el-form-item> @@ -52,100 +57,396 @@ :label="$t('userManage.RM.index')" width="70px" /> + <el-table-column align="center" prop="id" v-if="false" /> <el-table-column align="center" - prop="roleName" + prop="name" :label="$t('userManage.RM.roleName')" /> <el-table-column align="center" - prop="ownedSystem" + prop="depid" :label="$t('userManage.RM.ownedSystem')" /> <el-table-column align="center" - prop="Permission" - :label="$t('userManage.RM.Permission')" + prop="descr" + :label="$t('userManage.RM.describe')" + /> + + <el-table-column + align="center" + prop="createUser" + :label="$t('userManage.RM.creationuser')" /> <el-table-column align="center" - prop="resourcePermission" - :label="$t('userManage.RM.resourcePermission')" + prop="createTime" + :label="$t('userManage.RM.creationtime')" /> <el-table-column align="center" - prop="roleSetting" - :label="$t('userManage.RM.groupSetting')" + prop="UpdateUser" + :label="$t('userManage.RM.updateonuser')" + /> + <el-table-column + align="center" + prop="updateTime" + :label="$t('userManage.RM.updateontime')" + /> + <el-table-column + align="center" + prop="bak" + :label="$t('userManage.RM.remarks')" /> <el-table-column fixed="right" :label="$t('common.operate')" - width="300" + width="200" > - <template #default> - <el-button type="warning" size="small">{{ - $t("common.update") - }}</el-button> - <el-button type="danger" size="small">{{ - $t("common.delete") - }}</el-button> + <template slot-scope="scope"> + <el-button + type="warning" + @click="handleEdit(scope.$index, scope.row)" + size="small" + >{{ $t('common.update') }}</el-button + > + <el-button + type="danger" + @click="handleDelete(scope.$index, scope.row)" + size="small" + >{{ $t('common.delete') }}</el-button + > </template> </el-table-column> </el-table> - <div style="margin-top: 40px" class="pagination_box"> + <div style="margin-top: 25px" class="pagination_box"> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" - :current-page="currentPage" + :current-page="listData.pageIndex" :page-sizes="[10, 20, 30, 40]" - :page-size="10" + :page-size="listData.pageSize" layout="total, sizes, prev, pager, next, jumper" - :total="0" + :total="count" > </el-pagination> </div> </div> + <el-dialog + :title="$t('userManage.RM.insertRole')" + top="15vh" + width="80vh" + style="overflow: hidden" + :visible.sync="InsertFormdialog" + > + <el-form :model="insertform"> + <el-form-item + :label="$t('userManage.RM.roleName')" + :label-width="formLabelWidth" + > + <el-input v-model="insertform.name" autocomplete="off"></el-input> + </el-form-item> + <el-form-item + :label="$t('userManage.RM.ownedSystem')" + :label-width="formLabelWidth" + :prop="insertform.depValue" + :rules="[{ required: true, message: '涓嶈兘涓虹┖' }]" + > + <el-input + v-model="insertform.depValue" + :disabled="true" + :placeholder="$t('common.pleaseInput')" + /> + <el-button style="margin-left: 20px" @click="showDepTree(2)">{{ + $t('common.choose') + }}</el-button> + </el-form-item> + <el-form-item + :label="$t('userManage.RM.describe')" + :label-width="formLabelWidth" + > + <el-input v-model="insertform.descr" autocomplete="off"></el-input> + </el-form-item> + <el-form-item + :label="$t('userManage.RM.remarks')" + :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="insertFromClose">{{ $t('common.close') }}</el-button> + <el-button type="primary" @click="insertFromData">{{ + $t('common.confirm') + }}</el-button> + </div> + </el-dialog> + <el-dialog + :title="$t('userManage.RM.insertRole')" + top="15vh" + width="80vh" + style="overflow: hidden" + :visible.sync="UpdateFormdialog" + > + <el-form :model="updateform"> + <el-form-item + :label="$t('userManage.RM.roleName')" + :label-width="formLabelWidth" + > + <el-input v-model="updateform.name" autocomplete="off"></el-input> + </el-form-item> + + <el-form-item + :label="$t('userManage.RM.ownedSystem')" + :label-width="formLabelWidth" + :prop="updateform.depValue" + > + <el-input + v-model="updateform.depValue" + :disabled="true" + :placeholder="$t('common.pleaseInput')" + /> + <el-button style="margin-left: 20px" @click="showDepTree(3)">{{ + $t('common.choose') + }}</el-button> + </el-form-item> + <el-form-item + :label="$t('userManage.RM.describe')" + :label-width="formLabelWidth" + > + <el-input v-model="updateform.descr" autocomplete="off"></el-input> + </el-form-item> + <el-form-item + :label="$t('userManage.RM.remarks')" + :label-width="formLabelWidth" + > + <el-input v-model="updateform.bak" autocomplete="off"></el-input> + </el-form-item> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button @click="updateFromClose">{{ $t('common.close') }}</el-button> + <el-button type="primary" @click="updateFromData">{{ + $t('common.confirm') + }}</el-button> + </div> + </el-dialog> + <div class="leftTree" v-if="showCata"> + <div class="treeBox"> + <role-dep-tree></role-dep-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 + > + </div> + </div> </div> </template> - - <script> -import MyBread from "../../components/MyBread.vue"; +<script> +import MyBread from '../../components/MyBread.vue'; +import roleDepTree from './roleDepTree.vue'; +import { + select_Role_ByPageAndCount, + selectdepTab, + insertRole, + deleteRole, + selectDep, + updateRole, +} from '../../api/api'; export default { //import寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢� components: { MyBread, + roleDepTree, }, - data() { return { - currentPage: 1, - roleForm: { - groupName: "", - ownedSystem: "", - }, + showCata: false, + formLabelWidth: '120px', + InsertFormdialog: false, + UpdateFormdialog: false, + roleForm: {}, + cataName: '', + depValue: '', + elTreeFlag: 0, + path_id: '', tableData: [], + insertform: {}, + updateform: {}, + count: 0, + selData: [], + listData: { + pageIndex: 1, + pageSize: 10, + }, }; }, methods: { + showDepTree(res) { + this.showCata = true; + this.elTreeFlag = res; + }, + selectCataName() { + this.cataName = this.$store.state.catalogueName; + this.path_id = this.$store.state.cataNode.id; + var value; + if (this.cataName.indexOf('>') != -1) { + var data = this.$store.state.catalogueName.split('>'); + value = data[data.length - 1]; + } else { + value = this.$store.state.catalogueName; + } + this.$store.commit('changeCata', ''); //娓呯┖state鐨勯潰鍖呭睉 + this.$store.commit('changeNode', ''); //娓呯┖state鐨勮妭鐐瑰璞� + this.showCata = false; + switch (this.elTreeFlag) { + case 1: + this.roleForm.value = value; + + break; + case 2: + this.insertform.depid = this.path_id; + this.insertform.depValue = value; + break; + case 3: + this.updateform.depid = this.path_id; + this.updateform.depValue = value; + break; + } + }, + async getRoleTabelData() { + if (this.listData.tab == '') { + delete this.listData.tab; + } + const data = await select_Role_ByPageAndCount(this.listData); + if (data.code != 200) { + this.$message.error('鍒楄〃璋冪敤澶辫触'); + } + this.tableData = data.result; + this.count = data.count; + }, + async getSelectDepTab() { + this.selectData = []; + const data = await selectdepTab(); + if (data.code != 200) { + this.$message.error('涓嬫媺璋冪敤澶辫触'); + } + data.result.forEach((e) => { + if (e) { + this.selData.push({ + label: e.name, + value: e.id, + }); + } + }); + }, + insertFromClose() { + this.InsertFormdialog = false; + this.insertform = {}; + }, + async insertFromData() { + if (this.insertform.depValue == null) { + this.$message({ + message: '璇烽�夋嫨瑙掕壊鎵�灞炲崟浣�', + type: 'warning', + }); + return; + } + const data = await insertRole(this.insertform); + if (data.code == 200) { + this.InsertFormdialog = false; + this.insertform = {}; + this.$message({ + message: '娣诲姞鎴愬姛锛�', + type: 'success', + }); + this.getRoleTabelData(); + } else { + this.$message({ + message: '娣诲姞澶辫触锛�', + type: 'warning', + }); + } + }, + updateFromClose() { + this.UpdateFormdialog = false; + this.updateform = {}; + }, + async updateFromData() { + if (this.updateform.depValue == null) { + this.$message({ + message: '璇烽�夋嫨瑙掕壊鎵�灞炲崟浣�', + type: 'warning', + }); + return; + } + const data = await updateRole(this.updateform); + if (data.code == 200) { + this.UpdateFormdialog = false; + this.updateform = {}; + this.$message({ + message: '淇敼鎴愬姛锛�', + type: 'success', + }); + this.getRoleTabelData(); + } else { + this.$message({ + message: '淇敼澶辫触锛�', + type: 'warning', + }); + } + }, + async handleDelete(index, row) { + const data = await deleteRole({ id: row.id.toString() }); + if (data.code == 200) { + this.InsertFormdialog = false; + this.$message({ + message: '鍒犻櫎鎴愬姛锛�', + type: 'success', + }); + this.getRoleTabelData(); + } else { + this.$message({ + message: '鍒犻櫎澶辫触锛�', + type: 'warning', + }); + } + }, handleSizeChange(val) { - console.log(`姣忛〉 ${val} 鏉); + this.listData.pageSize = val; + this.getRoleTabelData(); }, handleCurrentChange(val) { console.log(`褰撳墠椤�: ${val}`); + this.listData.pageIndex = val; + this.getRoleTabelData(); + }, + async handleEdit(index, row) { + this.updateform = row; + const data = await selectDep({ id: row.depid }); + this.updateform.depValue = data.result.name; + this.UpdateFormdialog = true; }, onSubmit() { - console.log("submit!"); + console.log('submit!'); }, resetForm(formName) { this.$refs[formName].resetFields(); }, }, - created() {}, + created() { + this.getRoleTabelData(); + this.getSelectDepTab(); + }, }; </script> - <style lang="less" scoped> +<style lang="less" scoped> //@import url(); 寮曞叆鍏叡css绫� .logLog_box { background: rgb(240, 242, 245); @@ -156,21 +457,43 @@ .el-input { width: 300px; } + .leftTree { + position: absolute; + z-index: 9999; + top: 9%; + left: 37%; + width: 400px; + height: 600px; + background: #f0f2f5; + border: 1px solid #000; + .treeBox { + height: 550px; + overflow: auto; + /deep/ .el-tree-node__content:hover { + background-color: rgb(153, 153, 153); + } + } + .btnBox { + width: 123px; + margin: 10px auto 0; + // background-color: red; + } + } .inquire { - height: 110px; + height: 115px; overflow: auto; padding: 10px; margin-top: 20px; background: #fff; border-radius: 5px; border: 1px solid rgb(202, 201, 204); - margin-bottom: 20px; + margin-bottom: 10px; .el-form-item { margin: 7px; } } .table_box { - height: 65%; + height: 70%; padding: 10px; background: #fff; border-radius: 5px; @@ -181,4 +504,3 @@ } } </style> - \ No newline at end of file -- Gitblit v1.9.3