角色页面中增加了新增与删除角色时调用后端的过程；对显示效果进行了微调

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

@@ -8,11 +8,11 @@
         <!-- :requestApi="getRoleList" -->
         <!-- 表格 header 按钮 -->
         <template #tableHeader='scope'>
-          <el-button type='primary' :icon='CirclePlus' @click="openDrawer('新增角色')">新增角色</el-button>
-          <el-button type='primary' :icon='Download' plain @click='downloadFile'>导出角色数据</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)'>
-            批量删除角色
+            批量删除
           </el-button>
         </template>
         <!-- 表格操作 -->
@@ -28,6 +28,7 @@
    :dialogVisible = roleUnitVisible 
    :title = roleUnitTitle 
    :data = roleUnitData 
+   :updataList = "updataList"
    @update:visible="roleUnitVisible = $event"
    />
   <permissionUnit 
@@ -81,6 +82,8 @@
 
   //const roleData = roleDataList
   const roleData = ref<Role.ResRoleList[]>([])
+
+  function updataList() {
     getRoleList({
     id: '',
     rolename: '',
@@ -91,8 +94,13 @@
   }).then(res => {
     if(res.code == '200') {
       roleData.value = res.data.list
+
+      console.log(11111);
+      
   }
   })
+  }
+  updataList()
 
   // ProTable 实例
   const proTable = ref<ProTableInstance>()
@@ -166,6 +174,7 @@
   const deleteAccount = async (params: Role.ResRoleList) => {
     await useHandleData(deleteRole, { id: [params.id] }, `删除【${params.rolename}】角色`)
     proTable.value?.getTableList()
+    updataList()
   }
 
   // 批量删除角色信息