新建、编辑操作项选择节点

src/views/permission/operation-list/operation-table.vue

@@ -36,7 +36,7 @@
     <el-dialog :visible.sync="editOperation.show" :title="editOperation.operationItemId ? '编辑操作项' : '新建操作项'" width="590px" @closed="onEditOperationClose">
       <el-form :model="editOperation" :rules="editOperationRule" ref="editOperation" label-width="110px">
         <el-form-item label="节点" prop="menuId">
-          <el-select v-model="editOperation.menuId" style="width: 440px"></el-select>
+           <el-cascader v-model="editOperation.menuId" :options="menuList" :props="{ checkStrictly: true, label: 'menuName', value: 'menuId' }" style="width: 440px" clearable></el-cascader>
         </el-form-item>
         <el-form-item label="节点code">
           <el-input :value="editOperation.menuCode" style="width:440px" disabled></el-input>
@@ -102,6 +102,10 @@ export default {
   },
   data() {
     return {
+      // 节点列表
+      menuList: [],
+      // 平铺的节点列表
+      flatMenuList: [],
       search: '',
       // 分页相关的数据
       pager: {
@@ -117,7 +121,7 @@ export default {
         show: false,
         loading: false,
         operationItemId: '',
-        menuId: '',
+        menuId: [],
         menuCode: '',
         operationItemName: '',
         operationItemCode: '',
@@ -178,7 +182,7 @@ export default {
       Object.assign(this.editOperation, {
         show: true,
         operationItemId,
-        menuId,
+        menuId: getFullId(this.flatMenuList, menuId),
         menuCode,
         operationItemName,
         operationItemCode,
@@ -187,6 +191,16 @@ export default {
         roleRange: typeof roleRange == 'undefined' ? '1' : roleRange,
         version
       });
+      function getFullId(menuList, menuId) {
+        let result = [ menuId ];
+        menuList.some(el => {
+          if (el.menuId == menuId && el.parentId > 0) {
+            result = getFullId(menuList, el.parentId).concat(result);
+          }
+          return el.menuId == menuId
+        })
+        return result;
+      }
     },
     // 新建、编辑操作项 弹窗关闭
     onEditOperationClose() {
@@ -209,7 +223,16 @@ export default {
       this.$refs.editOperation.validate(vali => {
         if (!vali) return;
         const { operationItemId, menuId, menuCode, operationItemName, operationItemCode, operationItemUrl, authItemFlag, roleRange, version, appType } = this.editOperation;
-        const params = { menuId, menuCode, operationItemName, operationItemCode, operationItemUrl, authItemFlag, roleRange, version }
+        const params = {
+          menuId: Array.isArray(menuId) && menuId.length > 0 ? menuId[menuId.length - 1] : '',
+          menuCode,
+          operationItemName,
+          operationItemCode,
+          operationItemUrl,
+          authItemFlag,
+          roleRange,
+          version
+        }
 
         this.editOperation.loading = true;
         if (operationItemId) {