已修改角色、新增用户、检测源列表、被检设备列表、检测脚本列表

frontend/src/views/authority/role/components/permissionUnit.vue

@@ -1,8 +1,8 @@
 <template>
 <!-- 权限信息弹出框 -->
-<el-dialog :model-value="dialogVisible" :title="title" @close="handleCancel" width="800" draggable>
+<el-dialog :model-value="dialogVisible" :title="title" v-bind="dialogBig" @close="handleCancel" width="600" draggable>
     <div>
-        <el-transfer v-model="value" :data="data" :titles="['未具备的权限', '已具备的权限']"/>
+        <el-transfer v-model="value" :data="data.permissionList" :titles="['未具备的权限', '已具备的权限']"/>
     </div>
     <template #footer>
       <div class="dialog-footer">
@@ -18,7 +18,53 @@
   
   <script lang="ts" setup>
   import { ref } from 'vue'
-  const {dialogVisible,data} = defineProps(['dialogVisible','title','data'])
+  import { Role } from '@/api/role/interface'
+  import { dialogBig } from '@/utils/elementBind'
+  const {dialogVisible,data} = defineProps<{
+  dialogVisible: boolean;
+  title: string;
+  data: Role.ResRoleList;
+}>()
+
+  // const leftvalue = ref<Role.Permission[]>([])
+  // const rightvalue = ref<Role.Permission[]>([])
+
+  // const rightvalue = computed<Role.Permission[]>({
+  //   get(){
+  //     return data.permissionList?.filter(item => item.disabled) || []
+  //     },
+  //    set: (value: Role.Permission[]) => {
+  //     if (data.permissionList) {
+  //       for(let i = 0;i<value.length;i++){
+  //         for(let j = 0;j<(data.permissionList?.length);j++){
+  //           if(value[i].key === data.permissionList[j].key)
+  //           {
+  //             data.permissionList[j].disabled = value[i].disabled
+  //           }
+  //         }
+  //       }
+  //     }
+  //    } 
+  // })
+
+  // const leftvalue = computed<Role.Permission[]>({
+  //   get(){
+  //     return data.permissionList?.filter(item => item.disabled === false) || []
+  //     },
+  //    set: (value: Role.Permission[]) => {
+  //     if (data.permissionList) {
+  //       for(let i = 0;i<value.length;i++){
+  //         for(let j = 0;j<(data.permissionList?.length);j++){
+  //           if(value[i].key === data.permissionList[j].key)
+  //           {
+  //             data.permissionList[j].disabled = value[i].disabled
+  //           }
+  //         }
+  //       }
+  //     }
+  //    } 
+  // })
+
   const value = ref()
  
   const emit = defineEmits<{

frontend/src/views/authority/role/components/roleUnit.vue

@@ -1,6 +1,6 @@
 <template>
     <!-- 基础信息弹出框 -->
-  <el-dialog :model-value="dialogVisible" :title="title" @close="handleCancel" width="800" draggable>
+  <el-dialog :model-value="dialogVisible" :title="title" v-bind="dialogSmall" @close="handleCancel" width="500" draggable>
     <div>
         <el-form :model="data">
         <el-form-item label="角色类型名称" :label-width="100">
@@ -36,9 +36,9 @@
   </template>
   
   <script lang="ts" setup>
-  import { ref } from 'vue'
-  
-  const value = ref(true)
+  import { ref,computed  } from 'vue'
+  import {dialogSmall} from '@/utils/elementBind'
+
   const {dialogVisible,title,data}  = defineProps<{
     dialogVisible:boolean;
     title:string;
@@ -49,6 +49,12 @@
       describe:string;
     }
   }>();
+
+  const value = computed({
+    get: () => data.status === 1,
+    set: (value: boolean) => data.status = value ? 1 : 0
+  })
+  
   const emit = defineEmits<{
   (e:'update:visible',value:boolean):void;
   }>();

frontend/src/views/authority/role/index.vue

@@ -4,10 +4,11 @@
         ref='proTable'
         :columns='columns'
         :data='roleData'
-      >
+     >
+        <!-- :requestApi="getRoleList" -->
         <!-- 表格 header 按钮 -->
         <template #tableHeader='scope'>
-          <el-button type='primary' :icon='CirclePlus' @click="openDrawer('新增')">新增角色</el-button>
+          <el-button type='primary' :icon='CirclePlus' @click="openDrawer('新增角色')">新增角色</el-button>
           <el-button type='primary' :icon='Download' plain @click='downloadFile'>导出角色数据</el-button>
           <el-button type='danger' :icon='Delete' plain :disabled='!scope.isSelected'
                      @click='batchDelete(scope.selectedListIds)'>
@@ -16,10 +17,8 @@
         </template>
         <!-- 表格操作 -->
         <template #operation='scope'>
-
-          <el-button type='primary' link :icon='EditPen' @click="openDrawer('编辑', scope.row)">编辑</el-button>
+          <el-button type='primary' link :icon='EditPen' @click="openDrawer('编辑角色', scope.row)">编辑</el-button>
           <el-button type='primary' link :icon='Delete' @click='deleteAccount(scope.row)'>删除</el-button>
-
           <el-button type='primary' link :icon='Share' @click="openDrawer('设置权限', scope.row)">设置权限</el-button>
       </template>
 
@@ -73,13 +72,27 @@
     const roleUnitTitle = ref()
     const permissionUnitTitle = ref()
     const roleUnitData = ref<Role.ResRoleList>({} as Role.ResRoleList)
-    const permissionUnitData = ref<Role.Permission[]>([])
+    const permissionUnitData = ref<Role.ResRoleList>({} as Role.ResRoleList)
+    // const permissionUnitData = ref<Role.Permission[]>([])
     return {roleUnitVisible,permissionUnitVisible,roleUnitTitle,permissionUnitTitle,roleUnitData,permissionUnitData};
   }
 
   const dictStore = useDictStore()
 
-  const roleData = roleDataList
+  //const roleData = roleDataList
+  const roleData = ref<Role.ResRoleList[]>([])
+    getRoleList({
+    id: '',
+    rolename: '',
+    status: 0,
+    describe: '',
+    pageNum: 1,
+    pageSize: 10
+  }).then(res => {
+    if(res.code == '200') {
+      roleData.value = res.data.list
+  }
+  })
 
   // ProTable 实例
   const proTable = ref<ProTableInstance>()
@@ -126,6 +139,11 @@
       search: { el: 'input' },
       minWidth: 180,
     },
+    {
+      prop: 'describe',
+      label: '描述',
+      minWidth: 380,
+    },
     {
       prop: 'status',
 
@@ -141,11 +159,6 @@
         )
       },
     },
-    {
-      prop: 'describe',
-      label: '描述',
-      minWidth: 380,
-    },
     { prop: 'operation', label: '操作', fixed: 'right', width: 330 },
   ])
 
@@ -192,7 +205,7 @@
 
   // 打开 drawer(新增、查看、编辑)
   const openDrawer = (title: string, row: Partial<Role.ResRoleList> = {}) => {
-    if(title === "新增" || title === '编辑' )
+    if(title === "新增角色" || title === '编辑角色' )
     {
       roleUnitVisible.value = true
       roleUnitTitle.value = title
@@ -212,10 +225,20 @@
       permissionUnitVisible.value = true
       permissionUnitTitle.value = title
 
-      if (row.permissionList) 
-      {
-        permissionUnitData.value = row.permissionList;
-      }
+      const safeRow: Role.ResRoleList = {
+        id: row.id || '',
+        rolename: row.rolename || '',
+        status: row.status || 0,
+        describe: row.describe || '',
+        permissionList: row.permissionList || []
+      };
+
+      permissionUnitData.value = safeRow;
+      console.log(111,permissionUnitData);
+      // if (row.permissionList) 
+      // {
+      //   permissionUnitData.value = row.permissionList; 
+      // }
     }
   }
   </script>