场站+服务管理功能开发，角色权限完善，总览弹窗接口联调

web/src/views/system/role.vue

@@ -23,7 +23,7 @@
         </template>
         <template #permission="record">
           <!-- 0:禁用; 1:启用 -->
-          <span>{{record.permission.map(item=>item.name).toString() }}</span>
+          <span>{{ record.permission.map((item) => item.name).toString() }}</span>
         </template>
 
         <template #action="record">
@@ -34,6 +34,7 @@
     <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
       <!-- action:edit add -->
       <EditCom
+      :show-flag="formModal"
         :record="record"
         @operateForm="operateForm"
         type="role"
@@ -125,25 +126,39 @@ export default {
         //统一处理报错提示
       }
     },
+    async getPermissionList() {
+      let arr = []
+
+      const params = {
+        page_size: 1000,
+        page: 1
+      }
+
+      const res = await getReq('/queryPermissionList', params)
+      if (res.errcode === 0) {
+        arr = res.data
+      } else {
+        arr = []
+      }
+      return arr
+    },
     operateForm(type, record = {}) {
-      console.log(record,record.id,'rrrrrrrrrr')
+      console.log(record, record.id, 'rrrrrrrrrr')
       this.formStatus = type
       switch (type) {
       case 'add':
-        this.formModal = true
         this.formState = {}
         this.getRuleFormInfo()
 
         break
       case 'edit':
       case 'read':
-        this.formModal = true
         this.formState = record
         this.getRuleFormInfo(record)
         break
-    
+
       case 'del':
-        this.handleDelete([record.role_id],this.getList)
+        this.handleDelete([record.role_id], this.getList)
 
         break
 
@@ -157,7 +172,7 @@ export default {
       }
     },
     //  删除操作
-    async handleDelete(id,callback) {
+    async handleDelete(id, callback) {
       const that = this
       Modal.confirm({
         title: '你确认删除数据吗?',
@@ -165,10 +180,10 @@ export default {
 
         async onOk() {
           try {
-            const res = await getReq('/deleteRole',{role_id:id})
+            const res = await getReq('/deleteRole', { role_id: id })
             if (res.errcode === 0) {
               this.$message.success(res.errmsg)
-              this.pageOption.page=1
+              this.pageOption.page = 1
               callback()
             } else {
               throw res
@@ -199,13 +214,37 @@ export default {
         row = record
         // this.type='edit'
       }
+      const perList = await this.getPermissionList()
+      const permissionList=perList.map((item)=>{
+        return{
+          key:+item.permission_id,
+          ...item
+        }
+      })
+      console.log(permissionList, 'permissionList')
+
       roleOptions.forEach((e, index) => {
         e.list.forEach((i) => {
-          
-          e.ruleForm[i.key] = row ? row[i.key] : ''
-          e.ruleForm.id = row.id
+          if (i.key == 'permission') {
+            i.tableData=permissionList
+            //  .forEach((item)=>{
+            //  .push({...item,key:item.permission_id})
+            // })
+            if (record && record.role_id) {
+              i.selectTableData = row.permission
+                ? row.permissionList.map((item) => item.permission_id)
+                : []
+            } else {
+              i.selectTableData = []
+            }
+          } else {
+            e.ruleForm[i.key] = row ? row[i.key] : ''
+          }
         })
       })
+      console.log(permissionList,"permissionList")
+      this.formModal = true
+
     },
     handlePagesizeChange(pageOption) {
       this.pageOption.pageSize = pageOption.pageSize