cnhis-design-vue 3.3.1-beta.9 → 3.3.1-release.4

package/es/components/iho-table/src/plugins/rendererPlugins/editableWidgets/timeRendererPlugin/editTime.vue2.js

@@ -1 +1,233 @@
-import{defineComponent as e,useAttrs as t,inject as l,ref as a,computed as o,reactive as r,watch as u,nextTick as n,onBeforeUnmount as i,openBlock as m,createBlock as d,unref as v,withCtx as c,createVNode as s,mergeProps as f,isRef as p,createElementBlock as h,Fragment as g,renderList as w,createTextVNode as y,toDisplayString as b,createCommentVNode as k}from"vue";import{noop as _}from"lodash-es";import{NPopover as F,NInput as V,NSpace as S,NScrollbar as $,NButton as H}from"naive-ui";import{useIhoTableFormEvent as x}from"../../../../utils/index.js";import C from"../../../../../../time-picker/index.js";import{parse as D,isValid as O,format as j,getHours as E,getMinutes as A,getSeconds as I}from"date-fns";var P=e({__name:"editTime",props:{formattedValue:{type:String},column:{type:Object},row:{type:Object},rowIndex:{type:Number},shortcutOptions:{type:Array,default:()=>[]},ignoreGlobEmit:{type:Boolean,default:!1}},emits:["update:formattedValue","click"],setup(e,{emit:P}){var R;const U=e,q=t(),{emitFormChangeWithParams:B=_}=U.ignoreGlobEmit?{}:x({...U,$table:l("$xetable")}),G=a(null),M=a(!1),N=a(),W=a();let z=U.formattedValue;const K=o((()=>W.value&&Y(W.value)?{style:"text-decoration: line-through"}:{})),L=o({get(){if(!W.value)return null;const e=D(W.value,Q.valueFormat,new Date);return O(e)?j(e,Q.valueFormat):U.formattedValue?te(U.formattedValue):null},set(e){X(e)}}),{placeholder:T=(null==(R=window.getLanguageByCode)?void 0:R.call(window,"10010.1.147"))||"请选择",valueFormat:J="HH:mm"}=q,Q=r({...q,placeholder:T,valueFormat:J,format:J});function X(e){W.value=e||"",e&&Y(e)||(z=e)}function Y(e){var t,l,a;const o=D(e,Q.format,new Date),r=E(o),u=A(o),n=I(o),i=null==(t=Q.isHourDisabled)?void 0:t.call(Q,r),m=null==(l=Q.isMinuteDisabled)?void 0:l.call(Q,u,r),d=null==(a=Q.isSecondDisabled)?void 0:a.call(Q,n,u,r);return i||m||d}function Z(){[Q.valueFormat.replace(/[^\w]/g,""),Q.valueFormat].some((e=>{const t=D(W.value,e,new Date);if(!W.value||O(t)){return X(W.value?j(t,Q.valueFormat):null),!0}return!1}))}function ee(e){var t;const{key:l}=e;"Enter"===l&&(null==(t=G.value)||t.blur(),M.value=!1)}function te(e){var t;const l=Q.valueFormat.match(/\W/)[0]||":",a=e.split(l).map(Number),o=`${a[0].toString().padStart(2,"0")}${l}${a[1].toString().padStart(2,"0")}`;return"HH:mm"===Q.valueFormat?o:"HH:mm:ss"===Q.valueFormat?`${o}${l}${(null!=(t=a[2])?t:0).toString().padStart(2,"0")}`:e}function le(){z&&Y(z)||U.formattedValue!==z&&(P("update:formattedValue",z),B({oldValue:U.formattedValue}))}return u((()=>U.formattedValue),(e=>{z=e,e&&(W.value=te(e))}),{immediate:!0}),u((()=>M.value),(async e=>{var t,l,a,o,r;e?(z=L.value,await n(),null==(r=null==(o=null==(a=null==(l=null==(t=N.value)?void 0:t.$timePicker)?void 0:l.panelInstRef)?void 0:a.$el)?void 0:o.querySelectorAll(".n-time-picker-col"))||r.forEach((e=>{var t,l;return null==(l=null==(t=null==e?void 0:e.querySelector)?void 0:t.call(e,".n-time-picker-col__item--active"))?void 0:l.scrollIntoView()}))):le()})),i((()=>{le()})),(t,l)=>(m(),d(v(F),{show:M.value,"onUpdate:show":l[3]||(l[3]=e=>M.value=e),trigger:"click",showArrow:!1,placement:"bottom-start",style:{padding:"0"}},{trigger:c((()=>[s(v(V),{ref_key:"formRef",ref:G,clearable:"",placeholder:v(T),value:W.value,"onUpdate:value":l[0]||(l[0]=e=>W.value=e),valueModifiers:{trim:!0},"input-props":v(K),onChange:Z,onKeydown:ee},null,8,["placeholder","value","input-props"])])),default:c((()=>[s(v(S),null,{default:c((()=>[s(v(C),f({ref_key:"timePickerRef",ref:N,show:""},v(Q),{class:"iho-table__time-picker",to:!1,"formatted-value":v(L),"onUpdate:formatted-value":l[1]||(l[1]=e=>p(L)?L.value=e:null),onConfirm:l[2]||(l[2]=()=>M.value=!1)}),null,16,["formatted-value"]),s(v($),{class:"iho-table__scrollbar"},{default:c((()=>[e.shortcutOptions.length?(m(),d(v(S),{key:0,vertical:"",wrap:!1},{default:c((()=>[(m(!0),h(g,null,w(e.shortcutOptions,(e=>(m(),d(v(H),{size:"tiny",key:e,disabled:Y(e),onClick:t=>function(e){X(te(e)),M.value=!1}(e)},{default:c((()=>[y(b(e),1)])),_:2},1032,["disabled","onClick"])))),128))])),_:1})):k("v-if",!0)])),_:1})])),_:1})])),_:1},8,["show"]))}});export{P as default};
+import { defineComponent, useAttrs, inject, ref, computed, reactive, watch, nextTick, onBeforeUnmount, openBlock, createBlock, unref, withCtx, createVNode, mergeProps, isRef, createElementBlock, Fragment, renderList, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
+import { noop } from 'lodash-es';
+import { NPopover, NInput, NSpace, NScrollbar, NButton } from 'naive-ui';
+import { useIhoTableFormEvent } from '../../../../utils/index.js';
+import TimePicker from '../../../../../../time-picker/index.js';
+import { parse, isValid, format, getHours, getMinutes, getSeconds } from 'date-fns';
+
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "editTime",
+  props: {
+    formattedValue: {
+      type: String
+    },
+    column: {
+      type: Object
+    },
+    row: {
+      type: Object
+    },
+    rowIndex: {
+      type: Number
+    },
+    shortcutOptions: {
+      type: Array,
+      default: () => []
+    },
+    ignoreGlobEmit: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["update:formattedValue", "click"],
+  setup(__props, {
+    emit
+  }) {
+    var _a;
+    const props = __props;
+    const attr = useAttrs();
+    const {
+      emitFormChangeWithParams = noop
+    } = props.ignoreGlobEmit ? {} : useIhoTableFormEvent({
+      ...props,
+      $table: inject("$xetable")
+    });
+    const formRef = ref(null);
+    const isShow = ref(false);
+    const timePickerRef = ref();
+    const inputValue = ref();
+    let newValue = props.formattedValue;
+    const inputProps = computed(() => {
+      return inputValue.value && isDisabled(inputValue.value) ? {
+        style: "text-decoration: line-through"
+      } : {};
+    });
+    const __formattedValue = computed({
+      get() {
+        if (!inputValue.value)
+          return null;
+        const parseValue = parse(inputValue.value, timeConfig.valueFormat, new Date());
+        return isValid(parseValue) ? format(parseValue, timeConfig.valueFormat) : props.formattedValue ? formatTime(props.formattedValue) : null;
+      },
+      set(value) {
+        saveValue(value);
+      }
+    });
+    const {
+      placeholder = ((_a = window.getLanguageByCode) == null ? void 0 : _a.call(window, "10010.1.147")) || "\u8BF7\u9009\u62E9",
+      valueFormat = "HH:mm"
+    } = attr;
+    const timeConfig = reactive({
+      ...attr,
+      placeholder,
+      valueFormat,
+      format: valueFormat
+    });
+    function clickShortcutOption(item) {
+      saveValue(formatTime(item));
+      isShow.value = false;
+    }
+    function saveValue(value) {
+      inputValue.value = !value ? "" : value;
+      if (value && isDisabled(value))
+        return;
+      newValue = value;
+    }
+    function isDisabled(value) {
+      var _a2, _b, _c;
+      const parsedTime = parse(value, timeConfig.format, new Date());
+      const hours = getHours(parsedTime);
+      const minutes = getMinutes(parsedTime);
+      const seconds = getSeconds(parsedTime);
+      const isHourDisabled = (_a2 = timeConfig.isHourDisabled) == null ? void 0 : _a2.call(timeConfig, hours);
+      const isMinuteDisabled = (_b = timeConfig.isMinuteDisabled) == null ? void 0 : _b.call(timeConfig, minutes, hours);
+      const isSecondDisabled = (_c = timeConfig.isSecondDisabled) == null ? void 0 : _c.call(timeConfig, seconds, minutes, hours);
+      return isHourDisabled || isMinuteDisabled || isSecondDisabled;
+    }
+    function onChange() {
+      const formats = [timeConfig.valueFormat.replace(/[^\w]/g, ""), timeConfig.valueFormat];
+      formats.some((_format) => {
+        const parseValue = parse(inputValue.value, _format, new Date());
+        if (!inputValue.value || isValid(parseValue)) {
+          const value = !inputValue.value ? null : format(parseValue, timeConfig.valueFormat);
+          saveValue(value);
+          return true;
+        }
+        return false;
+      });
+    }
+    function onKeydown(event) {
+      var _a2;
+      const {
+        key
+      } = event;
+      if (key === "Enter") {
+        (_a2 = formRef.value) == null ? void 0 : _a2.blur();
+        isShow.value = false;
+      }
+    }
+    function formatTime(time) {
+      var _a2;
+      const separator = timeConfig.valueFormat.match(/\W/)[0] || ":";
+      const parts = time.split(separator).map(Number);
+      const commonStr = `${parts[0].toString().padStart(2, "0")}${separator}${parts[1].toString().padStart(2, "0")}`;
+      if (timeConfig.valueFormat === "HH:mm") {
+        return commonStr;
+      } else if (timeConfig.valueFormat === "HH:mm:ss") {
+        return `${commonStr}${separator}${((_a2 = parts[2]) != null ? _a2 : 0).toString().padStart(2, "0")}`;
+      } else {
+        return time;
+      }
+    }
+    function updateFormattedValue() {
+      if (newValue && isDisabled(newValue))
+        return;
+      if (props.formattedValue === newValue)
+        return;
+      emit("update:formattedValue", newValue);
+      emitFormChangeWithParams({
+        oldValue: props.formattedValue
+      });
+    }
+    watch(() => props.formattedValue, (value) => {
+      newValue = value;
+      if (!value)
+        return;
+      inputValue.value = formatTime(value);
+    }, {
+      immediate: true
+    });
+    watch(() => isShow.value, async (value) => {
+      var _a2, _b, _c, _d, _e;
+      if (value) {
+        newValue = __formattedValue.value;
+        await nextTick();
+        (_e = (_d = (_c = (_b = (_a2 = timePickerRef.value) == null ? void 0 : _a2.$timePicker) == null ? void 0 : _b.panelInstRef) == null ? void 0 : _c.$el) == null ? void 0 : _d.querySelectorAll(".n-time-picker-col")) == null ? void 0 : _e.forEach((node) => {
+          var _a3, _b2;
+          return (_b2 = (_a3 = node == null ? void 0 : node.querySelector) == null ? void 0 : _a3.call(node, ".n-time-picker-col__item--active")) == null ? void 0 : _b2.scrollIntoView();
+        });
+      } else {
+        updateFormattedValue();
+      }
+    });
+    onBeforeUnmount(() => {
+      updateFormattedValue();
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(NPopover), {
+        show: isShow.value,
+        "onUpdate:show": _cache[3] || (_cache[3] = ($event) => isShow.value = $event),
+        trigger: "click",
+        showArrow: false,
+        placement: "bottom-start",
+        style: {
+          "padding": "0"
+        }
+      }, {
+        trigger: withCtx(() => [createVNode(unref(NInput), {
+          ref_key: "formRef",
+          ref: formRef,
+          clearable: "",
+          placeholder: unref(placeholder),
+          value: inputValue.value,
+          "onUpdate:value": _cache[0] || (_cache[0] = ($event) => inputValue.value = $event),
+          valueModifiers: {
+            trim: true
+          },
+          "input-props": unref(inputProps),
+          onChange,
+          onKeydown
+        }, null, 8, ["placeholder", "value", "input-props"])]),
+        default: withCtx(() => [createVNode(unref(NSpace), null, {
+          default: withCtx(() => [createVNode(unref(TimePicker), mergeProps({
+            ref_key: "timePickerRef",
+            ref: timePickerRef,
+            show: ""
+          }, unref(timeConfig), {
+            class: "iho-table__time-picker",
+            to: false,
+            "formatted-value": unref(__formattedValue),
+            "onUpdate:formatted-value": _cache[1] || (_cache[1] = ($event) => isRef(__formattedValue) ? __formattedValue.value = $event : null),
+            onConfirm: _cache[2] || (_cache[2] = () => isShow.value = false)
+          }), null, 16, ["formatted-value"]), createVNode(unref(NScrollbar), {
+            class: "iho-table__scrollbar"
+          }, {
+            default: withCtx(() => [__props.shortcutOptions.length ? (openBlock(), createBlock(unref(NSpace), {
+              key: 0,
+              vertical: "",
+              wrap: false
+            }, {
+              default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.shortcutOptions, (item) => {
+                return openBlock(), createBlock(unref(NButton), {
+                  size: "tiny",
+                  key: item,
+                  disabled: isDisabled(item),
+                  onClick: ($event) => clickShortcutOption(item)
+                }, {
+                  default: withCtx(() => [createTextVNode(toDisplayString(item), 1)]),
+                  _: 2
+                }, 1032, ["disabled", "onClick"]);
+              }), 128))]),
+              _: 1
+            })) : createCommentVNode("v-if", true)]),
+            _: 1
+          })]),
+          _: 1
+        })]),
+        _: 1
+      }, 8, ["show"]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/es/components/iho-table/src/plugins/rendererPlugins/editableWidgets/timeRendererPlugin/index.js

@@ -1 +1,88 @@
-import{createVNode as e,mergeProps as o}from"vue";import{format as r}from"date-fns";import{isFunction as t}from"lodash-es";import"../../../../../index.js";import{EDITABLE_WIDGET_TYPE as n}from"../../../../constants/index.js";import{useAutoFocus as i}from"../hooks/useAutoFocus.js";import{IhoTableRenderHelper as l,getLowCodeFieldFromField as d,isInvalidTime as m}from"../../../../utils/index.js";import u from"./editTime.vue.js";import{defineTablePlugin as a}from"../../../../hooks/useTablePlugin.js";function f(){const f="timeRendererPlugin";return a({name:f,vxe(r){r.renderer.add(n.TIME,{renderCell:l.createDefaultRenderCell(),renderEdit:l.createRenderEdit((({fieldItem:r,emitFormClick:t,row:n,column:i,$rowIndex:l})=>[e(u,o({formattedValue:n[i.field],"onUpdate:formattedValue":e=>n[i.field]=e,column:i,row:n,"row-index":l,valueFormat:r.valueFormat},r.componentProps,{onClick:t}),null)]))})},apply(e){i(e).bindAutoFocusConfig(f,n.TIME,".n-input__input-el",{after:e=>(Reflect.set(e.editRender,"autoselect",!0),e)}),e.eventHooks.onCellDblclick.tap(f,(({row:e,column:o,columnIndex:i,rowIndex:l,$rowIndex:u},a,{$table:f,emits:s})=>{var c,p,v,x;if((null==(c=o.editRender)?void 0:c.name)!==n.TIME||e[o.field])return;if(t(null==(p=a.editConfig)?void 0:p.beforeEditMethod)){if(!(null==(v=a.editConfig)?void 0:v.beforeEditMethod({row:e,column:o,columnIndex:i,rowIndex:l,$table:f,$grid:f})))return}const w=r(new Date,(null==(x=d(o))?void 0:x.valueFormat)||"HH:mm");if(m(o,w))return;const I=e[o.field];e[o.field]=w,s("formChange",{oldValue:I,index:l>-1?l:u,value:e[o.field],row:e,column:o,$table:f})}))}})}export{f as timeRendererPlugin};
+import { createVNode, mergeProps } from 'vue';
+import { format } from 'date-fns';
+import { isFunction } from 'lodash-es';
+import '../../../../../index.js';
+import { EDITABLE_WIDGET_TYPE } from '../../../../constants/index.js';
+import { useAutoFocus } from '../hooks/useAutoFocus.js';
+import { IhoTableRenderHelper, getLowCodeFieldFromField, isInvalidTime } from '../../../../utils/index.js';
+import EditTime from './editTime.vue.js';
+import { defineTablePlugin } from '../../../../hooks/useTablePlugin.js';
+
+function timeRendererPlugin() {
+  const pluginName = "timeRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(EDITABLE_WIDGET_TYPE.TIME, {
+        renderCell: IhoTableRenderHelper.createDefaultRenderCell(),
+        renderEdit: IhoTableRenderHelper.createRenderEdit(({
+          fieldItem,
+          emitFormClick,
+          row,
+          column,
+          $rowIndex
+        }) => {
+          return [createVNode(EditTime, mergeProps({
+            "formattedValue": row[column.field],
+            "onUpdate:formattedValue": ($event) => row[column.field] = $event,
+            "column": column,
+            "row": row,
+            "row-index": $rowIndex,
+            "valueFormat": fieldItem.valueFormat
+          }, fieldItem.componentProps, {
+            "onClick": emitFormClick
+          }), null)];
+        })
+      });
+    },
+    apply(hooks) {
+      useAutoFocus(hooks).bindAutoFocusConfig(pluginName, EDITABLE_WIDGET_TYPE.TIME, ".n-input__input-el", {
+        after: (fieldItem) => {
+          Reflect.set(fieldItem.editRender, "autoselect", true);
+          return fieldItem;
+        }
+      });
+      hooks.eventHooks.onCellDblclick.tap(pluginName, ({
+        row,
+        column,
+        columnIndex,
+        rowIndex,
+        $rowIndex
+      }, config, {
+        $table,
+        emits
+      }) => {
+        var _a, _b, _c, _d;
+        if (((_a = column.editRender) == null ? void 0 : _a.name) !== EDITABLE_WIDGET_TYPE.TIME || row[column.field])
+          return;
+        if (isFunction((_b = config.editConfig) == null ? void 0 : _b.beforeEditMethod)) {
+          const editable = (_c = config.editConfig) == null ? void 0 : _c.beforeEditMethod({
+            row,
+            column,
+            columnIndex,
+            rowIndex,
+            $table,
+            $grid: $table
+          });
+          if (!editable)
+            return;
+        }
+        const newValue = format(new Date(), ((_d = getLowCodeFieldFromField(column)) == null ? void 0 : _d.valueFormat) || "HH:mm");
+        if (isInvalidTime(column, newValue))
+          return;
+        const oldValue = row[column.field];
+        row[column.field] = newValue;
+        emits("formChange", {
+          oldValue,
+          index: rowIndex > -1 ? rowIndex : $rowIndex,
+          value: row[column.field],
+          row,
+          column,
+          $table
+        });
+      });
+    }
+  });
+}
+
+export { timeRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/widgets/checkRendererPlugin.js

@@ -1 +1,107 @@
-import{createVNode as e,defineComponent as l,inject as o,computed as t}from"vue";import{isNumber as n,constant as i,isString as c}from"lodash-es";import"../../../../index.js";import{NCheckbox as a}from"naive-ui";import{defineTablePlugin as d}from"../../../hooks/useTablePlugin.js";function r(){const l="checkRendererPlugin";return d({name:l,apply(o){o.fieldHooks.field.tap(l,((o,{index:t,insertBefore:c},a)=>{if(0===t&&a.selectType&&["checkbox","radio"].includes(a.selectType)){const{radioConfig:o,checkboxConfig:t={}}=a,d={width:45,align:"center",fixed:"left",..."radio"===a.selectType?o:t,field:l,type:a.selectType,annotation:!1};t.disableHeader&&(d.slots={header:()=>e("span",{class:"checkbox-cell--disable"},null),...d.slots}),t.useNCheckbox&&(d.slots={checkbox:e=>s(e,t),header:n(t.maxCheckSize)?i([]):e=>s(e,t),...d.slots}),c(d)}return o}))}})}function s(l,o){return[e(p,{payload:l,checkboxConfig:o},null)]}const p=l({name:"IhoTableNCheckbox",props:{payload:{type:Object,default:()=>({})},checkboxConfig:{type:Object,default:()=>({})}},setup(l){const n=o("$xetable");function i(e,o){var t,i,c,a;if(o.stopPropagation(),"header"===(null==(t=l.payload)?void 0:t.type))if(null==(i=l.checkboxConfig)?void 0:i.checkStrictly){const l=null==(a=null==(c=null==n?void 0:n.getComputeMaps())?void 0:c.computeCheckboxOpts)?void 0:a.value;if(!l)return;l.checkStrictly=!1,null==n||n.triggerCheckAllEvent(o,e),l.checkStrictly=!0}else null==n||n.triggerCheckAllEvent(o,e);else null==n||n.triggerCheckRowEvent(o,l.payload,e)}const d=t((()=>{var e,o;return c(null==(e=l.checkboxConfig)?void 0:e.indeterminateField)?null==(o=l.payload.row)?void 0:o[l.checkboxConfig.indeterminateField]:l.payload.indeterminate}));return()=>!1===l.payload.visible?null:e(a,{checked:l.payload.checked,"onUpdate:checked":e=>l.payload.checked=e,indeterminate:d.value,disabled:l.payload.disabled,onUpdateChecked:i},null)}});export{r as checkRendererPlugin};
+import { createVNode, defineComponent, inject, computed } from 'vue';
+import { isNumber, constant, isString } from 'lodash-es';
+import '../../../../index.js';
+import { NCheckbox } from 'naive-ui';
+import { defineTablePlugin } from '../../../hooks/useTablePlugin.js';
+
+function checkRendererPlugin() {
+  const pluginName = "checkRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    apply(hooks) {
+      hooks.fieldHooks.field.tap(pluginName, (field, {
+        index,
+        insertBefore
+      }, config) => {
+        if (index === 0 && config.selectType && ["checkbox", "radio"].includes(config.selectType)) {
+          const {
+            radioConfig,
+            checkboxConfig = {}
+          } = config;
+          const field2 = {
+            width: 45,
+            align: "center",
+            fixed: "left",
+            ...config.selectType === "radio" ? radioConfig : checkboxConfig,
+            field: pluginName,
+            type: config.selectType,
+            annotation: false
+          };
+          if (checkboxConfig.disableHeader) {
+            field2.slots = {
+              header: () => createVNode("span", {
+                "class": "checkbox-cell--disable"
+              }, null),
+              ...field2.slots
+            };
+          }
+          if (checkboxConfig.useNCheckbox) {
+            field2.slots = {
+              checkbox: (payload) => renderNCheckbox(payload, checkboxConfig),
+              header: isNumber(checkboxConfig.maxCheckSize) ? constant([]) : (payload) => renderNCheckbox(payload, checkboxConfig),
+              ...field2.slots
+            };
+          }
+          insertBefore(field2);
+        }
+        return field;
+      });
+    }
+  });
+}
+function renderNCheckbox(payload, checkboxConfig) {
+  return [createVNode(Checkbox, {
+    "payload": payload,
+    "checkboxConfig": checkboxConfig
+  }, null)];
+}
+const Checkbox = /* @__PURE__ */ defineComponent({
+  name: "IhoTableNCheckbox",
+  props: {
+    payload: {
+      type: Object,
+      default: () => ({})
+    },
+    checkboxConfig: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  setup(props) {
+    const $xetable = inject("$xetable");
+    function onUpdateChecked(checked, e) {
+      var _a, _b, _c, _d;
+      e.stopPropagation();
+      if (((_a = props.payload) == null ? void 0 : _a.type) === "header") {
+        if ((_b = props.checkboxConfig) == null ? void 0 : _b.checkStrictly) {
+          const checkOptions = (_d = (_c = $xetable == null ? void 0 : $xetable.getComputeMaps()) == null ? void 0 : _c.computeCheckboxOpts) == null ? void 0 : _d.value;
+          if (!checkOptions)
+            return;
+          checkOptions.checkStrictly = false;
+          $xetable == null ? void 0 : $xetable.triggerCheckAllEvent(e, checked);
+          checkOptions.checkStrictly = true;
+        } else {
+          $xetable == null ? void 0 : $xetable.triggerCheckAllEvent(e, checked);
+        }
+      } else {
+        $xetable == null ? void 0 : $xetable.triggerCheckRowEvent(e, props.payload, checked);
+      }
+    }
+    const indeterminateRef = computed(() => {
+      var _a, _b;
+      if (isString((_a = props.checkboxConfig) == null ? void 0 : _a.indeterminateField)) {
+        return (_b = props.payload.row) == null ? void 0 : _b[props.checkboxConfig.indeterminateField];
+      }
+      return props.payload.indeterminate;
+    });
+    return () => props.payload.visible === false ? null : createVNode(NCheckbox, {
+      "checked": props.payload.checked,
+      "onUpdate:checked": ($event) => props.payload.checked = $event,
+      "indeterminate": indeterminateRef.value,
+      "disabled": props.payload.disabled,
+      "onUpdateChecked": onUpdateChecked
+    }, null);
+  }
+});
+
+export { checkRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/widgets/colorRendererPlugin.js

@@ -1 +1,49 @@
-import{createVNode as e}from"vue";import"../../../../index.js";import{WIDGET_TYPE as r}from"../../../constants/index.js";import{getTitle as n,getRowHeight as o}from"../../../utils/index.js";import{defineTablePlugin as l}from"../../../hooks/useTablePlugin.js";function t(){const t={blue:"blue",sky:"skyblue",azure:"azure",palegreen:"palegreen",yellow:"yellow",darkorange:"darkorange",magenta:"magenta",purple:"purple",maroon:"maroon",orange:"orange",green:"green",red:"red",grey:"grey"};return l({name:"colorRendererPlugin",vxe(l){l.renderer.add(r.COLOR,{renderCell(r,{row:l,column:a}){const u=l[a.field];if(!u)return[];const[i,g]=u.split("-");return[e("div",{title:n(a,u),style:{background:t[g]||i,height:o()-8+"px"}},null)]}})}})}export{t as colorRendererPlugin};
+import { createVNode } from 'vue';
+import '../../../../index.js';
+import { WIDGET_TYPE } from '../../../constants/index.js';
+import { getTitle, getRowHeight } from '../../../utils/index.js';
+import { defineTablePlugin } from '../../../hooks/useTablePlugin.js';
+
+function colorRendererPlugin() {
+  const pluginName = "colorRendererPlugin";
+  const colorMap = {
+    blue: "blue",
+    sky: "skyblue",
+    azure: "azure",
+    palegreen: "palegreen",
+    yellow: "yellow",
+    darkorange: "darkorange",
+    magenta: "magenta",
+    purple: "purple",
+    maroon: "maroon",
+    orange: "orange",
+    green: "green",
+    red: "red",
+    grey: "grey"
+  };
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(WIDGET_TYPE.COLOR, {
+        renderCell(renderOpts, {
+          row,
+          column
+        }) {
+          const value = row[column.field];
+          if (!value)
+            return [];
+          const [color, alias] = value.split("-");
+          return [createVNode("div", {
+            "title": getTitle(column, value),
+            "style": {
+              background: colorMap[alias] || color,
+              height: getRowHeight() - 8 + "px"
+            }
+          }, null)];
+        }
+      });
+    }
+  });
+}
+
+export { colorRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/widgets/defaultRendererPlugin.js

@@ -1 +1,60 @@
-import{createVNode as n}from"vue";import"../../../../index.js";import{WIDGET_TYPE as e}from"../../../constants/index.js";import{parseMergeField as r,getTitle as t,isRichContent as o,parseRichContent as i}from"../../../utils/index.js";import{defineTablePlugin as l}from"../../../hooks/useTablePlugin.js";function c(){return l({name:"defaultRendererPlugin",vxe(o){o.renderer.add(e.DEFAULT,{renderCell(e,{row:o,column:i}){const l=r(o,i);return n("span",{title:String(t(i,l)),class:"iho-table__colorAndIcon"},[c(l,i)])}}),o.renderer.add(e.STATUS,o.renderer.get(e.DEFAULT))}});function c(e,r){if(!o(e))return e;const l=i(e),c=l.background||l.icon,a=c&&"#000"!==c&&"#000000"!==c&&"black"!==c&&"rgb(0, 0, 0)"!==c;return[n("span",{title:t(r,l.change_text)},[function(e){if(!e)return null;if(e.match(/#[\da-f]{6}|[\da-f]{3}/i))return n("i",{class:"icon-dot",style:{"--table-icon-color":e,"--table-icon-shadow":e}},null);return n("i",{class:l.icon},null)}(l.icon),n("i",{style:{color:c,fontWeight:a?"bold":"normal"}},[l.change_text])])]}}export{c as defaultRendererPlugin};
+import { createVNode } from 'vue';
+import '../../../../index.js';
+import { WIDGET_TYPE } from '../../../constants/index.js';
+import { parseMergeField, getTitle, isRichContent, parseRichContent } from '../../../utils/index.js';
+import { defineTablePlugin } from '../../../hooks/useTablePlugin.js';
+
+function defaultRendererPlugin() {
+  const pluginName = "defaultRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(WIDGET_TYPE.DEFAULT, {
+        renderCell(renderOpts, {
+          row,
+          column
+        }) {
+          const value = parseMergeField(row, column);
+          return createVNode("span", {
+            "title": String(getTitle(column, value)),
+            "class": "iho-table__colorAndIcon"
+          }, [renderRichContent(value, column)]);
+        }
+      });
+      instance.renderer.add(WIDGET_TYPE.STATUS, instance.renderer.get(WIDGET_TYPE.DEFAULT));
+    }
+  });
+  function renderRichContent(content, column) {
+    if (!isRichContent(content))
+      return content;
+    const parsedContent = parseRichContent(content);
+    const color = parsedContent.background || parsedContent.icon;
+    const bold = color && color !== "#000" && color !== "#000000" && color !== "black" && color !== "rgb(0, 0, 0)";
+    return [createVNode("span", {
+      "title": getTitle(column, parsedContent.change_text)
+    }, [renderIcon(parsedContent.icon), createVNode("i", {
+      "style": {
+        color,
+        fontWeight: bold ? "bold" : "normal"
+      }
+    }, [parsedContent.change_text])])];
+    function renderIcon(icon) {
+      if (!icon)
+        return null;
+      if (icon.match(/#[\da-f]{6}|[\da-f]{3}/i)) {
+        return createVNode("i", {
+          "class": "icon-dot",
+          "style": {
+            "--table-icon-color": icon,
+            "--table-icon-shadow": icon
+          }
+        }, null);
+      }
+      return createVNode("i", {
+        "class": parsedContent.icon
+      }, null);
+    }
+  }
+}
+
+export { defaultRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/widgets/htmlRendererPlugin.js

@@ -1 +1,48 @@
-import{createVNode as e}from"vue";import{isString as r}from"lodash-es";import{NTooltip as o}from"naive-ui";import"../../../../index.js";import{WIDGET_TYPE as n}from"../../../constants/index.js";import{getLowCodeFieldFromField as l,IhoTableUtils as i}from"../../../utils/index.js";import{defineTablePlugin as t}from"../../../hooks/useTablePlugin.js";function s(){const s="htmlRendererPlugin";return t({name:s,vxe(l){l.renderer.add(n.HTML,{renderCell(n,{row:l,column:i}){const t=l[i.field];return t&&r(t)?[e(o,null,{trigger:()=>e("span",{class:"iho-table__htmlRender iho-table__colorAndIcon",innerHTML:t},null),default:()=>e("div",{innerHTML:t},null)})]:[]}})},apply(e){e.fieldHooks.field.tap(s,(e=>{const r=l(e);return r?(i.getCellType(r)===n.HTML&&(e.showOverflow="ellipsis"),e):e}))}})}export{s as htmlRendererPlugin};
+import { createVNode } from 'vue';
+import { isString } from 'lodash-es';
+import { NTooltip } from 'naive-ui';
+import '../../../../index.js';
+import { WIDGET_TYPE } from '../../../constants/index.js';
+import { getLowCodeFieldFromField, IhoTableUtils } from '../../../utils/index.js';
+import { defineTablePlugin } from '../../../hooks/useTablePlugin.js';
+
+function htmlRendererPlugin() {
+  const pluginName = "htmlRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(WIDGET_TYPE.HTML, {
+        renderCell(renderOpts, {
+          row,
+          column
+        }) {
+          const value = row[column.field];
+          if (!value || !isString(value))
+            return [];
+          return [createVNode(NTooltip, null, {
+            trigger: () => createVNode("span", {
+              "class": "iho-table__htmlRender iho-table__colorAndIcon",
+              "innerHTML": value
+            }, null),
+            default: () => createVNode("div", {
+              "innerHTML": value
+            }, null)
+          })];
+        }
+      });
+    },
+    apply(hooks) {
+      hooks.fieldHooks.field.tap(pluginName, (field) => {
+        const lowCodeField = getLowCodeFieldFromField(field);
+        if (!lowCodeField)
+          return field;
+        if (IhoTableUtils.getCellType(lowCodeField) === WIDGET_TYPE.HTML) {
+          field.showOverflow = "ellipsis";
+        }
+        return field;
+      });
+    }
+  });
+}
+
+export { htmlRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/widgets/labelRendererPlugin.js

@@ -1 +1,56 @@
-import{createVNode as e}from"vue";import{jsonParse as r}from"../../../../../../shared/utils/index.js";import{isArray as l,isString as o}from"lodash-es";import"../../../../index.js";import{WIDGET_TYPE as t}from"../../../constants/index.js";import{getTitle as n}from"../../../utils/index.js";import{defineTablePlugin as a}from"../../../hooks/useTablePlugin.js";function i(){return a({name:"labelRendererPlugin",vxe(a){a.renderer.add(t.LABEL,{renderCell(t,{row:a,column:i}){try{if(!a[i.field])return[];const t=r(a[i.field]),m=l(t.labels)?t.labels:(s=t.labelStr,o(s)?s.split(",").map((e=>({labelName:e}))):[]);return e("span",{title:n(i,m.map((e=>e.labelName)).join(",")),style:{display:"flex"},class:"iho-table__colorAndIcon"},[m.map((function(r){return e("span",{style:{backgroundColor:r.color||"#5585f5",color:"white",flex:"1"}},[r.labelName])}))])}catch(e){return[]}var s}})}})}export{i as labelRendererPlugin};
+import { createVNode } from 'vue';
+import { jsonParse } from '../../../../../../shared/utils/index.js';
+import { isArray, isString } from 'lodash-es';
+import '../../../../index.js';
+import { WIDGET_TYPE } from '../../../constants/index.js';
+import { getTitle } from '../../../utils/index.js';
+import { defineTablePlugin } from '../../../hooks/useTablePlugin.js';
+
+function labelRendererPlugin() {
+  const pluginName = "labelRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(WIDGET_TYPE.LABEL, {
+        renderCell(renderOpts, {
+          row,
+          column
+        }) {
+          try {
+            if (!row[column.field])
+              return [];
+            const value = jsonParse(row[column.field]);
+            const labels = isArray(value.labels) ? value.labels : parseLabelString(value.labelStr);
+            return createVNode("span", {
+              "title": getTitle(column, labels.map((labelItem) => labelItem.labelName).join(",")),
+              "style": {
+                display: "flex"
+              },
+              "class": "iho-table__colorAndIcon"
+            }, [labels.map(renderLabelItem)]);
+          } catch (e) {
+            return [];
+          }
+          function parseLabelString(str) {
+            if (!isString(str))
+              return [];
+            return str.split(",").map((s) => ({
+              labelName: s
+            }));
+          }
+          function renderLabelItem(item) {
+            return createVNode("span", {
+              "style": {
+                backgroundColor: item.color || "#5585f5",
+                color: "white",
+                flex: "1"
+              }
+            }, [item.labelName]);
+          }
+        }
+      });
+    }
+  });
+}
+
+export { labelRendererPlugin };