Merge remote-tracking branch 'yudao/dev' into dev

apps/web-antd/src/adapter/vxe-table.ts

@@ -11,9 +11,9 @@ import {
   useVbenVxeGrid,
 } from '@vben/plugins/vxe-table';
 import {
+  erpCountInputFormatter,
   erpNumberFormatter,
   formatPast2,
-  formatToFractionDigit,
   isFunction,
   isString,
 } from '@vben/utils';
@@ -333,8 +333,8 @@ setupVbenVxeTable({
 
     // add by 星语：数量格式化，例如说：金额
     vxeUI.formats.add('formatNumber', {
-      tableCellFormatMethod({ cellValue }, digits = 2) {
+      tableCellFormatMethod({ cellValue }) {
-        return formatToFractionDigit(cellValue, digits);
+        return erpCountInputFormatter(cellValue);
       },
     });
 

apps/web-antd/src/components/table-action/table-action.vue

@@ -4,7 +4,7 @@ import type { PropType } from 'vue';
 
 import type { ActionItem, PopConfirm } from './typing';
 
-import { computed, ref, toRaw, unref, watchEffect } from 'vue';
+import { computed, unref } from 'vue';
 
 import { useAccess } from '@vben/access';
 import { IconifyIcon } from '@vben/icons';
@@ -41,14 +41,7 @@ const props = defineProps({
 
 const { hasAccessByCodes } = useAccess();
 
-/** 缓存处理后的 actions */
+/** 检查是否显示 */
-const processedActions = ref<any[]>([]);
-const processedDropdownActions = ref<any[]>([]);
-
-/** 用于比较的字符串化版本 */
-const actionsStringField = ref('');
-const dropdownActionsStringField = ref('');
-
 function isIfShow(action: ActionItem): boolean {
   const ifShow = action.ifShow;
   let isIfShow = true;
@@ -65,12 +58,10 @@ function isIfShow(action: ActionItem): boolean {
   return isIfShow;
 }
 
-/** 处理 actions 的纯函数 */
+/** 处理按钮 actions */
-function processActions(actions: ActionItem[]): any[] {
+const getActions = computed(() => {
-  return actions
+  return (props.actions || [])
-    .filter((action: ActionItem) => {
+    .filter((action: ActionItem) => isIfShow(action))
-      return isIfShow(action);
-    })
     .map((action: ActionItem) => {
       const { popConfirm } = action;
       return {
@@ -82,17 +73,12 @@ function processActions(actions: ActionItem[]): any[] {
         enable: !!popConfirm,
       };
     });
-}
+});
 
-/** 处理下拉菜单 actions 的纯函数 */
+/** 处理下拉菜单 actions */
-function processDropdownActions(
+const getDropdownList = computed(() => {
-  dropDownActions: ActionItem[],
+  return (props.dropDownActions || [])
-  divider: boolean,
+    .filter((action: ActionItem) => isIfShow(action))
-): any[] {
-  return dropDownActions
-    .filter((action: ActionItem) => {
-      return isIfShow(action);
-    })
     .map((action: ActionItem, index: number) => {
       const { label, popConfirm } = action;
       const processedAction = { ...action };
@@ -103,79 +89,21 @@ function processDropdownActions(
         onConfirm: popConfirm?.confirm,
         onCancel: popConfirm?.cancel,
         text: label,
-        divider: index < dropDownActions.length - 1 ? divider : false,
+        divider:
+          index < props.dropDownActions.length - 1 ? props.divider : false,
       };
     });
-}
-
-/** 监听 actions 变化并更新缓存 */
-watchEffect(() => {
-  const rawActions = toRaw(props.actions) || [];
-  const currentStringField = JSON.stringify(
-    rawActions.map((a) => ({
-      ...a,
-      onClick: undefined, // 排除函数以便比较
-      popConfirm: a.popConfirm
-        ? { ...a.popConfirm, confirm: undefined, cancel: undefined }
-        : undefined,
-    })),
-  );
-
-  if (currentStringField !== actionsStringField.value) {
-    actionsStringField.value = currentStringField;
-    processedActions.value = processActions(rawActions);
-  }
 });
 
-/** 监听 dropDownActions 变化并更新缓存 */
+/** Space 组件的 size */
-watchEffect(() => {
-  const rawDropDownActions = toRaw(props.dropDownActions) || [];
-  const currentStringField = JSON.stringify({
-    actions: rawDropDownActions.map((a) => ({
-      ...a,
-      onClick: undefined, // 排除函数以便比较
-      popConfirm: a.popConfirm
-        ? { ...a.popConfirm, confirm: undefined, cancel: undefined }
-        : undefined,
-    })),
-    divider: props.divider,
-  });
-
-  if (currentStringField !== dropdownActionsStringField.value) {
-    dropdownActionsStringField.value = currentStringField;
-    processedDropdownActions.value = processDropdownActions(
-      rawDropDownActions,
-      props.divider,
-    );
-  }
-});
-
-const getActions = computed(() => processedActions.value);
-
-const getDropdownList = computed(() => processedDropdownActions.value);
-
-/** 缓存 Space 组件的 size 计算结果 */
 const spaceSize = computed(() => {
   return unref(getActions)?.some((item: ActionItem) => item.type === 'link')
     ? 0
     : 8;
 });
 
-/** 缓存 PopConfirm 属性 */
+/** 获取 PopConfirm 属性 */
-const popConfirmPropsMap = new Map<string, any>();
-
 function getPopConfirmProps(attrs: PopConfirm) {
-  const key = JSON.stringify({
-    title: attrs.title,
-    okText: attrs.okText,
-    cancelText: attrs.cancelText,
-    disabled: attrs.disabled,
-  });
-
-  if (popConfirmPropsMap.has(key)) {
-    return popConfirmPropsMap.get(key);
-  }
-
   const originAttrs: any = { ...attrs };
   delete originAttrs.icon;
   if (attrs.confirm && isFunction(attrs.confirm)) {
@@ -186,61 +114,30 @@ function getPopConfirmProps(attrs: PopConfirm) {
     originAttrs.onCancel = attrs.cancel;
     delete originAttrs.cancel;
   }
-
-  popConfirmPropsMap.set(key, originAttrs);
   return originAttrs;
 }
 
-/** 缓存 Button 属性 */
+/** 获取 Button 属性 */
-const buttonPropsMap = new Map<string, any>();
-
 function getButtonProps(action: ActionItem) {
-  const key = JSON.stringify({
+  return {
-    type: action.type,
-    danger: action.danger || false,
-    disabled: action.disabled,
-    loading: action.loading,
-    size: action.size,
-  });
-
-  if (buttonPropsMap.has(key)) {
-    return { ...buttonPropsMap.get(key) };
-  }
-
-  const res = {
     type: action.type || 'link',
     danger: action.danger || false,
     disabled: action.disabled,
     loading: action.loading,
     size: action.size,
   };
-
-  buttonPropsMap.set(key, res);
-  return res;
 }
 
-/** 缓存 Tooltip 属性 */
+/** 获取 Tooltip 属性 */
-const tooltipPropsMap = new Map<string, any>();
-
 function getTooltipProps(tooltip: any | string) {
   if (!tooltip) return {};
-
+  return typeof tooltip === 'string' ? { title: tooltip } : { ...tooltip };
-  const key = typeof tooltip === 'string' ? tooltip : JSON.stringify(tooltip);
-
-  if (tooltipPropsMap.has(key)) {
-    return tooltipPropsMap.get(key);
-  }
-
-  const result =
-    typeof tooltip === 'string' ? { title: tooltip } : { ...tooltip };
-
-  tooltipPropsMap.set(key, result);
-  return result;
 }
 
+/** 处理菜单点击 */
 function handleMenuClick(e: any) {
   const action = getDropdownList.value[e.key];
-  if (action.onClick && isFunction(action.onClick)) {
+  if (action && action.onClick && isFunction(action.onClick)) {
     action.onClick();
   }
 }
@@ -287,7 +184,7 @@ function getActionKey(action: ActionItem, index: number) {
 
     <Dropdown v-if="getDropdownList.length > 0" :trigger="['hover']">
       <slot name="more">
-        <Button :type="getDropdownList[0].type">
+        <Button :type="getDropdownList[0]?.type">
           <template #icon>
             {{ $t('page.action.more') }}
             <IconifyIcon icon="lucide:ellipsis-vertical" />
@@ -339,6 +236,7 @@ function getActionKey(action: ActionItem, index: number) {
     </Dropdown>
   </div>
 </template>
+
 <style lang="scss">
 .table-actions {
   .ant-btn-link {

apps/web-antd/src/utils/formCreate.ts

@@ -5,14 +5,12 @@
 import { isRef } from 'vue';
 
 // 编码表单 Conf
-export const encodeConf = (designerRef: object) => {
+export const encodeConf = (designerRef: any) => {
-  // @ts-ignore designerRef.value is dynamically added by form-create-designer
   return JSON.stringify(designerRef.value.getOption());
 };
 
 // 编码表单 Fields
-export const encodeFields = (designerRef: object) => {
+export const encodeFields = (designerRef: any) => {
-  // @ts-ignore designerRef.value is dynamically added by form-create-designer
   const rule = JSON.parse(designerRef.value.getJson());
   const fields: string[] = [];
   rule.forEach((item: unknown) => {
@@ -32,33 +30,29 @@ export const decodeFields = (fields: string[]) => {
 
 // 设置表单的 Conf 和 Fields，适用 FcDesigner 场景
 export const setConfAndFields = (
-  designerRef: object,
+  designerRef: any,
   conf: string,
   fields: string | string[],
 ) => {
-  // @ts-ignore designerRef.value is dynamically added by form-create-designer
   designerRef.value.setOption(JSON.parse(conf));
-  // @ts-ignore designerRef.value is dynamically added by form-create-designer
+  // 处理 fields 参数类型，确保传入 decodeFields 的是 string[] 类型
-  designerRef.value.setRule(decodeFields(fields));
+  const fieldsArray = Array.isArray(fields) ? fields : [fields];
+  designerRef.value.setRule(decodeFields(fieldsArray));
 };
 
 // 设置表单的 Conf 和 Fields，适用 form-create 场景
 export const setConfAndFields2 = (
-  detailPreview: object,
+  detailPreview: any,
   conf: string,
   fields: string[],
-  value?: object,
+  value?: any,
 ) => {
   if (isRef(detailPreview)) {
-    // @ts-ignore detailPreview.value is dynamically added by form-create-designer
     detailPreview = detailPreview.value;
   }
-  // @ts-ignore detailPreview properties are dynamically added by form-create-designer
   detailPreview.option = JSON.parse(conf);
-  // @ts-ignore detailPreview properties are dynamically added by form-create-designer
   detailPreview.rule = decodeFields(fields);
   if (value) {
-    // @ts-ignore detailPreview properties are dynamically added by form-create-designer
     detailPreview.value = value;
   }
 };

apps/web-antd/src/views/bpm/processInstance/create/modules/form.vue

@@ -255,15 +255,12 @@ async function getApprovalDetail(row: {
  */
 function setFieldPermission(field: string, permission: string) {
   if (permission === BpmFieldPermissionType.READ) {
-    // @ts-ignore
     fApi.value?.disabled(true, field);
   }
   if (permission === BpmFieldPermissionType.WRITE) {
-    // @ts-ignore
     fApi.value?.disabled(false, field);
   }
   if (permission === BpmFieldPermissionType.NONE) {
-    // @ts-ignore
     fApi.value?.hidden(true, field);
   }
 }

apps/web-antd/src/views/bpm/processInstance/detail/index.vue

@@ -195,17 +195,14 @@ const activityNodes = ref<BpmProcessInstanceApi.ApprovalNodeInfo[]>([]);
  */
 function setFieldPermission(field: string, permission: string) {
   if (permission === FieldPermissionType.READ) {
-    // @ts-ignore
     fApi.value?.disabled(true, field);
   }
   if (permission === FieldPermissionType.WRITE) {
-    // @ts-ignore
     fApi.value?.disabled(false, field);
     // 加入可以编辑的字段
     writableFields.push(field);
   }
   if (permission === FieldPermissionType.NONE) {
-    // @ts-ignore
     fApi.value?.hidden(true, field);
   }
 }

apps/web-antd/src/views/bpm/processInstance/detail/modules/operation-button.vue

@@ -359,7 +359,6 @@ async function handleAudit(pass: boolean, formRef: FormInstance | undefined) {
       const formCreateApi = approveFormFApi.value;
       if (Object.keys(formCreateApi)?.length > 0) {
         await formCreateApi.validate();
-        // @ts-ignore
         data.variables = approveForm.value.value;
       }
       await TaskApi.approveTask(data);

apps/web-antd/src/views/bpm/processInstance/detail/modules/time-line.vue

@@ -330,9 +330,7 @@ function handleUserSelectCancel() {
                 v-if="task.assigneeUser || task.ownerUser"
               >
                 <!-- 信息：头像昵称 -->
-                <div
+                <div class="relative flex h-8 items-center rounded-3xl pr-2">
-                  class="relative flex h-8 items-center rounded-3xl bg-gray-100 pr-2 dark:bg-gray-600"
-                >
                   <template
                     v-if="
                       task.assigneeUser?.avatar || task.assigneeUser?.nickname
@@ -414,7 +412,7 @@ function handleUserSelectCancel() {
             <div
               v-for="(user, userIndex) in activity.candidateUsers"
               :key="userIndex"
-              class="relative flex h-8 items-center rounded-3xl bg-gray-100 pr-2 dark:bg-gray-600"
+              class="relative flex h-8 items-center rounded-3xl pr-2"
             >
               <Avatar
                 class="!m-1"

apps/web-antd/src/views/crm/contract/data.ts

@@ -2,7 +2,7 @@ import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 
 import { useUserStore } from '@vben/stores';
-import { erpPriceMultiply, floatToFixed2 } from '@vben/utils';
+import { erpPriceInputFormatter, erpPriceMultiply } from '@vben/utils';
 
 import { z } from '#/adapter/form';
 import { getSimpleBusinessList } from '#/api/crm/business';
@@ -341,7 +341,9 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       field: 'unpaidPrice',
       minWidth: 150,
       formatter: ({ row }) => {
-        return floatToFixed2(row.totalPrice - row.totalReceivablePrice);
+        return erpPriceInputFormatter(
+          row.totalPrice - row.totalReceivablePrice,
+        );
       },
     },
     {

apps/web-antd/src/views/crm/contract/modules/detail-data.ts

@@ -3,11 +3,7 @@ import type { DescriptionItemSchema } from '#/components/description';
 
 import { h } from 'vue';
 
-import {
+import { erpPriceInputFormatter, formatDateTime } from '@vben/utils';
-  erpPriceInputFormatter,
-  floatToFixed2,
-  formatDateTime,
-} from '@vben/utils';
 
 import { DictTag } from '#/components/dict-tag';
 import { DICT_TYPE } from '#/utils';
@@ -148,7 +144,9 @@ export function useDetailListColumns(): VxeTableGridOptions['columns'] {
       field: 'unpaidPrice',
       minWidth: 150,
       formatter: ({ row }) => {
-        return floatToFixed2(row.totalPrice - row.totalReceivablePrice);
+        return erpPriceInputFormatter(
+          row.totalPrice - row.totalReceivablePrice,
+        );
       },
     },
     {

apps/web-antd/src/views/crm/contract/modules/detail.vue

@@ -64,14 +64,14 @@ const [TransferModal, transferModalApi] = useVbenModal({
   destroyOnClose: true,
 });
 
-/** 加载线索详情 */
+/** 加载合同详情 */
 async function loadContractDetail() {
   loading.value = true;
   const data = await getContract(contractId.value);
   contract.value = data;
   // 操作日志
   const logList = await getOperateLogPage({
-    bizType: BizTypeEnum.CRM_CLUE,
+    bizType: BizTypeEnum.CRM_CONTRACT,
     bizId: contractId.value,
   });
   contractLogList.value = logList.list;

apps/web-antd/src/views/crm/product/modules/detail-data.ts

@@ -104,6 +104,12 @@ export function useDetailListColumns(
       formatter: 'formatAmount2',
       visible: showBussinePrice,
     },
+    {
+      field: 'contractPrice',
+      title: '合同价格（元）',
+      formatter: 'formatAmount2',
+      visible: !showBussinePrice,
+    },
     {
       field: 'count',
       title: '数量',

apps/web-antd/src/views/crm/receivable/modules/detail.vue

@@ -53,7 +53,7 @@ const [FormModal, formModalApi] = useVbenModal({
   destroyOnClose: true,
 });
 
-/** 加载线索详情 */
+/** 加载回款详情 */
 async function loadReceivableDetail() {
   loading.value = true;
   const data = await getReceivable(receivableId.value);

apps/web-antd/src/views/crm/receivable/plan/data.ts

@@ -2,7 +2,7 @@ import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 
 import { useUserStore } from '@vben/stores';
-import { floatToFixed2 } from '@vben/utils';
+import { erpPriceInputFormatter } from '@vben/utils';
 
 import { getContractSimpleList } from '#/api/crm/contract';
 import { getCustomerSimpleList } from '#/api/crm/customer';
@@ -53,6 +53,13 @@ export function useFormSchema(): VbenFormSchema[] {
               value: item.id,
             })),
             placeholder: '请选择合同',
+            onChange: (value: number) => {
+              const contract = res.find((item) => item.id === value);
+              if (contract) {
+                values.price =
+                  contract.totalPrice - contract.totalReceivablePrice;
+              }
+            },
           };
         },
       },
@@ -106,6 +113,7 @@ export function useFormSchema(): VbenFormSchema[] {
         valueFormat: 'x',
         format: 'YYYY-MM-DD',
       },
+      defaultValue: new Date(),
     },
     {
       fieldName: 'remindDays',
@@ -246,9 +254,9 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       minWidth: 160,
       formatter: ({ row }) => {
         if (row.receivable) {
-          return floatToFixed2(row.price - row.receivable.price);
+          return erpPriceInputFormatter(row.price - row.receivable.price);
         }
-        return floatToFixed2(row.price);
+        return erpPriceInputFormatter(row.price);
       },
     },
     {

apps/web-antd/src/views/crm/receivable/plan/modules/detail.vue

@@ -53,7 +53,7 @@ const [FormModal, formModalApi] = useVbenModal({
   destroyOnClose: true,
 });
 
-/** 加载线索详情 */
+/** 加载回款计划详情 */
 async function loadreceivablePlanDetail() {
   loading.value = true;
   const data = await getReceivablePlan(receivablePlanId.value);

apps/web-antd/src/views/pay/demo/withdraw/index.vue

@@ -3,7 +3,7 @@ import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { DemoWithdrawApi } from '#/api/pay/demo/withdraw';
 
 import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
-import { floatToFixed2 } from '@vben/utils';
+import { erpPriceInputFormatter } from '@vben/utils';
 
 import { message, Tag } from 'ant-design-vue';
 
@@ -110,7 +110,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
         <Tag v-else-if="row.type === 3">钱包余额</Tag>
       </template>
       <template #price="{ row }">
-        <span>￥{{ floatToFixed2(row.price) }}</span>
+        <span>￥{{ erpPriceInputFormatter(row.price) }}</span>
       </template>
       <template #status="{ row }">
         <Tag v-if="row.status === 0 && !row.payTransferId" type="warning">

apps/web-antd/src/views/pay/order/data.ts

@@ -4,7 +4,7 @@ import type { DescriptionItemSchema } from '#/components/description';
 
 import { h } from 'vue';
 
-import { floatToFixed2, formatDateTime } from '@vben/utils';
+import { erpPriceInputFormatter, formatDateTime } from '@vben/utils';
 
 import { Tag } from 'ant-design-vue';
 
@@ -174,17 +174,17 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'price',
       label: '支付金额',
-      content: (data) => `￥${floatToFixed2(data?.price)}`,
+      content: (data) => `￥${erpPriceInputFormatter(data?.price)}`,
     },
     {
       field: 'channelFeePrice',
       label: '手续费',
-      content: (data) => `￥${floatToFixed2(data?.channelFeePrice)}`,
+      content: (data) => `￥${erpPriceInputFormatter(data?.channelFeePrice)}`,
     },
     {
       field: 'channelFeeRate',
       label: '手续费比例',
-      content: (data) => `${floatToFixed2(data?.channelFeeRate)}%`,
+      content: (data) => `${erpPriceInputFormatter(data?.channelFeeRate)}%`,
     },
     {
       field: 'successTime',
@@ -240,7 +240,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'refundPrice',
       label: '退款金额',
-      content: (data) => `￥${floatToFixed2(data?.refundPrice)}`,
+      content: (data) => `￥${erpPriceInputFormatter(data?.refundPrice)}`,
     },
     {
       field: 'notifyUrl',

apps/web-antd/src/views/pay/transfer/data.ts

@@ -4,7 +4,7 @@ import type { DescriptionItemSchema } from '#/components/description';
 
 import { h } from 'vue';
 
-import { floatToFixed2, formatDateTime } from '@vben/utils';
+import { erpPriceInputFormatter, formatDateTime } from '@vben/utils';
 
 import { Tag } from 'ant-design-vue';
 
@@ -217,7 +217,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
       content: (data) => {
         return h(Tag, {
           color: 'blue',
-          content: `￥${floatToFixed2(data?.price)}`,
+          content: `￥${erpPriceInputFormatter(data?.price)}`,
         });
       },
     },

packages/@core/ui-kit/popup-ui/src/modal/modal.vue

@@ -105,10 +105,17 @@ const shouldDraggable = computed(
   () => draggable.value && !shouldFullscreen.value && header.value,
 );
 
+const getAppendTo = computed(() => {
+  return appendToMain.value
+    ? `#${ELEMENT_ID_MAIN_CONTENT}>div:not(.absolute)>div`
+    : undefined;
+});
+
 const { dragging, transform } = useModalDraggable(
   dialogRef,
   headerRef,
   shouldDraggable,
+  getAppendTo,
 );
 
 const firstOpened = ref(false);
@@ -198,11 +205,6 @@ function handleFocusOutside(e: Event) {
   e.preventDefault();
   e.stopPropagation();
 }
-const getAppendTo = computed(() => {
-  return appendToMain.value
-    ? `#${ELEMENT_ID_MAIN_CONTENT}>div:not(.absolute)>div`
-    : undefined;
-});
 
 const getForceMount = computed(() => {
   return !unref(destroyOnClose) && unref(firstOpened);
@@ -224,7 +226,8 @@ function handleClosed() {
       :append-to="getAppendTo"
       :class="
         cn(
-          'left-0 right-0 top-[10vh] mx-auto flex max-h-[80%] w-[520px] flex-col p-0 sm:rounded-[var(--radius)]',
+          'left-0 right-0 top-[10vh] mx-auto flex max-h-[80%] w-[520px] flex-col p-0',
+          shouldFullscreen ? 'sm:rounded-none' : 'sm:rounded-[var(--radius)]',
           modalClass,
           {
             'border-border border': bordered,

packages/@core/ui-kit/popup-ui/src/modal/use-modal-draggable.ts

@@ -13,6 +13,7 @@ export function useModalDraggable(
   targetRef: Ref<HTMLElement | undefined>,
   dragRef: Ref<HTMLElement | undefined>,
   draggable: ComputedRef<boolean>,
+  containerSelector?: ComputedRef<string | undefined>,
 ) {
   const transform = reactive({
     offsetX: 0,
@@ -30,20 +31,36 @@ export function useModalDraggable(
     }
 
     const targetRect = targetRef.value.getBoundingClientRect();
-
     const { offsetX, offsetY } = transform;
     const targetLeft = targetRect.left;
     const targetTop = targetRect.top;
     const targetWidth = targetRect.width;
     const targetHeight = targetRect.height;
+
+    let containerRect: DOMRect | null = null;
+
+    if (containerSelector?.value) {
+      const container = document.querySelector(containerSelector.value);
+      if (container) {
+        containerRect = container.getBoundingClientRect();
+      }
+    }
+
+    let maxLeft, maxTop, minLeft, minTop;
+    if (containerRect) {
+      minLeft = containerRect.left - targetLeft + offsetX;
+      maxLeft = containerRect.right - targetLeft - targetWidth + offsetX;
+      minTop = containerRect.top - targetTop + offsetY;
+      maxTop = containerRect.bottom - targetTop - targetHeight + offsetY;
+    } else {
       const docElement = document.documentElement;
       const clientWidth = docElement.clientWidth;
       const clientHeight = docElement.clientHeight;
-
+      minLeft = -targetLeft + offsetX;
-    const minLeft = -targetLeft + offsetX;
+      minTop = -targetTop + offsetY;
-    const minTop = -targetTop + offsetY;
+      maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
-    const maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
+      maxTop = clientHeight - targetTop - targetHeight + offsetY;
-    const maxTop = clientHeight - targetTop - targetHeight + offsetY;
+    }
 
     const onMousemove = (e: MouseEvent) => {
       let moveX = offsetX + e.clientX - downX;

packages/@core/ui-kit/shadcn-ui/src/ui/tree/tree.vue

@@ -23,6 +23,7 @@ const props = withDefaults(defineProps<TreeProps>(), {
   defaultExpandedKeys: () => [],
   defaultExpandedLevel: 0,
   disabled: false,
+  disabledField: 'disabled',
   expanded: () => [],
   iconField: 'icon',
   labelField: 'label',
@@ -101,16 +102,37 @@ function updateTreeValue() {
   if (val === undefined) {
     treeValue.value = undefined;
   } else {
-    treeValue.value = Array.isArray(val)
+    if (Array.isArray(val)) {
-      ? val.map((v) => getItemByValue(v))
+      const filteredValues = val.filter((v) => {
-      : getItemByValue(val);
+        const item = getItemByValue(v);
+        return item && !get(item, props.disabledField);
+      });
+      treeValue.value = filteredValues.map((v) => getItemByValue(v));
+
+      if (filteredValues.length !== val.length) {
+        modelValue.value = filteredValues;
+      }
+    } else {
+      const item = getItemByValue(val);
+      if (item && !get(item, props.disabledField)) {
+        treeValue.value = item;
+      } else {
+        treeValue.value = undefined;
+        modelValue.value = undefined;
+      }
+    }
   }
 }
 
 function updateModelValue(val: Arrayable<Recordable<any>>) {
-  modelValue.value = Array.isArray(val)
+  if (Array.isArray(val)) {
-    ? val.map((v) => get(v, props.valueField))
+    const filteredVal = val.filter((v) => !get(v, props.disabledField));
-    : get(val, props.valueField);
+    modelValue.value = filteredVal.map((v) => get(v, props.valueField));
+  } else {
+    if (val && !get(val, props.disabledField)) {
+      modelValue.value = get(val, props.valueField);
+    }
+  }
 }
 
 function expandToLevel(level: number) {
@@ -149,10 +171,18 @@ function collapseAll() {
   expanded.value = [];
 }
 
+function isNodeDisabled(item: FlattenedItem<Recordable<any>>) {
+  return props.disabled || get(item.value, props.disabledField);
+}
+
 function onToggle(item: FlattenedItem<Recordable<any>>) {
   emits('expand', item);
 }
 function onSelect(item: FlattenedItem<Recordable<any>>, isSelected: boolean) {
+  if (isNodeDisabled(item)) {
+    return;
+  }
+
   if (
     !props.checkStrictly &&
     props.multiple &&
@@ -224,28 +254,34 @@ defineExpose({
         :class="
           cn('cursor-pointer', getNodeClass?.(item), {
             'data-[selected]:bg-accent': !multiple,
-            'cursor-not-allowed': disabled,
+            'cursor-not-allowed': isNodeDisabled(item),
           })
         "
         v-bind="
           Object.assign(item.bind, {
-            onfocus: disabled ? 'this.blur()' : undefined,
+            onfocus: isNodeDisabled(item) ? 'this.blur()' : undefined,
+            disabled: isNodeDisabled(item),
           })
         "
         @select="
-          (event) => {
+          (event: any) => {
+            if (isNodeDisabled(item)) {
+              event.preventDefault();
+              event.stopPropagation();
+              return;
+            }
             if (event.detail.originalEvent.type === 'click') {
               event.preventDefault();
             }
-            !disabled && onSelect(item, event.detail.isSelected);
+            onSelect(item, event.detail.isSelected);
           }
         "
         @toggle="
-          (event) => {
+          (event: any) => {
             if (event.detail.originalEvent.type === 'click') {
               event.preventDefault();
             }
-            !disabled && onToggle(item);
+            !isNodeDisabled(item) && onToggle(item);
           }
         "
         class="tree-node focus:ring-grass8 my-0.5 flex items-center rounded px-2 py-1 outline-none focus:ring-2"
@@ -266,24 +302,32 @@ defineExpose({
         </div>
         <Checkbox
           v-if="multiple"
-          :checked="isSelected"
+          :checked="isSelected && !isNodeDisabled(item)"
-          :disabled="disabled"
+          :disabled="isNodeDisabled(item)"
-          :indeterminate="isIndeterminate"
+          :indeterminate="isIndeterminate && !isNodeDisabled(item)"
           @click="
-            () => {
+            (event: MouseEvent) => {
-              !disabled && handleSelect();
+              if (isNodeDisabled(item)) {
-              // onSelect(item, !isSelected);
+                event.preventDefault();
+                event.stopPropagation();
+                return;
+              }
+              handleSelect();
             }
           "
         />
         <div
           class="flex items-center gap-1 pl-2"
           @click="
-            (_event) => {
+            (event: MouseEvent) => {
-              // $event.stopPropagation();
+              if (isNodeDisabled(item)) {
-              // $event.preventDefault();
+                event.preventDefault();
-              !disabled && handleSelect();
+                event.stopPropagation();
-              // onSelect(item, !isSelected);
+                return;
+              }
+              event.stopPropagation();
+              event.preventDefault();
+              handleSelect();
             }
           "
         >

packages/@core/ui-kit/shadcn-ui/src/ui/tree/types.ts

@@ -22,6 +22,8 @@ export interface TreeProps {
   defaultValue?: Arrayable<number | string>;
   /** 禁用 */
   disabled?: boolean;
+  /** 禁用字段名 */
+  disabledField?: string;
   /** 自定义节点类名 */
   getNodeClass?: (item: FlattenedItem<Recordable<any>>) => string;
   iconField?: string;

packages/effects/common-ui/src/components/icon-picker/icon-picker.vue

@@ -76,6 +76,12 @@ const keyword = ref('');
 const keywordDebounce = refDebounced(keyword, 300);
 const innerIcons = ref<string[]>([]);
 
+/* 当检索关键词变化时，重置分页 */
+watch(keywordDebounce, () => {
+  currentPage.value = 1;
+  setCurrentPage(1);
+});
+  
 watchDebounced(
   () => props.prefix,
   async (prefix) => {

packages/effects/common-ui/src/ui/authentication/login-expired-modal.vue

@@ -3,6 +3,8 @@ import type { AuthenticationProps } from './types';
 
 import { computed, watch } from 'vue';
 
+import { $t } from '@vben/locales';
+
 import { useVbenModal } from '@vben-core/popup-ui';
 import { Slot, VbenAvatar } from '@vben-core/shadcn-ui';
 

packages/effects/hooks/src/use-hover-toggle.ts

@@ -2,7 +2,7 @@ import type { Arrayable, MaybeElementRef } from '@vueuse/core';
 
 import type { Ref } from 'vue';
 
-import { computed, onUnmounted, ref, unref, watch } from 'vue';
+import { computed, effectScope, onUnmounted, ref, unref, watch } from 'vue';
 
 import { isFunction } from '@vben/utils';
 
@@ -20,12 +20,12 @@ const DEFAULT_ENTER_DELAY = 0; // 鼠标进入延迟时间，默认为 0（立
 
 /**
  * 监测鼠标是否在元素内部，如果在元素内部则返回 true，否则返回 false
- * @param refElement 所有需要检测的元素。如果提供了一个数组，那么鼠标在任何一个元素内部都会返回 true
+ * @param refElement 所有需要检测的元素。支持单个元素、元素数组或响应式引用的元素数组。如果鼠标在任何一个元素内部都会返回 true
  * @param delay 延迟更新状态的时间，可以是数字或包含进入/离开延迟的配置对象
  * @returns 返回一个数组，第一个元素是一个 ref，表示鼠标是否在元素内部，第二个元素是一个控制器，可以通过 enable 和 disable 方法来控制监听器的启用和禁用
  */
 export function useHoverToggle(
-  refElement: Arrayable<MaybeElementRef>,
+  refElement: Arrayable<MaybeElementRef> | Ref<HTMLElement[] | null>,
   delay: (() => number) | HoverDelayOptions | number = DEFAULT_LEAVE_DELAY,
 ) {
   // 兼容旧版本API
@@ -38,20 +38,58 @@ export function useHoverToggle(
           ...delay,
         };
 
-  const isHovers: Array<Ref<boolean>> = [];
   const value = ref(false);
   const enterTimer = ref<ReturnType<typeof setTimeout> | undefined>();
   const leaveTimer = ref<ReturnType<typeof setTimeout> | undefined>();
-  const refs = Array.isArray(refElement) ? refElement : [refElement];
+  const hoverScopes = ref<ReturnType<typeof effectScope>[]>([]);
-  refs.forEach((refEle) => {
+
+  // 使用计算属性包装 refElement，使其响应式变化
+  const refs = computed(() => {
+    const raw = unref(refElement);
+    if (raw === null) return [];
+    return Array.isArray(raw) ? raw : [raw];
+  });
+  // 存储所有 hover 状态
+  const isHovers = ref<Array<Ref<boolean>>>([]);
+
+  // 更新 hover 监听的函数
+  function updateHovers() {
+    // 停止并清理之前的作用域
+    hoverScopes.value.forEach((scope) => scope.stop());
+    hoverScopes.value = [];
+
+    isHovers.value = refs.value.map((refEle) => {
+      if (!refEle) {
+        return ref(false);
+      }
       const eleRef = computed(() => {
         const ele = unref(refEle);
         return ele instanceof Element ? ele : (ele?.$el as Element);
       });
-    const isHover = useElementHover(eleRef);
+
-    isHovers.push(isHover);
+      // 为每个元素创建独立的作用域
+      const scope = effectScope();
+      const hoverRef = scope.run(() => useElementHover(eleRef)) || ref(false);
+      hoverScopes.value.push(scope);
+
+      return hoverRef;
     });
-  const isOutsideAll = computed(() => isHovers.every((v) => !v.value));
+  }
+
+  // 监听元素数量变化，避免过度执行
+  const elementsCount = computed(() => {
+    const raw = unref(refElement);
+    if (raw === null) return 0;
+    return Array.isArray(raw) ? raw.length : 1;
+  });
+
+  // 初始设置
+  updateHovers();
+
+  // 只在元素数量变化时重新设置监听器
+  const stopWatcher = watch(elementsCount, updateHovers, { deep: false });
+
+  const isOutsideAll = computed(() => isHovers.value.every((v) => !v.value));
 
   function clearTimers() {
     if (enterTimer.value) {
@@ -96,7 +134,7 @@ export function useHoverToggle(
     }
   }
 
-  const watcher = watch(
+  const hoverWatcher = watch(
     isOutsideAll,
     (val) => {
       setValueDelay(!val);
@@ -106,15 +144,19 @@ export function useHoverToggle(
 
   const controller = {
     enable() {
-      watcher.resume();
+      hoverWatcher.resume();
     },
     disable() {
-      watcher.pause();
+      hoverWatcher.pause();
     },
   };
 
   onUnmounted(() => {
     clearTimers();
+    // 停止监听器
+    stopWatcher();
+    // 停止所有剩余的作用域
+    hoverScopes.value.forEach((scope) => scope.stop());
   });
 
   return [value, controller] as [typeof value, typeof controller];

packages/effects/layouts/src/authentication/authentication.vue

@@ -62,6 +62,7 @@ const { authPanelCenter, authPanelLeft, authPanelRight, isDark } =
       </template>
     </AuthenticationFormView>
 
+    <slot name="logo">
       <!-- 头部 Logo 和应用名称 -->
       <div
         v-if="logo || appName"
@@ -77,6 +78,7 @@ const { authPanelCenter, authPanelLeft, authPanelRight, isDark } =
           </p>
         </div>
       </div>
+    </slot>
 
     <!-- 系统介绍 -->
     <div v-if="!authPanelCenter" class="relative hidden w-0 flex-1 lg:block">