@aspire-ui/element-component-pro 1.0.6 → 1.0.8

package/dist/index.d.ts

@@ -1,13 +1,13 @@
 import { VueConstructor } from 'vue';
 import { default as ProTable, TableAction } from './ProTable';
-import { default as ProForm, ProFormItem, FormActions } from './ProForm';
+import { default as ProForm, ProFormItem, FormActions, FormattedNumberInput } from './ProForm';
 import { default as ProDescriptions } from './ProDescriptions';
 import { useForm } from './ProForm/useForm';
 import { useDescription } from './ProDescriptions/useDescription';
 import { useProTable } from './ProTable/useProTable';
 import { useComponentSetting } from './useComponentSetting';
 
-export { ProForm, ProFormItem, FormActions, useForm };
+export { ProForm, ProFormItem, FormActions, FormattedNumberInput, useForm };
 export { ProTable, useProTable, TableAction };
 export { ProDescriptions, useDescription };
 export { useComponentSetting };
@@ -16,6 +16,7 @@ export type { UseProTableReturn, UseProTablePropsReactive } from './ProTable/use
 export type { UseDescriptionReturn, UseDescriptionPropsReactive } from './ProDescriptions/useDescription';
 export * from './ProTable/types';
 export * from './types';
+export * from './utils/formattedNumber';
 export declare function install(Vue: VueConstructor): void;
 declare const _default: {
     install: typeof install;
@@ -52,16 +53,16 @@ declare const _default: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        immediate: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         treeProps: {
             type: import('vue').PropType<{
                 hasChildren?: string;
                 children?: string;
             }>;
         };
-        immediate: {
-            type: import('vue').PropType<boolean>;
-            default: boolean;
-        };
         rowSelection: {
             type: import('vue').PropType<{
                 type?: "checkbox" | "radio";
@@ -222,16 +223,16 @@ declare const _default: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        immediate: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         treeProps: {
             type: import('vue').PropType<{
                 hasChildren?: string;
                 children?: string;
             }>;
         };
-        immediate: {
-            type: import('vue').PropType<boolean>;
-            default: boolean;
-        };
         rowSelection: {
             type: import('vue').PropType<{
                 type?: "checkbox" | "radio";
@@ -433,16 +434,16 @@ declare const _default: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        immediate: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         treeProps: {
             type: import('vue').PropType<{
                 hasChildren?: string;
                 children?: string;
             }>;
         };
-        immediate: {
-            type: import('vue').PropType<boolean>;
-            default: boolean;
-        };
         rowSelection: {
             type: import('vue').PropType<{
                 type?: "checkbox" | "radio";
@@ -637,16 +638,16 @@ declare const _default: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        immediate: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         treeProps: {
             type: import('vue').PropType<{
                 hasChildren?: string;
                 children?: string;
             }>;
         };
-        immediate: {
-            type: import('vue').PropType<boolean>;
-            default: boolean;
-        };
         rowSelection: {
             type: import('vue').PropType<{
                 type?: "checkbox" | "radio";
@@ -807,16 +808,16 @@ declare const _default: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        immediate: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         treeProps: {
             type: import('vue').PropType<{
                 hasChildren?: string;
                 children?: string;
             }>;
         };
-        immediate: {
-            type: import('vue').PropType<boolean>;
-            default: boolean;
-        };
         rowSelection: {
             type: import('vue').PropType<{
                 type?: "checkbox" | "radio";
@@ -1053,16 +1054,16 @@ declare const _default: {
                 type: import('vue').PropType<boolean>;
                 default: boolean;
             };
+            immediate: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
             treeProps: {
                 type: import('vue').PropType<{
                     hasChildren?: string;
                     children?: string;
                 }>;
             };
-            immediate: {
-                type: import('vue').PropType<boolean>;
-                default: boolean;
-            };
             rowSelection: {
                 type: import('vue').PropType<{
                     type?: "checkbox" | "radio";
@@ -1307,6 +1308,9 @@ declare const _default: {
         };
     });
     ProForm: import('vue/types/v3-component-public-instance').ComponentPublicInstanceConstructor<import('vue/types/v3-component-public-instance').Vue3Instance<{}, Readonly<import('vue').ExtractPropTypes<{
+        disabled: {
+            type: import('vue').PropType<boolean>;
+        };
         size: {
             type: import('vue').PropType<"medium" | "small" | "large">;
             default: string;
@@ -1314,9 +1318,6 @@ declare const _default: {
         components: {
             type: import('vue').PropType<Record<string, unknown>>;
         };
-        disabled: {
-            type: import('vue').PropType<boolean>;
-        };
         showActionButtonGroup: {
             type: import('vue').PropType<boolean>;
             default: boolean;
@@ -1359,6 +1360,10 @@ declare const _default: {
                 xl: number;
             };
         };
+        colon: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         schemas: {
             type: import('vue').PropType<import('./types').ProFormSchema[]>;
         };
@@ -1373,7 +1378,7 @@ declare const _default: {
             default: string;
         };
         labelPosition: {
-            type: import('vue').PropType<"left" | "right" | "top">;
+            type: import('vue').PropType<"top" | "left" | "right">;
             default: string;
         };
         gutter: {
@@ -1419,6 +1424,9 @@ declare const _default: {
             type: import('vue').PropType<import('./types').FormListeners>;
         };
     }>>, Readonly<import('vue').ExtractPropTypes<{
+        disabled: {
+            type: import('vue').PropType<boolean>;
+        };
         size: {
             type: import('vue').PropType<"medium" | "small" | "large">;
             default: string;
@@ -1426,9 +1434,6 @@ declare const _default: {
         components: {
             type: import('vue').PropType<Record<string, unknown>>;
         };
-        disabled: {
-            type: import('vue').PropType<boolean>;
-        };
         showActionButtonGroup: {
             type: import('vue').PropType<boolean>;
             default: boolean;
@@ -1471,6 +1476,10 @@ declare const _default: {
                 xl: number;
             };
         };
+        colon: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         schemas: {
             type: import('vue').PropType<import('./types').ProFormSchema[]>;
         };
@@ -1485,7 +1494,7 @@ declare const _default: {
             default: string;
         };
         labelPosition: {
-            type: import('vue').PropType<"left" | "right" | "top">;
+            type: import('vue').PropType<"top" | "left" | "right">;
             default: string;
         };
         gutter: {
@@ -1546,6 +1555,7 @@ declare const _default: {
         resetButtonIcon: string;
         showAdvancedButton: boolean;
         actionColOptions: import('./types').ColEx;
+        colon: boolean;
         labelWidth: string;
         labelPosition: "left" | "right" | "top";
         gutter: number;
@@ -1555,6 +1565,9 @@ declare const _default: {
         alwaysShowLines: number;
         submitOnReset: boolean;
     }, true, import('vue').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, any>> & Readonly<Readonly<import('vue').ExtractPropTypes<{
+        disabled: {
+            type: import('vue').PropType<boolean>;
+        };
         size: {
             type: import('vue').PropType<"medium" | "small" | "large">;
             default: string;
@@ -1562,9 +1575,6 @@ declare const _default: {
         components: {
             type: import('vue').PropType<Record<string, unknown>>;
         };
-        disabled: {
-            type: import('vue').PropType<boolean>;
-        };
         showActionButtonGroup: {
             type: import('vue').PropType<boolean>;
             default: boolean;
@@ -1607,6 +1617,10 @@ declare const _default: {
                 xl: number;
             };
         };
+        colon: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         schemas: {
             type: import('vue').PropType<import('./types').ProFormSchema[]>;
         };
@@ -1621,7 +1635,7 @@ declare const _default: {
             default: string;
         };
         labelPosition: {
-            type: import('vue').PropType<"left" | "right" | "top">;
+            type: import('vue').PropType<"top" | "left" | "right">;
             default: string;
         };
         gutter: {
@@ -1680,6 +1694,9 @@ declare const _default: {
         removeSchemaByField: (field: string | string[]) => Promise<void>;
         setProps: (props: Partial<import('./types').ProFormProps>) => Promise<void>;
     }> & import('vue/types/v3-component-options').ExtractComputedReturns<{}> & import('vue').ComponentCustomProperties & Readonly<import('vue').ExtractPropTypes<{
+        disabled: {
+            type: import('vue').PropType<boolean>;
+        };
         size: {
             type: import('vue').PropType<"medium" | "small" | "large">;
             default: string;
@@ -1687,9 +1704,6 @@ declare const _default: {
         components: {
             type: import('vue').PropType<Record<string, unknown>>;
         };
-        disabled: {
-            type: import('vue').PropType<boolean>;
-        };
         showActionButtonGroup: {
             type: import('vue').PropType<boolean>;
             default: boolean;
@@ -1732,6 +1746,10 @@ declare const _default: {
                 xl: number;
             };
         };
+        colon: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         schemas: {
             type: import('vue').PropType<import('./types').ProFormSchema[]>;
         };
@@ -1746,7 +1764,7 @@ declare const _default: {
             default: string;
         };
         labelPosition: {
-            type: import('vue').PropType<"left" | "right" | "top">;
+            type: import('vue').PropType<"top" | "left" | "right">;
             default: string;
         };
         gutter: {
@@ -1792,6 +1810,9 @@ declare const _default: {
             type: import('vue').PropType<import('./types').FormListeners>;
         };
     }>>> & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+        disabled: {
+            type: import('vue').PropType<boolean>;
+        };
         size: {
             type: import('vue').PropType<"medium" | "small" | "large">;
             default: string;
@@ -1799,9 +1820,6 @@ declare const _default: {
         components: {
             type: import('vue').PropType<Record<string, unknown>>;
         };
-        disabled: {
-            type: import('vue').PropType<boolean>;
-        };
         showActionButtonGroup: {
             type: import('vue').PropType<boolean>;
             default: boolean;
@@ -1844,6 +1862,10 @@ declare const _default: {
                 xl: number;
             };
         };
+        colon: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
         schemas: {
             type: import('vue').PropType<import('./types').ProFormSchema[]>;
         };
@@ -1858,7 +1880,7 @@ declare const _default: {
             default: string;
         };
         labelPosition: {
-            type: import('vue').PropType<"left" | "right" | "top">;
+            type: import('vue').PropType<"top" | "left" | "right">;
             default: string;
         };
         gutter: {
@@ -1932,6 +1954,7 @@ declare const _default: {
         resetButtonIcon: string;
         showAdvancedButton: boolean;
         actionColOptions: import('./types').ColEx;
+        colon: boolean;
         labelWidth: string;
         labelPosition: "left" | "right" | "top";
         gutter: number;
@@ -1942,6 +1965,9 @@ declare const _default: {
         submitOnReset: boolean;
     }> & {
         props: {
+            disabled: {
+                type: import('vue').PropType<boolean>;
+            };
             size: {
                 type: import('vue').PropType<"medium" | "small" | "large">;
                 default: string;
@@ -1949,9 +1975,6 @@ declare const _default: {
             components: {
                 type: import('vue').PropType<Record<string, unknown>>;
             };
-            disabled: {
-                type: import('vue').PropType<boolean>;
-            };
             showActionButtonGroup: {
                 type: import('vue').PropType<boolean>;
                 default: boolean;
@@ -1994,6 +2017,10 @@ declare const _default: {
                     xl: number;
                 };
             };
+            colon: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
             schemas: {
                 type: import('vue').PropType<import('./types').ProFormSchema[]>;
             };
@@ -2008,7 +2035,7 @@ declare const _default: {
                 default: string;
             };
             labelPosition: {
-                type: import('vue').PropType<"left" | "right" | "top">;
+                type: import('vue').PropType<"top" | "left" | "right">;
                 default: string;
             };
             gutter: {
@@ -2061,6 +2088,7 @@ declare const _default: {
                 field: string;
                 label: string;
                 labelWidth?: string | undefined;
+                colon?: boolean | undefined;
                 component?: (import('./types').ProFormBuiltInComponent | import('./types').ProFormCustomComponent) | undefined;
                 componentProps?: (Record<string, unknown> | ((params: import('./types').RenderCallbackParams & {
                     formActionType?: import('./types').FormActionType;
@@ -2090,6 +2118,7 @@ declare const _default: {
                 dependencies?: string[] | undefined;
                 helpMessage?: string | string[] | undefined;
                 helpComponentProps?: Record<string, unknown> | undefined;
+                tooltip?: (boolean | string | Record<string, unknown> | ((params: import('./types').RenderCallbackParams) => boolean | string | Record<string, unknown>)) | undefined;
             };
             field: string;
             values: Record<string, unknown>;
@@ -2543,5 +2572,56 @@ declare const _default: {
         dropDownActions: import('./ProTable').TableActionItem[];
         stopButtonPropagation: boolean;
     }>;
+    FormattedNumberInput: import('vue').DefineComponent<{
+        disabled: {
+            type: import('vue').PropType<boolean>;
+        };
+        value: {
+            type: import('vue').PropType<unknown>;
+        };
+        placeholder: {
+            type: import('vue').PropType<string>;
+        };
+        integerDigits: {
+            type: import('vue').PropType<number>;
+            default: number;
+        };
+        decimalPlaces: {
+            type: import('vue').PropType<number>;
+            default: number;
+        };
+        rounding: {
+            type: import('vue').PropType<import('.').FormattedNumberRounding>;
+            default: string;
+        };
+    }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        input: (value: unknown) => void;
+    }, string, Readonly<import('vue').ExtractPropTypes<{
+        disabled: {
+            type: import('vue').PropType<boolean>;
+        };
+        value: {
+            type: import('vue').PropType<unknown>;
+        };
+        placeholder: {
+            type: import('vue').PropType<string>;
+        };
+        integerDigits: {
+            type: import('vue').PropType<number>;
+            default: number;
+        };
+        decimalPlaces: {
+            type: import('vue').PropType<number>;
+            default: number;
+        };
+        rounding: {
+            type: import('vue').PropType<import('.').FormattedNumberRounding>;
+            default: string;
+        };
+    }>>, {
+        integerDigits: number;
+        decimalPlaces: number;
+        rounding: import('.').FormattedNumberRounding;
+    }>;
 };
 export default _default;

package/dist/style.css

@@ -1 +1 @@
-.ecp-pro-table[data-v-c5638c20]{padding:16px;background:#fff;width:100%;box-sizing:border-box}.ecp-pro-table[data-v-c5638c20] .el-table{width:100%!important}.ecp-pro-table__header[data-v-c5638c20]{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.ecp-pro-table__title-wrapper[data-v-c5638c20]{display:flex;align-items:center;gap:4px}.ecp-pro-table__title[data-v-c5638c20]{font-size:16px;font-weight:600}.ecp-pro-table__help[data-v-c5638c20]{color:#909399;cursor:help}.ecp-pro-table__toolbar[data-v-c5638c20]{display:flex;align-items:center;gap:8px}.ecp-pro-table__body[data-v-c5638c20]{width:100%}.ecp-pro-table__pagination[data-v-c5638c20]{margin-top:16px;display:flex;justify-content:flex-end}.ecp-pro-table__col-help[data-v-c5638c20]{margin-left:4px;color:#909399;cursor:help}.ecp-table-action[data-v-f319e73a],.ecp-table-action__item[data-v-f319e73a]{display:inline-flex;align-items:center;gap:4px}.ecp-table-action__icon[data-v-f319e73a]{margin-right:4px}.ecp-table-action__more[data-v-f319e73a]{display:inline-flex;align-items:center}.ecp-table-action__dropdown-item[data-v-f319e73a]{display:inline-flex;align-items:center;gap:4px}.ecp-tree-select[data-v-f30bba11]{position:relative;width:100%}.ecp-tree-select__filter-inner[data-v-f30bba11]{margin-bottom:8px}.ecp-tree-select__dropdown[data-v-f30bba11]{position:absolute;top:100%;left:0;right:0;max-height:280px;overflow:auto;background:#fff;border:1px solid #dcdfe6;border-radius:4px;margin-top:4px;z-index:1000;padding:8px}.ecp-tree-select__loading[data-v-f30bba11]{padding:24px;text-align:center;color:#909399;font-size:14px}.ecp-pro-form-item__help-icon[data-v-84880e9d]{margin-left:4px;color:#909399;cursor:help;font-size:14px}.ecp-pro-form-item__help-icon[data-v-84880e9d]:hover{color:#409eff}.ecp-pro-form-item__help-item[data-v-84880e9d]{margin-bottom:4px}.ecp-pro-form-item__help-item[data-v-84880e9d]:last-child{margin-bottom:0}.ecp-form-actions[data-v-489c88d2]{text-align:right}.ecp-form-actions__advance[data-v-489c88d2]{margin-right:8px}.el-icon-d-arrow-left.up[data-v-489c88d2]{transform:rotate(90deg)}.el-icon-d-arrow-left.down[data-v-489c88d2]{transform:rotate(-90deg)}.ecp-pro-form[data-v-6171d80d]{padding:16px;position:relative}.ecp-pro-form__advance[data-v-6171d80d]{margin-bottom:16px}.ecp-pro-form_col[data-v-6171d80d]{position:relative;float:right}.el-icon-d-arrow-left.up[data-v-6171d80d]{transform:rotate(90deg)}.el-icon-d-arrow-left.down[data-v-6171d80d]{transform:rotate(-90deg)}.ecp-form-actions__advance[data-v-6171d80d]{position:absolute;bottom:0;left:50%;transform:translate(-50%,-50%)}.ecp-pro-descriptions[data-v-31a2b882]{width:100%;box-sizing:border-box}.ecp-pro-descriptions__header[data-v-31a2b882]{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px}.ecp-pro-descriptions__title-wrap[data-v-31a2b882]{display:flex;align-items:center;gap:6px}.ecp-pro-descriptions__title[data-v-31a2b882]{font-size:16px;font-weight:600;color:#303133}.ecp-pro-descriptions__help[data-v-31a2b882],.ecp-pro-descriptions__toggle[data-v-31a2b882]{color:#909399}.ecp-pro-descriptions__toggle .el-icon-arrow-down[data-v-31a2b882]{margin-left:4px;transition:transform .2s ease}.ecp-pro-descriptions__toggle .el-icon-arrow-down.is-expanded[data-v-31a2b882]{transform:rotate(180deg)}.ecp-pro-descriptions__body[data-v-31a2b882]{display:grid;border-top:1px solid #ebeef5;border-left:1px solid #ebeef5;overflow:hidden}.ecp-pro-descriptions__body.is-collapsed[data-v-31a2b882]{overflow:hidden}.ecp-pro-descriptions__body[data-v-31a2b882]:not(.is-bordered){border-top:0;border-left:0;gap:12px 16px}.ecp-pro-descriptions__item[data-v-31a2b882]{display:flex;min-width:0;border-right:1px solid #ebeef5;border-bottom:1px solid #ebeef5}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__item[data-v-31a2b882]{border-right:0;border-bottom:0}.ecp-pro-descriptions__label[data-v-31a2b882],.ecp-pro-descriptions__content[data-v-31a2b882]{min-width:0;box-sizing:border-box;word-break:break-word}.ecp-pro-descriptions__label[data-v-31a2b882]{flex:0 0 120px;padding:12px 16px;color:#606266;background:#fafafa}.ecp-pro-descriptions__content[data-v-31a2b882]{flex:1;padding:12px 16px;color:#303133;background:#fff}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__label[data-v-31a2b882]{flex-basis:auto;padding:0;margin-right:8px;background:transparent;font-weight:500}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__content[data-v-31a2b882]{padding:0;background:transparent}.ecp-pro-descriptions__body.is-small .ecp-pro-descriptions__label[data-v-31a2b882],.ecp-pro-descriptions__body.is-small .ecp-pro-descriptions__content[data-v-31a2b882]{padding-top:8px;padding-bottom:8px;font-size:13px}@media (max-width: 767px){.ecp-pro-descriptions__item[data-v-31a2b882]{flex-direction:column}.ecp-pro-descriptions__label[data-v-31a2b882]{flex-basis:auto}}
+.ecp-pro-table[data-v-c5638c20]{padding:16px;background:#fff;width:100%;box-sizing:border-box}.ecp-pro-table[data-v-c5638c20] .el-table{width:100%!important}.ecp-pro-table__header[data-v-c5638c20]{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.ecp-pro-table__title-wrapper[data-v-c5638c20]{display:flex;align-items:center;gap:4px}.ecp-pro-table__title[data-v-c5638c20]{font-size:16px;font-weight:600}.ecp-pro-table__help[data-v-c5638c20]{color:#909399;cursor:help}.ecp-pro-table__toolbar[data-v-c5638c20]{display:flex;align-items:center;gap:8px}.ecp-pro-table__body[data-v-c5638c20]{width:100%}.ecp-pro-table__pagination[data-v-c5638c20]{margin-top:16px;display:flex;justify-content:flex-end}.ecp-pro-table__col-help[data-v-c5638c20]{margin-left:4px;color:#909399;cursor:help}.ecp-table-action[data-v-45a58e7c],.ecp-table-action__item[data-v-45a58e7c]{display:inline-flex;align-items:center;gap:4px}.ecp-table-action__icon[data-v-45a58e7c]{margin-right:4px}.ecp-table-action__more[data-v-45a58e7c]{display:inline-flex;align-items:center}.ecp-table-action__dropdown-item[data-v-45a58e7c]{display:inline-flex;align-items:center;gap:4px}.ecp-tree-select[data-v-f30bba11]{position:relative;width:100%}.ecp-tree-select__filter-inner[data-v-f30bba11]{margin-bottom:8px}.ecp-tree-select__dropdown[data-v-f30bba11]{position:absolute;top:100%;left:0;right:0;max-height:280px;overflow:auto;background:#fff;border:1px solid #dcdfe6;border-radius:4px;margin-top:4px;z-index:1000;padding:8px}.ecp-tree-select__loading[data-v-f30bba11]{padding:24px;text-align:center;color:#909399;font-size:14px}.ecp-pro-form-item__colon[data-v-d3466c67]{margin-right:2px}.ecp-pro-form-item__help-icon[data-v-d3466c67]{margin-left:4px;color:#909399;cursor:help;font-size:14px}.ecp-pro-form-item__help-icon[data-v-d3466c67]:hover{color:#409eff}.ecp-pro-form-item__help-item[data-v-d3466c67]{margin-bottom:4px}.ecp-pro-form-item__help-item[data-v-d3466c67]:last-child{margin-bottom:0}.ecp-form-actions[data-v-489c88d2]{text-align:right}.ecp-form-actions__advance[data-v-489c88d2]{margin-right:8px}.el-icon-d-arrow-left.up[data-v-489c88d2]{transform:rotate(90deg)}.el-icon-d-arrow-left.down[data-v-489c88d2]{transform:rotate(-90deg)}.ecp-pro-form[data-v-bf70afca]{padding:16px;position:relative}.ecp-pro-form__advance[data-v-bf70afca]{margin-bottom:16px}.ecp-pro-form_col[data-v-bf70afca]{position:relative;float:right}.el-icon-d-arrow-left.up[data-v-bf70afca]{transform:rotate(90deg)}.el-icon-d-arrow-left.down[data-v-bf70afca]{transform:rotate(-90deg)}.ecp-form-actions__advance[data-v-bf70afca]{position:absolute;bottom:0;left:50%;transform:translate(-50%,-50%)}.ecp-pro-descriptions[data-v-7d6cd376]{width:100%;box-sizing:border-box}.ecp-pro-descriptions__header[data-v-7d6cd376]{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px}.ecp-pro-descriptions__title-wrap[data-v-7d6cd376]{display:flex;align-items:center;gap:6px}.ecp-pro-descriptions__title[data-v-7d6cd376]{font-size:16px;font-weight:600;color:#303133}.ecp-pro-descriptions__help[data-v-7d6cd376],.ecp-pro-descriptions__toggle[data-v-7d6cd376]{color:#909399}.ecp-pro-descriptions__toggle .el-icon-arrow-down[data-v-7d6cd376]{margin-left:4px;transition:transform .2s ease}.ecp-pro-descriptions__toggle .el-icon-arrow-down.is-expanded[data-v-7d6cd376]{transform:rotate(180deg)}.ecp-pro-descriptions__body[data-v-7d6cd376]{display:grid;border-top:1px solid #ebeef5;border-left:1px solid #ebeef5;overflow:hidden}.ecp-pro-descriptions__body.is-collapsed[data-v-7d6cd376]{overflow:hidden}.ecp-pro-descriptions__body[data-v-7d6cd376]:not(.is-bordered){border-top:0;border-left:0;gap:12px 16px}.ecp-pro-descriptions__item[data-v-7d6cd376]{display:flex;min-width:0;border-right:1px solid #ebeef5;border-bottom:1px solid #ebeef5}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__item[data-v-7d6cd376]{border-right:0;border-bottom:0}.ecp-pro-descriptions__label[data-v-7d6cd376],.ecp-pro-descriptions__content[data-v-7d6cd376]{min-width:0;box-sizing:border-box;word-break:break-word}.ecp-pro-descriptions__label[data-v-7d6cd376]{flex:0 0 120px;padding:12px 16px;color:#606266;background:#fafafa}.ecp-pro-descriptions__content[data-v-7d6cd376]{flex:1;padding:12px 16px;color:#303133;background:#fff}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__label[data-v-7d6cd376]{flex-basis:auto;padding:0;margin-right:8px;background:transparent;font-weight:500}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__content[data-v-7d6cd376]{padding:0;background:transparent}.ecp-pro-descriptions__body.is-small .ecp-pro-descriptions__label[data-v-7d6cd376],.ecp-pro-descriptions__body.is-small .ecp-pro-descriptions__content[data-v-7d6cd376]{padding-top:8px;padding-bottom:8px;font-size:13px}@media (max-width: 767px){.ecp-pro-descriptions__item[data-v-7d6cd376]{flex-direction:column}.ecp-pro-descriptions__label[data-v-7d6cd376]{flex-basis:auto}}

package/dist/types/index.d.ts

@@ -54,6 +54,7 @@ export interface ProFormProps {
     initialValues?: Record<string, unknown>;
     labelWidth?: string;
     labelPosition?: 'left' | 'right' | 'top';
+    colon?: boolean;
     gutter?: number;
     size?: 'medium' | 'small' | 'large';
     disabled?: boolean;
@@ -77,7 +78,7 @@ export interface ProFormProps {
     components?: Record<string, unknown>;
 }
 /** ProForm 内置表单项组件类型 */
-export type ProFormBuiltInComponent = 'input' | 'select' | 'api-select' | 'tree-select' | 'date-picker' | 'date-range' | 'input-number' | 'switch' | 'cascader' | 'checkbox' | 'radio';
+export type ProFormBuiltInComponent = 'input' | 'select' | 'api-select' | 'tree-select' | 'date-picker' | 'date-range' | 'input-number' | 'formatted-number' | 'switch' | 'cascader' | 'checkbox' | 'radio';
 /** 自定义组件：组件名（string）或 Vue 组件选项/构造函数（object | Function） */
 export type ProFormCustomComponent = string | object | ((...args: unknown[]) => unknown);
 /** ProForm 表单项配置 */
@@ -88,9 +89,11 @@ export interface ProFormSchema {
     label: string;
     /** 单个表单项标签宽度，优先级高于 Form 的 labelWidth */
     labelWidth?: string;
+    /** 是否显示 label 冒号，优先级高于 ProForm 的 colon */
+    colon?: boolean;
     /**
      * 组件类型：
-     * - 内置：'input' | 'select' | 'date-picker' | 'date-range' | 'input-number' | 'switch' | 'cascader' | 'checkbox' | 'radio'
+     * - 内置：'input' | 'select' | 'date-picker' | 'date-range' | 'input-number' | 'formatted-number' | 'switch' | 'cascader' | 'checkbox' | 'radio'
      * - 自定义组件名：任意字符串，对应全局或 ProForm 传入的 components 中注册的组件
      * - 内联组件：直接传入 Vue 组件选项对象或构造函数
      */
@@ -129,6 +132,8 @@ export interface ProFormSchema {
     helpMessage?: string | string[];
     /** 温馨提示组件的 props */
     helpComponentProps?: Record<string, unknown>;
+    /** 表单项 value 的 tooltip，true 时默认展示当前值，支持函数动态返回 */
+    tooltip?: boolean | string | Record<string, unknown> | ((params: RenderCallbackParams) => boolean | string | Record<string, unknown>);
 }
 /** ProDescriptions 描述项配置 */
 export interface ProDescriptionsSchema {
@@ -174,6 +179,12 @@ export interface DescriptionSchema {
     slot?: string;
     /** 自定义渲染 */
     render?: (value: unknown, record: Record<string, unknown>) => VNode | string | number | null | undefined;
+    /** 描述项 value 的 tooltip，true 时默认展示当前值，支持函数动态返回 */
+    tooltip?: boolean | string | Record<string, unknown> | ((params: {
+        value: unknown;
+        record: Record<string, unknown>;
+        schema: DescriptionSchema;
+    }) => boolean | string | Record<string, unknown>);
 }
 /** Description Props */
 export interface DescriptionProps {

package/dist/utils/formattedNumber.d.ts

@@ -0,0 +1,16 @@
+/** 进位方式：向下取整、向上取整、四舍五入 */
+export type FormattedNumberRounding = 'floor' | 'ceil' | 'round';
+/** 仅保留数字、至多一个小数点、可选前导负号 */
+export declare function sanitizeNumericInput(raw: string): string;
+export declare function stripNumberGrouping(s: string): string;
+/** 按整数位数上限约束绝对值 */
+export declare function clampByIntegerDigits(value: number, integerDigits: number, decimalPlaces: number): number;
+export declare function roundToDecimals(value: number, decimalPlaces: number, rounding: FormattedNumberRounding): number;
+/**
+ * 解析 → 按整数位夹紧 → 按小数位与进位方式舍入 → 再夹紧（防止舍入后越界）
+ */
+export declare function normalizeNumericValue(value: number, integerDigits: number, decimalPlaces: number, rounding: FormattedNumberRounding): number;
+/** 千分位格式化展示（整数部分），小数部分固定 m 位 */
+export declare function formatWithThousands(value: number, decimalPlaces: number): string;
+/** 编辑态：无千分位，去掉多余尾部 0（在 m 位精度内） */
+export declare function numberToEditString(value: number, decimalPlaces: number): string;

package/dist/utils/tooltip.d.ts

@@ -0,0 +1,4 @@
+export type TooltipValue = boolean | string | Record<string, unknown>;
+export declare const hasTooltipContent: (value: unknown) => boolean;
+export declare const getTooltipContent: (value: unknown) => string;
+export declare const normalizeTooltipConfig: (tooltip: TooltipValue | null | undefined, fallbackValue?: unknown) => Record<string, unknown> | null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aspire-ui/element-component-pro",
-  "version": "1.0.06",
+  "version": "1.0.08",
   "description": "Element UI 二次封装组件库，基于 Vue 2.7 + TypeScript + setup 语法糖，实现 VbenAdmin 风格的 Pro 组件",
   "type": "module",
   "main": "./dist/element-component-pro.umd.js",
@@ -32,6 +32,7 @@
   "devDependencies": {
     "@vitejs/plugin-vue2": "^2.3.1",
     "element-ui": "^2.15.14",
+    "marked": "^9.1.6",
     "playwright": "^1.40.0",
     "typescript": "^5.3.0",
     "vite": "^4.5.0",

package/src/ProDescriptions/ProDescriptions.vue

@@ -72,6 +72,7 @@
 <script setup lang="ts">
 import { computed, defineComponent, h, onMounted, onUnmounted, ref, watch } from 'vue'
 import { useComponentSetting } from '../useComponentSetting'
+import { normalizeTooltipConfig } from '../utils/tooltip'
 import type {
   DescriptionActionType,
   DescriptionColumn,
@@ -139,30 +140,47 @@ const DescriptionValueRenderer = defineComponent({
       const record = rendererProps.record as Record<string, unknown>
       const value = rendererProps.value
 
+      const renderTextNode = (text: string) => {
+        const tooltipProps = normalizeTooltip(schema, text === rendererProps.emptyText ? value : text, record)
+        const contentNode = h('span', text)
+        if (!tooltipProps) return contentNode
+        return h('el-tooltip', { props: tooltipProps }, [contentNode])
+      }
+
       if (schema.render) {
         const rendered = schema.render(value, record)
-        if (rendered == null || rendered === '') return h('span', rendererProps.emptyText)
-        if (typeof rendered === 'string' || typeof rendered === 'number') return h('span', String(rendered))
+        if (rendered == null || rendered === '') return renderTextNode(rendererProps.emptyText)
+        if (typeof rendered === 'string' || typeof rendered === 'number') return renderTextNode(String(rendered))
         return rendered as never
       }
 
       if (Array.isArray(value)) {
-        return h('span', value.length ? value.join(', ') : rendererProps.emptyText)
+        return renderTextNode(value.length ? value.join(', ') : rendererProps.emptyText)
       }
 
       if (value === null || value === undefined || value === '') {
-        return h('span', rendererProps.emptyText)
+        return renderTextNode(rendererProps.emptyText)
       }
 
       if (typeof value === 'object') {
-        return h('span', JSON.stringify(value))
+        return renderTextNode(JSON.stringify(value))
       }
 
-      return h('span', String(value))
+      return renderTextNode(String(value))
     }
   },
 })
 
+const normalizeTooltip = (schema: DescriptionSchema, value: unknown, record: Record<string, unknown>) => {
+  const tooltip = schema.tooltip
+  if (!tooltip) return null
+
+  const resolved = typeof tooltip === 'function'
+    ? tooltip({ value, record, schema })
+    : tooltip
+  return normalizeTooltipConfig(resolved, value)
+}
+
 const { getSetting } = useComponentSetting()
 const effectiveProps = computed(() => ({ ...getSetting('ProDescriptions'), ...props, ...innerProps.value }))