🎟 框架升级

kicc-ui/src/api/system/user.ts

@@ -1,5 +1,6 @@
 import { User, UserDto } from './model/userModel';
 import { defHttp } from '/@/utils/http/axios';
+import { ResultVo } from "/@/api/model";
 
 enum Api {
   list = '/system_proxy/system/user/list',
@@ -21,7 +22,7 @@ export const addUser = (params: Partial<User>) => defHttp.post({ url: Api.add, d
 export const editUser = (params: Partial<User>) => defHttp.put({ url: Api.edit, data: params });
 
 // 查询用户详细
-export const getUser = (id: string) => defHttp.get<User>({ url: `${Api.get}/${id}` });
+export const getUser = (id: string) => defHttp.get<ResultVo<any>>({ url: `${Api.get}/${id}` });
 
 // 删除用户
 export const delUser = (id: string) => defHttp.delete({ url: `${Api.del}/${id}` });

kicc-ui/src/store/modules/user.ts

@@ -18,6 +18,7 @@ import {useMessage} from '/@/hooks/web/useMessage';
 import {router} from '/@/router';
 import {usePermissionStore} from '/@/store/modules/permission';
 import {RouteRecordRaw} from 'vue-router';
+import defaultAvatar from '/@/assets/images/defaultAvatar.png';
 
 interface UserState {
   userInfo: Nullable<UserInfo>;
@@ -129,6 +130,7 @@ export const useUserStore = defineStore({
     },
     async getUserInfoAction(): Promise<UserInfo> {
       const userInfo = await getUserInfo();
+      userInfo.avatar || (userInfo.avatar = defaultAvatar);
       // 存储用户扩展信息,便于鉴权
       this.setUserInfo(userInfo);
       this.setRoleIds(userInfo.roleIds);

kicc-ui/src/utils/index.ts

@@ -96,3 +96,19 @@ export const withInstall = <T>(component: T, alias?: string) => {
   };
   return component as T & Plugin;
 };
+
+
+/** 查询指定集合名称 */
+export const findListNameById = (id: string, list: any[], options: Partial<{ idField: string, nameField: string, childrenField: string }> = {}) => {
+  // 设置默认配置
+  options = Object.assign({ idField: 'id', nameField: 'name', childrenField: 'children' }, options);
+  for (let i = 0; i < list.length; i++) {
+    if (list[i][options.idField!] === id) {
+      return list[i][options.nameField!];
+    }
+    if (list[i][options.childrenField!]) {
+      return findListNameById(id, list[i][options.childrenField!],options);
+    }
+  }
+  return '';
+};

kicc-ui/src/views/system/menu/MenuModal.vue

@@ -52,7 +52,7 @@
         break;
       case 'edit':
         props.title = '编辑菜单';
-        await setFieldsValue(await getMenu(menuId) || {});
+        await setFieldsValue(await getMenu(menuId));
         break;
     }
     setModalProps(props);

kicc-ui/src/views/system/role/RoleDrawer.vue

@@ -63,7 +63,7 @@
       case 'edit':
         props.title = '编辑角色';
         const result = await getRoleMenuIds(roleId);
-        const role  = await getRole(roleId) || {};
+        const role  = await getRole(roleId);
         await setFieldsValue(Object.assign(role, { menuIds: result.extend }));
         break;
     }

kicc-ui/src/views/system/user/ResetPwdModal.vue

@@ -64,9 +64,9 @@
 
   const { resetFields, clearValidate, validate, validateInfos } = useForm(modelRef, rulesRef);
 
-  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data: WindowInnerData) => {
-    await resetFields();
-    await clearValidate();
+  const [registerModal, { setModalProps, closeModal }] = useModalInner( (data: WindowInnerData) => {
+    resetFields();
+    clearValidate();
     modelRef.id = data.record?.id;
     const props: Partial<ModalProps> = { confirmLoading: false };
     setModalProps(props);

kicc-ui/src/views/system/user/UserModal.vue

@@ -12,24 +12,31 @@
    * Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved.
    * author entfrm开发团队-王翔
    */
-  import { defineComponent, ref, computed, unref, reactive } from 'vue';
+  import {defineComponent, reactive, ref, toRaw, unref} from 'vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
-  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  import { BasicForm, useForm } from '/@/components/Form/index';
   import { userFormSchema } from './user.data';
   import { deptList } from '/@/api/system/dept';
   import { addUser, editUser, getUser } from '/@/api/system/user';
   import { listToTree } from "/@/utils/helper/treeHelper";
-  import { addMenu, editMenu, getMenu, getRoleMenuIds, listMenu } from "/@/api/system/menu";
   import { ModalProps } from "/@/components/Modal";
+  import { findListNameById } from '/@/utils';
+  import {TreeItem} from "/@/components/Tree";
 
   export default defineComponent({
     name: 'UserModal',
     components: { BasicModal, BasicForm },
     emits: ['success', 'register'],
     setup(props, { emit }) {
-      const tag = ref('');
 
-      const [registerForm, {resetFields, setFieldsValue, updateSchema, validate, clearValidate}] = useForm({
+      const state = reactive({
+        // 操作标签
+        tag: '',
+        // 部门树形数据
+        deptTree: [] as TreeItem[],
+      });
+
+      const [registerForm, { resetFields, setFieldsValue, updateSchema, validate, clearValidate }] = useForm({
         labelWidth: 100,
         schemas: userFormSchema,
         showActionButtonGroup: false,
@@ -41,26 +48,28 @@
       const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
         await resetFields();
         await clearValidate();
-        tag.value = data._tag;
+        state.tag = data._tag;
+        state.deptTree = listToTree(await deptList());
         const userId = data.record?.id;
         const props: Partial<ModalProps> = { confirmLoading: false };
         await updateSchema([
           {
             field: 'deptId',
-            componentProps: { treeData: listToTree(await deptList()) }
+            componentProps: { treeData: toRaw(state.deptTree) }
           },
           {
             field: 'password',
-            show: tag.value == 'add'
+            show: state.tag == 'add'
           }
         ]);
-        switch (tag.value) {
+        switch (state.tag) {
           case 'add':
             props.title = '新增用户';
             break;
           case 'edit':
             props.title = '编辑用户';
-            await setFieldsValue(await getUser(userId) || {});
+            const result = await getUser(userId);
+            await setFieldsValue(result.result);
             break;
         }
         setModalProps(props);
@@ -70,12 +79,13 @@
         try {
           const formData = await validate();
           setModalProps({ confirmLoading: true });
-          switch (unref(tag)) {
+          formData.deptName = findListNameById(formData.deptId, toRaw(state.deptTree), { idField: 'deptId' });
+          switch (state.tag) {
             case 'add':
-              await addMenu(formData);
+              await addUser(formData);
               break;
             case 'edit':
-              await editMenu(formData);
+              await editUser(formData);
               break;
           }
           closeModal();

kicc-ui/src/views/system/user/index.vue

@@ -5,7 +5,11 @@
                contentClass="flex"
   >
     <DeptTree class="w-1/4 xl:w-1/5" @select="handleSelect"/>
-    <BasicTable class="w-3/4 xl:w-4/5" @register="registerTable">
+    <BasicTable class="w-3/4 xl:w-5/5"
+                @register="registerTable"
+                @fetch-success="handleSelectionChange"
+                @selection-change="handleSelectionChange"
+    >
       <template #toolbar>
         <a-button v-auth="['user_add']"
                   type="primary"
@@ -26,7 +30,7 @@
         <TableAction :actions="[
           {
             label: '重置密码',
-            icon: 'clarity:lock-line',
+            icon: 'brandico:codepen',
             auth: ['user_reset'],
             onClick: handleResetPassword.bind(null, record),
           },
@@ -39,8 +43,8 @@
           {
             label: '删除',
             icon: 'ant-design:delete-outlined',
-            auth: ['user_del'],
             color: 'error',
+            auth: ['user_del'],
             onClick: handleDel.bind(null, record)
           }]"
         />
@@ -62,6 +66,7 @@
   import UserModal from './UserModal.vue';
   import { columns, searchFormSchema } from './user.data';
   import { useMessage } from '/@/hooks/web/useMessage';
+  import { convertDateRange } from "/@/utils/dateUtil";
 
   const { createConfirm } = useMessage();
   const { createMessage } = useMessage();
@@ -113,7 +118,8 @@
           dataIndex: 'action',
           slots: { customRender: 'action' },
           fixed: false
-        }
+        },
+        handleSearchInfoFn: (queryParams) => convertDateRange(queryParams, 'dateRange')
       });
 
       /** 处理多选框选中数据 */

kicc-ui/src/views/system/user/user.data.ts

@@ -1,3 +1,10 @@
+/**
+ * @program: kicc-ui
+ * @description: 用户模块动态渲染配置
+ * @author: entfrm开发团队-王翔
+ * @create: 2022/4/21
+ */
+
 import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
 import { h } from 'vue';
@@ -90,8 +97,8 @@ export const userFormSchema: FormSchema[] = [
     componentProps: {
       replaceFields: {
         title: 'name',
-        key: 'id',
-        value: 'id'
+        key: 'deptId',
+        value: 'deptId'
       },
       getPopupContainer: () => document.body
     },
@@ -205,68 +212,3 @@ export const userFormSchema: FormSchema[] = [
     }
   }
 ];
-
-export const passwordFormSchema: FormSchema[] = [
-  {
-    field: 'id',
-    label: 'ID',
-    component: 'Input',
-    show: false,
-  },
-  {
-    field: 'passwordNew',
-    label: '密码',
-    component: 'StrengthMeter',
-    componentProps: {
-      placeholder: '密码',
-    },
-    rules: [
-      {
-        required: true,
-        whitespace: true,
-        message: '请输入密码！',
-      },
-      {
-        pattern: new RegExp('[^\\u4e00-\\u9fa5]+'),
-        type: 'string',
-        message: '密码不能输入汉字！',
-      },
-      {
-        min: 6,
-        max: 32,
-        message: '长度必需在6-32之间！',
-      },
-    ],
-  },
-  {
-    field: 'confirmPassword',
-    label: '确认密码',
-    component: 'InputPassword',
-    dynamicRules: ({ values }) => {
-      return [
-        {
-          required: true,
-          validator: (_, value) => {
-            if (!value) {
-              return Promise.reject('确认密码不能为空');
-            }
-            if (value !== values.passwordNew) {
-              return Promise.reject('两次输入的密码不一致!');
-            }
-            return Promise.resolve();
-          },
-        },
-        {
-          pattern: new RegExp('[^\\u4e00-\\u9fa5]+'),
-          type: 'string',
-          message: '密码不能输入汉字！',
-        },
-        {
-          min: 6,
-          max: 32,
-          message: '长度必需在6-32之间！',
-        },
-      ];
-    },
-  },
-];