cnhis-design-vue 3.1.14 → 3.1.15-beta.10

package/es/packages/annotation-edit/src/AnnotationEdit.js

@@ -36,7 +36,8 @@ var script = defineComponent({
     });
     const isEdit = ref(false);
     let clickTimer;
-    function iconClick() {
+    function iconClick(evt) {
+      evt.stopPropagation();
       clearTimeout(clickTimer);
       if (showPopper.value && isEdit.value) {
         showPopper.value = false;

package/es/packages/big-table/index.d.ts

@@ -9,9 +9,8 @@ declare const BigTable: SFCWithInstall<import("vue").DefineComponent<{
         type: NumberConstructor;
         default: number;
     };
-    checkboxBindRowClick: {
-        type: BooleanConstructor;
-        default: boolean;
+    annotation: {
+        type: import("vue").PropType<import("../../../es/src/types").AnyObject>;
     };
     showFooter: BooleanConstructor;
     sumData: {
@@ -2595,9 +2594,8 @@ declare const BigTable: SFCWithInstall<import("vue").DefineComponent<{
             type: NumberConstructor;
             default: number;
         };
-        checkboxBindRowClick: {
-            type: BooleanConstructor;
-            default: boolean;
+        annotation: {
+            type: import("vue").PropType<import("../../../es/src/types").AnyObject>;
         };
         showFooter: BooleanConstructor;
         sumData: {
@@ -2945,7 +2943,8 @@ declare const BigTable: SFCWithInstall<import("vue").DefineComponent<{
     maskUp: (e: any) => void;
     setGroupTreeExpand: () => void;
     resetTableInlineEditStatus: () => false | undefined;
-    toolTipTitle: (item: any, type: any) => any;
+    renderAnnotation: (columnConfig: import("../../../es/src/types").AnyObject) => JSX.Element | null;
+    toolTipTitle: (item: any, type: any) => any[] | (() => any[]);
     triggerExpand: (e: any, isExpand: any) => void;
     getOtherConfigInit: () => any;
     refreshTable: () => void;
@@ -4082,9 +4081,8 @@ declare const BigTable: SFCWithInstall<import("vue").DefineComponent<{
         type: NumberConstructor;
         default: number;
     };
-    checkboxBindRowClick: {
-        type: BooleanConstructor;
-        default: boolean;
+    annotation: {
+        type: import("vue").PropType<import("../../../es/src/types").AnyObject>;
     };
     showFooter: BooleanConstructor;
     sumData: {
@@ -4281,7 +4279,6 @@ declare const BigTable: SFCWithInstall<import("vue").DefineComponent<{
     columnConfig: Record<string, any>;
     menuConfig: Record<string, any>;
     maxCheckSize: number;
-    checkboxBindRowClick: boolean;
     sumData: Record<string, any>;
     avgData: Record<string, any>;
     refreshRow: number;

package/es/packages/big-table/src/BigTable.vue.d.ts

@@ -7,9 +7,8 @@ declare const _default: import("vue").DefineComponent<{
         type: NumberConstructor;
         default: number;
     };
-    checkboxBindRowClick: {
-        type: BooleanConstructor;
-        default: boolean;
+    annotation: {
+        type: import("vue").PropType<import("../../../src/types").AnyObject>;
     };
     showFooter: BooleanConstructor;
     sumData: {
@@ -1163,7 +1162,14 @@ declare const _default: import("vue").DefineComponent<{
                 paddingLarge: string;
                 paddingRoundTiny: string;
                 paddingRoundSmall: string;
-                paddingRoundMedium: string;
+                paddingRoundMedium: string; /**
+                 * 初始化props
+                 * @param {*} unionItem
+                 * @param {*} row
+                 * @param {*} column
+                 * @param {*} $rowIndex
+                 * @returns
+                 */
                 paddingRoundLarge: string;
                 iconMarginTiny: string;
                 iconMarginSmall: string;
@@ -1252,9 +1258,7 @@ declare const _default: import("vue").DefineComponent<{
                 borderHoverPrimary: string;
                 borderPressedPrimary: string;
                 borderFocusPrimary: string;
-                borderDisabledPrimary: string; /**
-                 * tsx渲染表格
-                 */
+                borderDisabledPrimary: string;
                 rippleColorPrimary: string;
                 colorInfo: string;
                 colorHoverInfo: string;
@@ -2595,9 +2599,8 @@ declare const _default: import("vue").DefineComponent<{
             type: NumberConstructor;
             default: number;
         };
-        checkboxBindRowClick: {
-            type: BooleanConstructor;
-            default: boolean;
+        annotation: {
+            type: import("vue").PropType<import("../../../src/types").AnyObject>;
         };
         showFooter: BooleanConstructor;
         sumData: {
@@ -2945,7 +2948,8 @@ declare const _default: import("vue").DefineComponent<{
     maskUp: (e: any) => void;
     setGroupTreeExpand: () => void;
     resetTableInlineEditStatus: () => false | undefined;
-    toolTipTitle: (item: any, type: any) => any;
+    renderAnnotation: (columnConfig: import("../../../src/types").AnyObject) => JSX.Element | null;
+    toolTipTitle: (item: any, type: any) => any[] | (() => any[]);
     triggerExpand: (e: any, isExpand: any) => void;
     getOtherConfigInit: () => any;
     refreshTable: () => void;
@@ -3292,7 +3296,10 @@ declare const _default: import("vue").DefineComponent<{
                 buttonColor2: string;
                 buttonColor2Hover: string;
                 buttonColor2Pressed: string;
-                boxShadow1: string; /**
+                boxShadow1: string;
+                boxShadow2: string;
+                boxShadow3: string;
+                /**
                  * 针对 bigTable 的设置列
                  * type: 列的类型
                  * field: 列字段名（注：属性层级越深，渲染性能将直线下降）
@@ -3308,8 +3315,6 @@ declare const _default: import("vue").DefineComponent<{
                  * formatter: 格式化显示内容 Function({cellValue, row, column})
                  * sortable: 是否允许列排序
                  */
-                boxShadow2: string;
-                boxShadow3: string;
                 fontFamily: string;
                 fontFamilyMono: string;
                 fontWeight: string;
@@ -4061,7 +4066,9 @@ declare const _default: import("vue").DefineComponent<{
             color: string;
             opacity1Depth: string;
             opacity2Depth: string;
-            opacity3Depth: string;
+            opacity3Depth: string; /**
+             * computed
+             */
             opacity4Depth: string;
             opacity5Depth: string;
         }, any>>;
@@ -4097,9 +4104,8 @@ declare const _default: import("vue").DefineComponent<{
         type: NumberConstructor;
         default: number;
     };
-    checkboxBindRowClick: {
-        type: BooleanConstructor;
-        default: boolean;
+    annotation: {
+        type: import("vue").PropType<import("../../../src/types").AnyObject>;
     };
     showFooter: BooleanConstructor;
     sumData: {
@@ -4296,7 +4302,6 @@ declare const _default: import("vue").DefineComponent<{
     columnConfig: Record<string, any>;
     menuConfig: Record<string, any>;
     maxCheckSize: number;
-    checkboxBindRowClick: boolean;
     sumData: Record<string, any>;
     avgData: Record<string, any>;
     refreshRow: number;

package/es/packages/big-table/src/BigTable.vue_vue_type_script_setup_true_lang.js

@@ -1,5 +1,6 @@
 import { defineComponent, ref, reactive, useAttrs, computed, onMounted, onUnmounted, onActivated, createVNode, h, resolveComponent, Teleport, createTextVNode, nextTick, watch, openBlock, createElementBlock, Fragment, createCommentVNode, createElementVNode, normalizeClass, normalizeStyle, unref, mergeProps, withCtx, renderSlot, createBlock, toDisplayString, withDirectives, vShow, isVNode } from 'vue';
 import { isArray, isFunction } from 'lodash-es';
+import { useAnnotation } from '../../../packages/big-table/src/hooks/useAnnotation';
 import { useSeparateRow } from '../../../packages/big-table/src/hooks/useSeparateRow';
 import bigTableState from './bigTableState.js';
 import bigTableProps from './bigTableProps.js';
@@ -539,6 +540,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         row,
         index: $rowIndex,
         type: formType,
+        ...col.componentProps || {},
         onFormChange,
         onClick: () => {
           emit("formClick", {
@@ -950,6 +952,9 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         return false;
       handleClickCancelBtnByInline();
     };
+    const {
+      renderAnnotation
+    } = useAnnotation(props);
     const toolTipTitle = (item, type) => {
       var _a;
       let name = item.formTitle || item.alias || item.title;
@@ -962,11 +967,11 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         isAlias = !!tooltipTitle;
       }
       if (type === "format")
-        return createVNode(TextOverTooltip, {
+        return [createVNode(TextOverTooltip, {
           "tooltipTitle": tooltipTitle,
           "content": name,
           "isAlias": isAlias
-        }, null);
+        }, null), renderAnnotation(item)];
       return () => {
         return [createVNode(TextOverTooltip, {
           "tooltipTitle": tooltipTitle,
@@ -977,7 +982,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
             "component": state.isExpand && state.total < 1001 ? CaretDown : CaretForward,
             "onClick": (e) => triggerExpand(e, state.isExpand)
           }, null) : ""]
-        })];
+        }), renderAnnotation(item)];
       };
     };
     const triggerExpand = (e, isExpand) => {
@@ -1341,9 +1346,6 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       }
       isAboutNestTable.value && emit("setNestLastClickTable", table, props.isNestTable, row[handleRowId.value], row);
       emit("setNestTableClick", false);
-      if (!props.checkboxBindRowClick) {
-        return;
-      }
       if (props.isNestTable) {
         table == null ? void 0 : table.setAllCheckboxRow(false);
         nestHandleClickRow(table, data);
@@ -2314,7 +2316,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         "span-method": colspanMethod,
         "footer-span-method": footerRowspanMethod,
         "tooltip-config": {
-          enterable: false
+          enterable: false,
+          ..._ctx.$attrs.tooltipConfig || {}
         },
         "checkbox-config": {
           checkField: "checked",
@@ -2330,10 +2333,12 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           checkField: "checked",
           trigger: "cell",
           reserve: true,
-          highlight: true
+          highlight: true,
+          ..._ctx.$attrs.radioConfig || {}
         },
         "scroll-y": {
-          gt: 50
+          gt: 50,
+          ..._ctx.$attrs.scrollY || {}
         },
         "row-style": unref(getRowStyle),
         "edit-config": state.editConfig,
@@ -2343,7 +2348,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           loadMethod: unref(loadExpandMethod),
           toggleMethod: unref(toggleExpandMethod),
           iconOpen: "iconfont icon-a-xitongtubiaozhediejian",
-          iconClose: "iconfont icon-a-xitongtubiaotianjia"
+          iconClose: "iconfont icon-a-xitongtubiaotianjia",
+          ..._ctx.$attrs.expandConfig || {}
         },
         "keyboard-config": _ctx.columnConfig.keyboardConfig || {},
         "edit-rules": _ctx.columnConfig.editRules || {},
@@ -2413,7 +2419,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           }
         })]),
         _: 3
-      }, 16, ["height", "seq-config", "tree-config", "cell-class-name", "row-config", "show-footer", "checkbox-config", "row-style", "edit-config", "expand-config", "keyboard-config", "edit-rules", "menu-config", "onScroll", "onKeydown"]), createCommentVNode(" `${refreshRow}\u6761\u66F4\u65B0` "), withDirectives(createElementVNode("div", {
+      }, 16, ["height", "seq-config", "tree-config", "cell-class-name", "row-config", "show-footer", "tooltip-config", "checkbox-config", "radio-config", "scroll-y", "row-style", "edit-config", "expand-config", "keyboard-config", "edit-rules", "menu-config", "onScroll", "onKeydown"]), createCommentVNode(" `${refreshRow}\u6761\u66F4\u65B0` "), withDirectives(createElementVNode("div", {
         class: "refresh",
         onClick: hanldeClickRefresh
       }, [createVNode(unref(NIcon), {

package/es/packages/big-table/src/bigTableProps.d.ts

@@ -1,3 +1,5 @@
+import { AnyObject } from '../../../../es/src/types';
+import { PropType } from 'vue';
 declare const bigTableProps: {
     data: {
         type: ArrayConstructor;
@@ -7,9 +9,8 @@ declare const bigTableProps: {
         type: NumberConstructor;
         default: number;
     };
-    checkboxBindRowClick: {
-        type: BooleanConstructor;
-        default: boolean;
+    annotation: {
+        type: PropType<AnyObject>;
     };
     showFooter: BooleanConstructor;
     sumData: {

package/es/packages/big-table/src/bigTableProps.js

@@ -1,7 +1,7 @@
 const bigTableProps = {
   data: { type: Array, default: () => [] },
   maxCheckSize: { type: Number, default: 0 },
-  checkboxBindRowClick: { type: Boolean, default: true },
+  annotation: { type: Object },
   showFooter: Boolean,
   sumData: { type: Object, default: () => ({}) },
   avgData: { type: Object, default: () => ({}) },

package/es/packages/big-table/src/components/edit-form/edit-date.js

@@ -1,4 +1,5 @@
 import { defineComponent, createVNode, mergeProps } from 'vue';
+import { isFunction } from 'lodash-es';
 import { NDatePicker } from 'naive-ui';
 
 var EditDate = defineComponent({
@@ -94,16 +95,24 @@ var EditDate = defineComponent({
         }
       };
     };
+    function customDateDisabledDecorator(customDateDisabled) {
+      if (!isFunction(customDateDisabled))
+        return null;
+      return (ts) => {
+        return customDateDisabled(ts, props.row);
+      };
+    }
     const config = {
-      type: props.col.type || "datetime",
+      type: props.col.type || props.col.dateType || "datetime",
       clearable: props.col.clearable || true,
       disabled: props.col.disabled || false,
       valueFormat: props.col.valueFormat || "yyyy-MM-dd HH:mm:ss",
-      isDateDisabled: props.col.isDateDisabled || isDateDisabled,
-      placeholder: props.col.placeholder || "\u8BF7\u9009\u62E9"
+      isDateDisabled: customDateDisabledDecorator(props.col.isDateDisabled) || isDateDisabled,
+      placeholder: props.col.placeholder || "\u8BF7\u9009\u62E9",
+      ...props.col.componentProps || {}
     };
     if (config.type.includes("time")) {
-      config.isTimeDisabled = props.col.isTimeDisabled || isTimeDisabled;
+      config.isTimeDisabled = customDateDisabledDecorator(props.col.isTimeDisabled) || isTimeDisabled;
     }
     return () => createVNode(NDatePicker, mergeProps(attrs, config, {
       "onUpdateFormattedValue": onConfirm

package/es/packages/big-table/src/components/edit-form/edit-select.js

@@ -33,7 +33,8 @@ var EditSelect = defineComponent({
       loading: false,
       keyword: "",
       config: {
-        multiple: props.col.multiple || false
+        multiple: props.col.multiple || false,
+        ...props.col.componentProps || {}
       }
     });
     const setOptions = async () => {

package/es/packages/big-table/src/components/edit-form/edit-separate.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, openBlock, createBlock, unref, withCtx, createVNode, withModifiers } from 'vue';
+import { defineComponent, ref, watch, openBlock, createBlock, unref, withCtx, createVNode, withModifiers } from 'vue';
 import SlotRender from '../../../../../src/components/SlotRender';
 import { cloneDeep, isObject, isArray } from 'lodash-es';
 import { NPopover, NInput } from 'naive-ui';
@@ -17,14 +17,22 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit }) {
     const props = __props;
     const popoverRef = ref();
+    const show = ref(false);
+    function setShow(v) {
+      show.value = v;
+    }
+    watch(show, updateShow);
     const editContent = ref();
     const { getRowData } = useSeparateMap();
-    function updateShow(show) {
+    async function updateShow(show2) {
+      var _a;
       const target = getRowData(props.row);
       if (!target)
         return;
-      if (show) {
+      if (show2) {
         editContent.value = cloneDeep(target.row[props.col.field]);
+        await new Promise((resolve) => setTimeout(resolve));
+        (_a = popoverRef.value) == null ? void 0 : _a.syncPosition();
         return;
       }
       const old = target.row[props.col.field];
@@ -52,14 +60,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return openBlock(), createBlock(unref(NPopover), {
         ref_key: "popoverRef",
         ref: popoverRef,
-        trigger: "click",
-        "show-arrow": false,
-        "onUpdate:show": updateShow
+        trigger: "manual",
+        show: show.value,
+        "onUpdate:show": _cache[3] || (_cache[3] = ($event) => show.value = $event),
+        "show-arrow": false
       }, {
         trigger: withCtx(() => [
           createVNode(Separate, {
-            onClick: _cache[0] || (_cache[0] = withModifiers(() => {
-            }, ["stop"])),
+            onClick: _cache[0] || (_cache[0] = withModifiers(($event) => show.value = !show.value, ["stop"])),
             style,
             col: __props.col,
             row: __props.row
@@ -71,6 +79,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             renderer: __props.col.separateSlot,
             value: editContent.value,
             "onUpdate:value": _cache[1] || (_cache[1] = ($event) => editContent.value = $event),
+            "onUpdate:show": setShow,
             col: __props.col,
             row: __props.row
           }, null, 8, ["renderer", "value", "col", "row"])) : (openBlock(), createBlock(unref(NInput), {
@@ -81,7 +90,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           }, null, 8, ["value"]))
         ]),
         _: 1
-      }, 512);
+      }, 8, ["show"]);
     };
   }
 });

package/es/packages/big-table/src/components/edit-form/edit-separate.vue.d.ts

@@ -31,6 +31,8 @@ declare const _default: import("vue").DefineComponent<{
         onFormChange?: ((...args: any[]) => any) | undefined;
     }>>;
     popoverRef: import("vue").Ref<any>;
+    show: import("vue").Ref<boolean>;
+    setShow: (v: boolean) => void;
     emit: (event: "formChange", ...args: any[]) => void;
     editContent: import("vue").Ref<any>;
     getRowData: (row: AnyObject) => {
@@ -39,7 +41,7 @@ declare const _default: import("vue").DefineComponent<{
         rawRow: AnyObject;
         row: AnyObject;
     } | undefined;
-    updateShow: (show: boolean) => void;
+    updateShow: (show: boolean) => Promise<void>;
     style: CSSProperties;
     SlotRender: import("vue").DefineComponent<{
         renderer: {

package/es/packages/big-table/src/hooks/useAnnotation.d.ts

@@ -0,0 +1,4 @@
+import { AnyObject } from '../../../../../es/src/types';
+export declare function useAnnotation(props: AnyObject): {
+    renderAnnotation: (columnConfig: AnyObject) => JSX.Element | null;
+};

package/es/packages/big-table/src/hooks/useAnnotation.js

@@ -0,0 +1,21 @@
+import { createVNode } from 'vue';
+import { isObject } from '@vue/shared';
+import Annotation from '../../../annotation-edit/index.js';
+
+function useAnnotation(props) {
+  function renderAnnotation(columnConfig) {
+    if (!isObject(props.annotation) || columnConfig.annotation === false)
+      return null;
+    return createVNode("section", {
+      "class": "big-table__annotationWrapper"
+    }, [createVNode(Annotation, {
+      "modelValue": props.annotation[columnConfig.columnName],
+      "onUpdate:modelValue": ($event) => props.annotation[columnConfig.columnName] = $event
+    }, null)]);
+  }
+  return {
+    renderAnnotation
+  };
+}
+
+export { useAnnotation };

package/es/packages/big-table/src/hooks/useColumnConfigAdaptor.js

@@ -31,50 +31,65 @@ function useColumnConfigAdaptor() {
         ...["INPUT"].map((type) => [type, "input"]),
         ...["DIGITAL"].map((type) => [type, "number"])
       ]);
-      const settingMap = new Map([
-        ["multi_select_value", { property: "multiple", valueMap: multipleValueMap }],
-        [
-          "is_null",
-          (value, result, _fieldItem, _editRules) => {
-            if (value === "1")
-              return;
-            if (value === "0")
-              _editRules[_fieldItem.val_key] = [{ required: true, message: "\u5FC5\u586B" }];
+      const isNullHandler = (value, result, _fieldItem, _editRules) => {
+        if (value === "1")
+          return;
+        if (value === "0")
+          _editRules[_fieldItem.val_key] = [{ required: true, message: "\u5FC5\u586B" }];
+      };
+      const validateHandler = (value, result) => {
+        if (!isObject(value))
+          return;
+        result.componentProps = Object.assign({}, result.comonentProps, {
+          maxlength: value.max_length,
+          minlength: value.min_length,
+          max: value.max_value,
+          min: value.min_value,
+          precision: value.decimal_length
+        });
+      };
+      const dateRangeValidate = (value, result) => {
+        if (!isObject(value))
+          return;
+        result.isDateDisabled = (ts, row) => {
+          if (!isObject(row))
+            return;
+          const { startDate, endDate } = value;
+          let invalid = false;
+          if (startDate) {
+            invalid = new Date(row[startDate]).getTime() > ts;
           }
-        ],
-        [
-          "validate",
-          (value, result) => {
-            if (!isObject(value))
-              return;
-            result.componentProps = Object.assign({}, result.comonentProps, {
-              maxlength: value.max_length,
-              minlength: value.min_length,
-              max: value.max_value,
-              min: value.min_value,
-              precision: value.decimal_length
-            });
+          if (endDate) {
+            invalid = invalid || new Date(row[endDate]).getTime() < ts;
           }
-        ],
-        ...["open", "close"].map((key) => {
-          return [
-            key,
-            (value, result) => {
-              if (!isObject(value))
-                return;
-              const option = { label: value.describe, ...value };
-              result.options = isArray(result.options) ? [...result.options, option] : [option];
-            }
-          ];
-        }),
+          return invalid;
+        };
+      };
+      const switchOptionHandler = (value, result) => {
+        if (!isObject(value))
+          return;
+        const option = { label: value.describe, ...value };
+        result.options = isArray(result.options) ? [...result.options, option] : [option];
+      };
+      const settingMap = new Map([
+        ["multi_select_value", { property: "multiple", valueMap: multipleValueMap }],
+        ["is_null", isNullHandler],
+        ["validate", validateHandler],
+        ["dateValidate", dateRangeValidate],
+        ...["open", "close"].map((key) => [key, switchOptionHandler]),
         ["is_edit", { property: "isEdit", valueMap: isEditValueMap }],
         ["html_type", { property: "formType", valueMap: htmlTypeValueMap }],
-        ["option", { property: "options", fieldMap: /* @__PURE__ */ new Map([["text", "label"]]) }]
+        ["option", { property: "options", fieldMap: /* @__PURE__ */ new Map([["text", "label"]]) }],
+        [
+          "alias",
+          (value, result, fieldItem) => {
+            result.title = `${value}${fieldItem.suffix ? `(${fieldItem.suffix})` : ""}`;
+          }
+        ]
       ]);
       const fieldMap = /* @__PURE__ */ new Map([
         ["sum", "isSum"],
         ["show", "isShow"],
-        ["name", "title"],
         ["elementId", "columnName"],
         ["columnWidth", "colWidth"],
         ["fixedWayEnum", { property: "isFixed", valueMap: fixedWayEnumValueMap }],

package/es/packages/big-table/src/hooks/useEdit.d.ts

@@ -223,6 +223,8 @@ export declare const comps: {
             onFormChange?: ((...args: any[]) => any) | undefined;
         }>>;
         popoverRef: import("vue").Ref<any>;
+        show: import("vue").Ref<boolean>;
+        setShow: (v: boolean) => void;
         emit: (event: "formChange", ...args: any[]) => void;
         editContent: import("vue").Ref<any>;
         getRowData: (row: import("../../../../src/types").AnyObject) => {
@@ -231,7 +233,7 @@ export declare const comps: {
             rawRow: import("../../../../src/types").AnyObject;
             row: import("../../../../src/types").AnyObject;
         } | undefined;
-        updateShow: (show: boolean) => void;
+        updateShow: (show: boolean) => Promise<void>;
         style: import("vue").CSSProperties;
         SlotRender: import("vue").DefineComponent<{
             renderer: {

package/es/packages/big-table/src/hooks/useFormat.js

@@ -133,7 +133,14 @@ const useFormat = (state) => {
                 item[key] = temp.change_text;
               } else {
                 if (temp.background != "#ffffff") {
-                  item[key] = `<span class="field-span" style="color:${temp.background}"><span class="${temp.icon}"></span>${temp.change_text || ""}</span>`;
+                  const reg = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/;
+                  let color = temp.background;
+                  let iconHtml = `<span class="${temp.icon}"></span>`;
+                  if (reg.test(temp.icon)) {
+                    color = temp.icon;
+                    iconHtml = `<span class="icon-dot-custom" style="--table-icon-color:${temp.icon};--table-icon-shadow:${temp.icon}80"></span>`;
+                  }
+                  item[key] = `<span class="field-span" style="color:${color}">${iconHtml}${temp.change_text || ""}</span>`;
                 } else {
                   item[key] = temp.change_text;
                 }