refactor: API类型声明优化调整

Former-commit-id: 0ae696c2e872fa90feba0c5df9a92391c02d3e0b

src/api/auth/index.ts

@@ -1,11 +1,13 @@
 import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
-import { LoginFormData } from '@/types/api/user';
+import { LoginForm, VerifyCode } from './types';
 
 /**
- * 登录
+ *
+ * @param data {LoginForm}
+ * @returns
  */
-export function login(data: LoginFormData): AxiosPromise {
+export function loginApi(data: LoginForm): AxiosPromise<string> {
   return request({
     url: '/api/v1/auth/login',
     method: 'post',
@@ -19,9 +21,19 @@ export function login(data: LoginFormData): AxiosPromise {
 /**
  * 注销
  */
-export function logout() {
+export function logoutApi() {
   return request({
     url: '/api/v1/auth/logout',
     method: 'delete'
   });
 }
+
+/**
+ * 获取图片验证码
+ */
+export function getCaptcha(): AxiosPromise<VerifyCode> {
+  return request({
+    url: '/captcha?t=' + new Date().getTime().toString(),
+    method: 'get'
+  });
+}

src/api/auth/types.ts

@@ -0,0 +1,32 @@
+/**
+ * 登录表单类型声明
+ */
+export interface LoginForm {
+  username: string;
+  password: string;
+  grant_type: string;
+  /**
+   * 验证码Code
+   */
+  //verifyCode: string;
+  /**
+   * 验证码Code服务端缓存key(UUID)
+   */
+  // verifyCodeKey: string;
+}
+
+/**
+ * 登录响应类型声明
+ */
+export interface LoginResult {
+  access_token: string;
+  token_type: string;
+}
+
+/**
+ * 验证码类型声明
+ */
+export interface VerifyCode {
+  verifyCodeImg: string;
+  verifyCodeKey: string;
+}

src/api/dept/index.ts

@@ -1,16 +1,13 @@
-import { DeptFormData, DeptItem, DeptQueryParam } from '@/types/api/dept';
-import { Option } from '@/types/common';
 import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
+import { DeptForm, DeptQuery, Dept } from './types';
 
 /**
  * 部门树形表格
  *
  * @param queryParams
  */
-export function listDepartments(
+export function listDepartments(queryParams?: DeptQuery): AxiosPromise<Dept[]> {
-  queryParams?: DeptQueryParam
-): AxiosPromise<DeptItem[]> {
   return request({
     url: '/api/v1/dept',
     method: 'get',
@@ -21,7 +18,7 @@ export function listDepartments(
 /**
  * 部门下拉列表
  */
-export function listDeptOptions(): AxiosPromise<Option[]> {
+export function listDeptOptions(): AxiosPromise<OptionType[]> {
   return request({
     url: '/api/v1/dept/options',
     method: 'get'
@@ -33,7 +30,7 @@ export function listDeptOptions(): AxiosPromise<Option[]> {
  *
  * @param id
  */
-export function getDeptForm(id: string): AxiosPromise<DeptFormData> {
+export function getDeptForm(id: string): AxiosPromise<DeptForm> {
   return request({
     url: '/api/v1/dept/' + id + '/form',
     method: 'get'
@@ -45,7 +42,7 @@ export function getDeptForm(id: string): AxiosPromise<DeptFormData> {
  *
  * @param data
  */
-export function addDept(data: DeptFormData) {
+export function addDept(data: DeptForm) {
   return request({
     url: '/api/v1/dept',
     method: 'post',
@@ -59,7 +56,7 @@ export function addDept(data: DeptFormData) {
  * @param id
  * @param data
  */
-export function updateDept(id: string, data: DeptFormData) {
+export function updateDept(id: string, data: DeptForm) {
   return request({
     url: '/api/v1/dept/' + id,
     method: 'put',

src/api/dept/types.ts

@@ -1,16 +1,15 @@
 /**
- * 部门查询参数类型声明
+ * 部门查询参数
  */
-export interface DeptQueryParam {
+export interface DeptQuery {
   keywords: string | undefined;
   status: number | undefined;
 }
 
 /**
- * 部门列表项声明
+ * 部门类型
  */
-
+export interface Dept {
-export interface DeptItem {
   id: string;
   name: string;
   parentId: string;
@@ -20,13 +19,13 @@ export interface DeptItem {
   leader?: string;
   mobile?: string;
   email?: string;
-  children: DeptItem[];
+  children: Dept[];
 }
 
 /**
- * 部门表单类型声明
+ * 部门表单类型
  */
-export interface DeptFormData {
+export interface DeptForm {
   id?: string;
   parentId: string;
   name: string;

src/api/dict/index.ts

@@ -1,14 +1,13 @@
-import { Option } from '@/types/common';
-import {
-  DictTypeFormData,
-  DictItemFormData,
-  DictItemPageResult,
-  DictItemQueryParam,
-  DictPageResult,
-  DictQueryParam
-} from '@/types/api/dict';
 import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
+import {
+  DictQuery,
+  DictPageResult,
+  DictTypeForm,
+  DictItemQuery,
+  DictItemPageResult,
+  DictItemForm
+} from './types';
 
 /**
  * 获取字典类型分页列表
@@ -16,7 +15,7 @@ import { AxiosPromise } from 'axios';
  * @param queryParams
  */
 export function listDictTypePages(
-  queryParams: DictQueryParam
+  queryParams: DictQuery
 ): AxiosPromise<DictPageResult> {
   return request({
     url: '/api/v1/dict/types/pages',
@@ -30,7 +29,7 @@ export function listDictTypePages(
  *
  * @param id
  */
-export function getDictTypeForm(id: number): AxiosPromise<DictTypeFormData> {
+export function getDictTypeForm(id: number): AxiosPromise<DictTypeForm> {
   return request({
     url: '/api/v1/dict/types/' + id + '/form',
     method: 'get'
@@ -42,7 +41,7 @@ export function getDictTypeForm(id: number): AxiosPromise<DictTypeFormData> {
  *
  * @param data
  */
-export function addDictType(data: DictTypeFormData) {
+export function addDictType(data: DictTypeForm) {
   return request({
     url: '/api/v1/dict/types',
     method: 'post',
@@ -56,7 +55,7 @@ export function addDictType(data: DictTypeFormData) {
  * @param id
  * @param data
  */
-export function updateDictType(id: number, data: DictTypeFormData) {
+export function updateDictType(id: number, data: DictTypeForm) {
   return request({
     url: '/api/v1/dict/types/' + id,
     method: 'put',
@@ -81,7 +80,7 @@ export function deleteDictTypes(ids: string) {
  */
 export function listDictItemsByTypeCode(
   typeCode: string
-): AxiosPromise<Option[]> {
+): AxiosPromise<OptionType[]> {
   return request({
     url: '/api/v1/dict/types/' + typeCode + '/items',
     method: 'get'
@@ -92,7 +91,7 @@ export function listDictItemsByTypeCode(
  * 获取字典项分页列表
  */
 export function listDictItemPages(
-  queryParams: DictItemQueryParam
+  queryParams: DictItemQuery
 ): AxiosPromise<DictItemPageResult> {
   return request({
     url: '/api/v1/dict/items/pages',
@@ -106,7 +105,7 @@ export function listDictItemPages(
  *
  * @param id
  */
-export function getDictItemData(id: number): AxiosPromise<DictItemFormData> {
+export function getDictItemData(id: number): AxiosPromise<DictItemForm> {
   return request({
     url: '/api/v1/dict/items/' + id + '/form',
     method: 'get'
@@ -118,7 +117,7 @@ export function getDictItemData(id: number): AxiosPromise<DictItemFormData> {
  *
  * @param data
  */
-export function saveDictItem(data: DictItemFormData) {
+export function saveDictItem(data: DictItemForm) {
   return request({
     url: '/api/v1/dict/items',
     method: 'post',
@@ -132,7 +131,7 @@ export function saveDictItem(data: DictItemFormData) {
  * @param id
  * @param data
  */
-export function updateDictItem(id: number, data: DictItemFormData) {
+export function updateDictItem(id: number, data: DictItemForm) {
   return request({
     url: '/api/v1/dict/items/' + id,
     method: 'put',

src/api/dict/types.ts

@@ -1,17 +1,15 @@
-import { PageQueryParam, PageResult } from './base';
-
 /**
- * 字典查询参数类型声明
+ * 字典查询参数
  */
-export interface DictQueryParam extends PageQueryParam {
+export interface DictQuery extends PageQuery {
   /**
    * 字典名称
    */
-  name: string | undefined;
+  name?: string;
 }
 
 /**
- * 字典分页列表项声明
+ * 字典类型
  */
 export interface Dict {
   id: number;
@@ -29,7 +27,7 @@ export type DictPageResult = PageResult<Dict[]>;
 /**
  * 字典表单类型声明
  */
-export interface DictTypeFormData {
+export interface DictTypeForm {
   id: number | undefined;
   name: string;
   code: string;
@@ -40,7 +38,7 @@ export interface DictTypeFormData {
 /**
  * 字典项查询参数类型声明
  */
-export interface DictItemQueryParam extends PageQueryParam {
+export interface DictItemQuery extends PageQuery {
   /**
    * 字典项名称
    */
@@ -52,13 +50,13 @@ export interface DictItemQueryParam extends PageQueryParam {
 }
 
 /**
- * 字典分页列表项声明
+ * 字典数据项类型
  */
 export interface DictItem {
   id: number;
   name: string;
   value: string;
-  dictCode: string;
+  typeCode: string;
   sort: number;
   status: number;
   defaulted: number;
@@ -73,7 +71,7 @@ export type DictItemPageResult = PageResult<DictItem[]>;
 /**
  * 字典表单类型声明
  */
-export interface DictItemFormData {
+export interface DictItemForm {
   id?: number;
   typeCode?: string;
   typeName?: string;

src/api/menu/index.ts

@@ -1,12 +1,6 @@
-import {
-  MenuFormData,
-  MenuItem,
-  MenuQueryParam,
-  Resource
-} from '@/types/api/menu';
-import { Option } from '@/types/common';
 import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
+import { MenuQuery, Menu, Resource, MenuForm } from './types';
 
 /**
  * 获取路由列表
@@ -23,9 +17,7 @@ export function listRoutes() {
  *
  * @param queryParams
  */
-export function listMenus(
+export function listMenus(queryParams: MenuQuery): AxiosPromise<Menu[]> {
-  queryParams: MenuQueryParam
-): AxiosPromise<MenuItem[]> {
   return request({
     url: '/api/v1/menus',
     method: 'get',
@@ -36,7 +28,7 @@ export function listMenus(
 /**
  * 获取菜单下拉树形列表
  */
-export function listMenuOptions(): AxiosPromise<Option[]> {
+export function listMenuOptions(): AxiosPromise<OptionType[]> {
   return request({
     url: '/api/v1/menus/options',
     method: 'get'
@@ -57,7 +49,7 @@ export function listResources(): AxiosPromise<Resource[]> {
  * 获取菜单详情
  * @param id
  */
-export function getMenuDetail(id: string): AxiosPromise<MenuFormData> {
+export function getMenuDetail(id: string): AxiosPromise<MenuForm> {
   return request({
     url: '/api/v1/menus/' + id,
     method: 'get'
@@ -69,7 +61,7 @@ export function getMenuDetail(id: string): AxiosPromise<MenuFormData> {
  *
  * @param data
  */
-export function addMenu(data: MenuFormData) {
+export function addMenu(data: MenuForm) {
   return request({
     url: '/api/v1/menus',
     method: 'post',
@@ -83,7 +75,7 @@ export function addMenu(data: MenuFormData) {
  * @param id
  * @param data
  */
-export function updateMenu(id: string, data: MenuFormData) {
+export function updateMenu(id: string, data: MenuForm) {
   return request({
     url: '/api/v1/menus/' + id,
     method: 'put',

src/api/menu/types.ts

@@ -1,7 +1,7 @@
 /**
  * 菜单查询参数类型声明
  */
-export interface MenuQueryParam {
+export interface MenuQuery {
   keywords?: string;
 }
 
@@ -9,7 +9,7 @@ export interface MenuQueryParam {
  * 菜单分页列表项声明
  */
 
-export interface MenuItem {
+export interface Menu {
   id?: number;
   parentId: number;
   type?: string | 'CATEGORY' | 'MENU' | 'EXTLINK';
@@ -20,13 +20,13 @@ export interface MenuItem {
   component: string;
   sort: number;
   visible: number;
-  children: MenuItem[];
+  children: Menu[];
 }
 
 /**
  * 菜单表单类型声明
  */
-export interface MenuFormData {
+export interface MenuForm {
   /**
    * 菜单ID
    */

src/api/role/index.ts

@@ -1,13 +1,6 @@
-import {
-  RoleFormData,
-  RolePageResult,
-  RoleQueryParam,
-  RoleResource
-} from '@/types/api/role';
-
-import { Option } from '@/types/common';
 import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
+import { RoleQuery, RolePageResult, RoleForm } from './types';
 
 /**
  * 获取角色分页数据
@@ -15,7 +8,7 @@ import { AxiosPromise } from 'axios';
  * @param queryParams
  */
 export function listRolePages(
-  queryParams?: RoleQueryParam
+  queryParams?: RoleQuery
 ): AxiosPromise<RolePageResult> {
   return request({
     url: '/api/v1/roles/pages',
@@ -30,8 +23,8 @@ export function listRolePages(
  * @param queryParams
  */
 export function listRoleOptions(
-  queryParams?: RoleQueryParam
+  queryParams?: RoleQuery
-): AxiosPromise<Option[]> {
+): AxiosPromise<OptionType[]> {
   return request({
     url: '/api/v1/roles/options',
     method: 'get',
@@ -72,7 +65,7 @@ export function updateRoleMenus(
  *
  * @param id
  */
-export function getRoleFormDetail(id: number): AxiosPromise<RoleFormData> {
+export function getRoleFormDetail(id: number): AxiosPromise<RoleForm> {
   return request({
     url: '/api/v1/roles/' + id,
     method: 'get'
@@ -84,7 +77,7 @@ export function getRoleFormDetail(id: number): AxiosPromise<RoleFormData> {
  *
  * @param data
  */
-export function addRole(data: RoleFormData) {
+export function addRole(data: RoleForm) {
   return request({
     url: '/api/v1/roles',
     method: 'post',
@@ -98,7 +91,7 @@ export function addRole(data: RoleFormData) {
  * @param id
  * @param data
  */
-export function updateRole(id: number, data: RoleFormData) {
+export function updateRole(id: number, data: RoleForm) {
   return request({
     url: '/api/v1/roles/' + id,
     method: 'put',

src/api/role/types.ts

@@ -1,16 +1,14 @@
-import { PageQueryParam, PageResult } from './base';
-
 /**
  * 角色查询参数类型
  */
-export interface RoleQueryParam extends PageQueryParam {
+export interface RoleQuery extends PageQuery {
   keywords?: string;
 }
 
 /**
  * 角色分页列表项
  */
-export interface RoleItem {
+export interface Role {
   id: string;
   name: string;
   code: string;
@@ -24,23 +22,19 @@ export interface RoleItem {
 /**
  * 角色分页项类型
  */
-export type RolePageResult = PageResult<RoleItem[]>;
+export type RolePageResult = PageResult<Role[]>;
 
 /**
  * 角色表单类型
  */
-export interface RoleFormData {
+export interface RoleForm {
-  id: string | undefined;
+  id?: string;
   name: string;
   code: string;
   sort: number;
   status: number;
-}
-
   /**
- *
+   * 数据权限
    */
-export interface RoleResource {
+  dataScope: number;
-  menuIds: string[];
-  permIds: string[];
 }

src/api/user/index.ts

@@ -1,11 +1,6 @@
 import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
-import {
+import { UserForm, UserInfo, UserPageResult, UserQuery } from './types';
-  UserFormData,
-  UserInfo,
-  UserPageResult,
-  UserQueryParam
-} from '@/types/api/user';
 
 /**
  * 登录成功后获取用户信息（昵称、头像、权限集合和角色集合）
@@ -23,7 +18,7 @@ export function getUserInfo(): AxiosPromise<UserInfo> {
  * @param queryParams
  */
 export function listUserPages(
-  queryParams: UserQueryParam
+  queryParams: UserQuery
 ): AxiosPromise<UserPageResult> {
   return request({
     url: '/api/v1/users/pages',
@@ -37,7 +32,7 @@ export function listUserPages(
  *
  * @param userId
  */
-export function getUserFormData(userId: number): AxiosPromise<UserFormData> {
+export function getUserForm(userId: number): AxiosPromise<UserForm> {
   return request({
     url: '/api/v1/users/' + userId + '/form',
     method: 'get'
@@ -63,7 +58,7 @@ export function addUser(data: any) {
  * @param id
  * @param data
  */
-export function updateUser(id: number, data: UserFormData) {
+export function updateUser(id: number, data: UserForm) {
   return request({
     url: '/api/v1/users/' + id,
     method: 'put',
@@ -130,7 +125,7 @@ export function downloadTemplate() {
  * @param queryParams
  * @returns
  */
-export function exportUser(queryParams: UserQueryParam) {
+export function exportUser(queryParams: UserQuery) {
   return request({
     url: '/api/v1/users/_export',
     method: 'get',

src/api/user/types.ts

@@ -1,22 +1,3 @@
-import { PageQueryParam, PageResult } from './base';
-
-/**
- * 登录表单
- */
-export interface LoginFormData {
-  username: string;
-  password: string;
-  grant_type: string;
-}
-
-/**
- * 登录响应
- */
-export interface LoginResponseData {
-  access_token: string;
-  token_type: string;
-}
-
 /**
  * 登录用户信息
  */
@@ -30,7 +11,7 @@ export interface UserInfo {
 /**
  * 用户查询参数
  */
-export interface UserQueryParam extends PageQueryParam {
+export interface UserQuery extends PageQuery {
   keywords: string;
   status: number;
   deptId: number;
@@ -39,7 +20,7 @@ export interface UserQueryParam extends PageQueryParam {
 /**
  * 用户分页列表项声明
  */
-export interface UserItem {
+export interface UserType {
   id: string;
   username: string;
   nickname: string;
@@ -56,12 +37,12 @@ export interface UserItem {
 /**
  * 用户分页项类型声明
  */
-export type UserPageResult = PageResult<UserItem[]>;
+export type UserPageResult = PageResult<UserType[]>;
 
 /**
  * 用户表单类型声明
  */
-export interface UserFormData {
+export interface UserForm {
   id: number | undefined;
   deptId: number;
   username: string;

src/store/modules/app.ts

@@ -1,4 +1,4 @@
-import { AppState } from '@/types/store/app';
+import { AppState } from './types';
 import { localStorage } from '@/utils/storage';
 import { defineStore } from 'pinia';
 import { getLanguage } from '@/lang/index';

src/store/modules/permission.ts

@@ -1,4 +1,4 @@
-import { PermissionState } from '@/types/store/permission';
+import { PermissionState } from './types';
 import { RouteRecordRaw } from 'vue-router';
 import { defineStore } from 'pinia';
 import { constantRoutes } from '@/router';

src/store/modules/settings.ts

@@ -1,5 +1,5 @@
 import { defineStore } from 'pinia';
-import { SettingState } from '@/types/store/setting';
+import { SettingState } from './types';
 import defaultSettings from '../../settings';
 import { localStorage } from '@/utils/storage';
 

src/store/modules/tagsView.ts

@@ -1,5 +1,5 @@
 import { defineStore } from 'pinia';
-import { TagsViewState } from '@/types/store/tagsview';
+import { TagsViewState } from './types';
 
 const useTagsViewStore = defineStore({
   id: 'tagsView',

src/store/modules/types.ts

@@ -0,0 +1,41 @@
+import { RouteLocationNormalized, RouteRecordRaw } from 'vue-router';
+
+export interface AppState {
+  device: string;
+  sidebar: {
+    opened: boolean;
+    withoutAnimation: boolean;
+  };
+  language: string;
+  size: string;
+}
+
+export interface PermissionState {
+  routes: RouteRecordRaw[];
+  addRoutes: RouteRecordRaw[];
+}
+
+export interface SettingState {
+  theme: string;
+  tagsView: boolean;
+  fixedHeader: boolean;
+  showSettings: boolean;
+  sidebarLogo: boolean;
+}
+
+export interface UserState {
+  token: string;
+  nickname: string;
+  avatar: string;
+  roles: string[];
+  perms: string[];
+}
+
+export interface TagView extends Partial<RouteLocationNormalized> {
+  title?: string;
+}
+
+export interface TagsViewState {
+  visitedViews: TagView[];
+  cachedViews: string[];
+}

src/store/modules/user.ts

@@ -1,12 +1,11 @@
 import { defineStore } from 'pinia';
-import { LoginFormData } from '@/types/api/user';
+import { UserState } from './types';
-import { UserState } from '@/types/store/user';
 
 import { localStorage } from '@/utils/storage';
-import { login, logout } from '@/api/auth';
+import { loginApi, logoutApi } from '@/api/auth';
 import { getUserInfo } from '@/api/user';
-
 import { resetRouter } from '@/router';
+import { LoginForm } from '@/api/auth/types';
 
 const useUserStore = defineStore({
   id: 'user',
@@ -22,12 +21,12 @@ const useUserStore = defineStore({
       this.$reset();
     },
     /**
-     * 登录 login
+     * 登录
      */
-    login(loginData: LoginFormData) {
+    login(data: LoginForm) {
-      const { username, password } = loginData;
+      const { username, password } = data;
       return new Promise((resolve, reject) => {
-        login({
+        loginApi({
           grant_type: 'password',
           username: username.trim(),
           password: password
@@ -65,7 +64,6 @@ const useUserStore = defineStore({
             resolve(data);
           })
           .catch(error => {
-            console.log('error', error);
             reject(error);
           });
       });
@@ -76,7 +74,7 @@ const useUserStore = defineStore({
      */
     logout() {
       return new Promise((resolve, reject) => {
-        logout()
+        logoutApi()
           .then(() => {
             localStorage.remove('token');
             this.RESET_STATE();

src/types/api/base.d.ts

@@ -1,9 +0,0 @@
-export interface PageQueryParam {
-  pageNum: number;
-  pageSize: number;
-}
-
-export interface PageResult<T> {
-  list: T;
-  total: number;
-}

src/types/api/perm.d.ts

@@ -1,37 +0,0 @@
-import { PageQueryParam, PageResult } from './base';
-
-/**
- * 权限查询参数类型声明
- */
-export interface PermQueryParam extends PageQueryParam {
-  menuId: any;
-  name: string | undefined;
-}
-
-/**
- * 权限分页列表项声明
- */
-export interface PermItem {
-  id: number;
-  name: string;
-  menuId: string;
-  urlPerm: string;
-  btnPerm: string;
-  roles?: string[];
-}
-
-/**
- * 权限分页项类型声明
- */
-export type PermPageResult = PageResult<PermItem[]>;
-
-/**
- * 权限表单类型声明
- */
-export interface PermFormData {
-  id: number | undefined;
-  name: string;
-  urlPerm: string;
-  btnPerm: string;
-  menuId: string;
-}

src/types/common.d.ts

@@ -1,17 +0,0 @@
-/**
- * 弹窗类型
- */
-export interface Dialog {
-  title: string;
-  visible: boolean;
-}
-
-/**
- * 通用组件选择项类型
- */
-export interface Option {
-  value: string;
-  label: string;
-  checked?: boolean;
-  children?: Option[];
-}

src/types/store/app.d.ts

@@ -1,12 +0,0 @@
-/**
- * 系统类型声明
- */
- export interface AppState {
-  device: string;
-  sidebar: {
-    opened: boolean;
-    withoutAnimation: boolean;
-  };
-  language: string;
-  size: string;
-}

src/types/store/permission.d.ts

@@ -1,7 +0,0 @@
-/**
- * 权限类型声明
- */
- export interface PermissionState {
-  routes: RouteRecordRaw[];
-  addRoutes: RouteRecordRaw[];
-}

src/types/store/setting.d.ts

@@ -1,10 +0,0 @@
-/**
- * 设置状态类型声明
- */
- export interface SettingState {
-  theme: string;
-  tagsView: boolean;
-  fixedHeader: boolean;
-  showSettings: boolean;
-  sidebarLogo: boolean;
-}

src/types/store/tagsview.d.ts

@@ -1,13 +0,0 @@
-import { RouteLocationNormalized } from 'vue-router';
-
-/**
- * 标签状态类型声明
- */
-export interface TagView extends Partial<RouteLocationNormalized> {
-  title?: string;
-}
-
-export interface TagsViewState {
-  visitedViews: TagView[];
-  cachedViews: string[];
-}

src/types/store/user.d.ts

@@ -1,7 +0,0 @@
-export interface UserState {
-  token: string;
-  nickname: string;
-  avatar: string;
-  roles: string[];
-  perms: string[];
-}

src/utils/request.ts

@@ -7,7 +7,7 @@ import useStore from '@/store';
 const service = axios.create({
   baseURL: import.meta.env.VITE_APP_BASE_API,
   timeout: 50000,
-  headers: { 'Content-Type': 'application/json;charset=utf-8' }
+  headers: { 'Content-Type': 'application/json;charset=utf-8' },
 });
 
 // 请求拦截器
@@ -24,7 +24,7 @@ service.interceptors.request.use(
     }
     return config;
   },
-  error => {
+  (error: any) => {
     return Promise.reject(error);
   }
 );
@@ -33,36 +33,36 @@ service.interceptors.request.use(
 service.interceptors.response.use(
   (response: AxiosResponse) => {
     const { code, msg } = response.data;
-    if (code) {
-      // 有状态码判断是否为00000,除此皆为异常响应
     if (code === '00000') {
       return response.data;
     } else {
-        ElMessage({
+      // 响应数据为二进制流处理(Excel导出)
-          message: response.data.msg || '系统出错',
+      if (response.data instanceof ArrayBuffer) {
-          type: 'error'
-        });
-        return Promise.reject(new Error(msg || 'Error'));
-      }
-    } else {
-      // 无状态码响应直接返回
-      console.log('response', response);
         return response;
       }
-  },
+
-  error => {
-    const { code, msg } = error.response.data;
-    if (code === 'A0230') {
-      // token 过期
-      localStorage.clear(); // 清除浏览器全部缓存
-      ElMessageBox.alert('当前页面已失效，请重新登录', '提示', {});
-    } else {
       ElMessage({
         message: msg || '系统出错',
-        type: 'error'
+        type: 'error',
       });
       return Promise.reject(new Error(msg || 'Error'));
     }
+  },
+  (error: any) => {
+    if (error.response.data) {
+      const { code } = error.response.data;
+      // token 过期,重新登录
+      if (code === 'A0230') {
+        ElMessageBox.confirm('当前页面已失效，请重新登录', 'Warning', {
+          confirmButtonText: 'OK',
+          type: 'warning',
+        }).then(() => {
+          localStorage.clear();
+          window.location.href = '/';
+        });
+      }
+    }
+    return Promise.reject(error.message);
   }
 );
 

src/views/login/index.vue

@@ -99,7 +99,7 @@ import useStore from '@/store';
 
 // API依赖
 import { useRoute } from 'vue-router';
-import { LoginFormData } from '@/types/api/user';
+import { LoginForm } from '@/api/auth/types';
 
 const { user } = useStore();
 const route = useRoute();
@@ -112,7 +112,7 @@ const state = reactive({
   loginForm: {
     username: 'admin',
     password: '123456'
-  } as LoginFormData,
+  } as LoginForm,
   loginRules: {
     username: [{ required: true, trigger: 'blur' }],
     password: [{ required: true, trigger: 'blur', validator: validatePassword }]

src/views/system/dept/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts">
 export default {
-  name: 'dept'
+  name: 'dept',
 };
 </script>
 
@@ -13,13 +13,12 @@ import {
   updateDept,
   addDept,
   listDeptOptions,
-  listDepartments
+  listDepartments,
 } from '@/api/dept';
 
-import { Search, Plus, Edit, Refresh, Delete } from '@element-plus/icons-vue';
+import { Search, Plus, Refresh, Delete } from '@element-plus/icons-vue';
 import { ElForm, ElMessage, ElMessageBox } from 'element-plus';
-import { DeptFormData, DeptItem, DeptQueryParam } from '@/types/api/dept';
+import { Dept, DeptForm, DeptQuery } from '@/api/dept/types';
-import { Dialog, Option } from '@/types/common';
 
 const queryFormRef = ref(ElForm);
 const dataFormRef = ref(ElForm);
@@ -29,21 +28,21 @@ const state = reactive({
   // 选中ID数组
   ids: [] as number[],
   // 表格树数据
-  dataList: [] as DeptItem[],
+  dataList: [] as Dept[],
-  deptOptions: [] as Option[],
+  deptOptions: [] as OptionType[],
-  dialog: { visible: false } as Dialog,
+  dialog: { visible: false } as DialogType,
-  queryParams: {} as DeptQueryParam,
+  queryParams: {} as DeptQuery,
   formData: {
     sort: 1,
-    status: 1
+    status: 1,
-  } as DeptFormData,
+  } as DeptForm,
   rules: {
     parentId: [
-      { required: true, message: '上级部门不能为空', trigger: 'blur' }
+      { required: true, message: '上级部门不能为空', trigger: 'blur' },
     ],
     name: [{ required: true, message: '部门名称不能为空', trigger: 'blur' }],
-    sort: [{ required: true, message: '显示排序不能为空', trigger: 'blur' }]
+    sort: [{ required: true, message: '显示排序不能为空', trigger: 'blur' }],
-  }
+  },
 });
 
 const {
@@ -54,7 +53,7 @@ const {
   queryParams,
   formData,
   rules,
-  dialog
+  dialog,
 } = toRefs(state);
 
 /**
@@ -85,11 +84,11 @@ function handleSelectionChange(selection: any) {
  */
 async function getDeptOptions() {
   const deptOptions: any[] = [];
-  listDeptOptions().then(response => {
+  listDeptOptions().then((response) => {
     const rootDeptOption = {
       value: '0',
       label: '顶级部门',
-      children: response.data
+      children: response.data,
     };
     deptOptions.push(rootDeptOption);
     state.deptOptions = deptOptions;
@@ -105,7 +104,7 @@ function handleAdd(row: any) {
   formData.value.parentId = row.id;
   dialog.value = {
     title: '添加部门',
-    visible: true
+    visible: true,
   };
 }
 
@@ -117,7 +116,7 @@ async function handleUpdate(row: any) {
   const deptId = row.id || state.ids;
   state.dialog = {
     title: '修改部门',
-    visible: true
+    visible: true,
   };
   getDeptForm(deptId).then((response: any) => {
     state.formData = response.data;
@@ -160,7 +159,7 @@ function handleDelete(row: any) {
   ElMessageBox.confirm(`确认删除已选中的数据项?`, '警告', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
-    type: 'warning'
+    type: 'warning',
   })
     .then(() => {
       deleteDept(ids)
@@ -266,28 +265,24 @@ onMounted(() => {
           <template #default="scope">
             <el-button
               type="primary"
-              :icon="Edit"
+               link
-              circle
-              plain
               @click.stop="handleUpdate(scope.row)"
-            >
+            >新增
             </el-button>
             <el-button
               type="success"
-              :icon="Plus"
+              link
-              circle
-              plain
               @click.stop="handleAdd(scope.row)"
             >
+            修改
             </el-button>
 
             <el-button
               type="danger"
-              :icon="Delete"
+              link
-              circle
-              plain
               @click.stop="handleDelete(scope.row)"
             >
+            删除
             </el-button>
           </template>
         </el-table-column>

src/views/system/dict/components/DictItem.vue

@@ -1,46 +1,41 @@
 <script lang="ts">
 export default {
-  name: 'dictItem'
+  name: 'dictItem',
 };
 </script>
 
 <script setup lang="ts">
 import { onMounted, reactive, ref, toRefs, watch } from 'vue';
 import { ElForm, ElMessage, ElMessageBox } from 'element-plus';
-import {
-  DictItem,
-  DictItemFormData,
-  DictItemQueryParam
-} from '@/types/api/dict';
 
-import { Dialog } from '@/types/common';
 import {
   listDictItemPages,
   getDictItemData,
   saveDictItem,
   updateDictItem,
-  deleteDictItems
+  deleteDictItems,
 } from '@/api/dict';
 import { Search, Plus, Edit, Refresh, Delete } from '@element-plus/icons-vue';
+import { DictItem, DictItemForm, DictItemQuery } from '@/api/dict/types';
 
 const props = defineProps({
   typeCode: {
     type: String,
     default: () => {
       return '';
-    }
+    },
   },
   typeName: {
     type: String,
     default: () => {
       return '';
-    }
+    },
-  }
+  },
 });
 
 watch(
   () => props.typeCode,
-  value => {
+  (value) => {
     state.queryParams.typeCode = value;
     state.formData.typeCode = value;
     handleQuery();
@@ -59,21 +54,21 @@ const state = reactive({
   // 非多个禁用
   multiple: true,
   total: 0,
-  queryParams: { pageNum: 1, pageSize: 10 } as DictItemQueryParam,
+  queryParams: { pageNum: 1, pageSize: 10 } as DictItemQuery,
   dictItemList: [] as DictItem[],
-  dialog: { visible: false } as Dialog,
+  dialog: { visible: false } as DialogType,
   formData: {
     typeCode: props.typeCode,
     typeName: props.typeName,
     status: 1,
-    sort: 1
+    sort: 1,
-  } as DictItemFormData,
+  } as DictItemForm,
   rules: {
     name: [{ required: true, message: '请输入字典项名称', trigger: 'blur' }],
-    value: [{ required: true, message: '请输入字典项值', trigger: 'blur' }]
+    value: [{ required: true, message: '请输入字典项值', trigger: 'blur' }],
   },
   localDictCode: props.typeCode,
-  localDictName: props.typeName
+  localDictName: props.typeName,
 });
 
 const {
@@ -84,7 +79,7 @@ const {
   dialog,
   formData,
   rules,
-  total
+  total,
 } = toRefs(state);
 
 function handleQuery() {
@@ -121,14 +116,14 @@ function handleAdd() {
   }
   state.dialog = {
     title: '添加字典数据项',
-    visible: true
+    visible: true,
   };
 }
 
 function handleUpdate(row: any) {
   state.dialog = {
     title: '修改字典数据项',
-    visible: true
+    visible: true,
   };
   const id = row.id || state.ids;
   getDictItemData(id).then(({ data }) => {
@@ -167,7 +162,7 @@ function handleDelete(row: any) {
   ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
-    type: 'warning'
+    type: 'warning',
   })
     .then(() => {
       deleteDictItems(ids).then(() => {

src/views/system/dict/components/DictType.vue

@@ -1,6 +1,6 @@
 <script lang="ts">
 export default {
-  name: 'dictType'
+  name: 'dictType',
 };
 </script>
 
@@ -135,13 +135,11 @@ import {
   getDictTypeForm,
   addDictType,
   updateDictType,
-  deleteDictTypes
+  deleteDictTypes,
 } from '@/api/dict';
 import { Search, Plus, Edit, Refresh, Delete } from '@element-plus/icons-vue';
 import { ElForm, ElMessage, ElMessageBox } from 'element-plus';
-
+import { Dict, DictQuery, DictTypeForm } from '@/api/dict/types';
-import { Dialog } from '@/types/common';
-import { Dict, DictTypeFormData, DictQueryParam } from '@/types/api/dict';
 
 const queryFormRef = ref(ElForm);
 const dataFormRef = ref(ElForm);
@@ -158,18 +156,18 @@ const state = reactive({
   multiple: true,
   queryParams: {
     pageNum: 1,
-    pageSize: 10
+    pageSize: 10,
-  } as DictQueryParam,
+  } as DictQuery,
   dictList: [] as Dict[],
   total: 0,
-  dialog: { visible: false } as Dialog,
+  dialog: { visible: false } as DialogType,
   formData: {
-    status: 1
+    status: 1,
-  } as DictTypeFormData,
+  } as DictTypeForm,
   rules: {
     name: [{ required: true, message: '请输入字典名称', trigger: 'blur' }],
-    code: [{ required: true, message: '请输入字典编码', trigger: 'blur' }]
+    code: [{ required: true, message: '请输入字典编码', trigger: 'blur' }],
-  }
+  },
 });
 
 const { total, dialog, loading, dictList, formData, rules, queryParams } =
@@ -199,14 +197,14 @@ function handleSelectionChange(selection: any) {
 function handleAdd() {
   state.dialog = {
     title: '添加字典',
-    visible: true
+    visible: true,
   };
 }
 
 function handleUpdate(row: any) {
   state.dialog = {
     title: '修改字典',
-    visible: true
+    visible: true,
   };
   const id = row.id || state.ids;
   getDictTypeForm(id).then(({ data }) => {
@@ -245,7 +243,7 @@ function handleDelete(row: any) {
   ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
-    type: 'warning'
+    type: 'warning',
   })
     .then(() => {
       deleteDictTypes(ids).then(() => {

src/views/system/menu/index.vue

@@ -100,25 +100,28 @@
           <template #default="scope">
             <el-button
               type="success"
-              :icon="Plus"
+              link
-              circle
-              plain
               @click.stop="handleAdd(scope.row)"
-            />
+
+              v-if="scope.row.type=='CATALOG' ||scope.row.type=='MENU'"
+            >
+            新增
+          </el-button>
+
             <el-button
               type="primary"
-              :icon="Edit"
+              link
-              circle
-              plain
               @click.stop="handleUpdate(scope.row)"
-            />
+            >
+          修改
+          </el-button>
             <el-button
               type="danger"
-              :icon="Delete"
+             link
-              circle
-              plain
               @click.stop="handleDelete(scope.row)"
-            />
+           >
+          删除
+          </el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -276,9 +279,7 @@ import { reactive, ref, onMounted, toRefs } from 'vue';
 import { Search, Plus, Edit, Refresh, Delete } from '@element-plus/icons-vue';
 import { ElForm, ElMessage, ElMessageBox, ElPopover } from 'element-plus';
 
-import { Dialog, Option } from '@/types/common';
+import { MenuQuery, MenuForm, Menu } from '@/api/menu/types';
-
-import { MenuFormData, MenuItem, MenuQueryParam } from '@/types/api/menu';
 // API 依赖
 import {
   listMenus,
@@ -286,7 +287,7 @@ import {
   listMenuOptions,
   addMenu,
   deleteMenus,
-  updateMenu
+  updateMenu,
 } from '@/api/menu';
 
 import SvgIcon from '@/components/SvgIcon/index.vue';
@@ -305,34 +306,34 @@ const state = reactive({
   single: true,
   // 非多个禁用
   multiple: true,
-  queryParams: {} as MenuQueryParam,
+  queryParams: {} as MenuQuery,
-  menuList: [] as MenuItem[],
+  menuList: [] as Menu[],
-  dialog: { visible: false } as Dialog,
+  dialog: { visible: false } as DialogType,
   formData: {
     parentId: '0',
     name: '',
     visible: 1,
     sort: 1,
     component: undefined,
-    type: 'MENU'
+    type: 'MENU',
-  } as MenuFormData,
+  } as MenuForm,
   rules: {
     parentId: [{ required: true, message: '请选择顶级菜单', trigger: 'blur' }],
     name: [{ required: true, message: '请输入菜单名称', trigger: 'blur' }],
     type: [{ required: true, message: '请选择菜单类型', trigger: 'blur' }],
     path: [{ required: true, message: '请输入路由路径', trigger: 'blur' }],
     component: [
-      { required: true, message: '请输入组件完整路径', trigger: 'blur' }
+      { required: true, message: '请输入组件完整路径', trigger: 'blur' },
-    ]
+    ],
   },
-  menuOptions: [] as Option[],
+  menuOptions: [] as OptionType[],
   currentRow: undefined,
   // Icon选择器显示状态
   iconSelectVisible: false,
   cacheData: {
     menuType: '',
-    menuPath: ''
+    menuPath: '',
-  }
+  },
 });
 
 const {
@@ -344,7 +345,7 @@ const {
   rules,
   menuOptions,
   iconSelectVisible,
-  cacheData
+  cacheData,
 } = toRefs(state);
 
 /**
@@ -393,7 +394,7 @@ async function handleAdd(row: any) {
   await loadMenuData();
   dialog.value = {
     title: '添加菜单',
-    visible: true
+    visible: true,
   };
 
   if (row.id) {
@@ -416,11 +417,11 @@ async function handleAdd(row: any) {
 /**
  * 编辑菜单
  */
-async function handleUpdate(row: MenuFormData) {
+async function handleUpdate(row: MenuForm) {
   await loadMenuData();
   state.dialog = {
     title: '编辑菜单',
-    visible: true
+    visible: true,
   };
   const id = row.id as string;
   getMenuDetail(id).then(({ data }) => {
@@ -474,7 +475,7 @@ function handleDelete(row: any) {
   ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
-    type: 'warning'
+    type: 'warning',
   })
     .then(() => {
       deleteMenus(ids).then(() => {

src/views/system/role/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts">
 export default {
-  name: 'role'
+  name: 'role',
 };
 </script>
 
@@ -13,15 +13,13 @@ import {
   addRole,
   deleteRoles,
   getRoleMenuIds,
-  updateRoleMenus
+  updateRoleMenus,
 } from '@/api/role';
 import { listResources } from '@/api/menu';
 
 import { ElForm, ElMessage, ElMessageBox, ElTree } from 'element-plus';
-import { Search, Plus, Edit, Refresh, Delete } from '@element-plus/icons-vue';
+import { Search, Plus, Refresh, Delete } from '@element-plus/icons-vue';
-import { RoleFormData, RoleItem, RoleQueryParam } from '@/types/api/role';
+import { Role, RoleForm, RoleQuery } from '@/api/role/types';
-import SvgIcon from '@/components/SvgIcon/index.vue';
-import { Option, Dialog } from '@/types/common';
 
 const emit = defineEmits(['roleClick']);
 const queryFormRef = ref(ElForm);
@@ -34,21 +32,23 @@ const state = reactive({
   ids: [] as number[],
   queryParams: {
     pageNum: 1,
-    pageSize: 10
+    pageSize: 10,
-  } as RoleQueryParam,
+  } as RoleQuery,
-  roleList: [] as RoleItem[],
+  roleList: [] as Role[],
   total: 0,
   dialog: {
     title: '',
-    visible: false
+    visible: false,
-  } as Dialog,
+  } as DialogType,
-  formData: {} as RoleFormData,
+  formData: {} as RoleForm,
   rules: {
     name: [{ required: true, message: '请输入角色名称', trigger: 'blur' }],
-    code: [{ required: true, message: '请输入角色编码', trigger: 'blur' }]
+    code: [{ required: true, message: '请输入角色编码', trigger: 'blur' }],
+    dataScope: [{ required: true, message: '请选择数据权限', trigger: 'blur' }],
+    status: [{ required: true, message: '请选择状态', trigger: 'blur' }],
   },
   menuDialogVisible: false,
-  resourceOptions: [] as Option[],
+  resourceOptions: [] as OptionType[],
   btnPerms: {} as any,
   // 勾选的菜单ID
   checkedMenuIds: new Set([]),
@@ -56,8 +56,8 @@ const state = reactive({
   // 选中的角色
   checkedRole: {
     id: '',
-    name: ''
+    name: '',
-  }
+  },
 });
 
 const {
@@ -71,7 +71,7 @@ const {
   rules,
   menuDialogVisible,
   checkedRole,
-  resourceOptions
+  resourceOptions,
 } = toRefs(state);
 
 /**
@@ -105,14 +105,14 @@ function handleRowClick(row: any) {
 function handleAdd() {
   dialog.value = {
     title: '添加角色',
-    visible: true
+    visible: true,
   };
 }
 
 function handleUpdate(row: any) {
   dialog.value = {
     title: '修改角色',
-    visible: true
+    visible: true,
   };
   const roleId = row.id || state.ids;
   getRoleFormDetail(roleId).then(({ data }) => {
@@ -160,7 +160,7 @@ function handleDelete(row: any) {
   ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
-    type: 'warning'
+    type: 'warning',
   })
     .then(() => {
       deleteRoles(ids).then(() => {
@@ -174,24 +174,27 @@ function handleDelete(row: any) {
 /**
  * 资源分配
  */
-function showRoleMenuDialog(row: RoleItem) {
+function showRoleMenuDialog(row: Role) {
   menuDialogVisible.value = true;
   loading.value = true;
 
   const roleId: any = row.id;
   checkedRole.value = {
     id: roleId,
-    name: row.name
+    name: row.name,
   };
 
   // 获取所有的资源
-  listResources().then(response => {
+  listResources().then((response) => {
     resourceOptions.value = response.data;
     // 角色拥有的资源
     getRoleMenuIds(roleId).then(({ data }) => {
       // 勾选回显
       const checkedMenuIds = data;
-      resourceRef.value.setCheckedKeys(checkedMenuIds);
+      checkedMenuIds.forEach((menuId) =>
+        resourceRef.value.setChecked(menuId, true)
+      );
+
       loading.value = false;
     });
   });
@@ -204,7 +207,7 @@ function handleRoleResourceSubmit() {
     .getCheckedNodes(false, true)
     .map((node: any) => node.value);
 
-  updateRoleMenus(checkedRole.value.id, checkedMenuIds).then(res => {
+  updateRoleMenus(checkedRole.value.id, checkedMenuIds).then((res) => {
     ElMessage.success('分配权限成功');
     menuDialogVisible.value = false;
     handleQuery();
@@ -258,7 +261,7 @@ onMounted(() => {
           >删除</el-button
         >
       </template>
-      <!--table-->
+
       <el-table
         ref="dataTableRef"
         v-loading="loading"
@@ -269,8 +272,8 @@ onMounted(() => {
         border
       >
         <el-table-column type="selection" width="55" align="center" />
-        <el-table-column label="角色名称" prop="name" min-width="300" />
+        <el-table-column label="角色名称" prop="name" min-width="150" />
-        <el-table-column label="角色编码" prop="code" width="200" />
+        <el-table-column label="角色编码" prop="code" width="150" />
 
         <el-table-column label="状态" align="center" width="150">
           <template #default="scope">
@@ -280,36 +283,29 @@ onMounted(() => {
         </el-table-column>
 
         <el-table-column label="排序" align="center" width="100" prop="sort" />
-        <el-table-column prop="createTime" label="创建时间" width="250" />
+        <el-table-column prop="createTime" label="创建时间" width="160" />
-        <el-table-column prop="updateTime" label="修改时间" width="250" />
+        <el-table-column prop="updateTime" label="修改时间" width="160" />
 
-        <el-table-column label="操作" align="center" width="200">
+        <el-table-column label="操作" align="left" >
           <template #default="scope">
-            <el-tooltip content="分配资源" effect="light">
             <el-button
               type="success"
-                circle
+              link
-                plain
               @click.stop="showRoleMenuDialog(scope.row)"
             >
-                <svg-icon icon-class="perm" />
+              资源分配
             </el-button>
-            </el-tooltip>
 
             <el-button
               type="primary"
-              :icon="Edit"
+              link
-              circle
-              plain
               @click.stop="handleUpdate(scope.row)"
-            />
+            >
-            <el-button
+              修改
-              type="danger"
+            </el-button>
-              :icon="Delete"
+            <el-button type="danger" link @click.stop="handleDelete(scope.row)">
-              circle
+              删除
-              plain
+            </el-button>
-              @click.stop="handleDelete(scope.row)"
-            />
           </template>
         </el-table-column>
       </el-table>
@@ -345,6 +341,22 @@ onMounted(() => {
           <el-input v-model="formData.code" placeholder="请输入角色编码" />
         </el-form-item>
 
+        <el-form-item label="数据权限" prop="dataScope">
+          <el-select v-model="formData.dataScope">
+            <el-option :key="0" label="全部数据" :value="0" />
+            <el-option :key="1" label="部门及子部门数据" :value="1" />
+            <el-option :key="2" label="本部门数据" :value="2" />
+            <el-option :key="3" label="本人数据" :value="3" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="状态" prop="status">
+          <el-radio-group v-model="formData.status">
+            <el-radio :label="1">正常</el-radio>
+            <el-radio :label="0">停用</el-radio>
+          </el-radio-group>
+        </el-form-item>
+
         <el-form-item label="排序" prop="sort">
           <el-input-number
             v-model="formData.sort"
@@ -353,13 +365,6 @@ onMounted(() => {
             style="width: 100px"
           />
         </el-form-item>
-
-        <el-form-item label="状态">
-          <el-radio-group v-model="formData.status">
-            <el-radio :label="1">正常</el-radio>
-            <el-radio :label="0">停用</el-radio>
-          </el-radio-group>
-        </el-form-item>
       </el-form>
 
       <template #footer>
@@ -370,7 +375,7 @@ onMounted(() => {
       </template>
     </el-dialog>
 
-    <!--分配资源弹窗-->
+    <!-- assign permission dialog -->
     <el-dialog
       :title="'【' + checkedRole.name + '】资源分配'"
       v-model="menuDialogVisible"

src/views/system/user/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts">
 export default {
-  name: 'user'
+  name: 'user',
 };
 </script>
 
@@ -11,13 +11,13 @@ import {
   watchEffect,
   onMounted,
   getCurrentInstance,
-  toRefs
+  toRefs,
 } from 'vue';
 
 // api
 import {
   listUserPages,
-  getUserFormData,
+  getUserForm,
   deleteUsers,
   addUser,
   updateUser,
@@ -25,37 +25,33 @@ import {
   updateUserPassword,
   downloadTemplate,
   exportUser,
-  importUser
+  importUser,
 } from '@/api/user';
 import { listDeptOptions } from '@/api/dept';
 import { listRoleOptions } from '@/api/role';
 
 import {
-  ElMessage,
-  ElMessageBox,
   ElTree,
   ElForm,
-  UploadFile
+  ElMessageBox,
+  ElMessage,
+  UploadFile,
 } from 'element-plus';
 import {
   Search,
   Plus,
-  Edit,
   Refresh,
   Delete,
-  Lock,
   Download,
   Top,
-  UploadFilled
+  UploadFilled,
 } from '@element-plus/icons-vue';
 import {
-  UserItem,
+  UserForm,
-  UserQueryParam,
+  UserImportData,
-  UserFormData,
+  UserQuery,
-  UserImportData
+  UserType,
-} from '@/types/api/user';
+} from '@/api/user/types';
-
-import { Option, Dialog } from '@/types/common';
 
 const deptTreeRef = ref(ElTree); // 部门树
 const queryFormRef = ref(ElForm); // 查询表单
@@ -71,28 +67,28 @@ const state = reactive({
   ids: [] as number[],
   // 总条数
   total: 0,
-  userList: [] as UserItem[],
+  userList: [] as UserType[],
   dialog: {
-    visible: false
+    visible: false,
-  } as Dialog,
+  } as DialogType,
   deptName: undefined,
   // 部门下拉项
-  deptOptions: [] as Option[],
+  deptOptions: [] as OptionType[],
   // 性别下拉项
-  genderOptions: [] as Option[],
+  genderOptions: [] as OptionType[],
   // 角色下拉项
-  roleOptions: [] as Option[],
+  roleOptions: [] as OptionType[],
   formData: {
-    status: 1
+    status: 1,
-  } as UserFormData,
+  } as UserForm,
   queryParams: {
     pageNum: 1,
-    pageSize: 10
+    pageSize: 10,
-  } as UserQueryParam,
+  } as UserQuery,
   rules: {
     username: [{ required: true, message: '用户名不能为空', trigger: 'blur' }],
     nickname: [
-      { required: true, message: '用户昵称不能为空', trigger: 'blur' }
+      { required: true, message: '用户昵称不能为空', trigger: 'blur' },
     ],
     deptId: [{ required: true, message: '所属部门不能为空', trigger: 'blur' }],
     roleIds: [{ required: true, message: '用户角色不能为空', trigger: 'blur' }],
@@ -100,25 +96,25 @@ const state = reactive({
       {
         pattern: /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/,
         message: '请输入正确的邮箱地址',
-        trigger: 'blur'
+        trigger: 'blur',
-      }
+      },
     ],
     mobile: [
       {
         pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
         message: '请输入正确的手机号码',
-        trigger: 'blur'
+        trigger: 'blur',
-      }
+      },
-    ]
+    ],
   },
 
   importDialog: {
     title: '用户搭配',
-    visible: false
+    visible: false,
-  } as Dialog,
+  } as DialogType,
   importFormData: {} as UserImportData,
   excelFile: undefined as any,
-  excelFilelist: [] as File[]
+  excelFilelist: [] as File[],
 });
 
 const {
@@ -135,7 +131,7 @@ const {
   roleOptions,
   importDialog,
   importFormData,
-  excelFilelist
+  excelFilelist,
 } = toRefs(state);
 
 watchEffect(
@@ -143,7 +139,7 @@ watchEffect(
     deptTreeRef.value.filter(state.deptName);
   },
   {
-    flush: 'post' // watchEffect会在DOM挂载或者更新之前就会触发，此属性控制在DOM元素更新后运行
+    flush: 'post', // watchEffect会在DOM挂载或者更新之前就会触发，此属性控制在DOM元素更新后运行
   }
 );
 
@@ -169,7 +165,7 @@ function handleDeptNodeClick(data: { [key: string]: any }) {
  * 获取角色下拉项
  */
 async function getRoleOptions() {
-  listRoleOptions().then(response => {
+  listRoleOptions().then((response) => {
     state.roleOptions = response.data;
   });
 }
@@ -185,7 +181,7 @@ function handleStatusChange(row: { [key: string]: any }) {
     {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
-      type: 'warning'
+      type: 'warning',
     }
   )
     .then(() => {
@@ -235,7 +231,7 @@ function resetPassword(row: { [key: string]: any }) {
     '重置密码',
     {
       confirmButtonText: '确定',
-      cancelButtonText: '取消'
+      cancelButtonText: '取消',
     }
   )
     .then(({ value }) => {
@@ -256,7 +252,7 @@ function resetPassword(row: { [key: string]: any }) {
 async function handleAdd() {
   state.dialog = {
     title: '添加用户',
-    visible: true
+    visible: true,
   };
   await getDeptOptions();
   await getRoleOptions();
@@ -266,15 +262,15 @@ async function handleAdd() {
  * 修改用户
  **/
 async function handleUpdate(row: { [key: string]: any }) {
-  state.dialog = {
+  dialog.value = {
     title: '修改用户',
-    visible: true
+    visible: true,
   };
 
   const userId = row.id || state.ids;
   await getDeptOptions();
   await getRoleOptions();
-  getUserFormData(userId).then(({ data }) => {
+  getUserForm(userId).then(({ data }) => {
     formData.value = data;
   });
 }
@@ -314,7 +310,7 @@ function handleDelete(row: { [key: string]: any }) {
     {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
-      type: 'warning'
+      type: 'warning',
     }
   )
     .then(function () {
@@ -339,7 +335,7 @@ function closeDialog() {
  * 获取部门下拉项
  */
 async function getDeptOptions() {
-  listDeptOptions().then(response => {
+  listDeptOptions().then((response) => {
     state.deptOptions = response.data;
   });
 }
@@ -359,7 +355,7 @@ function getGenderOptions() {
 function handleDownloadTemplate() {
   downloadTemplate().then((response: any) => {
     const blob = new Blob([response.data], {
-      type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
+      type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8',
     });
     const a = document.createElement('a');
     const href = window.URL.createObjectURL(blob); // 下载链接
@@ -411,7 +407,7 @@ function submitImportForm() {
 
       const deptId = state.importFormData.deptId;
       const roleIds = state.importFormData.roleIds.join(',');
-      importUser(deptId, roleIds, state.excelFile).then(response => {
+      importUser(deptId, roleIds, state.excelFile).then((response) => {
         ElMessage.success(response.data);
         closeImportDialog();
         handleQuery();
@@ -436,7 +432,7 @@ function closeImportDialog() {
 function handleExport() {
   exportUser(queryParams.value).then((response: any) => {
     const blob = new Blob([response.data], {
-      type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
+      type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8',
     });
     const a = document.createElement('a');
     const href = window.URL.createObjectURL(blob); // 下载的链接
@@ -573,7 +569,7 @@ onMounted(() => {
             <el-table-column type="selection" width="50" align="center" />
             <el-table-column
               key="id"
-              label="用户编号"
+              label="编号"
               align="center"
               prop="id"
               width="100"
@@ -584,11 +580,11 @@ onMounted(() => {
               align="center"
               prop="username"
             />
-            <el-table-column label="用户昵称" align="center" prop="nickname" />
+            <el-table-column label="用户昵称" width="120" align="center" prop="nickname" />
 
-            <el-table-column label="性别" align="center" prop="genderLabel" />
+            <el-table-column label="性别" width="100" align="center" prop="genderLabel" />
 
-            <el-table-column label="部门" align="center" prop="deptName" />
+            <el-table-column label="部门" width="120" align="center" prop="deptName" />
             <el-table-column
               label="手机号码"
               align="center"
@@ -612,31 +608,25 @@ onMounted(() => {
               prop="createTime"
               width="180"
             ></el-table-column>
-            <el-table-column label="操作" align="center" width="150">
+            <el-table-column label="操作" align="left" width="200">
               <template #default="scope">
+                <el-button type="success" link @click="resetPassword(scope.row)"
+                  >重置密码</el-button
+                >
                 <el-button
                   type="primary"
-                  :icon="Edit"
+                  link
-                  circle
-                  plain
                   @click="handleUpdate(scope.row)"
                   v-hasPerm="['sys:user:edit']"
-                ></el-button>
+                  >修改</el-button
+                >
                 <el-button
                   type="danger"
-                  :icon="Delete"
+                  link
-                  circle
-                  plain
                   @click="handleDelete(scope.row)"
-                  v-hasPerm="['sys:user:delete']"
+                  v-hasPerm="['sys:user:del']"
-                ></el-button>
+                  >删除</el-button
-                <el-button
+                >
-                  type="warning"
-                  :icon="Lock"
-                  circle
-                  plain
-                  @click="resetPassword(scope.row)"
-                ></el-button>
               </template>
             </el-table-column>
           </el-table>

types/components.d.ts

@@ -0,0 +1,9 @@
+// 全局组件类型声明
+import Pagination from '@/components/Pagination/index.vue';
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    Pagination: typeof Pagination;
+  }
+}
+export {};

types/env.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="vite/client" />
+
+declare module '*.vue' {
+  import { DefineComponent } from 'vue';
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+  const component: DefineComponent<{}, {}, any>;
+  export default component;
+}
+
+// 环境变量 TypeScript的智能提示
+interface ImportMetaEnv {
+  VITE_APP_TITLE: string;
+  VITE_APP_PORT: string;
+  VITE_APP_BASE_API: string;
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv;
+}

types/global.d.ts

@@ -0,0 +1,13 @@
+declare global {
+  interface PageQuery {
+    pageNum: number;
+    pageSize: number;
+  }
+
+  interface PageResult<T> {
+    list: T;
+    total: number;
+  }
+}
+
+export {};

types/index.d.ts

@@ -0,0 +1,11 @@
+declare type DialogType = {
+  title: string;
+  visible: boolean;
+};
+
+declare type OptionType = {
+  value: string;
+  label: string;
+  checked?: boolean;
+  children?: OptionType[];
+};