From d37e2f599c69a877c9da9dbc112f598d6532f6c8 Mon Sep 17 00:00:00 2001
From: Vben <ann.vben@gmail.com>
Date: Sat, 5 Oct 2024 17:09:42 +0800
Subject: [PATCH 01/19] fix: naive ui form reset does not meet expectations
 (#4569)

* fix: naive ui form reset does not meet expectations

* fix: typo
---
 apps/web-antd/src/api/core/auth.ts                       | 4 ++--
 apps/web-ele/src/api/core/auth.ts                        | 4 ++--
 apps/web-naive/src/adapter/form.ts                       | 3 +++
 apps/web-naive/src/api/core/auth.ts                      | 4 ++--
 packages/@core/ui-kit/form-ui/src/config.ts              | 9 +++++++--
 .../@core/ui-kit/form-ui/src/form-render/form-field.vue  | 7 ++++---
 packages/@core/ui-kit/form-ui/src/form-render/form.vue   | 2 ++
 packages/@core/ui-kit/form-ui/src/types.ts               | 5 +++++
 .../effects/common-ui/src/ui/authentication/types.ts     | 5 +----
 packages/effects/plugins/src/vxe-table/use-vxe-grid.vue  | 4 ++--
 packages/stores/src/modules/user.ts                      | 1 +
 packages/utils/src/index.ts                              | 1 +
 playground/src/api/core/auth.ts                          | 4 ++--
 13 files changed, 34 insertions(+), 19 deletions(-)

diff --git a/apps/web-antd/src/api/core/auth.ts b/apps/web-antd/src/api/core/auth.ts
index 53b8366d..71d9f994 100644
--- a/apps/web-antd/src/api/core/auth.ts
+++ b/apps/web-antd/src/api/core/auth.ts
@@ -3,8 +3,8 @@ import { baseRequestClient, requestClient } from '#/api/request';
 export namespace AuthApi {
   /** 登录接口参数 */
   export interface LoginParams {
-    password: string;
-    username: string;
+    password?: string;
+    username?: string;
   }
 
   /** 登录接口返回值 */
diff --git a/apps/web-ele/src/api/core/auth.ts b/apps/web-ele/src/api/core/auth.ts
index 53b8366d..71d9f994 100644
--- a/apps/web-ele/src/api/core/auth.ts
+++ b/apps/web-ele/src/api/core/auth.ts
@@ -3,8 +3,8 @@ import { baseRequestClient, requestClient } from '#/api/request';
 export namespace AuthApi {
   /** 登录接口参数 */
   export interface LoginParams {
-    password: string;
-    username: string;
+    password?: string;
+    username?: string;
   }
 
   /** 登录接口返回值 */
diff --git a/apps/web-naive/src/adapter/form.ts b/apps/web-naive/src/adapter/form.ts
index 1c051b4a..eb765476 100644
--- a/apps/web-naive/src/adapter/form.ts
+++ b/apps/web-naive/src/adapter/form.ts
@@ -84,7 +84,10 @@ setupVbenForm<FormComponentType>({
     Upload: NUpload,
   },
   config: {
+    // naive-ui组件不接受onChang事件，所以需要禁用
     disabledOnChangeListener: true,
+    // naive-ui组件的空值为null,不能是undefined，否则重置表单时不生效
+    emptyStateValue: null,
     baseModelPropName: 'value',
     modelPropNameMap: {
       Checkbox: 'checked',
diff --git a/apps/web-naive/src/api/core/auth.ts b/apps/web-naive/src/api/core/auth.ts
index 53b8366d..71d9f994 100644
--- a/apps/web-naive/src/api/core/auth.ts
+++ b/apps/web-naive/src/api/core/auth.ts
@@ -3,8 +3,8 @@ import { baseRequestClient, requestClient } from '#/api/request';
 export namespace AuthApi {
   /** 登录接口参数 */
   export interface LoginParams {
-    password: string;
-    username: string;
+    password?: string;
+    username?: string;
   }
 
   /** 登录接口返回值 */
diff --git a/packages/@core/ui-kit/form-ui/src/config.ts b/packages/@core/ui-kit/form-ui/src/config.ts
index 7c118634..33b11317 100644
--- a/packages/@core/ui-kit/form-ui/src/config.ts
+++ b/packages/@core/ui-kit/form-ui/src/config.ts
@@ -43,8 +43,13 @@ export function setupVbenForm<
 >(options: VbenFormAdapterOptions<T>) {
   const { components, config, defineRules } = options;
 
-  DEFAULT_FORM_COMMON_CONFIG.disabledOnChangeListener =
-    config?.disabledOnChangeListener ?? false;
+  const { disabledOnChangeListener = false, emptyStateValue = undefined } =
+    (config || {}) as FormCommonConfig;
+
+  Object.assign(DEFAULT_FORM_COMMON_CONFIG, {
+    disabledOnChangeListener,
+    emptyStateValue,
+  });
 
   if (defineRules) {
     for (const key of Object.keys(defineRules)) {
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
index c116d49c..f66a4bb6 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
+++ b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
@@ -33,6 +33,7 @@ const {
   description,
   disabled,
   disabledOnChangeListener,
+  emptyStateValue,
   fieldName,
   formFieldProps,
   label,
@@ -55,7 +56,7 @@ const formApi = formRenderProps.form;
 
 const isInValid = computed(() => errors.value?.length > 0);
 
-const fieldComponent = computed(() => {
+const FieldComponent = computed(() => {
   const finalComponent = isString(component)
     ? componentMap.value[component]
     : component;
@@ -213,7 +214,7 @@ function fieldBindEvent(slotProps: Record<string, any>) {
   if (bindEventField) {
     return {
       [`onUpdate:${bindEventField}`]: handler,
-      [bindEventField]: value,
+      [bindEventField]: value === undefined ? emptyStateValue : value,
       onChange: disabledOnChangeListener
         ? undefined
         : (e: Record<string, any>) => {
@@ -300,7 +301,7 @@ function autofocus() {
             }"
           >
             <component
-              :is="fieldComponent"
+              :is="FieldComponent"
               ref="fieldComponentRef"
               :class="{
                 'border-destructive focus:border-destructive hover:border-destructive/80 focus:shadow-[0_0_0_2px_rgba(255,38,5,0.06)]':
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form.vue b/packages/@core/ui-kit/form-ui/src/form-render/form.vue
index 7d5f2426..54ae5d26 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/form.vue
+++ b/packages/@core/ui-kit/form-ui/src/form-render/form.vue
@@ -87,6 +87,7 @@ const computedSchema = computed(
       controlClass = '',
       disabled,
       disabledOnChangeListener = false,
+      emptyStateValue = undefined,
       formFieldProps = {},
       formItemClass = '',
       hideLabel = false,
@@ -107,6 +108,7 @@ const computedSchema = computed(
       return {
         disabled,
         disabledOnChangeListener,
+        emptyStateValue,
         hideLabel,
         hideRequiredMark,
         labelWidth,
diff --git a/packages/@core/ui-kit/form-ui/src/types.ts b/packages/@core/ui-kit/form-ui/src/types.ts
index a898219e..4bb67936 100644
--- a/packages/@core/ui-kit/form-ui/src/types.ts
+++ b/packages/@core/ui-kit/form-ui/src/types.ts
@@ -153,6 +153,10 @@ export interface FormCommonConfig {
    * @default false
    */
   disabledOnChangeListener?: boolean;
+  /**
+   * 所有表单项的空状态值,默认都是undefined，naive-ui的空状态值是null
+   */
+  emptyStateValue?: null | undefined;
   /**
    * 所有表单项的控件样式
    * @default {}
@@ -341,6 +345,7 @@ export interface VbenFormAdapterOptions<
   config?: {
     baseModelPropName?: string;
     disabledOnChangeListener?: boolean;
+    emptyStateValue?: null | undefined;
     modelPropNameMap?: Partial<Record<T, string>>;
   };
   defineRules?: {
diff --git a/packages/effects/common-ui/src/ui/authentication/types.ts b/packages/effects/common-ui/src/ui/authentication/types.ts
index 8c82aa98..2da4889f 100644
--- a/packages/effects/common-ui/src/ui/authentication/types.ts
+++ b/packages/effects/common-ui/src/ui/authentication/types.ts
@@ -67,10 +67,7 @@ interface AuthenticationProps {
   submitButtonText?: string;
 }
 
-interface LoginAndRegisterParams {
-  password: string;
-  username: string;
-}
+type LoginAndRegisterParams = Record<string, any>;
 
 interface LoginCodeParams {
   code: string;
diff --git a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
index 75dbc597..241eda81 100644
--- a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
+++ b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
@@ -193,8 +193,8 @@ async function init() {
   }
 
   // form 由 vben-form代替，所以不适配formConfig，这里给出警告
-  const formConfig = defaultGridOptions.formConfig;
-  if (formConfig?.enabled) {
+  const formConfig = options.value.formConfig;
+  if (formConfig) {
     console.warn(
       '[Vben Vxe Table]: The formConfig in the grid is not supported, please use the `formOptions` props',
     );
diff --git a/packages/stores/src/modules/user.ts b/packages/stores/src/modules/user.ts
index 49b4dbb9..9d374335 100644
--- a/packages/stores/src/modules/user.ts
+++ b/packages/stores/src/modules/user.ts
@@ -1,6 +1,7 @@
 import { acceptHMRUpdate, defineStore } from 'pinia';
 
 interface BasicUserInfo {
+  [key: string]: any;
   /**
    * 头像
    */
diff --git a/packages/utils/src/index.ts b/packages/utils/src/index.ts
index 9bf575c3..80263b6a 100644
--- a/packages/utils/src/index.ts
+++ b/packages/utils/src/index.ts
@@ -1,3 +1,4 @@
 export * from './helpers';
+export * from '@vben-core/shared/cache';
 export * from '@vben-core/shared/color';
 export * from '@vben-core/shared/utils';
diff --git a/playground/src/api/core/auth.ts b/playground/src/api/core/auth.ts
index 53b8366d..71d9f994 100644
--- a/playground/src/api/core/auth.ts
+++ b/playground/src/api/core/auth.ts
@@ -3,8 +3,8 @@ import { baseRequestClient, requestClient } from '#/api/request';
 export namespace AuthApi {
   /** 登录接口参数 */
   export interface LoginParams {
-    password: string;
-    username: string;
+    password?: string;
+    username?: string;
   }
 
   /** 登录接口返回值 */

From 47d162e6e4aa5a1f22413458cc50be9522f4fdd2 Mon Sep 17 00:00:00 2001
From: Vben <ann.vben@gmail.com>
Date: Sat, 5 Oct 2024 22:00:11 +0800
Subject: [PATCH 02/19] fix: improve the layout of tables offline on the mobile
 (#4573)

---
 .../form-ui/src/components/form-actions.vue   |  8 ++--
 .../effects/plugins/src/vxe-table/theme.css   |  4 ++
 .../plugins/src/vxe-table/use-vxe-grid.vue    | 42 ++++++++++++-------
 playground/src/locales/langs/zh-CN.json       |  2 +-
 4 files changed, 36 insertions(+), 20 deletions(-)

diff --git a/packages/@core/ui-kit/form-ui/src/components/form-actions.vue b/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
index 3c03c757..25c54d7c 100644
--- a/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
+++ b/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
@@ -30,12 +30,12 @@ const submitButtonOptions = computed(() => {
   };
 });
 
-const isQueryForm = computed(() => {
-  return !!unref(rootProps).showCollapseButton;
-});
+// const isQueryForm = computed(() => {
+//   return !!unref(rootProps).showCollapseButton;
+// });
 
 const queryFormStyle = computed(() => {
-  if (isQueryForm.value) {
+  if (!unref(rootProps).actionWrapperClass) {
     return {
       'grid-column': `-2 / -1`,
       marginLeft: 'auto',
diff --git a/packages/effects/plugins/src/vxe-table/theme.css b/packages/effects/plugins/src/vxe-table/theme.css
index b8761b79..bfb930f6 100644
--- a/packages/effects/plugins/src/vxe-table/theme.css
+++ b/packages/effects/plugins/src/vxe-table/theme.css
@@ -76,3 +76,7 @@
     }
   }
 }
+
+.vxe-pager--wrapper {
+  @apply justify-center md:justify-end;
+}
diff --git a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
index 241eda81..f8574a5d 100644
--- a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
+++ b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
@@ -19,6 +19,7 @@ import {
 import { usePriorityValues } from '@vben/hooks';
 import { EmptyIcon } from '@vben/icons';
 import { $t } from '@vben/locales';
+import { usePreferences } from '@vben/preferences';
 import { cloneDeep, cn, mergeWithArrayOverride } from '@vben/utils';
 import { VbenLoading } from '@vben-core/shadcn-ui';
 
@@ -48,6 +49,8 @@ const {
   formOptions,
 } = usePriorityValues(props, state);
 
+const { isMobile } = usePreferences();
+
 const slots = useSlots();
 
 const [Form, formApi] = useTableForm({});
@@ -91,6 +94,20 @@ const options = computed(() => {
   }
 
   if (mergedOptions.pagerConfig) {
+    const mobileLayouts = [
+      'PrevJump',
+      'PrevPage',
+      'Number',
+      'NextPage',
+      'NextJump',
+    ] as any;
+    const layouts = [
+      'Total',
+      'Sizes',
+      'Home',
+      ...mobileLayouts,
+      'End',
+    ] as readonly string[];
     mergedOptions.pagerConfig = mergeWithArrayOverride(
       {},
       mergedOptions.pagerConfig,
@@ -99,18 +116,7 @@ const options = computed(() => {
         background: true,
         pageSizes: [10, 20, 30, 50, 100, 200],
         className: 'mt-2 w-full',
-        layouts: [
-          'Total',
-          'Sizes',
-          'Home',
-          'PrevJump',
-          'PrevPage',
-          'Number',
-          'NextPage',
-          'NextJump',
-          'End',
-          // 'FullJump',
-        ] as any[],
+        layouts: isMobile.value ? mobileLayouts : layouts,
         size: 'mini' as const,
       },
     );
@@ -138,7 +144,6 @@ const vbenFormOptions = computed(() => {
       const formValues = formApi.form.values;
       props.api.reload(formValues);
     },
-    collapseTriggerResize: true,
     commonConfig: {
       componentProps: {
         class: 'w-full',
@@ -150,8 +155,15 @@ const vbenFormOptions = computed(() => {
     },
     wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
   };
+  const finalFormOptions: VbenFormProps = mergeWithArrayOverride(
+    {},
+    formOptions.value,
+    defaultFormProps,
+  );
+
   return {
-    ...mergeWithArrayOverride({}, formOptions.value, defaultFormProps),
+    ...finalFormOptions,
+    collapseTriggerResize: !!finalFormOptions.showCollapseButton,
   };
 });
 
@@ -244,7 +256,7 @@ onMounted(() => {
             </Form>
           </slot>
           <div
-            class="bg-background-deep z-100 absolute -left-2 bottom-2 h-4 w-[calc(100%+1rem)] overflow-hidden"
+            class="bg-background-deep z-100 absolute -left-2 bottom-1 h-2 w-[calc(100%+1rem)] overflow-hidden md:bottom-2 md:h-3"
           ></div>
         </div>
       </template>
diff --git a/playground/src/locales/langs/zh-CN.json b/playground/src/locales/langs/zh-CN.json
index 26f87a03..727d6262 100644
--- a/playground/src/locales/langs/zh-CN.json
+++ b/playground/src/locales/langs/zh-CN.json
@@ -92,7 +92,7 @@
         "editCell": "单元格编辑",
         "editRow": "行编辑",
         "custom-cell": "自定义单元格",
-        "form": "开启搜索表单"
+        "form": "搜索表单"
       },
       "captcha": {
         "title": "验证码",

From bd340e63b79443d1700970f20fbc240bc5e665e4 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 22:08:32 +0800
Subject: [PATCH 03/19] feat: user

---
 apps/web-antd/src/views/system/user/index.vue | 210 +++++++++++-------
 apps/web-antd/src/views/system/user/info.tsx  |   4 +-
 .../src/views/system/user/user-info-modal.vue |   2 +-
 .../system/user/user-reset-pwd-modal.vue      |  18 +-
 4 files changed, 148 insertions(+), 86 deletions(-)

diff --git a/apps/web-antd/src/views/system/user/index.vue b/apps/web-antd/src/views/system/user/index.vue
index 3a82df07..7645ee67 100644
--- a/apps/web-antd/src/views/system/user/index.vue
+++ b/apps/web-antd/src/views/system/user/index.vue
@@ -10,8 +10,17 @@ import {
   type VbenFormProps,
 } from '@vben/common-ui';
 import { $t } from '@vben/locales';
+import { getPopupContainer } from '@vben/utils';
 
-import { Avatar, Modal, Popconfirm, Space } from 'ant-design-vue';
+import {
+  Avatar,
+  Dropdown,
+  Menu,
+  MenuItem,
+  Modal,
+  Popconfirm,
+  Space,
+} from 'ant-design-vue';
 import dayjs from 'dayjs';
 
 import { useVbenVxeGrid, type VxeGridProps } from '#/adapter';
@@ -28,6 +37,8 @@ import { columns, querySchema } from './data';
 import DeptTree from './dept-tree.vue';
 import userDrawer from './user-drawer.vue';
 import userImportModal from './user-import-modal.vue';
+import userInfoModal from './user-info-modal.vue';
+import userResetPwdModal from './user-reset-pwd-modal.vue';
 
 /**
  * 导入
@@ -100,6 +111,7 @@ const gridOptions: VxeGridProps = {
   rowConfig: {
     isHover: true,
     keyField: 'userId',
+    height: 48,
   },
   round: true,
   align: 'center',
@@ -152,95 +164,133 @@ function handleMultiDelete() {
     },
   });
 }
+
+const [UserInfoModal, userInfoModalApi] = useVbenModal({
+  connectedComponent: userInfoModal,
+});
+function handleUserInfo(row: Recordable<any>) {
+  userInfoModalApi.setData({ userId: row.userId });
+  userInfoModalApi.open();
+}
+
+const [UserResetPwdModal, userResetPwdModalApi] = useVbenModal({
+  connectedComponent: userResetPwdModal,
+});
+
+function handleResetPwd(record: Recordable<any>) {
+  userResetPwdModalApi.setData({ record });
+  userResetPwdModalApi.open();
+}
 </script>
 
 <template>
-  <Page :auto-content-height="true" content-class="flex gap-[8px]">
-    <DeptTree
-      v-model:select-dept-id="selectDeptId"
-      :height="300"
-      class="w-[260px]"
-      @select="() => tableApi.query()"
-    />
-    <BasicTable class="flex-1">
-      <template #toolbar-actions>
-        <span class="pl-[7px] text-[16px]">用户列表</span>
-      </template>
-      <template #toolbar-tools>
-        <Space>
-          <a-button
-            v-access:code="['system:user:export']"
-            @click="downloadExcel(userExport, '用户管理', {})"
-          >
-            {{ $t('pages.common.export') }}
-          </a-button>
-          <a-button
-            v-access:code="['system:user:import']"
-            @click="handleImport"
-          >
-            {{ $t('pages.common.import') }}
-          </a-button>
-          <a-button
-            :disabled="!checked"
-            danger
-            type="primary"
-            v-access:code="['system:user:remove']"
-            @click="handleMultiDelete"
-          >
-            {{ $t('pages.common.delete') }}
-          </a-button>
-          <a-button
-            type="primary"
-            v-access:code="['system:user:add']"
-            @click="handleAdd"
-          >
-            {{ $t('pages.common.add') }}
-          </a-button>
-        </Space>
-      </template>
-      <template #avatar="{ row }">
-        <Avatar v-if="row.avatar" :src="row.avatar" />
-        <Avatar
-          v-else
-          src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"
-        />
-      </template>
-      <template #status="{ row }">
-        <TableSwitch
-          v-model="row.status"
-          :api="() => userStatusChange(row)"
-          :disabled="row.userId === 1"
-          :reload="() => tableApi.query()"
-        />
-      </template>
-      <template #action="{ row }">
-        <Space v-if="row.userId !== 1">
-          <a-button
-            size="small"
-            type="primary"
-            v-access:code="['system:user:edit']"
-            @click.stop="handleEdit(row)"
-          >
-            {{ $t('pages.common.edit') }}
-          </a-button>
-          <Popconfirm
-            placement="left"
-            title="确认删除？"
-            @confirm="handleDelete(row)"
-          >
+  <Page :auto-content-height="true">
+    <div class="flex h-full gap-[8px]">
+      <DeptTree
+        v-model:select-dept-id="selectDeptId"
+        :height="300"
+        class="w-[260px]"
+        @select="() => tableApi.query()"
+      />
+      <BasicTable class="flex-1 overflow-hidden">
+        <template #toolbar-actions>
+          <span class="pl-[7px] text-[16px]">用户列表</span>
+        </template>
+        <template #toolbar-tools>
+          <Space>
             <a-button
+              v-access:code="['system:user:export']"
+              @click="downloadExcel(userExport, '用户管理', {})"
+            >
+              {{ $t('pages.common.export') }}
+            </a-button>
+            <a-button
+              v-access:code="['system:user:import']"
+              @click="handleImport"
+            >
+              {{ $t('pages.common.import') }}
+            </a-button>
+            <a-button
+              :disabled="!checked"
               danger
-              size="small"
+              type="primary"
               v-access:code="['system:user:remove']"
-              @click.stop=""
+              @click="handleMultiDelete"
             >
               {{ $t('pages.common.delete') }}
             </a-button>
-          </Popconfirm>
-        </Space>
-      </template>
-    </BasicTable>
+            <a-button
+              type="primary"
+              v-access:code="['system:user:add']"
+              @click="handleAdd"
+            >
+              {{ $t('pages.common.add') }}
+            </a-button>
+          </Space>
+        </template>
+        <template #avatar="{ row }">
+          <Avatar v-if="row.avatar" :src="row.avatar" />
+          <Avatar
+            v-else
+            src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"
+          />
+        </template>
+        <template #status="{ row }">
+          <TableSwitch
+            v-model="row.status"
+            :api="() => userStatusChange(row)"
+            :disabled="row.userId === 1"
+            :reload="() => tableApi.query()"
+          />
+        </template>
+        <template #action="{ row }">
+          <template v-if="row.userId !== 1">
+            <a-button
+              size="small"
+              type="link"
+              v-access:code="['system:user:edit']"
+              @click.stop="handleEdit(row)"
+            >
+              {{ $t('pages.common.edit') }}
+            </a-button>
+            <Popconfirm
+              placement="left"
+              title="确认删除？"
+              @confirm="handleDelete(row)"
+            >
+              <a-button
+                danger
+                size="small"
+                type="link"
+                v-access:code="['system:user:remove']"
+                @click.stop=""
+              >
+                {{ $t('pages.common.delete') }}
+              </a-button>
+            </Popconfirm>
+            <Dropdown
+              :get-popup-container="getPopupContainer"
+              placement="bottomRight"
+            >
+              <template #overlay>
+                <Menu>
+                  <MenuItem key="1" @click="handleUserInfo(row)">
+                    用户信息
+                  </MenuItem>
+                  <MenuItem key="2" @click="handleResetPwd(row)">
+                    重置密码
+                  </MenuItem>
+                </Menu>
+              </template>
+              <a-button size="small" type="link">更多</a-button>
+            </Dropdown>
+          </template>
+        </template>
+      </BasicTable>
+    </div>
     <UserImpotModal />
     <UserDrawer @reload="tableApi.query()" />
+    <UserInfoModal />
+    <UserResetPwdModal />
   </Page>
 </template>
diff --git a/apps/web-antd/src/views/system/user/info.tsx b/apps/web-antd/src/views/system/user/info.tsx
index 68009601..cd00bb81 100644
--- a/apps/web-antd/src/views/system/user/info.tsx
+++ b/apps/web-antd/src/views/system/user/info.tsx
@@ -5,10 +5,12 @@ import { DictEnum } from '@vben/constants';
 import { Tag } from 'ant-design-vue';
 import dayjs from 'dayjs';
 import duration from 'dayjs/plugin/duration';
+import relativeTime from 'dayjs/plugin/relativeTime';
 
 import { renderDict } from '#/utils/render';
 
 dayjs.extend(duration);
+dayjs.extend(relativeTime);
 
 function renderTags(list: string[]) {
   return (
@@ -100,7 +102,7 @@ export const descSchema: DescItem[] = [
       // 默认en显示
       dayjs.locale('zh-cn');
       // 计算相差秒数
-      const diffSeconds = dayjs(new Date()).diff(dayjs(value), 'second');
+      const diffSeconds = dayjs().diff(dayjs(value), 'second');
       /**
        * 转为时间显示(x月 x天)
        * https://dayjs.fenxianglu.cn/category/duration.html#%E4%BA%BA%E6%80%A7%E5%8C%96
diff --git a/apps/web-antd/src/views/system/user/user-info-modal.vue b/apps/web-antd/src/views/system/user/user-info-modal.vue
index 63491e42..80a917e9 100644
--- a/apps/web-antd/src/views/system/user/user-info-modal.vue
+++ b/apps/web-antd/src/views/system/user/user-info-modal.vue
@@ -50,7 +50,7 @@ async function handleOpenChange(open: boolean) {
 </script>
 
 <template>
-  <BasicModal :footer="false" title="用户信息">
+  <BasicModal :footer="false" :fullscreen-button="false" title="用户信息">
     <Description @register="registerDescription" />
   </BasicModal>
 </template>
diff --git a/apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue b/apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue
index 37c1682a..4cf92e03 100644
--- a/apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue
+++ b/apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue
@@ -46,7 +46,7 @@ const [BasicForm, formApi] = useVbenForm({
       rules: 'required',
     },
     {
-      component: 'StrengthMeter',
+      component: 'InputPassword',
       componentProps: {
         placeholder: '请输入新的密码, 密码长度为5 - 20',
       },
@@ -58,6 +58,10 @@ const [BasicForm, formApi] = useVbenForm({
         .max(20, { message: '密码长度为5 - 20' }),
     },
   ],
+  showDefaultActions: false,
+  commonConfig: {
+    labelWidth: 80,
+  },
 });
 
 async function handleOpenChange(open: boolean) {
@@ -94,8 +98,14 @@ async function handleCancel() {
 </script>
 
 <template>
-  <BasicModal :close-on-click-modal="false" title="重置密码">
-    <Description @register="registerDescription" />
-    <BasicForm />
+  <BasicModal
+    :close-on-click-modal="false"
+    :fullscreen-button="false"
+    title="重置密码"
+  >
+    <div class="flex flex-col gap-[12px]">
+      <Description @register="registerDescription" />
+      <BasicForm />
+    </div>
   </BasicModal>
 </template>

From fdd1d19c8edaa7b2a332315b9732f166a582aede Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 22:20:00 +0800
Subject: [PATCH 04/19] feat: post

---
 apps/web-antd/src/views/system/post/data.ts   |  4 +-
 apps/web-antd/src/views/system/post/index.vue | 49 +++++++++++++------
 2 files changed, 37 insertions(+), 16 deletions(-)

diff --git a/apps/web-antd/src/views/system/post/data.ts b/apps/web-antd/src/views/system/post/data.ts
index 8e8a9ce9..fd0702a6 100644
--- a/apps/web-antd/src/views/system/post/data.ts
+++ b/apps/web-antd/src/views/system/post/data.ts
@@ -74,8 +74,8 @@ export const drawerSchema: FormSchemaGetter = () => [
       show: () => false,
       triggerFields: [''],
     },
-    fieldName: 'id',
-    label: 'id',
+    fieldName: 'postId',
+    label: 'postId',
   },
   {
     component: 'TreeSelect',
diff --git a/apps/web-antd/src/views/system/post/index.vue b/apps/web-antd/src/views/system/post/index.vue
index daaab270..3dc1c821 100644
--- a/apps/web-antd/src/views/system/post/index.vue
+++ b/apps/web-antd/src/views/system/post/index.vue
@@ -16,21 +16,28 @@ import DeptTree from '#/views/system/user/dept-tree.vue';
 import { columns, querySchema } from './data';
 import postDrawer from './post-drawer.vue';
 
-const formOptions: VbenFormProps = {
-  schema: querySchema(),
-  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
-};
-
 // 左边部门用
 const selectDeptId = ref<string[]>([]);
+const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+  },
+  schema: querySchema(),
+  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
+  handleReset: async () => {
+    selectDeptId.value = [];
+    // eslint-disable-next-line no-use-before-define
+    await tableApi.query();
+  },
+};
+
 const gridOptions: VxeGridProps = {
   checkboxConfig: {
     // 高亮
     highlight: true,
     // 翻页时保留选中状态
     reserve: true,
-    // 点击行选中
-    // trigger: 'row',
+    trigger: 'cell',
   },
   columns,
   height: 'auto',
@@ -78,7 +85,20 @@ const gridOptions: VxeGridProps = {
   showOverflow: true,
 };
 
-const [BasicTable, tableApi] = useVbenVxeGrid({ formOptions, gridOptions });
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
+
 const [PostDrawer, drawerApi] = useVbenDrawer({
   connectedComponent: postDrawer,
 });
@@ -95,7 +115,7 @@ async function handleEdit(record: Recordable<any>) {
 
 async function handleDelete(row: Recordable<any>) {
   await postRemove(row.postId);
-  await tableApi.reload();
+  await tableApi.query();
 }
 
 function handleMultiDelete() {
@@ -119,9 +139,9 @@ function handleMultiDelete() {
       v-model:select-dept-id="selectDeptId"
       :height="300"
       class="w-[260px]"
-      @select="() => tableApi.reload()"
+      @select="() => tableApi.query()"
     />
-    <BasicTable class="flex-1">
+    <BasicTable class="flex-1 overflow-hidden">
       <template #toolbar-actions>
         <span class="pl-[7px] text-[16px]">岗位列表</span>
       </template>
@@ -134,9 +154,10 @@ function handleMultiDelete() {
             {{ $t('pages.common.export') }}
           </a-button>
           <a-button
+            :disabled="!checked"
             danger
             type="primary"
-            v-access:code="['system:post:delete']"
+            v-access:code="['system:post:remove']"
             @click="handleMultiDelete"
           >
             {{ $t('pages.common.delete') }}
@@ -169,7 +190,7 @@ function handleMultiDelete() {
               danger
               size="small"
               type="link"
-              v-access:code="['system:post:delete']"
+              v-access:code="['system:post:remove']"
               @click.stop=""
             >
               {{ $t('pages.common.delete') }}
@@ -178,6 +199,6 @@ function handleMultiDelete() {
         </Space>
       </template>
     </BasicTable>
-    <PostDrawer @reload="tableApi.reload()" />
+    <PostDrawer @reload="tableApi.query()" />
   </Page>
 </template>

From 9ad4f96e3868e7ef77ee09e789afd9c9d905f7e1 Mon Sep 17 00:00:00 2001
From: Vben <ann.vben@gmail.com>
Date: Sat, 5 Oct 2024 22:30:13 +0800
Subject: [PATCH 05/19] fix: the vxeUI global configuration does not take
 effect (#4574)

---
 packages/effects/plugins/src/vxe-table/use-vxe-grid.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
index f8574a5d..cc0d91a2 100644
--- a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
+++ b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
@@ -63,6 +63,8 @@ const options = computed(() => {
   const slotActions = slots['toolbar-actions']?.();
   const slotTools = slots['toolbar-tools']?.();
 
+  const globalGridConfig = VxeUI?.getConfig()?.grid ?? {};
+
   const forceUseToolbarOptions = showToolbar.value
     ? {
         toolbarConfig: {
@@ -79,6 +81,7 @@ const options = computed(() => {
       {},
       forceUseToolbarOptions,
       toRaw(gridOptions.value),
+      globalGridConfig,
     ),
   );
 
@@ -205,7 +208,7 @@ async function init() {
   }
 
   // form 由 vben-form代替，所以不适配formConfig，这里给出警告
-  const formConfig = options.value.formConfig;
+  const formConfig = gridOptions.value?.formConfig;
   if (formConfig) {
     console.warn(
       '[Vben Vxe Table]: The formConfig in the grid is not supported, please use the `formOptions` props',

From d7d8784bb42fbec43d31e6e0f98991e621645426 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 22:56:44 +0800
Subject: [PATCH 06/19] =?UTF-8?q?feat:=20=E5=AD=97=E5=85=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../web-antd/src/api/system/dict/dict-type.ts |   8 +-
 .../src/views/system/dict/data/data.ts        |  42 +++-
 .../src/views/system/dict/data/index.vue      | 218 ++++++++++++++---
 apps/web-antd/src/views/system/dict/index.vue |  15 +-
 .../src/views/system/dict/type/data.ts        |  29 ++-
 ...ict-type-model.vue => dict-type-modal.vue} |   0
 .../src/views/system/dict/type/index.vue      | 222 ++++++++++++++----
 7 files changed, 441 insertions(+), 93 deletions(-)
 rename apps/web-antd/src/views/system/dict/type/{dict-type-model.vue => dict-type-modal.vue} (100%)

diff --git a/apps/web-antd/src/api/system/dict/dict-type.ts b/apps/web-antd/src/api/system/dict/dict-type.ts
index 2f5576de..cbb5e92a 100644
--- a/apps/web-antd/src/api/system/dict/dict-type.ts
+++ b/apps/web-antd/src/api/system/dict/dict-type.ts
@@ -1,6 +1,6 @@
 import type { DictType } from './dict-type-model';
 
-import type { ID, IDS, PageQuery } from '#/api/common';
+import type { ID, IDS, PageQuery, PageResult } from '#/api/common';
 
 import { commonExport } from '#/api/helper';
 import { requestClient } from '#/api/request';
@@ -18,8 +18,8 @@ enum Api {
  * @param params 请求参数
  * @returns list
  */
-export function dictList(params?: PageQuery) {
-  return requestClient.get<DictType[]>(Api.dictTypeList, { params });
+export function dictTypeList(params?: PageQuery) {
+  return requestClient.get<PageResult<DictType>>(Api.dictTypeList, { params });
 }
 
 /**
@@ -27,7 +27,7 @@ export function dictList(params?: PageQuery) {
  * @param data 表单参数
  * @returns blob
  */
-export function dictExport(data: any) {
+export function dictTypeExport(data: any) {
   return commonExport(Api.dictTypeExport, data);
 }
 
diff --git a/apps/web-antd/src/views/system/dict/data/data.ts b/apps/web-antd/src/views/system/dict/data/data.ts
index 273fb824..f6d80aa3 100644
--- a/apps/web-antd/src/views/system/dict/data/data.ts
+++ b/apps/web-antd/src/views/system/dict/data/data.ts
@@ -1,11 +1,14 @@
-import type { FormSchemaGetter } from '#/adapter';
+import type { FormSchemaGetter, VxeGridProps } from '#/adapter';
 
 import { getPopupContainer } from '@vben/utils';
 
+import { renderDictTag } from '#/utils/render';
+
 export const querySchema: FormSchemaGetter = () => [
   {
     component: 'Select',
     componentProps: {
+      placeholder: 'TODO: 字典类型',
       getPopupContainer,
     },
     fieldName: 'dictType',
@@ -18,6 +21,43 @@ export const querySchema: FormSchemaGetter = () => [
   },
 ];
 
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '字典标签',
+    field: 'cssClass',
+    slots: {
+      default: ({ row }) => {
+        const { dictValue } = row;
+        return renderDictTag(dictValue, [row as any]);
+      },
+    },
+  },
+  {
+    title: '字典键值',
+    field: 'dictValue',
+  },
+  {
+    title: '字典排序',
+    field: 'dictSort',
+  },
+  {
+    title: '备注',
+    field: 'remark',
+  },
+  {
+    title: '创建时间',
+    field: 'createTime',
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+
 export const drawerSchema: FormSchemaGetter = () => [
   {
     component: 'Input',
diff --git a/apps/web-antd/src/views/system/dict/data/index.vue b/apps/web-antd/src/views/system/dict/data/index.vue
index 7447562f..3196256d 100644
--- a/apps/web-antd/src/views/system/dict/data/index.vue
+++ b/apps/web-antd/src/views/system/dict/data/index.vue
@@ -1,63 +1,203 @@
 <script setup lang="ts">
+import type { Recordable } from '@vben/types';
+
 import { ref } from 'vue';
 
-import { useVbenDrawer } from '@vben/common-ui';
-import { $t } from '@vben/locales';
+import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui';
 
-import { Card } from 'ant-design-vue';
+import { Modal, Popconfirm, Space } from 'ant-design-vue';
+import dayjs from 'dayjs';
 
-import { useVbenForm } from '#/adapter';
+import { useVbenVxeGrid, type VxeGridProps } from '#/adapter';
+import {
+  dictDataExport,
+  dictDataList,
+  dictDataRemove,
+} from '#/api/system/dict/dict-data';
+import { downloadExcel } from '#/utils/file/download';
 
 import { emitter } from '../mitt';
-import { querySchema } from './data';
+import { columns, querySchema } from './data';
 import dictDataDrawer from './dict-data-drawer.vue';
 
+const dictType = ref('');
+
+const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+  },
+  schema: querySchema(),
+  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
+};
+
+const gridOptions: VxeGridProps = {
+  checkboxConfig: {
+    // 高亮
+    highlight: true,
+    // 翻页时保留选中状态
+    reserve: true,
+    // 点击行选中
+    // trigger: 'row',
+  },
+  columns,
+  height: 'auto',
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues = {}) => {
+        // 区间选择器处理
+        if (formValues?.createTime) {
+          formValues.params = {
+            beginTime: dayjs(formValues.createTime[0]).format(
+              'YYYY-MM-DD 00:00:00',
+            ),
+            endTime: dayjs(formValues.createTime[1]).format(
+              'YYYY-MM-DD 23:59:59',
+            ),
+          };
+          Reflect.deleteProperty(formValues, 'createTime');
+        } else {
+          Reflect.deleteProperty(formValues, 'params');
+        }
+
+        const params: any = {
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        };
+        if (dictType.value) {
+          params.dictType = dictType.value;
+        }
+
+        return await dictDataList(params);
+      },
+    },
+  },
+  rowConfig: {
+    isHover: true,
+    keyField: 'dictCode',
+  },
+  round: true,
+  align: 'center',
+  showOverflow: true,
+};
+
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
+
 const [DictDataDrawer, drawerApi] = useVbenDrawer({
   connectedComponent: dictDataDrawer,
 });
 
 function handleAdd() {
-  drawerApi.setData({ dictType: 'aa_bb_cc' });
+  drawerApi.setData({ dictType: dictType.value });
   drawerApi.open();
 }
 
-const [QueryForm] = useVbenForm({
-  // 默认展开
-  collapsed: false,
-  // 所有表单项共用，可单独在表单内覆盖
-  commonConfig: {
-    // 所有表单项
-    componentProps: {
-      class: 'w-full',
+async function handleEdit(record: Recordable<any>) {
+  drawerApi.setData({
+    dictType: dictType.value,
+    dictCode: record.dictCode,
+  });
+  drawerApi.open();
+}
+
+async function handleDelete(row: Recordable<any>) {
+  await dictDataRemove(row.dictCode);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: any) => row.dictCode);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await dictDataRemove(ids);
+      await tableApi.query();
     },
-  },
-  schema: querySchema(),
-  // 是否可展开
-  showCollapseButton: true,
-  submitButtonOptions: {
-    text: '查询',
-  },
-  wrapperClass: 'grid-cols-1 md:grid-cols-2',
-});
+  });
+}
 
-const testValue = ref('');
-
-emitter.on('rowClick', (dictType) => {
-  testValue.value = dictType;
+emitter.on('rowClick', async (value) => {
+  dictType.value = value;
+  await tableApi.query();
 });
 </script>
 
 <template>
-  <div class="flex flex-col gap-4">
-    <Card>
-      <QueryForm />
-    </Card>
-    <Card>
-      <a-button type="primary" @click="handleAdd">
-        {{ $t('pages.common.add') }}
-      </a-button>
-    </Card>
-    {{ testValue }}
-    <DictDataDrawer />
-  </div>
+  <Page :auto-content-height="true">
+    <BasicTable>
+      <template #toolbar-actions>
+        <span class="pl-[7px] text-[16px]">字典数据列表</span>
+      </template>
+      <template #toolbar-tools>
+        <Space>
+          <a-button
+            v-access:code="['system:dict:export']"
+            @click="downloadExcel(dictDataExport, '字典数据', {})"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!checked"
+            danger
+            type="primary"
+            v-access:code="['system:dict:remove']"
+            @click="handleMultiDelete"
+          >
+            {{ $t('pages.common.delete') }}
+          </a-button>
+          <a-button
+            :disabled="dictType === ''"
+            type="primary"
+            v-access:code="['system:dict:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <a-button
+          size="small"
+          type="link"
+          v-access:code="['system:dict:edit']"
+          @click="handleEdit(row)"
+        >
+          {{ $t('pages.common.edit') }}
+        </a-button>
+        <Popconfirm
+          placement="left"
+          title="确认删除？"
+          @confirm="handleDelete(row)"
+        >
+          <a-button
+            danger
+            size="small"
+            type="link"
+            v-access:code="['system:dict:remove']"
+            @click.stop=""
+          >
+            {{ $t('pages.common.delete') }}
+          </a-button>
+        </Popconfirm>
+      </template>
+    </BasicTable>
+    <DictDataDrawer @reload="tableApi.query()" />
+  </Page>
 </template>
diff --git a/apps/web-antd/src/views/system/dict/index.vue b/apps/web-antd/src/views/system/dict/index.vue
index 1254cff9..2f2331f8 100644
--- a/apps/web-antd/src/views/system/dict/index.vue
+++ b/apps/web-antd/src/views/system/dict/index.vue
@@ -6,8 +6,17 @@ import DictTypePanel from './type/index.vue';
 </script>
 
 <template>
-  <Page content-class="flex flex-col gap-[16px] lg:flex-row">
-    <DictTypePanel class="flex-1" />
-    <DictDataPanel class="flex-1" />
+  <Page :auto-content-height="true" content-class="flex flex-col lg:flex-row">
+    <DictTypePanel class="flex-1 overflow-hidden" />
+    <DictDataPanel class="flex-1 overflow-hidden" />
   </Page>
 </template>
+
+<style scoped>
+/**
+TODO: ugly code
+*/
+:deep(.p-4) {
+  padding: 6px;
+}
+</style>
diff --git a/apps/web-antd/src/views/system/dict/type/data.ts b/apps/web-antd/src/views/system/dict/type/data.ts
index 8fd6c641..78dad00f 100644
--- a/apps/web-antd/src/views/system/dict/type/data.ts
+++ b/apps/web-antd/src/views/system/dict/type/data.ts
@@ -1,4 +1,4 @@
-import { type FormSchemaGetter, z } from '#/adapter';
+import { type FormSchemaGetter, type VxeGridProps, z } from '#/adapter';
 
 export const querySchema: FormSchemaGetter = () => [
   {
@@ -13,6 +13,33 @@ export const querySchema: FormSchemaGetter = () => [
   },
 ];
 
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '字典名称',
+    field: 'dictName',
+  },
+  {
+    title: '字典类型',
+    field: 'dictType',
+  },
+  {
+    title: '备注',
+    field: 'remark',
+  },
+  {
+    title: '创建时间',
+    field: 'createTime',
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+
 export const modalSchema: FormSchemaGetter = () => [
   {
     component: 'Input',
diff --git a/apps/web-antd/src/views/system/dict/type/dict-type-model.vue b/apps/web-antd/src/views/system/dict/type/dict-type-modal.vue
similarity index 100%
rename from apps/web-antd/src/views/system/dict/type/dict-type-model.vue
rename to apps/web-antd/src/views/system/dict/type/dict-type-modal.vue
diff --git a/apps/web-antd/src/views/system/dict/type/index.vue b/apps/web-antd/src/views/system/dict/type/index.vue
index 1b169781..4ed77f04 100644
--- a/apps/web-antd/src/views/system/dict/type/index.vue
+++ b/apps/web-antd/src/views/system/dict/type/index.vue
@@ -1,65 +1,197 @@
 <script setup lang="ts">
-import { useVbenModal } from '@vben/common-ui';
-import { $t } from '@vben/locales';
+import type { Recordable } from '@vben/types';
 
-import { Card } from 'ant-design-vue';
-import { uniqueId } from 'lodash-es';
+import { ref } from 'vue';
 
-import { useVbenForm } from '#/adapter';
+import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
+
+import { Modal, Popconfirm, Space } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { useVbenVxeGrid, type VxeGridProps } from '#/adapter';
+import {
+  dictTypeExport,
+  dictTypeList,
+  dictTypeRemove,
+} from '#/api/system/dict/dict-type';
+import { downloadExcel } from '#/utils/file/download';
 
 import { emitter } from '../mitt';
-import { querySchema } from './data';
-import dictTypeModel from './dict-type-model.vue';
+import { columns, querySchema } from './data';
+import dictTypeModal from './dict-type-modal.vue';
 
-defineOptions({ name: 'DictTypePanel' });
+const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 70,
+  },
+  schema: querySchema(),
+  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
+};
 
+const gridOptions: VxeGridProps = {
+  checkboxConfig: {
+    // 高亮
+    highlight: true,
+    // 翻页时保留选中状态
+    reserve: true,
+    // 点击行选中
+    // trigger: 'row',
+  },
+  columns,
+  height: 'auto',
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues = {}) => {
+        // 区间选择器处理
+        if (formValues?.createTime) {
+          formValues.params = {
+            beginTime: dayjs(formValues.createTime[0]).format(
+              'YYYY-MM-DD 00:00:00',
+            ),
+            endTime: dayjs(formValues.createTime[1]).format(
+              'YYYY-MM-DD 23:59:59',
+            ),
+          };
+          Reflect.deleteProperty(formValues, 'createTime');
+        } else {
+          Reflect.deleteProperty(formValues, 'params');
+        }
+
+        return await dictTypeList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    isHover: true,
+    keyField: 'dictId',
+  },
+  round: true,
+  align: 'center',
+  showOverflow: true,
+};
+
+const checked = ref(false);
+const lastDictType = ref('');
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    cellClick: (e: any) => {
+      const { row } = e;
+      if (lastDictType.value === row.dictType) {
+        return;
+      }
+      emitter.emit('rowClick', row.dictType);
+      lastDictType.value = row.dictType;
+    },
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
 const [DictTypeModal, modalApi] = useVbenModal({
-  connectedComponent: dictTypeModel,
+  connectedComponent: dictTypeModal,
 });
 
 function handleAdd() {
-  modalApi.setData({ update: false });
+  modalApi.setData({});
   modalApi.open();
 }
 
-const [QueryForm] = useVbenForm({
-  // 默认展开
-  collapsed: false,
-  // 所有表单项共用，可单独在表单内覆盖
-  commonConfig: {
-    // 所有表单项
-    componentProps: {
-      class: 'w-full',
-    },
-  },
-  schema: querySchema(),
-  // 是否可展开
-  showCollapseButton: true,
-  submitButtonOptions: {
-    text: '查询',
-  },
-  wrapperClass: 'grid-cols-1 md:grid-cols-2',
-});
+async function handleEdit(record: Recordable<any>) {
+  modalApi.setData({ id: record.dictId });
+  modalApi.open();
+}
 
-function handleRowClickTest() {
-  emitter.emit('rowClick', uniqueId('mitt-'));
+async function handleDelete(row: Recordable<any>) {
+  await dictTypeRemove(row.dictId);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: any) => row.dictId);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await dictTypeRemove(ids);
+      await tableApi.query();
+    },
+  });
 }
 </script>
 
 <template>
-  <div class="flex flex-col gap-4">
-    <Card>
-      <QueryForm />
-    </Card>
-    <Card>
-      <a-button type="primary" @click="handleAdd">
-        {{ $t('pages.common.add') }}
-      </a-button>
-    </Card>
-    <Card>
-      <a-button @click="handleRowClickTest">测试mitt</a-button>
-      左侧向右侧传值
-    </Card>
-    <DictTypeModal />
-  </div>
+  <Page :auto-content-height="true">
+    <BasicTable>
+      <template #toolbar-actions>
+        <span class="pl-[7px] text-[16px]">字典类型列表</span>
+      </template>
+      <template #toolbar-tools>
+        <Space>
+          <a-button danger type="primary">缓存(TODO)</a-button>
+          <a-button
+            v-access:code="['system:dict:export']"
+            @click="downloadExcel(dictTypeExport, '字典类型数据', {})"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!checked"
+            danger
+            type="primary"
+            v-access:code="['system:dict:remove']"
+            @click="handleMultiDelete"
+          >
+            {{ $t('pages.common.delete') }}
+          </a-button>
+          <a-button
+            type="primary"
+            v-access:code="['system:dict:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <a-button
+          size="small"
+          type="link"
+          v-access:code="['system:dict:edit']"
+          @click="handleEdit(row)"
+        >
+          {{ $t('pages.common.edit') }}
+        </a-button>
+        <Popconfirm
+          placement="left"
+          title="确认删除？"
+          @confirm="handleDelete(row)"
+        >
+          <a-button
+            danger
+            size="small"
+            type="link"
+            v-access:code="['system:dict:remove']"
+            @click.stop=""
+          >
+            {{ $t('pages.common.delete') }}
+          </a-button>
+        </Popconfirm>
+      </template>
+    </BasicTable>
+    <DictTypeModal @reload="tableApi.query()" />
+  </Page>
 </template>

From 6a627fe045a6724a92f1fa7292d846aaaaa64783 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 22:59:14 +0800
Subject: [PATCH 07/19] feat: config

---
 .../src/views/system/config/index.vue         | 60 ++++++++++++-------
 1 file changed, 38 insertions(+), 22 deletions(-)

diff --git a/apps/web-antd/src/views/system/config/index.vue b/apps/web-antd/src/views/system/config/index.vue
index d523599a..a4382e50 100644
--- a/apps/web-antd/src/views/system/config/index.vue
+++ b/apps/web-antd/src/views/system/config/index.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import type { Recordable } from '@vben/types';
 
+import { ref } from 'vue';
+
 import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
 
 import { Modal, Popconfirm, Space } from 'ant-design-vue';
@@ -19,6 +21,9 @@ import configModal from './config-modal.vue';
 import { columns, querySchema } from './data';
 
 const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+  },
   schema: querySchema(),
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
 };
@@ -71,7 +76,19 @@ const gridOptions: VxeGridProps = {
   showOverflow: true,
 };
 
-const [BasicTable, tableApi] = useVbenVxeGrid({ formOptions, gridOptions });
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
 const [ConfigModal, modalApi] = useVbenModal({
   connectedComponent: configModal,
 });
@@ -127,9 +144,10 @@ async function handleRefreshCache() {
             {{ $t('pages.common.export') }}
           </a-button>
           <a-button
+            :disabled="!checked"
             danger
             type="primary"
-            v-access:code="['system:config:delete']"
+            v-access:code="['system:config:remove']"
             @click="handleMultiDelete"
           >
             {{ $t('pages.common.delete') }}
@@ -144,31 +162,29 @@ async function handleRefreshCache() {
         </Space>
       </template>
       <template #action="{ row }">
-        <Space>
+        <a-button
+          size="small"
+          type="link"
+          v-access:code="['system:config:edit']"
+          @click="handleEdit(row)"
+        >
+          {{ $t('pages.common.edit') }}
+        </a-button>
+        <Popconfirm
+          placement="left"
+          title="确认删除？"
+          @confirm="handleDelete(row)"
+        >
           <a-button
+            danger
             size="small"
             type="link"
-            v-access:code="['system:config:edit']"
-            @click="handleEdit(row)"
+            v-access:code="['system:config:remove']"
+            @click.stop=""
           >
-            {{ $t('pages.common.edit') }}
+            {{ $t('pages.common.delete') }}
           </a-button>
-          <Popconfirm
-            placement="left"
-            title="确认删除？"
-            @confirm="handleDelete(row)"
-          >
-            <a-button
-              danger
-              size="small"
-              type="link"
-              v-access:code="['system:config:delete']"
-              @click.stop=""
-            >
-              {{ $t('pages.common.delete') }}
-            </a-button>
-          </Popconfirm>
-        </Space>
+        </Popconfirm>
       </template>
     </BasicTable>
     <ConfigModal @reload="tableApi.reload()" />

From fb4a5334991a8bafe6e2b29240659960a2b4357c Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:01:16 +0800
Subject: [PATCH 08/19] feat: notice

---
 .../src/views/system/notice/index.vue         | 61 ++++++++++++-------
 1 file changed, 39 insertions(+), 22 deletions(-)

diff --git a/apps/web-antd/src/views/system/notice/index.vue b/apps/web-antd/src/views/system/notice/index.vue
index 50ba542b..72a13920 100644
--- a/apps/web-antd/src/views/system/notice/index.vue
+++ b/apps/web-antd/src/views/system/notice/index.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import type { Recordable } from '@vben/types';
 
+import { ref } from 'vue';
+
 import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
 
 import { Modal, Popconfirm, Space } from 'ant-design-vue';
@@ -13,6 +15,9 @@ import { columns, querySchema } from './data';
 import noticeModal from './notice-modal.vue';
 
 const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+  },
   schema: querySchema(),
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
 };
@@ -65,7 +70,20 @@ const gridOptions: VxeGridProps = {
   showOverflow: true,
 };
 
-const [BasicTable, tableApi] = useVbenVxeGrid({ formOptions, gridOptions });
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
+
 const [NoticeModal, modalApi] = useVbenModal({
   connectedComponent: noticeModal,
 });
@@ -109,9 +127,10 @@ function handleMultiDelete() {
       <template #toolbar-tools>
         <Space>
           <a-button
+            :disabled="!checked"
             danger
             type="primary"
-            v-access:code="['system:notice:delete']"
+            v-access:code="['system:notice:remove']"
             @click="handleMultiDelete"
           >
             {{ $t('pages.common.delete') }}
@@ -126,31 +145,29 @@ function handleMultiDelete() {
         </Space>
       </template>
       <template #action="{ row }">
-        <Space>
+        <a-button
+          size="small"
+          type="link"
+          v-access:code="['system:notice:edit']"
+          @click="handleEdit(row)"
+        >
+          {{ $t('pages.common.edit') }}
+        </a-button>
+        <Popconfirm
+          placement="left"
+          title="确认删除？"
+          @confirm="handleDelete(row)"
+        >
           <a-button
+            danger
             size="small"
             type="link"
-            v-access:code="['system:notice:edit']"
-            @click="handleEdit(row)"
+            v-access:code="['system:notice:remove']"
+            @click.stop=""
           >
-            {{ $t('pages.common.edit') }}
+            {{ $t('pages.common.delete') }}
           </a-button>
-          <Popconfirm
-            placement="left"
-            title="确认删除？"
-            @confirm="handleDelete(row)"
-          >
-            <a-button
-              danger
-              size="small"
-              type="link"
-              v-access:code="['system:notice:delete']"
-              @click.stop=""
-            >
-              {{ $t('pages.common.delete') }}
-            </a-button>
-          </Popconfirm>
-        </Space>
+        </Popconfirm>
       </template>
     </BasicTable>
     <NoticeModal @reload="tableApi.reload()" />

From 1ed659177ab50030ae4ab922269e73d797116224 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:06:34 +0800
Subject: [PATCH 09/19] chore: checked false

---
 apps/web-antd/src/views/monitor/logininfor/index.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/apps/web-antd/src/views/monitor/logininfor/index.vue b/apps/web-antd/src/views/monitor/logininfor/index.vue
index 530b0510..d5b75986 100644
--- a/apps/web-antd/src/views/monitor/logininfor/index.vue
+++ b/apps/web-antd/src/views/monitor/logininfor/index.vue
@@ -110,6 +110,7 @@ function handleMultiDelete() {
     onOk: async () => {
       await loginInfoRemove(ids);
       await tableApi.query();
+      checked.value = false;
     },
   });
 }

From c3f7840fe07d3f973238918f8c6acaa23deb6b43 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:09:42 +0800
Subject: [PATCH 10/19] feat: oss-config

---
 .../src/views/system/oss-config/index.vue     | 64 +++++++++++--------
 1 file changed, 39 insertions(+), 25 deletions(-)

diff --git a/apps/web-antd/src/views/system/oss-config/index.vue b/apps/web-antd/src/views/system/oss-config/index.vue
index b51d80b7..96c18e38 100644
--- a/apps/web-antd/src/views/system/oss-config/index.vue
+++ b/apps/web-antd/src/views/system/oss-config/index.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import type { Recordable } from '@vben/types';
 
+import { ref } from 'vue';
+
 import { useAccess } from '@vben/access';
 import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui';
 
@@ -71,7 +73,20 @@ const gridOptions: VxeGridProps = {
   showOverflow: true,
 };
 
-const [BasicTable, tableApi] = useVbenVxeGrid({ formOptions, gridOptions });
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
+
 const [OssConfigDrawer, drawerApi] = useVbenDrawer({
   connectedComponent: ossConfigDrawer,
 });
@@ -88,7 +103,7 @@ async function handleEdit(record: Recordable<any>) {
 
 async function handleDelete(row: Recordable<any>) {
   await ossConfigRemove(row.ossConfigId);
-  await tableApi.reload();
+  await tableApi.query();
 }
 
 function handleMultiDelete() {
@@ -100,7 +115,7 @@ function handleMultiDelete() {
     content: `确认删除选中的${ids.length}条记录吗？`,
     onOk: async () => {
       await ossConfigRemove(ids);
-      await tableApi.reload();
+      await tableApi.query();
     },
   });
 }
@@ -117,6 +132,7 @@ const { hasAccessByCodes } = useAccess();
       <template #toolbar-tools>
         <Space>
           <a-button
+            :disabled="!checked"
             danger
             type="primary"
             v-access:code="['system:ossConfig:remove']"
@@ -138,37 +154,35 @@ const { hasAccessByCodes } = useAccess();
           v-model="row.status"
           :api="() => ossConfigChangeStatus(row)"
           :disabled="!hasAccessByCodes(['system:ossConfig:edit'])"
-          :reload="() => tableApi.reload()"
+          :reload="() => tableApi.query()"
         />
       </template>
       <template #action="{ row }">
-        <Space>
+        <a-button
+          size="small"
+          type="link"
+          v-access:code="['system:ossConfig:edit']"
+          @click="handleEdit(row)"
+        >
+          {{ $t('pages.common.edit') }}
+        </a-button>
+        <Popconfirm
+          placement="left"
+          title="确认删除？"
+          @confirm="handleDelete(row)"
+        >
           <a-button
+            danger
             size="small"
             type="link"
-            v-access:code="['system:ossConfig:edit']"
-            @click="handleEdit(row)"
+            v-access:code="['system:ossConfig:remove']"
+            @click.stop=""
           >
-            {{ $t('pages.common.edit') }}
+            {{ $t('pages.common.delete') }}
           </a-button>
-          <Popconfirm
-            placement="left"
-            title="确认删除？"
-            @confirm="handleDelete(row)"
-          >
-            <a-button
-              danger
-              size="small"
-              type="link"
-              v-access:code="['system:ossConfig:remove']"
-              @click.stop=""
-            >
-              {{ $t('pages.common.delete') }}
-            </a-button>
-          </Popconfirm>
-        </Space>
+        </Popconfirm>
       </template>
     </BasicTable>
-    <OssConfigDrawer @reload="tableApi.reload()" />
+    <OssConfigDrawer @reload="tableApi.query()" />
   </Page>
 </template>

From 6a5cb7d9b6703d8251a3b1a789a07fde3fede396 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:13:20 +0800
Subject: [PATCH 11/19] feat: client

---
 .../src/views/system/client/index.vue         | 70 ++++++++++++-------
 1 file changed, 44 insertions(+), 26 deletions(-)

diff --git a/apps/web-antd/src/views/system/client/index.vue b/apps/web-antd/src/views/system/client/index.vue
index a8c555fc..97f1bcb2 100644
--- a/apps/web-antd/src/views/system/client/index.vue
+++ b/apps/web-antd/src/views/system/client/index.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import type { Recordable } from '@vben/types';
 
+import { ref } from 'vue';
+
 import { useAccess } from '@vben/access';
 import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui';
 
@@ -20,6 +22,9 @@ import clientDrawer from './client-drawer.vue';
 import { columns, querySchema } from './data';
 
 const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+  },
   schema: querySchema(),
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
 };
@@ -52,13 +57,27 @@ const gridOptions: VxeGridProps = {
   rowConfig: {
     isHover: true,
     keyField: 'id',
+    height: 90,
   },
   round: true,
   align: 'center',
   showOverflow: true,
 };
 
-const [BasicTable, tableApi] = useVbenVxeGrid({ formOptions, gridOptions });
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
+
 const [ClientDrawer, drawerApi] = useVbenDrawer({
   connectedComponent: clientDrawer,
 });
@@ -75,7 +94,7 @@ async function handleEdit(record: Recordable<any>) {
 
 async function handleDelete(row: Recordable<any>) {
   await clientRemove(row.id);
-  await tableApi.reload();
+  await tableApi.query();
 }
 
 function handleMultiDelete() {
@@ -87,7 +106,7 @@ function handleMultiDelete() {
     content: `确认删除选中的${ids.length}条记录吗？`,
     onOk: async () => {
       await clientRemove(ids);
-      await tableApi.reload();
+      await tableApi.query();
     },
   });
 }
@@ -110,6 +129,7 @@ const { hasAccessByCodes } = useAccess();
             {{ $t('pages.common.export') }}
           </a-button>
           <a-button
+            :disabled="!checked"
             danger
             type="primary"
             v-access:code="['system:client:remove']"
@@ -133,38 +153,36 @@ const { hasAccessByCodes } = useAccess();
           v-model="row.status"
           :api="() => clientChangeStatus(row)"
           :disabled="row.id === 1 || !hasAccessByCodes(['system:client:edit'])"
-          :reload="() => tableApi.reload()"
+          :reload="() => tableApi.query()"
         />
       </template>
       <template #action="{ row }">
-        <Space>
+        <a-button
+          size="small"
+          type="link"
+          v-access:code="['system:client:edit']"
+          @click="handleEdit(row)"
+        >
+          {{ $t('pages.common.edit') }}
+        </a-button>
+        <Popconfirm
+          placement="left"
+          title="确认删除？"
+          @confirm="handleDelete(row)"
+        >
           <a-button
+            :disabled="row.id === 1"
+            danger
             size="small"
             type="link"
-            v-access:code="['system:client:edit']"
-            @click="handleEdit(row)"
+            v-access:code="['system:client:remove']"
+            @click.stop=""
           >
-            {{ $t('pages.common.edit') }}
+            {{ $t('pages.common.delete') }}
           </a-button>
-          <Popconfirm
-            placement="left"
-            title="确认删除？"
-            @confirm="handleDelete(row)"
-          >
-            <a-button
-              :disabled="row.id === 1"
-              danger
-              size="small"
-              type="link"
-              v-access:code="['system:client:remove']"
-              @click.stop=""
-            >
-              {{ $t('pages.common.delete') }}
-            </a-button>
-          </Popconfirm>
-        </Space>
+        </Popconfirm>
       </template>
     </BasicTable>
-    <ClientDrawer @reload="tableApi.reload()" />
+    <ClientDrawer @reload="tableApi.query()" />
   </Page>
 </template>

From 936fa01b0877d21ea27d46bb5793f1d73d27f51e Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:14:19 +0800
Subject: [PATCH 12/19] chore: disabled

---
 apps/web-antd/src/views/system/client/index.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/apps/web-antd/src/views/system/client/index.vue b/apps/web-antd/src/views/system/client/index.vue
index 97f1bcb2..29780671 100644
--- a/apps/web-antd/src/views/system/client/index.vue
+++ b/apps/web-antd/src/views/system/client/index.vue
@@ -166,6 +166,7 @@ const { hasAccessByCodes } = useAccess();
           {{ $t('pages.common.edit') }}
         </a-button>
         <Popconfirm
+          :disabled="row.id === 1"
           placement="left"
           title="确认删除？"
           @confirm="handleDelete(row)"

From 74d56ddd8210ce45b1e7f5a657437f38c85b7c65 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:23:21 +0800
Subject: [PATCH 13/19] =?UTF-8?q?feat:=20=E7=A7=9F=E6=88=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../web-antd/src/views/system/tenant/data.tsx |  44 +++-
 .../src/views/system/tenant/index.vue         | 215 +++++++++++++++---
 2 files changed, 223 insertions(+), 36 deletions(-)

diff --git a/apps/web-antd/src/views/system/tenant/data.tsx b/apps/web-antd/src/views/system/tenant/data.tsx
index 1148a479..d31ca6d7 100644
--- a/apps/web-antd/src/views/system/tenant/data.tsx
+++ b/apps/web-antd/src/views/system/tenant/data.tsx
@@ -2,7 +2,7 @@ import { getPopupContainer } from '@vben/utils';
 
 import dayjs from 'dayjs';
 
-import { type FormSchemaGetter, z } from '#/adapter';
+import { type FormSchemaGetter, type VxeGridProps, z } from '#/adapter';
 
 export const querySchema: FormSchemaGetter = () => [
   {
@@ -27,6 +27,48 @@ export const querySchema: FormSchemaGetter = () => [
   },
 ];
 
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '租户编号',
+    field: 'tenantId',
+  },
+  {
+    title: '租户名称',
+    field: 'companyName',
+  },
+  {
+    title: '联系人',
+    field: 'contactUserName',
+  },
+  {
+    title: '联系电话',
+    field: 'contactPhone',
+  },
+  {
+    title: '到期时间',
+    field: 'expireTime',
+    formatter: ({ cellValue }) => {
+      if (!cellValue) {
+        return '无期限';
+      }
+      return cellValue;
+    },
+  },
+  {
+    title: '租户状态',
+    field: 'status',
+    slots: { default: 'status' },
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+
 const defaultExpireTime = dayjs()
   .add(365, 'days')
   .startOf('day')
diff --git a/apps/web-antd/src/views/system/tenant/index.vue b/apps/web-antd/src/views/system/tenant/index.vue
index 8c570272..f8033d92 100644
--- a/apps/web-antd/src/views/system/tenant/index.vue
+++ b/apps/web-antd/src/views/system/tenant/index.vue
@@ -1,55 +1,200 @@
 <script setup lang="ts">
-import { Page, useVbenDrawer } from '@vben/common-ui';
-import { $t } from '@vben/locales';
+import type { Recordable } from '@vben/types';
 
-import { Card } from 'ant-design-vue';
+import { ref } from 'vue';
 
-import { useVbenForm } from '#/adapter';
+import { useAccess } from '@vben/access';
+import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui';
 
-import { querySchema } from './data';
+import { Modal, Popconfirm, Space } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { useVbenVxeGrid, type VxeGridProps } from '#/adapter';
+import {
+  tenantExport,
+  tenantList,
+  tenantRemove,
+  tenantStatusChange,
+} from '#/api/system/tenant';
+import { TableSwitch } from '#/components/table';
+import { downloadExcel } from '#/utils/file/download';
+
+import { columns, querySchema } from './data';
 import tenantDrawer from './tenant-drawer.vue';
 
+const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+  },
+  schema: querySchema(),
+  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
+};
+
+const gridOptions: VxeGridProps = {
+  checkboxConfig: {
+    // 高亮
+    highlight: true,
+    // 翻页时保留选中状态
+    reserve: true,
+    // 点击行选中
+    // trigger: 'row',
+  },
+  columns,
+  height: 'auto',
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues) => {
+        // 区间选择器处理
+        if (formValues?.createTime) {
+          formValues.params = {
+            beginTime: dayjs(formValues.createTime[0]).format(
+              'YYYY-MM-DD 00:00:00',
+            ),
+            endTime: dayjs(formValues.createTime[1]).format(
+              'YYYY-MM-DD 23:59:59',
+            ),
+          };
+          Reflect.deleteProperty(formValues, 'createTime');
+        } else {
+          Reflect.deleteProperty(formValues, 'params');
+        }
+
+        return await tenantList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    isHover: true,
+    keyField: 'id',
+  },
+  round: true,
+  align: 'center',
+  showOverflow: true,
+};
+
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
+
 const [TenantDrawer, drawerApi] = useVbenDrawer({
   connectedComponent: tenantDrawer,
 });
 
 function handleAdd() {
-  drawerApi.setData({ update: false });
+  drawerApi.setData({});
   drawerApi.open();
 }
 
-const [QueryForm] = useVbenForm({
-  // 默认展开
-  collapsed: false,
-  // 所有表单项共用，可单独在表单内覆盖
-  commonConfig: {
-    // 所有表单项
-    componentProps: {
-      class: 'w-full',
+async function handleEdit(record: Recordable<any>) {
+  drawerApi.setData({ id: record.id });
+  drawerApi.open();
+}
+
+async function handleDelete(row: Recordable<any>) {
+  await tenantRemove(row.id);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: any) => row.id);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await tenantRemove(ids);
+      await tableApi.query();
+      checked.value = false;
     },
-  },
-  schema: querySchema(),
-  // 是否可展开
-  showCollapseButton: true,
-  submitButtonOptions: {
-    text: '查询',
-  },
-  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
-});
+  });
+}
+const { hasAccessByCodes } = useAccess();
 </script>
 
 <template>
-  <Page>
-    <Card>
-      <QueryForm />
-    </Card>
-    <a-button
-      type="primary"
-      v-access:code="['system:tenant:add']"
-      @click="handleAdd"
-    >
-      {{ $t('pages.common.add') }}
-    </a-button>
-    <TenantDrawer />
+  <Page :auto-content-height="true">
+    todo 新增修改删除与store同步 修改不显示密码
+    <BasicTable>
+      <template #toolbar-actions>
+        <span class="pl-[7px] text-[16px]">租户列表 </span>
+      </template>
+      <template #toolbar-tools>
+        <Space>
+          <a-button
+            v-access:code="['system:tenant:export']"
+            @click="downloadExcel(tenantExport, '租户数据', {})"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!checked"
+            danger
+            type="primary"
+            v-access:code="['system:tenant:remove']"
+            @click="handleMultiDelete"
+          >
+            {{ $t('pages.common.delete') }}
+          </a-button>
+          <a-button
+            type="primary"
+            v-access:code="['system:tenant:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #status="{ row }">
+        <TableSwitch
+          v-model="row.status"
+          :api="() => tenantStatusChange(row)"
+          :disabled="row.id === 1 || !hasAccessByCodes(['system:tenant:edit'])"
+          :reload="() => tableApi.query()"
+        />
+      </template>
+      <template #action="{ row }">
+        <a-button
+          size="small"
+          type="link"
+          v-access:code="['system:tenant:edit']"
+          @click="handleEdit(row)"
+        >
+          {{ $t('pages.common.edit') }}
+        </a-button>
+        <Popconfirm
+          placement="left"
+          title="确认删除？"
+          @confirm="handleDelete(row)"
+        >
+          <a-button
+            danger
+            size="small"
+            type="link"
+            v-access:code="['system:tenant:remove']"
+            @click.stop=""
+          >
+            {{ $t('pages.common.delete') }}
+          </a-button>
+        </Popconfirm>
+      </template>
+    </BasicTable>
+    <TenantDrawer @reload="tableApi.query()" />
   </Page>
 </template>

From a392c0a29360d82d347bf20f652a748ce62708c1 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:32:51 +0800
Subject: [PATCH 14/19] =?UTF-8?q?feat:=20=E7=A7=9F=E6=88=B7=E5=A5=97?=
 =?UTF-8?q?=E9=A4=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/api/system/tenant-package/index.ts    |   6 +-
 .../src/views/system/tenantPackage/data.ts    |  26 ++-
 .../src/views/system/tenantPackage/index.vue  | 192 +++++++++++++++++-
 3 files changed, 213 insertions(+), 11 deletions(-)

diff --git a/apps/web-antd/src/api/system/tenant-package/index.ts b/apps/web-antd/src/api/system/tenant-package/index.ts
index 4b74faee..1851a7bc 100644
--- a/apps/web-antd/src/api/system/tenant-package/index.ts
+++ b/apps/web-antd/src/api/system/tenant-package/index.ts
@@ -1,6 +1,6 @@
 import type { TenantPackage } from './model';
 
-import type { ID, IDS, PageQuery } from '#/api/common';
+import type { ID, IDS, PageQuery, PageResult } from '#/api/common';
 
 import { commonExport } from '#/api/helper';
 import { requestClient } from '#/api/request';
@@ -14,7 +14,9 @@ enum Api {
 }
 
 export function packageList(params?: PageQuery) {
-  return requestClient.get<TenantPackage[]>(Api.packageList, { params });
+  return requestClient.get<PageResult<TenantPackage>>(Api.packageList, {
+    params,
+  });
 }
 
 // 下拉框
diff --git a/apps/web-antd/src/views/system/tenantPackage/data.ts b/apps/web-antd/src/views/system/tenantPackage/data.ts
index f2dcd25c..7e8fba8c 100644
--- a/apps/web-antd/src/views/system/tenantPackage/data.ts
+++ b/apps/web-antd/src/views/system/tenantPackage/data.ts
@@ -1,4 +1,4 @@
-import type { FormSchemaGetter } from '#/adapter';
+import type { FormSchemaGetter, VxeGridProps } from '#/adapter';
 
 export const querySchema: FormSchemaGetter = () => [
   {
@@ -8,6 +8,30 @@ export const querySchema: FormSchemaGetter = () => [
   },
 ];
 
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '套餐名称',
+    field: 'packageName',
+  },
+  {
+    title: '备注',
+    field: 'remark',
+  },
+  {
+    title: '租户状态',
+    field: 'status',
+    slots: { default: 'status' },
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+
 export const drawerSchema: FormSchemaGetter = () => [
   {
     component: 'Input',
diff --git a/apps/web-antd/src/views/system/tenantPackage/index.vue b/apps/web-antd/src/views/system/tenantPackage/index.vue
index 261a41ea..3013da23 100644
--- a/apps/web-antd/src/views/system/tenantPackage/index.vue
+++ b/apps/web-antd/src/views/system/tenantPackage/index.vue
@@ -1,24 +1,200 @@
 <script setup lang="ts">
-import { Page, useVbenDrawer } from '@vben/common-ui';
-import { $t } from '@vben/locales';
+import type { Recordable } from '@vben/types';
 
+import { ref } from 'vue';
+
+import { useAccess } from '@vben/access';
+import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui';
+
+import { Modal, Popconfirm, Space } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { useVbenVxeGrid, type VxeGridProps } from '#/adapter';
+import {
+  packageChangeStatus,
+  packageExport,
+  packageList,
+  packageRemove,
+} from '#/api/system/tenant-package';
+import { TableSwitch } from '#/components/table';
+import { downloadExcel } from '#/utils/file/download';
+
+import { columns, querySchema } from './data';
 import tenantPackageDrawer from './tenant-package-drawer.vue';
 
+const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+  },
+  schema: querySchema(),
+  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
+};
+
+const gridOptions: VxeGridProps = {
+  checkboxConfig: {
+    // 高亮
+    highlight: true,
+    // 翻页时保留选中状态
+    reserve: true,
+    // 点击行选中
+    // trigger: 'row',
+  },
+  columns,
+  height: 'auto',
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues) => {
+        // 区间选择器处理
+        if (formValues?.createTime) {
+          formValues.params = {
+            beginTime: dayjs(formValues.createTime[0]).format(
+              'YYYY-MM-DD 00:00:00',
+            ),
+            endTime: dayjs(formValues.createTime[1]).format(
+              'YYYY-MM-DD 23:59:59',
+            ),
+          };
+          Reflect.deleteProperty(formValues, 'createTime');
+        } else {
+          Reflect.deleteProperty(formValues, 'params');
+        }
+
+        return await packageList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    isHover: true,
+    keyField: 'packageId',
+  },
+  round: true,
+  align: 'center',
+  showOverflow: true,
+};
+
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
+
 const [TenantPackageDrawer, drawerApi] = useVbenDrawer({
   connectedComponent: tenantPackageDrawer,
 });
 
 function handleAdd() {
-  drawerApi.setData({ update: false });
+  drawerApi.setData({});
   drawerApi.open();
 }
+
+async function handleEdit(record: Recordable<any>) {
+  drawerApi.setData({ id: record.packageId });
+  drawerApi.open();
+}
+
+async function handleDelete(row: Recordable<any>) {
+  await packageRemove(row.packageId);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: any) => row.packageId);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await packageRemove(ids);
+      await tableApi.query();
+      checked.value = false;
+    },
+  });
+}
+
+const { hasAccessByCodes } = useAccess();
 </script>
 
 <template>
-  <Page>
-    <a-button type="primary" @click="handleAdd">
-      {{ $t('pages.common.add') }}
-    </a-button>
-    <TenantPackageDrawer />
+  <Page :auto-content-height="true">
+    <BasicTable>
+      <template #toolbar-actions>
+        <span class="pl-[7px] text-[16px]">租户套餐列表</span>
+      </template>
+      <template #toolbar-tools>
+        <Space>
+          <a-button
+            v-access:code="['system:tenantPackage:export']"
+            @click="downloadExcel(packageExport, '租户套餐数据', {})"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!checked"
+            danger
+            type="primary"
+            v-access:code="['system:tenantPackage:remove']"
+            @click="handleMultiDelete"
+          >
+            {{ $t('pages.common.delete') }}
+          </a-button>
+          <a-button
+            type="primary"
+            v-access:code="['system:tenantPackage:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #status="{ row }">
+        <TableSwitch
+          v-model="row.status"
+          :api="() => packageChangeStatus(row)"
+          :disabled="!hasAccessByCodes(['system:tenantPackage:edit'])"
+          :reload="() => tableApi.query()"
+        />
+      </template>
+      <template #action="{ row }">
+        <a-button
+          size="small"
+          type="link"
+          v-access:code="['system:tenantPackage:edit']"
+          @click="handleEdit(row)"
+        >
+          {{ $t('pages.common.edit') }}
+        </a-button>
+        <Popconfirm
+          placement="left"
+          title="确认删除？"
+          @confirm="handleDelete(row)"
+        >
+          <a-button
+            danger
+            size="small"
+            type="link"
+            v-access:code="['system:tenantPackage:remove']"
+            @click.stop=""
+          >
+            {{ $t('pages.common.delete') }}
+          </a-button>
+        </Popconfirm>
+      </template>
+    </BasicTable>
+    <TenantPackageDrawer @reload="tableApi.query()" />
   </Page>
 </template>

From 36e6eda147d464ffcb979d3334c86f39ddf5914d Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:34:29 +0800
Subject: [PATCH 15/19] feat: online

---
 apps/web-antd/src/views/monitor/online/index.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/apps/web-antd/src/views/monitor/online/index.vue b/apps/web-antd/src/views/monitor/online/index.vue
index 3311c7d6..9050c531 100644
--- a/apps/web-antd/src/views/monitor/online/index.vue
+++ b/apps/web-antd/src/views/monitor/online/index.vue
@@ -11,6 +11,9 @@ import { forceLogout, onlineList } from '#/api/monitor/online';
 import { columns, querySchema } from './data';
 
 const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+  },
   schema: querySchema(),
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
 };
@@ -44,7 +47,7 @@ const [BasicTable, tableApi] = useVbenVxeGrid({ formOptions, gridOptions });
 
 async function handleForceOffline(row: Recordable<any>) {
   await forceLogout(row.tokenId);
-  await tableApi.reload();
+  await tableApi.query();
 }
 </script>
 

From 3b914a231cf65ec540a88be47cc68643d9d819bd Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:41:41 +0800
Subject: [PATCH 16/19] =?UTF-8?q?feat:=20=E4=B8=AA=E4=BA=BA=E4=B8=AD?=
 =?UTF-8?q?=E5=BF=83=20=E5=9C=A8=E7=BA=BF=E8=AE=BE=E5=A4=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../profile/components/online-device.vue      | 51 +++++++++++++++++--
 .../src/views/_core/profile/index.vue         |  7 ++-
 2 files changed, 54 insertions(+), 4 deletions(-)

diff --git a/apps/web-antd/src/views/_core/profile/components/online-device.vue b/apps/web-antd/src/views/_core/profile/components/online-device.vue
index 452097f2..a0309d46 100644
--- a/apps/web-antd/src/views/_core/profile/components/online-device.vue
+++ b/apps/web-antd/src/views/_core/profile/components/online-device.vue
@@ -1,8 +1,53 @@
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import type { Recordable } from '@vben/types';
+
+import { useVbenVxeGrid, type VxeGridProps } from '#/adapter';
+import { forceLogout2, onlineDeviceList } from '#/api/monitor/online';
+import { columns } from '#/views/monitor/online/data';
+
+const gridOptions: VxeGridProps = {
+  columns,
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async () => {
+        return await onlineDeviceList();
+      },
+    },
+  },
+  rowConfig: {
+    isHover: true,
+    keyField: 'tokenId',
+  },
+  round: true,
+  align: 'center',
+  showOverflow: true,
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({ gridOptions });
+
+async function handleForceOffline(row: Recordable<any>) {
+  await forceLogout2(row.tokenId);
+  await tableApi.query();
+}
+</script>
 
 <template>
   <div>
-    在线设备
-    <div>先不做</div>
+    <BasicTable>
+      <template #toolbar-actions>
+        <span class="pl-[7px] text-[16px]">我的在线设备</span>
+      </template>
+      <template #action="{ row }">
+        <Popconfirm
+          :title="`确认强制下线[${row.userName}]?`"
+          placement="left"
+          @confirm="handleForceOffline(row)"
+        >
+          <a-button danger size="small" type="link">强制下线</a-button>
+        </Popconfirm>
+      </template>
+    </BasicTable>
   </div>
 </template>
diff --git a/apps/web-antd/src/views/_core/profile/index.vue b/apps/web-antd/src/views/_core/profile/index.vue
index 4e595b03..b27d62df 100644
--- a/apps/web-antd/src/views/_core/profile/index.vue
+++ b/apps/web-antd/src/views/_core/profile/index.vue
@@ -40,7 +40,12 @@ async function handleUploadFinish() {
       <!-- 左侧 -->
       <ProfilePanel :profile="profile" @upload-finish="handleUploadFinish" />
       <!-- 右侧 -->
-      <SettingPanel v-if="profile" :profile="profile" @reload="loadProfile" />
+      <SettingPanel
+        v-if="profile"
+        :profile="profile"
+        class="flex-1 overflow-hidden"
+        @reload="loadProfile"
+      />
     </div>
   </Page>
 </template>

From 36522f44441365b7496e1e656c06f8f429f02f4c Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:42:25 +0800
Subject: [PATCH 17/19] chore: wrong text

---
 apps/web-antd/src/views/monitor/online/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/web-antd/src/views/monitor/online/index.vue b/apps/web-antd/src/views/monitor/online/index.vue
index 9050c531..f9d5bf17 100644
--- a/apps/web-antd/src/views/monitor/online/index.vue
+++ b/apps/web-antd/src/views/monitor/online/index.vue
@@ -55,7 +55,7 @@ async function handleForceOffline(row: Recordable<any>) {
   <Page :auto-content-height="true">
     <BasicTable>
       <template #toolbar-actions>
-        <span class="pl-[7px] text-[16px]">操作日志列表</span>
+        <span class="pl-[7px] text-[16px]">在线用户列表</span>
       </template>
       <template #action="{ row }">
         <Popconfirm

From ec5161422477df3a82c517898a5af50b93b97103 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sat, 5 Oct 2024 23:51:38 +0800
Subject: [PATCH 18/19] chore: code gen

---
 apps/web-antd/src/views/tool/gen/index.vue | 33 +++++++++++++++++-----
 1 file changed, 26 insertions(+), 7 deletions(-)

diff --git a/apps/web-antd/src/views/tool/gen/index.vue b/apps/web-antd/src/views/tool/gen/index.vue
index 378b87c6..92ba2c31 100644
--- a/apps/web-antd/src/views/tool/gen/index.vue
+++ b/apps/web-antd/src/views/tool/gen/index.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { Recordable } from '@vben/types';
 
+import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
@@ -69,7 +70,19 @@ const gridOptions: VxeGridProps = {
   showOverflow: true,
 };
 
-const [BasicTable, tableApi] = useVbenVxeGrid({ formOptions, gridOptions });
+const checked = ref(false);
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents: {
+    checkboxChange: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+    checkboxAll: (e: any) => {
+      checked.value = e.records.length > 0;
+    },
+  },
+});
 
 const [CodePreviewModal, previewModalApi] = useVbenModal({
   connectedComponent: codePreviewModal,
@@ -87,7 +100,7 @@ function handleEdit(record: Recordable<any>) {
 
 async function handleSync(record: Recordable<any>) {
   await syncDb(record.tableId);
-  await tableApi.reload();
+  await tableApi.query();
 }
 
 /**
@@ -130,7 +143,7 @@ async function handleDownload(record: Recordable<any>) {
  */
 async function handleDelete(record: Recordable<any>) {
   await genRemove(record.tableId);
-  await tableApi.reload();
+  await tableApi.query();
 }
 
 function handleMultiDelete() {
@@ -142,7 +155,8 @@ function handleMultiDelete() {
     content: `确认删除选中的${ids.length}条记录吗？`,
     onOk: async () => {
       await genRemove(ids);
-      await tableApi.reload();
+      await tableApi.query();
+      checked.value = false;
     },
   });
 }
@@ -164,10 +178,15 @@ function handleImport() {
       </template>
       <template #toolbar-tools>
         <Space>
-          <a-button danger type="primary" @click="handleMultiDelete">
+          <a-button
+            :disabled="!checked"
+            danger
+            type="primary"
+            @click="handleMultiDelete"
+          >
             {{ $t('pages.common.delete') }}
           </a-button>
-          <a-button @click="handleBatchGen">
+          <a-button :disabled="!checked" @click="handleBatchGen">
             {{ $t('pages.common.generate') }}
           </a-button>
           <a-button type="primary" @click="handleImport">
@@ -206,6 +225,6 @@ function handleImport() {
       </template>
     </BasicTable>
     <CodePreviewModal />
-    <TableImportModal @reload="tableApi.reload()" />
+    <TableImportModal @reload="tableApi.query()" />
   </Page>
 </template>

From 7a5af784c47cff89ed5a350d637d207a6fddbfdd Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Sun, 6 Oct 2024 00:00:27 +0800
Subject: [PATCH 19/19] fix: miss await

---
 apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue b/apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue
index 4cf92e03..68d7a88e 100644
--- a/apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue
+++ b/apps/web-antd/src/views/system/user/user-reset-pwd-modal.vue
@@ -80,7 +80,7 @@ async function handleSubmit() {
     if (!valid) {
       return;
     }
-    const data = formApi.getValues();
+    const data = await formApi.getValues();
     await userResetPassword(data as any);
     emit('reload');
     handleCancel();