From 83299c220d043e3f9d0bd0ff516c54c5b8977633 Mon Sep 17 00:00:00 2001 From: wangfei <3597712270@qq.com> Date: 星期二, 09 七月 2024 14:23:29 +0800 Subject: [PATCH] 调整用户管理、权限管理、角色管理页面关闭方式,调整角色管理级联选择则器回显,大理片笼小车位置,获取接口 --- UI-Project/src/views/User/rolelist.vue | 166 ++++++++++++++++++++++--------------------------------- 1 files changed, 66 insertions(+), 100 deletions(-) diff --git a/UI-Project/src/views/User/rolelist.vue b/UI-Project/src/views/User/rolelist.vue index df11be3..78dfa0f 100644 --- a/UI-Project/src/views/User/rolelist.vue +++ b/UI-Project/src/views/User/rolelist.vue @@ -99,113 +99,69 @@ console.error(error); } }; - -// function buildCascaderOptions(menuList) { -// // 鍒涘缓涓�涓槧灏勬潵蹇�熸煡鎵剧埗椤� -// const parentIdMap = {}; -// // 鍒濆鍖栨渶缁堢殑绾ц仈閫夐」鏁扮粍 -// const options = []; -// // 閬嶅巻鎵�鏈夎彍鍗曢」锛屽皢瀹冧滑娣诲姞鍒版槧灏勪腑锛屽苟鏋勫缓椤剁骇鑿滃崟椤� -// menuList.forEach(item => { -// // 濡傛灉parentId涓�0锛屽垯涓洪《绾ц彍鍗曢」 -// if (item.parentId === 0) { -// // 鍒濆鍖朿hildren鏁扮粍 -// item.children = []; -// // 娣诲姞鍒版渶缁堢殑閫夐」涓� -// options.push({ -// value: item.id, -// label: item.menuName, -// children: item.children -// }); -// // 灏嗛《绾ц彍鍗曢」娣诲姞鍒版槧灏勪腑锛堣櫧鐒跺湪杩欎釜鐗瑰畾鍦烘櫙涓彲鑳戒笉鏄繀闇�鐨勶紝浣嗗彲浠ョ敤浜庡叾浠栫洰鐨勶級 -// parentIdMap[item.id] = item; -// } else { -// // 濡傛灉parentId涓嶆槸0锛屽垯鏌ユ壘鐖堕」骞舵坊鍔犲埌鍏禼hildren鏁扮粍涓� -// // 娉ㄦ剰锛氳繖閲屽亣璁緋arentIdMap鍦ㄤ箣鍓嶅凡缁忓~鍏呬簡鎵�鏈夐《绾ц彍鍗曢」 -// if (!parentIdMap[item.parentId]) { -// // 濡傛灉鐖堕」涓嶅瓨鍦紝鍒欏彲鑳芥槸鏁版嵁涓嶅畬鏁存垨閿欒锛岄渶瑕佸鐞嗚繖绉嶆儏鍐� -// console.error(`Parent item with ID ${item.parentId} not found for child item with ID ${item.id}`); -// } else { -// parentIdMap[item.parentId].children.push({ -// value: item.id, -// label: item.menuName -// // 杩欓噷涓嶉渶瑕佸祵濂楃殑children锛岄櫎闈炰綘鐨勮彍鍗曟湁澶氫簬涓ょ骇鐨勭粨鏋� -// }); -// } -// } -// }); -// return options; -// } function handleEdit(row) { name.value = row.name; + adda.value = true; + window.localStorage.setItem('ids', row.id); const parentIdMap = {}; - const menuItems = row.menuList.map(item => { - let parentId = item.parentId || null; // 鎴栬�呬娇鐢� 0锛屽鏋滀綘鐨勭郴缁熸槸杩欐牱璁捐鐨� + const menuItemsById = {}; // 蹇�熸煡鎵捐彍鍗曢」 + let topLevelItems = []; // 瀛樺偍椤剁骇鑿滃崟椤� + row.menuList.forEach(item => { + const parentId = item.parentId === 0 ? null : item.parentId; + const menuItem = { + id: item.id, + parentId: parentId, + menuName: item.menuName, + children: [] + }; + menuItemsById[item.id] = menuItem; + // 鍒濆鍖栨垨鏇存柊parentIdMap涓殑鏁扮粍 if (!parentIdMap[parentId]) { parentIdMap[parentId] = []; } - parentIdMap[parentId].push({ - id: item.id, - menuName: item.menuName, - children: [] // 鍒濆涓虹┖锛岀◢鍚庝細濉厖瀛愰」 - }); - return { id: item.id, menuName: item.menuName, parentId: parentId }; - }); - - // 鐜板湪锛屾垜浠亶鍘嗘墍鏈夐」锛屽苟灏嗗畠浠垎閰嶇粰瀹冧滑鐨勭埗椤癸紙濡傛灉鏈夌殑璇濓級 - menuItems.forEach(item => { - if (item.parentId !== null && parentIdMap[item.parentId]) { - // 灏嗗綋鍓嶉」娣诲姞鍒板叾鐖堕」鐨� children 鏁扮粍涓� - parentIdMap[item.parentId].push({ - ...item, // 澶嶅埗闄や簡 parentId 涔嬪鐨勬墍鏈夊睘鎬� - children: [] // 杩欓噷鎴戜滑涓嶉渶瑕佸啀娆℃坊鍔� children锛屽洜涓哄畠宸茬粡鍦� parentIdMap 涓鍒濆鍖栦簡 - }); - // 娉ㄦ剰锛氳繖閲屽疄闄呬笂鏄竴涓敊璇紝鍥犱负鎴戜滑涓嶅簲璇ュ悜 parentIdMap[item.parentId] 鏁扮粍涓坊鍔犳暣涓」锛� - // 鑰屽簲璇ュ彧鏇存柊瀹冪殑 children 鏁扮粍銆備絾涓婇潰鐨勪唬鐮佺ず渚嬩簡濡備綍璁块棶鐖堕」銆� - // 姝g‘鐨勫仛娉曟槸鍦ㄦ瀯寤� parentIdMap 鏃跺氨璁剧疆濂� children 鏁扮粍锛屽苟鍦ㄥ悗闈笉鍐嶄慨鏀� parentIdMap[item.parentId] 鏁扮粍銆� + if (parentId === null) { + // 椤剁骇鑿滃崟椤圭洿鎺ユ坊鍔犲埌topLevelItems + topLevelItems.push(menuItem); + } else { + // 闈為《绾ц彍鍗曢」娣诲姞鍒皃arentIdMap涓� + parentIdMap[parentId].push(menuItem); } - // 娉ㄦ剰锛氫笂闈㈢殑浠g爜閫昏緫鏈夎锛屽洜涓烘垜浠湪鏋勫缓 parentIdMap 鏃跺凡缁忎负姣忎釜椤硅缃簡 children 鏁扮粍銆� - // 鎴戜滑搴旇鐩存帴淇敼杩欎簺 children 鏁扮粍锛岃�屼笉鏄悜 parentIdMap[item.parentId] 鏁扮粍娣诲姞鏂伴」銆� }); - - // 浣嗘槸锛岀敱浜庢垜浠湪鏋勫缓 parentIdMap 鏃跺凡缁忎负姣忎釜椤癸紙鍖呮嫭鍏剁埗椤癸級璁剧疆浜� children 鏁扮粍锛� - // 鎴戜滑瀹為檯涓婁笉闇�瑕佷笂闈㈢殑寰幆鏉ラ噸鏂板垎閰嶅瓙椤广�� - // 鎴戜滑鍙渶瑕佹壘鍒伴《绾ч」锛坧arentId 涓� null 鎴� 0 鐨勯」锛夛紝骞跺皢瀹冧滑璁剧疆涓� selectedOptions.value - - // 鍋囪椤剁骇椤圭殑 parentId 涓� null锛堟垨 0锛屾牴鎹綘鐨勭郴缁燂級 - const topLevelItems = parentIdMap[null] || parentIdMap[0] || []; - - // selectedOptions.value 搴旇鏄《绾ч」鐨勬暟缁勶紝浣嗛鍏堟垜浠渶瑕佸皢瀹冧滑浠� parentIdMap 鐨勫�间腑鎻愬彇鍑烘潵 - // 鐢变簬鎴戜滑鍦ㄦ瀯寤� parentIdMap 鏃跺凡缁忎负姣忎釜椤剁骇椤硅缃簡 children锛屾墍浠ユ垜浠彲浠ョ洿鎺ヤ娇鐢ㄨ繖浜涢」 - selectedOptions.value = topLevelItems; - - // 娉ㄦ剰锛歴electedOptions.value 鐨勫叿浣撴牸寮忓簲璇ヤ笌浣犵殑绾ц仈閫夋嫨鍣ㄧ粍浠舵墍鏈熸湜鐨勬牸寮忕浉鍖归厤 - // 濡傛灉浣犵殑绾ц仈閫夋嫨鍣ㄧ粍浠舵湡鏈涚殑鏄竴涓寘鍚� value 鍜� label 鐨勬暟缁勬暟缁勶紝浣犲彲鑳借繕闇�瑕佽繘涓�姝ヨ浆鎹� topLevelItems - adda.value = true; // 鏄剧ず瀵硅瘽妗� - -} - -// 娉ㄦ剰锛氫笂闈㈢殑浠g爜鍙兘浠嶇劧闇�瑕佹牴鎹綘鐨勫叿浣撴暟鎹粨鏋勮繘琛岃皟鏁� -// 鐗瑰埆鏄叧浜� parentId 鐨勫鐞嗭紝浠ュ強濡備綍灏嗚彍鍗曢」姝g‘鍦板垎閰嶇粰瀹冧滑鐨勭埗椤� -// 澶勭悊缂栬緫鎸夐挳鐐瑰嚮 -// function handleEdit(row) { -// name.value = row.name; -// let cascaderOptions = buildCascaderOptions(row.menuList); -// selectedOptions.value = cascaderOptions; // 鍋囪selectedOptions鏄痸-model缁戝畾鐨勭骇鑱旈�夋嫨鍣ㄧ殑鍊� -// console.log(cascaderOptions); // 鏌ョ湅鏋勫缓鍚庣殑绾ц仈閫夐」 -// // let transformedMenuList = row.menuList.map(item => ({ -// // id: item.id, // 鍋囪姣忎釜椤归兘鏈変竴涓猧d浣滀负鍞竴鏍囪瘑 -// // menuName: item.menuName, // 鏄剧ず缁欑敤鎴风殑鏂囨湰 -// // // children: item.children ? item.children.map(child => ({ value: child.id, label: child.name })) : [] -// // })); -// // selectedOptions.value = transformedMenuList -// console.log(transformedMenuList); -// adda.value = true; // 鏄剧ず瀵硅瘽妗� -// window.localStorage.setItem('id', row.id) -// } + for (const parentId in parentIdMap) { + if (parentId !== 'null') { // 璺宠繃椤剁骇鑿滃崟椤� + parentIdMap[parentId].forEach(child => { + // 鏌ユ壘鐖堕」骞舵坊鍔犲瓙椤� + if (menuItemsById[parentId]) { + menuItemsById[parentId].children.push(child); + } + }); + } + } + if (selectedOptions.value !== topLevelItems) { + selectedOptions.value = topLevelItems; + } + console.log(topLevelItems); + // selectedOptions.value = topLevelItems; +const topLevelItemsWithChildren = topLevelItems; // 鍖呭惈椤剁骇鑿滃崟椤瑰強鍏跺瓙鑿滃崟椤圭殑鏁扮粍 聽 + let selectedPath = []; +// 寰幆閬嶅巻 topLevelItemsWithChildren 鏁扮粍 +for (let i = 0; i < topLevelItemsWithChildren.length; i++) { + // 娣诲姞椤剁骇鑿滃崟椤圭殑 id + selectedPath.push(topLevelItemsWithChildren[i].id); + // 濡傛灉鏈夊瓙鑿滃崟椤癸紝娣诲姞绗竴涓瓙鑿滃崟椤圭殑 id + if (topLevelItemsWithChildren[i].children && topLevelItemsWithChildren[i].children.length > 0) { + for (let j = 0; j < topLevelItemsWithChildren[i].children.length; j++) { + // 灏嗘瘡涓瓙鑿滃崟椤圭殑 id 娣诲姞鍒� selectedPath 涓� + selectedPath.push(topLevelItemsWithChildren[i].children[j].id); + } + } +} + console.log(selectedPath); +selectedOptions.value = selectedPath; +} // 缂栬緫 const getTableRowa = async () => { - let id = window.localStorage.getItem('id') + let ids = window.localStorage.getItem('ids') try { let menuList = []; let parentIdMap = {}; // 鐢ㄤ簬瀛樺偍宸茬粡娣诲姞鐨勭埗椤� @@ -233,7 +189,7 @@ } }); const dataToSend = { - id:id, + id:ids, name: name.value, menuList: menuList }; @@ -251,6 +207,16 @@ console.error(error); } }; +function closeDialog(row) { + add.value = false; + name.value = ''; + selectedOptions.value = ''; +} +function closeDialoga(row) { + adda.value = false; + name.value = ''; + selectedOptions.value = ''; +} // 鍒犻櫎 const opena = async(row) => { try { @@ -346,7 +312,7 @@ <el-button type="primary" @click="getTableRow"> {{ $t('delivery.sure') }} </el-button> - <el-button @click="add = false"> {{ $t('delivery.cancel') }}</el-button> + <el-button @click="closeDialog"> {{ $t('delivery.cancel') }}</el-button> </div> </template> </el-dialog> @@ -386,7 +352,7 @@ <el-button type="primary" @click="getTableRowa"> {{ $t('delivery.sure') }} </el-button> - <el-button @click="adda = false">{{ $t('delivery.cancel') }}</el-button> + <el-button @click="closeDialoga">{{ $t('delivery.cancel') }}</el-button> </div> </template> </el-dialog> -- Gitblit v1.8.0