页面修改

src/components/system/menufunction-form.vue

@@ -39,6 +39,10 @@
       saveObj: {
         type: Object,
         default: null
+      },
+      paramObj:{
+          type:Number,
+          default:0
       }
     },
     data() {
@@ -46,7 +50,7 @@
         persistent: true,
         objOption: {
           Id: 0, //主键编号
-          Menu_Id: 0, //菜单编号
+          MenuId: 0, //菜单编号
           FunctionName: "", //权限名称
           FunctionCode: "", //权限编号
           Remarks: "", //权限备注
@@ -67,7 +71,7 @@
             Id: this.saveObj.Id
           }).then(res => {
             this.objOption.Id = res.Data.Id;
-            this.objOption.Menu_Id = res.Data.Menu_Id;
+            this.objOption.MenuId = res.Data.MenuId;
             this.objOption.FunctionName = res.Data.FunctionName;
             this.objOption.FunctionCode = res.Data.FunctionCode;
             this.objOption.Remarks = res.Data.Remarks;
@@ -77,7 +81,7 @@
         } else {
           this.optionTitle = "新增菜单功能权限"
           this.objOption.Id = 0;
-          this.objOption.Menu_Id = 0;
+          this.objOption.MenuId = this.paramObj;
           this.objOption.FunctionName = "";
           this.objOption.FunctionCode = "";
           this.objOption.Remarks = "";

src/components/system/role-form.vue

@@ -17,10 +17,12 @@
     font-size: 12px;
     white-space: nowrap;
   }
-  .role-form .role_TreeList{
-    height:250px;
+
+  .role-form .role_TreeList {
+    height: 250px;
     overflow: auto;
   }
+
   .role-form .role_TreeList::-webkit-scrollbar {
     width: 3px;
     height: 3px;
@@ -65,6 +67,7 @@
     border-radius: 4px;
     overflow: auto;
   }
+
   .role-form .role_ItemList::-webkit-scrollbar {
     width: 3px;
     height: 6px;
@@ -111,7 +114,7 @@
     width: 100%;
     height: 40px;
     background-color: #3fc4ff;
-    padding:0 10px 0 20px;
+    padding: 0 10px 0 20px;
     display: flex;
     align-items: center;
     color: #fff;
@@ -122,11 +125,13 @@
     margin: 20px 0;
     white-space: nowrap;
     overflow: auto;
-    padding-bottom:20px;
+    padding-bottom: 20px;
   }
-  .role-form .role_textarea .q-field__control-container{
-    height:85px;
+
+  .role-form .role_textarea .q-field__control-container {
+    height: 85px;
   }
+
 </style>
 <template>
   <q-dialog v-model="persistent" content-class="bg-grey-1" persistent transition-show="scale" transition-hide="scale">
@@ -143,7 +148,8 @@
         </div>
         </div>
         <div class="row wrap role_textarea">
-          <q-input filled v-model="objOption.RoleIntro" class="col-12 row-2" maxlength="100" label="角色介绍" type="textarea" />
+          <q-input filled v-model="objOption.RoleIntro" class="col-12 row-2" maxlength="100" label="角色介绍"
+            type="textarea" />
           <div class="col-12 q-pr-lg q-pb-lg q-pt-lg">
             <q-toggle size="md" label="状态" color="primary" :false-value="1" :true-value="0" v-model="objOption.Status"
               title="注意：关闭后，角色将无法正常使用." />
@@ -161,39 +167,13 @@
               <q-checkbox v-model="subItem.IsChecked" />
             </div>
             <div class="role_TreeList">
-              <q-tree v-if="subItem.SubList.length>0" :nodes="subItem.SubList" node-key="MenuId"
-                label-key="MenuName" children-key="SubList" tick-strategy="strict" :default-expand-all="true"
-                no-connectors :ticked.sync="chooseCategroyArray">
+              <q-tree v-if="subItem.SubList.length>0" :nodes="subItem.SubList" node-key="MenuId" label-key="MenuName"
+                children-key="SubList" tick-strategy="strict" :default-expand-all="true" no-connectors
+                :ticked.sync="chooseCategroyArray">
               </q-tree>
             </div>
           </div>
         </div>
-        <!-- <q-card>
-          <template v-for="(item,index) in AuthMenuList">
-            <q-checkbox v-model="item.IsChecked" :label="item.MenuName"
-              @input="menuChange(item)" />
-          </template>
-          <div class="row wrap">
-            <template v-if="SubMenuList&&SubMenuList.length>0" v-for="(subItem,subIndex) in SubMenuList">
-              <q-card class="my-card" flat style="width:200px;border:1px solid red;float:left;">
-                <q-card-section>
-                  <div class="text-h6">
-                    <q-checkbox v-model="subItem.IsChecked" :false-value="subItem.IsChecked"
-                      :label="subItem.MenuName" />
-                  </div>
-                  <template v-if="subItem.SubList&&subItem.SubList.length>0"
-                    v-for="(chiildItem,index) in subItem.SubList">
-                    <span style="display:inline-block">
-                      &nbsp;&nbsp;
-                      <q-checkbox v-model="chiildItem.IsChecked" :false-value="chiildItem.IsChecked"
-                        :label="chiildItem.MenuName" />
-                    </span>
-                  </template>
-                </q-card-section>
-              </q-card>
-            </template>
-          </div>
-        </q-card> -->
       </q-card-section>
       <q-separator />
       <q-card-actions align="right" class="bg-white">
@@ -229,7 +209,9 @@
           RoleId: 0, //角色编号
           RoleName: "", //角色名称
           RoleIntro: "", //角色介绍
-          Status: 0, //状态(0-正常,1-禁用)},
+          Status: 0, //状态(0-正常,1-禁用),
+          RolePermissionList: [], //菜单权限
+          RoleFunctionList: [], //功能权限
         },
         returnString: [],
         optionTitle: "",
@@ -238,7 +220,7 @@
         SubMenuList: [], //下级菜单权限
         group: [],
         checkedIndex: 0, //默认选中
-        chooseCategroyArray:[],
+        chooseCategroyArray: [],
       }
     },
     computed: {
@@ -251,26 +233,21 @@
     methods: {
       //菜单切换
       menuChange(item) {
-        console.log(item, 'item111');
         this.SubMenuList = [];
         if (item.IsChecked) {
           this.SubMenuList = item.SubList;
         }
-        console.log(this.SubMenuList, 'submenuList');
       },
       //点击选中
       getItem(item, index) {
-        if(this.checkedIndex != index){
+        if (this.checkedIndex != index) {
           this.checkedIndex = index;
           this.SubMenuList = [];
           this.SubMenuList = item.SubList;
-        }else{
-          this.checkedIndex=-1;
+        } else {
+          this.checkedIndex = -1;
           this.SubMenuList = [];
         }
-        // this.checkedIndex = index;
-        // this.SubMenuList = [];
-        // this.SubMenuList = item.SubList;
       },
       //获取权限
       queryRolePermission() {
@@ -278,11 +255,10 @@
           Role_Id: this.objOption.RoleId
         };
         GetRolePermission(qMsg).then(res => {
-          console.log("res", res.Data)
           if (res.Code == 1) {
             this.AuthMenuList = res.Data;
-            if(this.AuthMenuList.length>0){
-              this.SubMenuList=this.AuthMenuList[0].SubList;
+            if (this.AuthMenuList.length > 0) {
+              this.SubMenuList = this.AuthMenuList[0].SubList;
             }
           }
         }).catch(() => {})
@@ -316,19 +292,61 @@
       },
       //保存菜单
       saveRole() {
-        this.saveLoading = true;
-        var tempArray = [];
+        //this.saveLoading = true;
+        //角色菜单权限
+        var rolePermissionList = [];
+        //角色功能权限
+        var roleFunctionList = [];
         if (this.AuthMenuList && this.AuthMenuList.length > 0) {
           this.AuthMenuList.forEach(item => {
+            //一级菜单权限
             if (item.IsChecked) {
-              tempArray.push({
-
+              rolePermissionList.push({
+                ID: 0,
+                Role_Id: this.objOption.RoleId,
+                Menu_Id: item.MenuId
+              });
+            }
+            //二级菜单权限
+            if (item.SubList && item.SubList.length > 0) {
+              item.SubList.forEach(secondItem => {
+                if (secondItem.IsChecked) {
+                  rolePermissionList.push({
+                    ID: 0,
+                    Role_Id: this.objOption.RoleId,
+                    Menu_Id: secondItem.MenuId
+                  });
+                }
+                //三级菜单权限
+                if (secondItem.SubList && secondItem.SubList.length > 0) {
+                  secondItem.SubList.forEach(thirdItem => {
+                    if (thirdItem.IsChecked) {
+                      rolePermissionList.push({
+                        ID: 0,
+                        Role_Id: this.objOption.RoleId,
+                        Menu_Id: thirdItem.MenuId
+                      });
+                    }
+                    //四级--功能权限
+                    if (thirdItem.SubList && thirdItem.SubList.length > 0) {
+                      thirdItem.SubList.forEach(fourthItem => {
+                        if (fourthItem.IsChecked) {
+                          roleFunctionList.push({
+                            ID: 0,
+                            Role_Id: this.objOption.RoleId,
+                            Action_Id: fourthItem.MenuId
                           });
                         }
                       })
                     }
-        console.log()
-
+                  });
+                }
+              })
+            }
+          })
+        }
+        this.objOption.RolePermissionList = rolePermissionList;
+        this.objOption.RoleFunctionList = roleFunctionList;
         saveRoleInfo(this.objOption).then(res => {
           this.saveLoading = false
           this.$q.notify({

src/pages/system/menufunction.vue

@@ -27,7 +27,7 @@
           </q-td>
         </template>
       </q-table>
-      <menufunction-form v-if="isShowMenuForm" :save-obj="menuObjOption" @close="closeMenuSaveForm" @success="refreshPage">
+      <menufunction-form v-if="isShowMenuForm" :save-obj="menuObjOption" :paramObj="MenuId" @close="closeMenuSaveForm" @success="refreshPage">
       </menufunction-form>
     </div>
   </div>