用户接口测试

src/api/department/index.ts

@@ -1,5 +1,12 @@
 import request from '@/config/axios'
-import { DepartmentListResponse, DepartmentUserParams, DepartmentUserResponse } from './types'
+import {
+  DepartmentListResponse,
+  DepartmentUserParams,
+  DepartmentUserResponse,
+  UserParams,
+  SysRole,
+  SysUser
+} from './types'
 
 export const getDepartmentApi = () => {
   return request.get<DepartmentListResponse>({ url: '/department/list' })
@@ -28,3 +35,23 @@ export const deleteDepartmentApi = (ids: string[] | number[]) => {
 export const getDepartmentTableApi = (params: any) => {
   return request.get({ url: '/department/table/list', params })
 }
+
+export const getUserList = (data: UserParams) => {
+  return request.post<DepartmentUserResponse>({ url: '/api/sysUser/page', data })
+}
+
+export const deleteUserById = (id: number) => {
+  return request.delete({ url: `/api/sysUser/${id}` })
+}
+
+export const getRoleApi = () => {
+  return request.post<SysRole[]>({ url: '/api/sysRole/list' })
+}
+
+export const addUser = (data: any) => {
+  return request.post({ url: '/api/sysUser/add', data })
+}
+
+export const updataUser = (data: any) => {
+  return request.put({ url: '/api/sysUser', data })
+}

src/api/department/types.ts

@@ -17,7 +17,7 @@ export interface DepartmentUserParams {
 }
 
 export interface DepartmentUserItem {
-  id: string
+  id: number
   username: string
   account: string
   email: string
@@ -30,3 +30,33 @@ export interface DepartmentUserResponse {
   list: DepartmentUserItem[]
   total: number
 }
+
+export interface UserParams {
+  pageSize: number
+  pageNum: number
+  name?: string
+  account?: string
+}
+
+
+export interface UserResponse {
+  list: DepartmentUserItem[]
+  totalCount: number
+  totalPage: number
+  pageSize: number
+  currPage: number
+}
+
+export interface SysRole {
+  id: number
+  roleName: string
+  createTime: string
+  roleDesc: string
+}
+
+export interface SysUser {
+  id?: number
+  account: string
+  name: string
+  password: string
+}

src/config/axios/config.ts

@@ -7,6 +7,9 @@ import {
 } from './types'
 import { ElMessage } from 'element-plus'
 import qs from 'qs'
+import { useStorage } from '@/hooks/web/useStorage'
+
+const { getStorage } = useStorage()
 
 const config: AxiosConfig = {
   /**
@@ -40,7 +43,7 @@ const config: AxiosConfig = {
    * 默认接口请求类型
    * 可选值：application/x-www-form-urlencoded multipart/form-data
    */
-  defaultHeaders: 'application/json',
+  defaultHeaders: 'application/x-www-form-urlencoded',
 
   interceptors: {
     //请求拦截
@@ -74,6 +77,9 @@ const defaultRequestInterceptors = (config: InternalAxiosRequestConfig) => {
     config.params = {}
     config.url = url
   }
+  if (getStorage('token')) {
+    config.headers.token = getStorage('token')
+  }
   console.log(config)
   return config
 }

src/router/index.ts

@@ -197,14 +197,14 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
       alwaysShow: true
     },
     children: [
-      {
-        path: 'department',
-        component: () => import('@/views/Authorization/Department/Department.vue'),
-        name: 'Department',
-        meta: {
-          title: t('router.department')
-        }
-      },
+      // {
+      //   path: 'department',
+      //   component: () => import('@/views/Authorization/Department/Department.vue'),
+      //   name: 'Department',
+      //   meta: {
+      //     title: t('router.department')
+      //   }
+      // },
       {
         path: 'user',
         component: () => import('@/views/Authorization/User/User.vue'),
@@ -212,32 +212,32 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
         meta: {
           title: t('router.user')
         }
-      },
-      {
-        path: 'menu',
-        component: () => import('@/views/Authorization/Menu/Menu.vue'),
-        name: 'Menu',
-        meta: {
-          title: t('router.menuManagement')
-        }
-      },
-      {
-        path: 'role',
-        component: () => import('@/views/Authorization/Role/Role.vue'),
-        name: 'Role',
-        meta: {
-          title: t('router.role')
-        }
-      },
-      {
-        path: 'test',
-        component: () => import('@/views/Authorization/Test/Test.vue'),
-        name: 'Test',
-        meta: {
-          title: t('router.permission'),
-          permission: ['add', 'edit', 'delete']
-        }
       }
+      // {
+      //   path: 'menu',
+      //   component: () => import('@/views/Authorization/Menu/Menu.vue'),
+      //   name: 'Menu',
+      //   meta: {
+      //     title: t('router.menuManagement')
+      //   }
+      // },
+      // {
+      //   path: 'role',
+      //   component: () => import('@/views/Authorization/Role/Role.vue'),
+      //   name: 'Role',
+      //   meta: {
+      //     title: t('router.role')
+      //   }
+      // },
+      // {
+      //   path: 'test',
+      //   component: () => import('@/views/Authorization/Test/Test.vue'),
+      //   name: 'Test',
+      //   meta: {
+      //     title: t('router.permission'),
+      //     permission: ['add', 'edit', 'delete']
+      //   }
+      // }
     ]
   }
 ]

src/views/Authorization/User/User.vue

@@ -2,10 +2,10 @@
 import { ContentWrap } from '@/components/ContentWrap'
 import { useI18n } from '@/hooks/web/useI18n'
 import { Table } from '@/components/Table'
-import { ref, unref, nextTick, watch, reactive } from 'vue'
-import { ElButton, ElTree, ElInput, ElDivider } from 'element-plus'
-import { getDepartmentApi, getUserByIdApi, saveUserApi, deleteUserByIdApi } from '@/api/department'
-import type { DepartmentItem, DepartmentUserItem } from '@/api/department/types'
+import { ref, unref, watch, reactive } from 'vue'
+import { ElButton, ElTree } from 'element-plus'
+import { getUserList, addUser, updataUser, deleteUserById, getRoleApi } from '@/api/department'
+import type { DepartmentUserItem } from '@/api/department/types'
 import { useTable } from '@/hooks/web/useTable'
 import { Search } from '@/components/Search'
 import Write from './components/Write.vue'
@@ -18,9 +18,8 @@ const { t } = useI18n()
 const { tableRegister, tableState, tableMethods } = useTable({
   fetchDataApi: async () => {
     const { pageSize, currentPage } = tableState
-    const res = await getUserByIdApi({
-      id: unref(currentNodeKey),
-      pageIndex: unref(currentPage),
+    const res = await getUserList({
+      pageNum: unref(currentPage),
       pageSize: unref(pageSize),
       ...unref(searchParams)
     })
@@ -30,29 +29,14 @@ const { tableRegister, tableState, tableMethods } = useTable({
     }
   },
   fetchDelApi: async () => {
-    const res = await deleteUserByIdApi(unref(ids))
+    const res = await deleteUserById(unref(id))
     return !!res
   }
 })
 const { total, loading, dataList, pageSize, currentPage } = tableState
-const { getList, getElTableExpose, delList } = tableMethods
+const { getList, delList } = tableMethods
 
 const crudSchemas = reactive<CrudSchema[]>([
-  {
-    field: 'selection',
-    search: {
-      hidden: true
-    },
-    form: {
-      hidden: true
-    },
-    detail: {
-      hidden: true
-    },
-    table: {
-      type: 'selection'
-    }
-  },
   {
     field: 'index',
     label: t('userDemo.index'),
@@ -70,7 +54,7 @@ const crudSchemas = reactive<CrudSchema[]>([
     }
   },
   {
-    field: 'username',
+    field: 'name',
     label: t('userDemo.username')
   },
   {
@@ -78,38 +62,55 @@ const crudSchemas = reactive<CrudSchema[]>([
     label: t('userDemo.account')
   },
   {
-    field: 'department.id',
-    label: t('userDemo.department'),
-    detail: {
-      slots: {
-        default: (data: DepartmentUserItem) => {
-          return <>{data.department.departmentName}</>
-        }
+    field: 'isActive',
+    label: '是否启用',
+    form: {
+      component: 'Switch',
+      value: '1',
+      componentProps: {
+        activeText: '启用',
+        inactiveText: '禁用',
+        activeValue: '1',
+        inactiveValue: '0'
       }
-    },
+    }
+  },
+  {
+    field: 'roleId',
+    label: t('userDemo.role'),
     search: {
       hidden: true
     },
     form: {
-      component: 'TreeSelect',
-      componentProps: {
-        nodeKey: 'id',
-        props: {
-          label: 'departmentName'
-        }
-      },
+      component: 'Select',
       optionApi: async () => {
-        const res = await getDepartmentApi()
-        return res.data.list
+        const res = await getRoleApi()
+        console.log(res)
+        return res.data.map((e) => {
+          return {
+            label: e.roleDesc,
+            value: e.id
+          }
+        })
       }
+    }
+  },
+  {
+    field: 'phone',
+    label: '电话',
+    form: {
+      component: 'Input'
     },
-    table: {
-      type: 'index'
+    search: {
+      hidden: true
     }
   },
   {
-    field: 'role',
-    label: t('userDemo.role'),
+    field: 'address',
+    label: '住址',
+    form: {
+      component: 'Input'
+    },
     search: {
       hidden: true
     }
@@ -124,11 +125,27 @@ const crudSchemas = reactive<CrudSchema[]>([
       hidden: true
     }
   },
+  {
+    field: 'password',
+    label: '密码',
+    form: {
+      component: 'Input',
+      componentProps: {
+        type: 'password'
+      }
+    },
+    table: {
+      hidden: true
+    },
+    search: {
+      hidden: true
+    }
+  },
   {
     field: 'createTime',
     label: t('userDemo.createTime'),
     form: {
-      component: 'Input'
+      hidden: true
     },
     search: {
       hidden: true
@@ -181,18 +198,6 @@ const setSearchParams = (params: any) => {
 
 const treeEl = ref<typeof ElTree>()
 
-const currentNodeKey = ref('')
-const departmentList = ref<DepartmentItem[]>([])
-const fetchDepartment = async () => {
-  const res = await getDepartmentApi()
-  departmentList.value = res.data.list
-  currentNodeKey.value =
-    (res.data.list[0] && res.data.list[0]?.children && res.data.list[0].children[0].id) || ''
-  await nextTick()
-  unref(treeEl)?.setCurrentKey(currentNodeKey.value)
-}
-fetchDepartment()
-
 const currentDepartment = ref('')
 watch(
   () => currentDepartment.value,
@@ -201,18 +206,6 @@ watch(
   }
 )
 
-const currentChange = (data: DepartmentItem) => {
-  if (data.children) return
-  currentNodeKey.value = data.id
-  currentPage.value = 1
-  getList()
-}
-
-const filterNode = (value: string, data: DepartmentItem) => {
-  if (!value) return true
-  return data.departmentName.includes(value)
-}
-
 const dialogVisible = ref(false)
 const dialogTitle = ref('')
 
@@ -227,16 +220,13 @@ const AddAction = () => {
 }
 
 const delLoading = ref(false)
-const ids = ref<string[]>([])
+const id = ref<number>(0)
 
-const delData = async (row?: DepartmentUserItem) => {
-  const elTableExpose = await getElTableExpose()
-  ids.value = row
-    ? [row.id]
-    : elTableExpose?.getSelectionRows().map((v: DepartmentUserItem) => v.id) || []
+const delData = async (row: DepartmentUserItem) => {
+  id.value = row.id
   delLoading.value = true
 
-  await delList(unref(ids).length).finally(() => {
+  await delList(unref(id)).finally(() => {
     delLoading.value = false
   })
 }
@@ -258,7 +248,12 @@ const save = async () => {
   if (formData) {
     saveLoading.value = true
     try {
-      const res = await saveUserApi(formData)
+      let res: any
+      if (formData.id) {
+        res = await updataUser(formData)
+      } else {
+        res = await addUser(formData)
+      }
       if (res) {
         currentPage.value = 1
         getList()
@@ -274,32 +269,8 @@ const save = async () => {
 </script>
 
 <template>
-  <div class="flex w-100% h-100%">
-    <ContentWrap class="flex-1">
-      <div class="flex justify-center items-center">
-        <div class="flex-1">{{ t('userDemo.departmentList') }}</div>
-        <ElInput
-          v-model="currentDepartment"
-          class="flex-[2]"
-          :placeholder="t('userDemo.searchDepartment')"
-          clearable
-        />
-      </div>
-      <ElDivider />
-      <ElTree
-        ref="treeEl"
-        :data="departmentList"
-        default-expand-all
-        node-key="id"
-        :current-node-key="currentNodeKey"
-        :props="{
-          label: 'departmentName'
-        }"
-        :filter-node-method="filterNode"
-        @current-change="currentChange"
-      />
-    </ContentWrap>
-    <ContentWrap class="flex-[3] ml-20px">
+  <div>
+    <ContentWrap>
       <Search
         :schema="allSchemas.searchSchema"
         @reset="setSearchParams"
@@ -308,9 +279,6 @@ const save = async () => {
 
       <div class="mb-10px">
         <ElButton type="primary" @click="AddAction">{{ t('exampleDemo.add') }}</ElButton>
-        <ElButton :loading="delLoading" type="danger" @click="delData()">
-          {{ t('exampleDemo.del') }}
-        </ElButton>
       </div>
       <Table
         v-model:current-page="currentPage"

src/views/Authorization/User/components/Write.vue

@@ -19,12 +19,8 @@ const props = defineProps({
 })
 
 const rules = reactive({
-  username: [required()],
-  account: [required()],
-  'department.id': [required()],
-  role: [required()],
-  email: [required()],
-  createTime: [required()]
+  name: [required()],
+  account: [required()]
 })
 
 const { formRegister, formMethods } = useForm()

src/views/Login/components/LoginForm.vue

@@ -223,6 +223,7 @@ const signIn = async () => {
 
         if (res) {
           setStorage(appStore.getUserInfo, res.data)
+          setStorage('token', res.token)
           // 是否使用动态路由
           if (appStore.getDynamicRouter) {
             getRole()
@@ -246,17 +247,17 @@ const signIn = async () => {
 const getRole = async () => {
   const formData = await getFormData<UserType>()
   const params = {
-    roleName: formData.username
+    roleName: formData.account
   }
   // admin - 模拟后端过滤菜单
   // test - 模拟前端过滤菜单
   const res =
-    formData.username === 'admin' ? await getAdminRoleApi(params) : await getTestRoleApi(params)
+    formData.account === 'admin' ? await getAdminRoleApi(params) : await getTestRoleApi(params)
   if (res) {
     const routers = res.data || []
     setStorage('roleRouters', routers)
 
-    formData.username === 'admin'
+    formData.account === 'admin'
       ? await permissionStore.generateRoutes('admin', routers).catch(() => {})
       : await permissionStore.generateRoutes('test', routers).catch(() => {})
 

types/global.d.ts

@@ -45,7 +45,8 @@ declare global {
 
   declare interface IResponse<T = any> {
     code: string
-    data: T extends any ? T : T & any
+    data: T extends any ? T : T & any,
+    token: string
   }
 
   declare interface ThemeTypes {