1.新增用户管理页面，对接部分接口

src/hooks/common/router.ts

@@ -97,7 +97,7 @@ export function useRouterPush(inSetup = true) {
     const redirect = route.value.query?.redirect as string;
     console.log(redirect);
     if (needRedirect && redirect) {
-      await routerPush(redirect);
+      await toHome();
     } else {
       await toHome();
     }

src/router/guard/route.ts

@@ -24,6 +24,7 @@ export function createRouteGuard(router: Router) {
       next(location);
       return;
     }
+   
 
     const authStore = useAuthStore();
 
@@ -37,19 +38,22 @@ export function createRouteGuard(router: Router) {
 
     const hasRole = authStore.userInfo.roles.some(role => routeRoles.includes(role));
     const hasAuth = authStore.isStaticSuper || !routeRoles.length || hasRole;
+    // if(!location){
+    //   next({ name: 'home' });
+    //   return;
+    // }
 
     // if it is login route when logged in, then switch to the root page
     if (to.name === loginRoute && isLogin) {
       next({ name: rootRoute });
       return;
     }
-
+   
     // if the route does not need login, then it is allowed to access directly
     if (!needLogin) {
       handleRouteSwitch(to, from, next);
       return;
     }
-
     // the route need login but the user is not logged in, then switch to the login page
     if (!isLogin) {
       next({ name: loginRoute, query: { redirect: to.fullPath } });
@@ -164,6 +168,8 @@ async function initRoute(to: RouteLocationNormalized): Promise<RouteLocationRaw
 
 function handleRouteSwitch(to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) {
   // route with href
+  
+
   if (to.meta.href) {
     window.open(to.meta.href, '_blank');
 

src/router/routes/builtin.ts

@@ -8,7 +8,6 @@ export const ROOT_ROUTE: CustomRoute = {
   redirect: '/home',
   meta: {
     title: 'root',
-    constant: true
   }
 };
 

src/service/api/group.ts

@@ -28,9 +28,10 @@ export function editGroup(data: Partial<GroupApi.Group>) {
 }
 
 /** 删除API权限组 */
-export function deleteGroup(id: number) {
+export function deleteGroup(id) {
   return request({
-    url: `/adminapi/group/del/ids/${id}`,
-    method: 'get'
+    url: `/adminapi/group/del/ids`,
+    method: 'post',
+    data:{ids:id}
   });
 } 

src/service/api/index.ts

@@ -1,2 +1,39 @@
 export * from './auth';
 export * from './route';
+
+import { request } from '../request';
+
+
+/** 添加API权限组 */
+export function fetchGetAdminList(data) {
+    return request({
+        url: '/adminapi/admin_manager/index',
+        method: 'post',
+        data
+    });
+}
+/** 添加API权限组 */
+export function addAdmin(data,type) {
+    return request({
+        url: '/adminapi/admin_manager/add',
+        method:type,
+        data
+    });
+}
+/** 添加API权限组 */
+export function editAdmin(data) {
+    return request({
+        url: '/adminapi/admin_manager/edit/ids',
+        method: 'post',
+        data
+    });
+}
+
+/** 添加API权限组 */
+export function deleteAdmin(data) {
+    return request({
+        url: '/adminapi/admin_manager/del/ids',
+        method: 'post',
+        data
+    });
+}

src/service/api/route.ts

@@ -7,7 +7,7 @@ export function fetchGetConstantRoutes() {
 
 /** get user routes */
 export function fetchGetUserRoutes() {
-  return request<Api.Route.UserRoute>({ url: '/adminapi/rule/index?is_tree=1' });
+  return request<Api.Route.UserRoute>({ url: '/adminapi/admin/menu?is_tree=1' });
 }
 
 

src/store/modules/auth/index.ts

@@ -10,6 +10,8 @@ import { $t } from '@/locales';
 import { useRouteStore } from '../route';
 import { useTabStore } from '../tab';
 import { clearAuthStorage, getToken } from './shared';
+import { router } from '@/router';
+
 
 export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
   const route = useRoute();
@@ -69,8 +71,8 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
       const pass = await loginByToken(response.data.data.userinfo);
 
       if (pass) {
-        await redirectFromLogin(redirect);
-
+        //await redirectFromLogin(redirect);
+        router.push('home');
         window.$notification?.success({
           title: $t('page.login.common.loginSuccess'),
           content: $t('page.login.common.welcomeBack', { userName: response.data.data.userinfo.nickname }),

src/store/modules/route/index.ts

@@ -299,14 +299,13 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
    */
   function handleUpdateRootRouteRedirect(redirectKey: LastLevelRouteKey) {
     const redirect = getRoutePath(redirectKey);
-
+   
     if (redirect) {
       const rootRoute: CustomRoute = { ...ROOT_ROUTE, redirect };
 
       router.removeRoute(rootRoute.name);
 
       const [rootVueRoute] = getAuthVueRoutes([rootRoute]);
-
       router.addRoute(rootVueRoute);
     }
   }

src/views/system/auth/index.vue

@@ -24,7 +24,7 @@ const model = ref<Partial<GroupApi.Group & { rulesArray: (string | number)[] }>>
     id: 0,
     name: '',
     rules: '',
-    status: '',
+    status: 'normal',
     rulesArray: []
 });
 const rules = {};
@@ -118,7 +118,7 @@ function handleAdd() {
         id: 0,
         name: '',
         rules: '',
-        status: '',
+        status: 'normal',
         rulesArray: []
     };
     openModal();
@@ -129,7 +129,7 @@ async function handleDelete(id: number) {
     const { response } = await deleteGroup(id);
     console.log(response);
     if (response?.data?.code === 1) {
-        window.$message?.success(response.data.msg);
+        window.$message?.success('删除成功！');
         getData();
     } else {
         window.$message?.error(response?.data?.msg || '删除失败');

src/views/system/user/index.vue

@@ -1,7 +1,220 @@
 <template>
-  <div>
-    <h1>用户管理</h1>
+  <div ref="wrapperRef" class="flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
+    <NCard title="管理员管理" :bordered="false" size="small" class="sm:flex-1-hidden card-wrapper">
+      <template #header-extra>
+        <TableHeaderOperation v-model:columns="columnChecks" :disabled-delete="checkedRowKeys.length === 0"
+          :loading="loading" @add="handleAdd" @refresh="getData" />
+      </template>
+      <NDataTable v-model:checked-row-keys="checkedRowKeys" :columns="columns" :data="data" size="small"
+        :flex-height="!appStore.isMobile" :scroll-x="1088" :loading="loading" :row-key="row => row.id" remote
+        :pagination="pagination" class="sm:h-full" />
+    </NCard>
+    <NModal v-model:show="visible" :title="title" preset="card" class="w-800px">
+      <NScrollbar class="h-480px pr-20px">
+        <NForm ref="formRef" :model="model" :rules="rules" label-placement="left" :label-width="100">
+          <NGrid responsive="screen" item-responsive>
+            <NFormItemGi span="24 m:12" label="用户名" path="username">
+              <NInput v-model:value="model.username" placeholder="请输入用户名" />
+            </NFormItemGi>
+            <NFormItemGi span="24 m:12" label="昵称" path="nickname">
+              <NInput v-model:value="model.nickname" placeholder="请输入昵称" />
+            </NFormItemGi>
+            <NFormItemGi span="24 m:12" label="密码" path="password">
+              <NInput v-model:value="model.password" type="password" placeholder="请输入密码" />
+            </NFormItemGi>
+            <NFormItemGi span="24 m:12" label="用户组" path="group">
+              <NSelect v-model:value="model.group" :options="groupOptions" placeholder="请选择用户组" />
+            </NFormItemGi>
+            <NFormItemGi span="24 m:12" label="邮箱" path="email">
+              <NInput v-model:value="model.email" placeholder="请输入邮箱" />
+            </NFormItemGi>
+            <NFormItemGi span="24 m:12" label="手机号" path="mobile">
+              <NInput v-model:value="model.mobile" placeholder="请输入手机号" />
+            </NFormItemGi>
+          </NGrid>
+        </NForm>
+      </NScrollbar>
+      <template #footer>
+        <NSpace justify="end" :size="16">
+          <NButton @click="visible = false">取消</NButton>
+          <NButton type="primary" @click="handleSubmit">确认</NButton>
+        </NSpace>
+      </template>
+    </NModal>
   </div>
 </template>
 
+<script setup lang="tsx">
+import { ref, onMounted } from 'vue';
+import type { Ref } from 'vue';
+import { NButton, NPopconfirm, NTag, NSelect } from 'naive-ui';
+import { useBoolean } from '@sa/hooks';
+import { useAppStore } from '@/store/modules/app';
+import { useTable, useTableOperate } from '@/hooks/common/table';
+import { fetchGetAdminList, addAdmin, editAdmin, deleteAdmin } from '@/service/api/index';
+import { fetchGetGroups } from '@/service/api/group';
+import { log } from 'console';
+
+const appStore = useAppStore();
+
+const { bool: visible, setTrue: openModal } = useBoolean();
+
+const wrapperRef = ref<HTMLElement | null>(null);
+const title = ref('');
+
+const groupOptions = ref<{ label: string; value: number }[]>([]);
+
+// 获取用户组数据
+async function getGroupOptions() {
+  const { response } = await fetchGetGroups();
+  console.log(response.data)
+  if (response.data.code == 1) {
+    const data = (response.data).data.data;
+    console.log(data);
+    groupOptions.value = data.map((item) => ({
+      label: item.name,
+      value: item.id
+    }));
+  }
+}
+
+onMounted(() => {
+  console.log(111111111);
+  getGroupOptions();
+});
+const model = ref({
+  username: '',
+  nickname: '',
+  password: '',
+  group: null,
+  email: '',
+  mobile: '',
+  id: 0,
+});
+const rules = {};
+const { columns, columnChecks, data, loading, pagination, getData, getDataByPage } = useTable({
+  apiFn: fetchGetAdminList,
+  columns: () => [
+    {
+      key: 'id',
+      title: 'ID',
+      align: 'center',
+      width: 100,
+    },
+    {
+      key: 'username',
+      title: '用户名',
+      align: 'center',
+      width: 150,
+    },
+    {
+      key: 'nickname',
+      title: '昵称',
+      align: 'center',
+      width: 150,
+    },
+    {
+      key: 'groups_text',
+      title: '用户组',
+      align: 'center',
+      width: 150,
+    },
+    {
+      key: 'email',
+      title: '邮箱',
+      align: 'center',
+      width: 200,
+    },
+    {
+      key: 'mobile',
+      title: '手机号',
+      align: 'center',
+      width: 150,
+    },
+    {
+      key: 'operate',
+      title: '操作',
+      align: 'center',
+      width: 230,
+      render: row => (
+        <div class="flex-center justify-end gap-8px">
+          <NButton type="primary" ghost size="small" onClick={() => handleEdit(row)}>
+            编辑
+          </NButton>
+          <NPopconfirm onPositiveClick={() => handleDelete(row.id)}>
+            {{
+              default: () => '确定删除吗？',
+              trigger: () => (
+                <NButton type="error" ghost size="small">
+                  删除
+                </NButton>
+              )
+            }}
+          </NPopconfirm>
+        </div>
+      )
+    }
+  ]
+});
+
+const { checkedRowKeys, onBatchDeleted, onDeleted } = useTableOperate(data, getData);
+
+const operateType = ref('add');
+
+function handleAdd() {
+  operateType.value = 'add';
+  title.value = '新增管理员';
+  // 清空model
+  model.value = {
+    username: '',
+    nickname: '',
+    password: '',
+    group: null,
+    email: '',
+    mobile: '',
+    id: 0,
+  };
+  openModal();
+}
+
+async function handleDelete(id: number) {
+  // request
+  const { response } = await deleteAdmin(id);
+  if (response?.data?.code === 1) {
+    window.$message?.success('删除成功！');
+    getData();
+  } else {
+    window.$message?.error(response?.data?.msg || '删除失败');
+  }
+}
+
+function handleEdit(item: any) {
+  console.log(item);
+  //item.
+  operateType.value = 'edit';
+  title.value = '编辑管理员';
+  model.value = { ...item };
+  openModal();
+}
+
+async function handleSubmit() {
+  let res;
+  if (operateType.value === 'add') {
+    res = await addAdmin(model.value,'post');
+  } else {
+    res = await editAdmin(model.value);
+  }
+  if (res.response?.data?.code === 1) {
+    window.$message?.success(res.response.data.msg);
+    visible.value = false;
+    getData();
+  } else {
+    window.$message?.error(res.response?.data?.msg || '操作失败');
+  }
+}
+
+</script>
+
+<style scoped></style>
+