feat: 账号管理更换表格

src/views/system/user/CreateDrawer.vue

@@ -151,7 +151,6 @@
       realname: '',
       roleIdList: [],
     });
-console.log(props.departmentList,'<<<<departmentList');
     const message = ElMessage;
     const formRef: any = ref(null);
     const isDrawer = ref(false);

src/views/system/user/columns.ts

@@ -1,107 +0,0 @@
-import { h } from 'vue';
-import { ElTag } from 'element-plus';
-import { BasicColumn } from '@/components/Table';
-import type { RoleListItem } from '@/api/system/user-operate';
-import type {DeptTreeItem } from '@/api/system/user-query'
-
-export const columns: BasicColumn[] = [
-  {
-    type: 'selection',
-  },
-  {
-    label: '工号',
-    prop: 'staffNo',
-    render(record) {
-     return h(
-        'span',
-        record.row.staffNo ? record.row.staffNo : '--'
-      );
-    },
-  },
-  {
-    label: '登录账号',
-    prop: 'username',
-    render(record) {
-     return h(
-        'span',
-        record.row.username ? record.row.username : '--'
-      );
-    },
-  },
-  {
-    label: '姓名',
-    prop: 'realname',
-    render(record) {
-     return h(
-        'span',
-        record.row.realname ? record.row.realname : '--'
-      );
-    },
-  },
-  {
-    label: '手机',
-    prop: 'mobile',
-    render(record) {
-     return h(
-        'span',
-        record.row.mobile ? record.row.mobile : '--'
-      );
-    },
-  },
-  {
-    label: '状态',
-    prop: 'isDisabled',
-    minWidth: 50,
-    render(record) {
-      return h(
-        ElTag,
-        {
-          type: !record.row.isDisabled ? 'success' : 'danger',
-        },
-        {
-          default: () => (!record.row.isDisabled ? '正常' : '锁定')
-        },
-      );
-    },
-  },
-  {
-    label: '角色',
-    prop: 'roleList',
-    render(record) {
-      return h(
-        'span',
-        tranformRoleList(record.row.roleList)
-      );
-    },
-  },
-  {
-    label: '组织',
-    prop: 'deptName',
-    minWidth: 100,
-     render(record) {
-      return h(
-        'span',
-        tranformDeptList(record.row.deptList)
-      );
-    },
-  },
-  {
-    label: '认证方式',
-    prop: 'certify',
-  },
-  {
-    label: '创建时间',
-    prop: 'createdAt',
-    minWidth: 70,
-  },
-];
-
-const tranformRoleList = (arr:RoleListItem[]) => {
-  if (arr && arr.length === 0) return '--'
-  return arr?.map(item => item.roleName).join(',')
-}
-
-const tranformDeptList = (arr:DeptTreeItem[]) => {
-  if (arr && arr.length === 0) return '--'
-  return arr?.map(item => item.deptName).join(',')
-}

src/views/system/user/component/ActionColomns.vue

@@ -1,33 +0,0 @@
-<template>
-  <div class="flex items-center justify-center">
-    <el-space :size="space">
-      <div v-for="item in props.actionIcons" :key="item.label" @click="item.onClick">
-        <div  v-if="item.label === '重置密码'" style="font-size: 12px;color: #629bf9;cursor: pointer;">{{item.label}}</div>
-        <el-tooltip v-else :content="item.label" effect="light" disabled>
-          <el-icon v-if="props.style === 'icon'" :color="props.color" :size="props.size" >
-            <component :is="item.icon" />
-          </el-icon>
-          <img
-            v-if="props.style === 'img'"
-            :src="item.icon"
-            :style="{ width: `${props.size}px` }"
-          />
-        </el-tooltip>  
-      </div>
-    </el-space>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ActionItem } from '@/components/Table';
-  
-const props = defineProps<{
-  space: number;
-  size: number;
-  color: string;
-  style: 'img' | 'icon';
-  actionIcons: ActionItem[];
-}>();
-</script>
-
-<style scoped></style>

src/views/system/user/component/UserQuery.vue

@@ -1,115 +0,0 @@
-<template>
-  <div class="flex items-center query-head">
-    <el-space alignment="center" :size="50">
-      <div>
-        <el-select v-model="queryType" placeholder="选择类型" class="type-select">
-          <el-option
-            v-for="item in queryTypeSelect"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-input
-          :style="{ width: '180px' }"
-          v-model="queryTypeContent"
-          clearable
-          placeholder="请输入查找内容"
-          :disabled="!queryType"
-        />
-      </div>
-      <div>
-        <span>请选择角色：</span>
-        <el-select v-model="queryRoleName" placeholder="请选择角色" class="protocal-select">
-          <el-option
-            v-for="item in roleList!"
-            :key="item.roleId"
-            :label="item.roleName"
-            :value="item.roleId"
-          />
-        </el-select>
-      </div>
-      <div>
-        <span>请选择组织：</span>
-        <el-tree-select
-          v-model="queryDeptName"
-          :data="props.departmentList"
-          :render-after-expand="false"
-          :default-expand-all="true"
-          check-strictly
-          placeholder="请选择组织"
-          class="protocal-select"
-        />
-        <!-- <el-select v-model="queryDeptName" placeholder="请选择组织" class="protocal-select">
-          <el-option
-            v-for="item in props.departmentList"
-            :key="item.deptId"
-            :label="item.deptName"
-            :value="item.deptName"
-          />
-        </el-select> -->
-      </div>
-    </el-space>
-    <div class="flex-1 flex justify-end">
-      <el-button type="primary" @click="conditionSearch"> 查询 </el-button>
-      <el-button @click="resetSearch"> 重置 </el-button>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-  import { queryTypeSelect } from '../constant';
-  import useSelectContent from '../hooks/use-user-para';
-  import useUser from '../hooks/use-user';
-  import { storeToRefs } from 'pinia';
-
-  interface Props {
-  departmentList: any[];
-}
-
-const props = defineProps<Props>();
-
-  const selectContent = useSelectContent();
-  const { roleList } = selectContent;
-
-  const useUserDetail = useUser();
-  const {
-    queryType,
-    queryTypeContent,
-    queryStaffNo,
-    queryNickname,
-    queryMobile,
-    queryRoleName,
-    queryDeptName,
-  } = storeToRefs(useUserDetail);
-  const { conditionSearch } = useUserDetail;
-
-  // 重置查询条件
-  const resetSearch = () => {
-    queryType.value = '';
-    queryTypeContent.value = '';
-    queryRoleName.value = '';
-    queryDeptName.value = '';
-    queryStaffNo.value = '';
-    queryNickname.value = '';
-    queryMobile.value = '';
-  };
-</script>
-
-<style scoped>
-  .type-select {
-    width: 100px;
-  }
-
-  .protocal-select {
-    width: 160px;
-  }
-
-  .query-head {
-    padding: 24px 57px 18px 21px;
-  }
-
-  .protocal-select {
-    width: 160px;
-  }
-</style>

src/views/system/user/constant.ts

@@ -19,21 +19,6 @@ export enum QuerySelect {
   'mobile' = 'mobile',
 }
 
-// export const roleTypeSelect = [
-//   {
-//     value: 'roleCode',
-//     label: '工号',
-//   },
-//   {
-//     value: 'roleName',
-//     label: '姓名',
-//   },
-//   {
-//     value: 'rolePhone',
-//     label: '手机号',
-//   },
-// ];
-
 export const DEFAULT_DRAWER = {
   TITLE: '添加用户',
   WIDTH: 450

src/views/system/user/hooks/use-user-para.ts

@@ -1,26 +0,0 @@
-import { getAllRoles, Department, getAllDepartments, Role } from '@/api/system/user-query';
-import { onMounted, ref } from 'vue';
-
-export const getSelectList = () => {
-  const roleList = ref<Role[]>([]);
-  const getRoleList = () => {
-    getAllRoles().then((res) => {
-      roleList.value = res.list!;
-    });
-  };
-
-  const departmentList = ref<Department[]>([]);
-  const getDepartmentList = () => {
-    getAllDepartments().then((res) => {
-      departmentList.value = res;
-    });
-  };
-
-  onMounted(() => {
-    getRoleList();
-    getDepartmentList();
-  });
-
-  return { roleList, getRoleList, departmentList, getDepartmentList };
-};
-export default getSelectList;

src/views/system/user/hooks/use-user.ts

@@ -1,164 +0,0 @@
-import {
-  UserType,
-  addSingleUser,
-  addMultipleUser,
-  UserTypeDel,
-  delUser,
-  updateUser,
-  QueryUser,
-  getUserList,
-} from '@/api/system/user-operate';
-import { ref } from 'vue';
-import { QuerySelect } from '../constant';
-import { defineStore } from 'pinia';
-
-export const useUser = defineStore('user-list', () => {
-  //查询的类型
-  const queryType = ref<string>('');
-  //查询输入的内容
-  const queryTypeContent = ref<string>('');
-  //查询的工号
-  const queryStaffNo = ref<string>('');
-  //查询的姓名
-  const queryNickname = ref<string>('');
-  //查询的手机号
-  const queryMobile = ref<string>('');
-  //查询的角色
-  const queryRoleName = ref<string>('');
-  //查询的组织
-  const queryDeptName = ref<string>('');
-  //user数据
-  const userList = ref<UserTypeDel[]>([]);
-
-  //编辑时的单个数据
-  //   const userData = ref<UserType>();
-
-  //当前的页数
-  const page = ref<number>(1);
-  //总页数
-  //   const totalPage = ref<number>(1);
-  //每页的数量
-  const pageSize = ref<number>(10);
-  //总数量
-  const totalCount = ref<number>(0);
-
-  //条件查询
-  const conditionSearch = () => {
-    const params: QueryUser = {
-      page: page.value,
-      pageRow: pageSize.value,
-    };
-    queryStaffNo.value = '';
-    queryNickname.value = '';
-    queryMobile.value = '';
-    if (queryType.value === QuerySelect.staffNo) {
-      queryStaffNo.value = queryTypeContent.value;
-    } else if (queryType.value === QuerySelect.nickname) {
-      queryNickname.value = queryTypeContent.value;
-    } else if (queryType.value === QuerySelect.mobile) {
-      queryMobile.value = queryTypeContent.value;
-    }
-    if (queryStaffNo.value) {
-      params.staffNo = queryStaffNo.value;
-    }
-    if (queryNickname.value) {
-      params.nickname = queryNickname.value;
-    }
-    if (queryMobile.value) {
-      params.mobile = queryMobile.value;
-    }
-    if (queryRoleName.value) {
-      params.roleId = queryRoleName.value;
-    }
-    if (queryDeptName.value) {
-      params.deptId = queryDeptName.value;
-    }
-    getUserList(params).then((res) => {
-      userList.value = res.list;
-      userList.value.forEach(item =>{item.certify = "本地认证";})    
-      totalCount.value = res.totalCount;
-    });
-  };
-
-  //获取列表
-  const getList = () => {
-    getUserList(null).then((res) => {
-      userList.value = res.list;
-      userList.value.forEach(item =>{item.certify = "本地认证";})
-      totalCount.value = res.totalCount;
-    });
-  };
-
-  //添加单个数据
-  const singleUserAdd = (data: UserType) => {
-    addSingleUser(data).then(() => {
-      () => {
-        conditionSearch();
-      };
-    });
-  };
-
-  //添加多个数据
-  const multipleUserAdd = (data: File) => {
-    addMultipleUser(data).then(() => {
-      () => {
-        conditionSearch();
-      };
-    });
-  };
-
-  //删除用户
-  const userDel = (data: UserTypeDel) => {
-    delUser(data).then(() => {
-      conditionSearch();
-    });
-  };
-
-  //修改用户
-  const userUpdate = (data: UserType) => {
-    updateUser(data).then(() => {
-      conditionSearch();
-    });
-  };
-
-  const resetArgs = () => {
-    queryType.value = '';
-    queryTypeContent.value = '';
-    queryStaffNo.value = '';
-    queryNickname.value = '';
-    queryMobile.value = '';
-    queryRoleName.value = '';
-    queryDeptName.value = '';
-    userList.value = [];
-    page.value = 1;
-    pageSize.value = 10;
-    totalCount.value = 0;
-  };
-
-  return {
-    queryType,
-    queryTypeContent,
-    queryStaffNo,
-    queryNickname,
-    queryMobile,
-    queryRoleName,
-    queryDeptName,
-    userList,
-    page,
-    pageSize,
-    totalCount,
-    conditionSearch,
-    getList,
-    singleUserAdd,
-    multipleUserAdd,
-    userDel,
-    userUpdate,
-    resetArgs,
-  };
-});
-
-//获取单个数据
-
-//修改用户
-
-export default useUser;

src/views/system/user/useTenantList.ts

@@ -1,7 +0,0 @@
-import { tenantList } from '@/api/tenant';
-import { useRequest } from 'vue-hooks-plus';
-
-export function useTenantList() {
-  const { data, loading } = useRequest(tenantList);
-  return { data, loading };
-}

src/views/system/user/user-copy.vue

@@ -1,161 +0,0 @@
-<template>
-  <PageWrapper>
-    <el-card :bordered="false" class="mb-3 proCard">
-      <el-space align="center">
-        <el-input
-          :style="{ width: '320px' }"
-          v-model="params.username"
-          clearable
-          placeholder="请输入账号"
-          @keyup.enter="reloadTable"
-        />
-        <el-button type="primary" @click="reloadTable" :icon="Search"> 查询 </el-button>
-      </el-space>
-    </el-card>
-    <el-card :bordered="false" class="proCard">
-      <BasicTable
-        :columns="columns"
-        :request="loadDataTable"
-        :row-key="(row) => row.userId"
-        ref="basicTableRef"
-        :actionColumn="actionColumn"
-        @update:checked-row-keys="onCheckedRow"
-        virtual-scroll
-      >
-        <template #tableTitle>
-          <el-space align="center">
-            <el-button type="primary" @click="openCreateDrawer">
-              <template #icon>
-                <el-icon>
-                  <FileAddOutlined />
-                </el-icon>
-              </template>
-              添加
-            </el-button>
-
-            <!-- <el-button type="error" @click="openRemoveModal" :disabled="!rowKeys.length">
-                <template #icon>
-                  <el-icon>
-                    <DeleteOutlined />
-                  </el-icon>
-                </template>
-                删除
-              </el-button> -->
-          </el-space>
-        </template>
-      </BasicTable>
-    </el-card>
-
-    <CreateDrawer
-      ref="createDrawerRef"
-      :title="drawerTitle"
-      :roleList="roleData"
-      @change="reloadTable"
-    />
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { h, reactive, ref, onMounted } from 'vue';
-  import { ElMessage } from 'element-plus';
-  import { BasicTable, TableAction, BasicColumn } from '@/components/Table';
-  import { getUserList } from '@/api/system/user';
-  import { FileAddOutlined } from '@vicons/antd';
-  import { roleAllList } from '@/api/system/role';
-  import { delUser } from '@/api/system/user';
-  import CreateDrawer from './CreateDrawer.vue';
-  import { columns } from './columns';
-  import { Search } from '@element-plus/icons-vue';
-
-  const message = ElMessage;
-  const basicTableRef = ref();
-  const rowKeys = ref([]);
-  const rowKeysName = ref([]);
-  const tableData = ref();
-  const createDrawerRef = ref();
-  const drawerTitle = ref('添加用户');
-  const roleData = ref([]);
-
-  const params = reactive({
-    username: '',
-  });
-
-  const actionColumn: BasicColumn = reactive({
-    width: 150,
-    title: '操作',
-    prop: 'action',
-    fixed: 'right',
-    align: 'center',
-    render(record) {
-      return h(TableAction as any, {
-        actions: [
-          {
-            label: '删除',
-            isConfirm: true,
-            popConfirm: {
-              onConfirm: handleDelete.bind(null, record.row),
-              title: '您确定要删除吗？',
-              confirmButtonText: '确定',
-              cancelButtonText: '取消',
-            },
-          },
-          {
-            label: '编辑',
-            onClick: handleEdit.bind(null, record.row),
-          },
-        ],
-      });
-    },
-  });
-
-  const loadDataTable = async (res) => {
-    const result = await getUserList({ ...params, ...res });
-    tableData.value = result.list;
-    return result;
-  };
-
-  function onCheckedRow(keys) {
-    rowKeys.value = keys;
-    rowKeysName.value = tableData.value
-      .filter((item) => {
-        return keys.includes(item.id);
-      })
-      .map((item) => {
-        return item.username;
-      })
-      .join('，');
-  }
-
-  function reloadTable() {
-    basicTableRef.value.reload();
-  }
-
-  function openCreateDrawer() {
-    const { openDrawer } = createDrawerRef.value;
-    openDrawer();
-  }
-
-  function handleEdit(record: Recordable) {
-    console.log('点击了编辑', record);
-    drawerTitle.value = '编辑用户';
-    const { openDrawer } = createDrawerRef.value;
-    openDrawer(record.userId);
-  }
-
-  function handleDelete(record: Recordable) {
-    delUser({ userId: record.userId }).then(() => {
-      message.success('删除成功');
-      reloadTable();
-    });
-  }
-
-  onMounted(async () => {
-    const res = await roleAllList();
-    roleData.value = res.list.map((item: any) => {
-      return {
-        value: item.roleId,
-        label: item.roleName,
-      };
-    });
-  });
-</script>

src/views/system/user/user.vue

@@ -1,65 +1,101 @@
 <template>
   <div class="user-page">
-    <SearchForm ref="searchFormRef" 
+    <SearchForm
+      ref="searchFormRef"
       :departmentList="departmentList"
-      :roleData="roleData" 
-      @get-table-data="onSearchCommit" 
-      @reset-form="onResetForm"/>
-    <div class="user-list" >
-      <BasicTable
-        :columns="columns"
-        :data-source="userList"
-        :row-key="(row) => row.userId"
-        ref="basicTableRef"
-        :pagination="{ total: total, pageSize: params.pageSize, hideOnSinglePage: false }"
-        :actionColumn="actionColumn"
-        :tableSetting="{
-          size: false,
-          redo: false,
-          fullscreen: false,
-          striped: false,
-          setting: false,
-        }"
-        @update:checked-row-keys="onCheckedRow"
-        virtual-scroll
-        @page-num-change="handlePageNumChange"
-        @page-size-change="handlePageSizeChange"
-      >
-        <template #tableTitle>
-          <el-space align="center">
-            <el-button type="primary" @click="openAddSingleDrawer">
-              <template #icon>
-                <el-icon>
-                  <Plus />
-                </el-icon>
-              </template>
-              添加用户
-            </el-button>
-            <el-button @click="openAddAdminDrawer"  v-if="isSysTenant">
-              <template #icon>
-                <el-icon>
-                  <Plus />
-                </el-icon>
-              </template>
-              添加租户管理员
-            </el-button>
-            <el-button
-              color="#1890FF"
-              @click="openAddMultipleDrawer"
-              style="margin-left: 18px"
-              plain
-            >
-              <template #icon>
-                <el-icon>
-                  <DocumentAdd />
-                </el-icon>
-              </template>
-              批量导入
-            </el-button>
-          </el-space>
-        </template>
-      </BasicTable>
-    </div>
+      :roleData="roleData"
+      @get-table-data="onSearchCommit"
+      @reset-form="onResetForm"
+    />
+    <el-card>
+      <template #header>
+        <el-space align="center">
+          <el-button type="primary" @click="openAddSingleDrawer">
+            <template #icon>
+              <el-icon>
+                <Plus />
+              </el-icon>
+            </template>
+            添加用户
+          </el-button>
+          <el-button @click="openAddAdminDrawer" v-if="isSysTenant">
+            <template #icon>
+              <el-icon>
+                <Plus />
+              </el-icon>
+            </template>
+            添加租户管理员
+          </el-button>
+          <el-button color="#1890FF" @click="openAddMultipleDrawer" style="margin-left: 18px" plain>
+            <template #icon>
+              <el-icon>
+                <DocumentAdd />
+              </el-icon>
+            </template>
+            批量导入
+          </el-button>
+        </el-space>
+      </template>
+
+      <el-table height="calc(100vh - 340px)" :data="userList">
+        <el-table-column label="工号" prop="staffNo">
+          <template #default="scope">
+            <div style="display: flex; align-items: center">
+              <span style="margin-left: 10px">{{ scope.row.staffNo }}</span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="登录账号" prop="username" />
+        <el-table-column label="姓名" prop="realname" />
+        <el-table-column label="手机" prop="mobile" />
+        <el-table-column label="状态" prop="isDisabled">
+          <template #default="scope">
+            <div style="display: flex; align-items: center">
+              <el-tag :type="!scope.row.isDisabled ? 'success' : 'danger'">
+                {{ !scope.row.isDisabled ? '正常' : '锁定' }}</el-tag
+              >
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="角色" prop="roleList">
+          <template #default="scope">
+            <div style="display: flex; align-items: center">
+              {{ tranformRoleList(scope.row.roleList) }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="组织" prop="deptList">
+          <template #default="scope">
+            <div style="display: flex; align-items: center">
+              {{ tranformDeptList(scope.row.deptList) }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="认证方式" prop="certify" />
+        <el-table-column label="创建时间" prop="createdAt" />
+        <el-table-column label="操作" width="200">
+          <template #default="scope ">
+            <el-space>
+              <el-button v-if="scope.row.roleType !== RoleTypeEnum.SUPER_ADMIN" type="primary" :icon="Edit" text @click="handleEdit(scope.row)" />
+              <el-button  v-if="scope.row.roleType !== RoleTypeEnum.SUPER_ADMIN"  type="primary" :icon="Delete" text @click="handleDelete(scope.row.id)"  />
+              <el-button type="primary" text @click="handleResetCode(scope.row.id)">重置密码</el-button>
+            </el-space>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <section class="mt-4 flex justify-end">
+        <el-pagination
+          background
+          layout="total, sizes, prev, pager, next"
+          :page-sizes="[10, 30, 50]"
+          :total="total"
+          v-model:page-size="params.pageSize"
+          v-model:current-page="params.pageNumber"
+          @change="loadPageData"
+        />
+      </section>
+    </el-card>
     <CreateDrawer
       ref="createDrawerRef"
       :title="drawerTitle"
@@ -88,14 +124,10 @@
 </template>
 
 <script lang="ts" setup>
-  import { h, reactive, ref, onMounted } from 'vue';
+  import { reactive, ref, onMounted } from 'vue';
   import { ElMessage, ElMessageBox } from 'element-plus';
-  import { Plus, DocumentAdd } from '@element-plus/icons-vue';
+  import { Plus, DocumentAdd, Edit, Delete } from '@element-plus/icons-vue';
   import { isEmpty } from 'lodash-es';
-  import editIcon from '@/assets/images/table/table-edit.png';
-  import deleteIcon from '@/assets/images/table/table-delete.png';
-  import { BasicTable, BasicColumn } from '@/components/Table';
-  import { columns } from './columns';
   import { EditType, OptionsProps, SearchParamsProps } from './types';
   import { RoleTypeEnum } from '@/types/role/constants';
   import useSceneInfos from '@/hooks/useSceneInfos';
@@ -104,18 +136,18 @@
   import { getUserList, UserLisItem, deleteUser } from '@/api/system/user-operate';
   import { ResultEnum } from '@/enums/httpEnum';
   import { useTargetTenantIdSetting } from '@/utils/useTargetTenantIdSetting';
+  import type { RoleListItem } from '@/api/system/user-operate';
+  import type {DeptTreeItem } from '@/api/system/user-query'
   import SearchForm from './component/SearchForm.vue';
   import AddUser from './component/AddUser.vue';
-  import ActionColomns from './component/ActionColomns.vue';
   import CreateDrawer from './CreateDrawer.vue';
   import ResetCodeDrawer from './ResetCodeDrawer.vue';
   import CreateAdminDrawer from './CreateAdminDrawer.vue';
-  
+
   const sceneInfos = useSceneInfos();
   const { calculateTreeData } = sceneInfos;
   const userList = ref<UserLisItem[]>([]);
   const searchFormRef = ref<InstanceType<typeof SearchForm>>();
-  const basicTableRef = ref<InstanceType<typeof BasicTable>>();
   const createDrawerRef = ref<InstanceType<typeof CreateDrawer>>();
   const ResetCodeDrawerRef = ref<InstanceType<typeof ResetCodeDrawer>>();
   const createAdminDrawerRef = ref<InstanceType<typeof CreateAdminDrawer>>();
@@ -129,43 +161,6 @@
   const createAdminType = ref(EditType.create);
   const { isSysTenant } = useTargetTenantIdSetting();
 
-  const actionColumn: BasicColumn = reactive({
-    width: 150,
-    title: '操作',
-    prop: 'action',
-    key: 'action',
-    fixed: 'right',
-    render(record) {
-      return h(ActionColomns as any, {
-        space: 20,
-        color: '#629bf9',
-        style: 'img',
-        size: 16,
-        actionIcons: ( record.row.roleType !== RoleTypeEnum.SUPER_ADMIN ?[
-          {
-            label: '编辑',
-            icon: editIcon,
-            onClick: handleEdit.bind(null, record.row),
-          },
-          {
-            label: '删除',
-            icon: deleteIcon,
-            onClick: handleDelete.bind(null, record.row),
-          },
-          {
-            label: '重置密码',
-            onClick: handleResetCode.bind(null, record.row),
-          },
-        ] : [
-          {
-            label: '重置密码',
-            onClick: handleResetCode.bind(null, record.row),
-          },
-        ]),
-      });
-    },
-  });
-
   function onCheckedRow(keys) {
     rowKeys.value = keys;
     rowKeysName.value = tableData.value
@@ -179,7 +174,7 @@
   }
 
   function reloadTable() {
-    loadPageData()
+    loadPageData();
   }
 
   const openAddSingleDrawer = () => {
@@ -190,7 +185,6 @@
     } else {
       createDrawerRef.value?.openDrawer();
     }
-  
   };
   const openAddAdminDrawer = () => {
     createAdminTitle.value = '添加租户管理员';
@@ -230,15 +224,15 @@
       type: 'warning',
     })
       .then(() => {
-        deleteUser({ userId: record.id }).then(res => {
+        deleteUser({ userId: record.id }).then((res) => {
           if (res.code === ResultEnum.SUCCESS) {
             ElMessage({
               type: 'success',
               message: '删除成功',
             });
-            loadPageData()
+            loadPageData();
           }
-        })
+        });
       })
       .catch(() => {
         ElMessage({
@@ -249,7 +243,7 @@
   }
 
   onMounted(async () => {
-    loadPageData()
+    loadPageData();
     getAllDepartments().then((res) => {
       departmentList.value = calculateTreeData(
         res,
@@ -257,7 +251,7 @@
         1,
       );
     });
-    const res = await getRoles() || [];
+    const res = (await getRoles()) || [];
     roleData.value = res.map((item: any) => {
       return {
         value: item.id,
@@ -270,8 +264,8 @@
   const params = reactive<SearchParamsProps>({
     pageNumber: 1,
     pageSize: 10,
-    queryParam: {}
-  })
+    queryParam: {},
+  });
 
   // 获取页面数据
   const total = ref(0);
@@ -282,28 +276,30 @@
       Object.entries(searchFormData).forEach(([key, value]) => {
         if (!isEmpty(value)) {
           if (['deptId, roleId'].includes(key)) {
-            params.queryParam[key] = value
+            params.queryParam[key] = value;
           }
           params.queryParam[queryType] = queryTypeContent;
-        } 
-      })
+        }
+      });
       // 删除多余参数
       delteExtraParams(queryType);
-      getUserList(params).then(res => {
+      getUserList(params).then((res) => {
         userList.value = res.records;
-        userList.value.forEach(item =>{item.certify = "本地认证";})
+        userList.value.forEach((item) => {
+          item.certify = '本地认证';
+        });
         total.value = res.totalRow;
-      })
+      });
     }
-  }
+  };
 
   const extraParams = ['realname', 'mobile', 'staffNo'];
   const delteExtraParams = (type) => {
-    const needDeleteArr = extraParams.filter(item => item !== type);
-    needDeleteArr.forEach(item => {
+    const needDeleteArr = extraParams.filter((item) => item !== type);
+    needDeleteArr.forEach((item) => {
       delete params.queryParam[item];
     });
-  }
+  };
 
   //  获取列表数据
   const onSearchCommit = () => {
@@ -313,22 +309,19 @@
   // 重置列表数据
   const onResetForm = () => {
     params.pageNumber = 1;
-    params.pageSize = 10
-    params.queryParam = {}
+    params.pageSize = 10;
+    params.queryParam = {};
     loadPageData();
-  }
+  };
 
-  // 分页跳转
-  const handlePageNumChange = (pageNum) => {
-    params.pageNumber = pageNum;
-    loadPageData();
+  const tranformRoleList = (arr: RoleListItem[]) => {
+    if (arr && arr.length === 0) return '--';
+    return arr?.map((item) => item.roleName).join(',');
   };
 
-  // 更换页面
-  const handlePageSizeChange = (size) => {
-    params.pageNumber = 1;
-    params.pageSize = size;
-    loadPageData();
+  const tranformDeptList = (arr: DeptTreeItem[]) => {
+    if (arr && arr.length === 0) return '--';
+    return arr?.map((item) => item.deptName).join(',');
   };
 </script>
 <style scoped>