@ibiz-template/vue3-components 0.4.8-dev.0 → 0.4.8

package/es/control/grid/grid-column/grid-field-edit-column/cell-edit.mjs

@@ -0,0 +1,76 @@
+import { useClickOutside } from '@ibiz-template/vue3-util';
+import { computed, reactive } from 'vue';
+
+"use strict";
+function useCellEdit(props, componentRef) {
+  const c = props.controller;
+  const disabled = computed(() => {
+    return props.row.editColStates[c.fieldName].disabled;
+  });
+  const readonly = computed(() => {
+    return props.row.editColStates[c.fieldName].readonly;
+  });
+  const hasError = computed(() => !!props.row.errors[c.fieldName]);
+  const editable = computed(
+    () => props.row.editColStates[c.fieldName].editable
+  );
+  const setEditable = (flag) => {
+    props.row.editColStates[c.fieldName].editable = flag;
+  };
+  const cellEditable = computed(() => {
+    return !disabled.value && !readonly.value && !hasError.value;
+  });
+  const editorShowEdit = computed(() => {
+    return hasError.value || cellEditable.value && editable.value;
+  });
+  const editorReadOnly = computed(() => {
+    return !editorShowEdit.value;
+  });
+  const editorDisabled = false;
+  const isAutoFocus = true;
+  const showEditMask = computed(() => {
+    return cellEditable.value && !editable.value;
+  });
+  const stopPropagation = computed(() => {
+    return cellEditable.value;
+  });
+  let funcs;
+  const onMaskClick = () => {
+    setEditable(true);
+    funcs = useClickOutside(componentRef, async (_evt) => {
+      setEditable(false);
+      funcs.stop();
+    });
+  };
+  const onFocus = () => {
+    if (funcs) {
+      funcs.stop();
+    }
+    ibiz.log.debug(`${c.fieldName}\u5C5E\u6027\u7F16\u8F91\u5668focus\u4E8B\u4EF6`);
+  };
+  const onBlur = () => {
+    ibiz.log.debug(`${c.fieldName}\u5C5E\u6027\u7F16\u8F91\u5668blur\u4E8B\u4EF6`);
+    setEditable(false);
+    if (ibiz.config.grid.editSaveMode === "cell-blur") {
+      c.grid.save(props.row.data);
+    }
+  };
+  const gridEditItemProps = reactive({
+    showEditMask,
+    stopPropagation,
+    onMaskClick
+  });
+  const editorProps = reactive({
+    autoFocus: isAutoFocus,
+    disabled: editorDisabled,
+    readonly: editorReadOnly,
+    onBlur,
+    onFocus
+  });
+  return {
+    gridEditItemProps,
+    editorProps
+  };
+}
+
+export { useCellEdit };

package/es/control/grid/grid-column/grid-field-edit-column/grid-edit-item/grid-edit-item.css

@@ -0,0 +1 @@
+.ibiz-grid-edit-item{--ibiz-grid-edit-item-cell-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-form-item-label-color:var(--ibiz-color-text-1);--ibiz-form-item-text-color:var(--ibiz-color-text-2);--ibiz-form-item-hover-color:var(--ibiz-color-text-0);--ibiz-form-item-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-form-item-readonly-color:var(--ibiz-color-disabled-text);--ibiz-form-item-border-color:transparent;--ibiz-form-item-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-placeholder-color:var(--ibiz-color-text-3);--ibiz-form-item-disabled-color:var(--ibiz-color-disabled-text);--ibiz-form-item-disabled-bg-color:var(--ibiz-color-disabled-fill);--ibiz-form-item-disabled-border-color:var(--ibiz-color-disabled-border);--ibiz-form-item-active-bg:var(--ibiz-color-fill-2);--ibiz-form-item-active-border:var(--ibiz-active-bg);--ibiz-form-item-focus-bg:var(--ibiz-color-fill-0);--ibiz-form-item-focus-border:var(--ibiz-color-focus-border);--ibiz-form-item-line-height:var(--ibiz-editor-default-line-height);--ibiz-form-item-font-weight:var(--ibiz-font-weight-regular);width:100%;height:100%}.ibiz-grid-edit-item.is-error .ibiz-grid-edit-item__tooltip{border:1px solid red}.ibiz-grid-edit-item__tooltip{display:flex;align-items:center;justify-content:var(--ibiz-grid-column-justify-content);width:100%;height:100%;padding:var(--ibiz-spacing-tight);text-align:var(--ibiz-grid-column-text-align)}.ibiz-grid-edit-item .ibiz-checkbox--readonly,.ibiz-grid-edit-item .ibiz-date-picker--readonly,.ibiz-grid-edit-item .ibiz-dropdown--readonly,.ibiz-grid-edit-item .ibiz-input--readonly,.ibiz-grid-edit-item .ibiz-mpicker--readonly,.ibiz-grid-edit-item .ibiz-picker--readonly,.ibiz-grid-edit-item .ibiz-picker-dropdown--readonly,.ibiz-grid-edit-item .ibiz-radio--readonly,.ibiz-grid-edit-item .ibiz-span--readonly{color:var(--ibiz-color-text-0)}.ibiz-grid-edit-item--show-mask:hover{cursor:pointer;background-color:var(--ibiz-grid-edit-item-cell-hover-bg-color)}.ibiz-grid-edit-item .ibiz-input{height:auto}

package/es/control/grid/grid-column/grid-field-edit-column/grid-edit-item/grid-edit-item.mjs

@@ -0,0 +1,81 @@
+import { computed, resolveComponent, createVNode, defineComponent } from 'vue';
+import { useNamespace } from '@ibiz-template/vue3-util';
+import './grid-edit-item.css';
+
+"use strict";
+const IBizGridEditItem = /* @__PURE__ */ defineComponent({
+  name: "IBizGridEditItem",
+  props: {
+    required: {
+      type: Boolean,
+      default: false
+    },
+    showEditMask: {
+      type: Boolean,
+      default: false
+    },
+    stopPropagation: {
+      type: Boolean,
+      default: false
+    },
+    error: {
+      type: String
+    }
+  },
+  emits: {
+    maskClick: (_event) => true
+  },
+  setup(props, {
+    emit
+  }) {
+    const ns = useNamespace("grid-edit-item");
+    const onStopPropagation = (e) => {
+      if (props.stopPropagation) {
+        e.stopPropagation();
+      }
+    };
+    const onClick = (e) => {
+      if (props.stopPropagation) {
+        e.stopPropagation();
+      }
+      if (props.showEditMask) {
+        emit("maskClick", e);
+      }
+    };
+    const showTooltip = computed(() => {
+      return props.error;
+    });
+    const tooltipContent = computed(() => {
+      return props.error;
+    });
+    return {
+      ns,
+      tooltipContent,
+      showTooltip,
+      onClick,
+      onStopPropagation
+    };
+  },
+  render() {
+    return createVNode("div", {
+      "class": [this.ns.b(), this.ns.is("error", !!this.error), this.showEditMask && this.ns.m("show-mask")],
+      "onDblclick": this.onStopPropagation,
+      "onClick": this.onClick
+    }, [createVNode(resolveComponent("el-tooltip"), {
+      "content": this.tooltipContent,
+      "disabled": !this.showTooltip,
+      "transfer": true,
+      "transfer-class-name": this.ns.e("tooltip-popper"),
+      "placement": "top"
+    }, {
+      default: () => {
+        var _a, _b;
+        return [createVNode("div", {
+          "class": this.ns.e("tooltip")
+        }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)])];
+      }
+    })]);
+  }
+});
+
+export { IBizGridEditItem, IBizGridEditItem as default };

package/es/control/grid/grid-column/grid-field-edit-column/grid-field-edit-column.css

@@ -0,0 +1 @@
+.ibiz-grid-field-edit-column--ellipsis .ibiz-grid-field-edit-column__editor{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-grid-field-edit-column--wrap .ibiz-grid-field-edit-column__editor{word-break:break-word;white-space:pre-wrap}

package/es/control/grid/grid-column/grid-field-edit-column/grid-field-edit-column.mjs

@@ -0,0 +1,101 @@
+import { ref, computed, resolveComponent, h, createVNode, defineComponent } from 'vue';
+import { useNamespace } from '@ibiz-template/vue3-util';
+import { RuntimeError } from '@ibiz-template/core';
+import { GridFieldEditColumnController, GridRowState } from '@ibiz-template/runtime';
+import { isNil } from 'ramda';
+import { useCellEdit } from './cell-edit.mjs';
+import { useRowEdit } from './row-edit.mjs';
+import { useAllEdit } from './all-edit.mjs';
+import './grid-field-edit-column.css';
+
+"use strict";
+const GridFieldEditColumn = /* @__PURE__ */ defineComponent({
+  name: "IBizGridFieldEditColumn",
+  props: {
+    controller: {
+      type: GridFieldEditColumnController,
+      required: true
+    },
+    row: {
+      type: GridRowState,
+      required: true
+    }
+  },
+  setup(props) {
+    const ns = useNamespace("grid-field-edit-column");
+    const componentRef = ref();
+    const c = props.controller;
+    const fieldName = c.editItem.codeName;
+    const rowDataChange = async (val, name) => {
+      ibiz.log.debug(`${fieldName}\u503C\u53D8\u66F4`, val);
+      await c.setRowValue(props.row, val, name);
+    };
+    const useByShowMode = () => {
+      switch (ibiz.config.grid.editShowMode) {
+        case "cell":
+          return useCellEdit(props, componentRef);
+        case "row":
+          return useRowEdit(props, componentRef);
+        case "all":
+          return useAllEdit(props, componentRef);
+        default:
+          throw new RuntimeError(`${ibiz.config.grid.editShowMode}\u6682\u672A\u652F\u6301`);
+      }
+    };
+    const {
+      gridEditItemProps,
+      editorProps
+    } = useByShowMode();
+    const infoText = ref(void 0);
+    const onInfoTextChange = (text) => {
+      infoText.value = text;
+    };
+    const tooltip = computed(() => {
+      if (!editorProps.readonly) {
+        return void 0;
+      }
+      if (isNil(infoText.value)) {
+        const val = props.row.data[fieldName];
+        return c.formatValue(val);
+      }
+      return infoText.value;
+    });
+    return {
+      ns,
+      c,
+      fieldName,
+      componentRef,
+      tooltip,
+      rowDataChange,
+      onInfoTextChange,
+      gridEditItemProps,
+      editorProps
+    };
+  },
+  render() {
+    var _a;
+    const val = this.row.data[this.fieldName];
+    return createVNode(resolveComponent("iBizGridEditItem"), {
+      ref: "componentRef",
+      required: !this.c.editItem.allowEmpty,
+      error: this.row.errors[this.fieldName],
+      overflowMode: this.controller.grid.overflowMode,
+      class: [this.ns, this.ns.m(this.c.grid.overflowMode), (_a = this.controller.model.cellSysCss) == null ? void 0 : _a.cssName],
+      ...this.gridEditItemProps
+    }, {
+      default: () => [this.c.editorProvider && h(resolveComponent(this.c.editorProvider.gridEditor), {
+        class: this.ns.e("editor"),
+        value: this.editorProps.readonly ? this.c.formatValue(val) : val,
+        data: this.row.data,
+        controller: this.c.editor,
+        overflowMode: this.c.grid.overflowMode,
+        onChange: this.rowDataChange,
+        onInfoTextChange: this.onInfoTextChange,
+        title: this.tooltip,
+        ...this.editorProps
+      })]
+    });
+  }
+});
+
+export { GridFieldEditColumn, GridFieldEditColumn as default };

package/es/control/grid/grid-column/grid-field-edit-column/grid-field-edit-column.provider.mjs

@@ -0,0 +1,21 @@
+import { GridFieldEditColumnController } from '@ibiz-template/runtime';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class GridFieldEditColumnProvider {
+  constructor() {
+    __publicField(this, "component", "IBizGridFieldEditColumn");
+  }
+  async createController(columnModel, grid) {
+    const c = new GridFieldEditColumnController(columnModel, grid);
+    await c.init();
+    return c;
+  }
+}
+
+export { GridFieldEditColumnProvider };

package/es/control/grid/grid-column/grid-field-edit-column/index.mjs

@@ -0,0 +1,20 @@
+import { registerGridColumnProvider } from '@ibiz-template/runtime';
+import { withInstall } from '@ibiz-template/vue3-util';
+import { GridFieldEditColumn } from './grid-field-edit-column.mjs';
+import { GridFieldEditColumnProvider } from './grid-field-edit-column.provider.mjs';
+import { IBizGridEditItem } from './grid-edit-item/grid-edit-item.mjs';
+
+"use strict";
+const IBizGridFieldEditColumn = withInstall(
+  GridFieldEditColumn,
+  function(v) {
+    v.component(GridFieldEditColumn.name, GridFieldEditColumn);
+    v.component(IBizGridEditItem.name, IBizGridEditItem);
+    registerGridColumnProvider(
+      "DEFGRIDCOLUMN_EDIT",
+      () => new GridFieldEditColumnProvider()
+    );
+  }
+);
+
+export { IBizGridFieldEditColumn, IBizGridFieldEditColumn as default };

package/es/control/grid/grid-column/grid-field-edit-column/row-edit.mjs

@@ -0,0 +1,37 @@
+import { computed, reactive } from 'vue';
+
+"use strict";
+function useRowEdit(props, _componentRef) {
+  const c = props.controller;
+  const disabled = computed(() => {
+    return props.row.editColStates[c.fieldName].disabled;
+  });
+  const readonly = computed(() => {
+    return props.row.editColStates[c.fieldName].readonly;
+  });
+  const editable = computed(
+    () => props.row.editColStates[c.fieldName].editable
+  );
+  const editorReadOnly = computed(() => {
+    return readonly.value || !editable.value;
+  });
+  const editorDisabled = computed(() => {
+    return editable.value && disabled.value;
+  });
+  const stopPropagation = computed(() => {
+    return editable.value;
+  });
+  const gridEditItemProps = reactive({
+    stopPropagation
+  });
+  const editorProps = reactive({
+    disabled: editorDisabled,
+    readonly: editorReadOnly
+  });
+  return {
+    gridEditItemProps,
+    editorProps
+  };
+}
+
+export { useRowEdit };

package/es/control/grid/grid-column/grid-group-column/grid-group-column.mjs

@@ -0,0 +1,31 @@
+import { createVNode, defineComponent } from 'vue';
+import { useNamespace } from '@ibiz-template/vue3-util';
+import { GridGroupColumnController, GridRowState } from '@ibiz-template/runtime';
+
+"use strict";
+const GridGroupColumn = /* @__PURE__ */ defineComponent({
+  name: "IBizGridGroupColumn",
+  props: {
+    controller: {
+      type: GridGroupColumnController,
+      required: true
+    },
+    row: {
+      type: GridRowState,
+      required: true
+    }
+  },
+  setup() {
+    const ns = useNamespace("grid-group-column");
+    return {
+      ns
+    };
+  },
+  render() {
+    return createVNode("div", {
+      "class": [this.ns.b()]
+    }, null);
+  }
+});
+
+export { GridGroupColumn, GridGroupColumn as default };

package/es/control/grid/grid-column/grid-group-column/grid-group-column.provider.mjs

@@ -0,0 +1,21 @@
+import { GridGroupColumnController } from '@ibiz-template/runtime';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class GridGroupColumnProvider {
+  constructor() {
+    __publicField(this, "component", "");
+  }
+  async createController(columnModel, grid) {
+    const c = new GridGroupColumnController(columnModel, grid);
+    await c.init();
+    return c;
+  }
+}
+
+export { GridGroupColumnProvider };

package/es/control/grid/grid-column/grid-group-column/index.mjs

@@ -0,0 +1,14 @@
+import { registerGridColumnProvider } from '@ibiz-template/runtime';
+import { withInstall } from '@ibiz-template/vue3-util';
+import { GridGroupColumn } from './grid-group-column.mjs';
+import { GridGroupColumnProvider } from './grid-group-column.provider.mjs';
+
+"use strict";
+const IBizGridGroupColumn = withInstall(GridGroupColumn, () => {
+  registerGridColumnProvider(
+    "GROUPGRIDCOLUMN",
+    () => new GridGroupColumnProvider()
+  );
+});
+
+export { IBizGridGroupColumn, IBizGridGroupColumn as default };

package/es/control/grid/grid-column/grid-ua-column/grid-ua-column.css

@@ -0,0 +1 @@
+.ibiz-grid-ua-column{--ibiz-grid-ua-column-cell-padding:var(--ibiz-spacing-tight);--ibiz-grid-ua-column-btn-bg-color:transparent;--ibiz-grid-ua-column-btn-hover-color:var(--ibiz-color-primary-hover);--ibiz-grid-ua-column-btn-color:var(--ibiz-color-primary);--ibiz-grid-ua-column-font-size:var(--ibiz-font-size-regular);--ibiz-grid-ua-column-font-weight:var(--ibiz-font-weight-regular);display:flex;align-items:center;justify-content:var(--ibiz-grid-column-text-align);width:100%;height:100%;padding:var(--ibiz-grid-ua-column-cell-padding)}.ibiz-grid-ua-column .el-button{font-size:var(--ibiz-grid-ua-column-font-size);font-weight:var(--ibiz-grid-ua-column-font-weight);color:var(--ibiz-grid-ua-column-btn-color);background-color:var(--ibiz-grid-ua-column-btn-bg-color);box-shadow:none}.ibiz-grid-ua-column .el-button:hover{color:var(--ibiz-grid-ua-column-btn-hover-color)}.ibiz-grid-ua-column .el-button.is-text:not(.is-disabled):hover{background-color:var(--ibiz-grid-ua-column-btn-bg-color)}

package/es/control/grid/grid-column/grid-ua-column/grid-ua-column.mjs

@@ -0,0 +1,47 @@
+import { resolveComponent, createVNode, defineComponent } from 'vue';
+import { useNamespace } from '@ibiz-template/vue3-util';
+import './grid-ua-column.css';
+import { GridUAColumnController, GridRowState } from '@ibiz-template/runtime';
+
+"use strict";
+const GridUAColumn = /* @__PURE__ */ defineComponent({
+  name: "IBizGridUAColumn",
+  props: {
+    controller: {
+      type: GridUAColumnController,
+      required: true
+    },
+    row: {
+      type: GridRowState,
+      required: true
+    }
+  },
+  setup(props) {
+    const ns = useNamespace("grid-ua-column");
+    const onStopPropagation = (e) => {
+      e.stopPropagation();
+    };
+    const onActionClick = async (detail, event) => {
+      await props.controller.onActionClick(detail, props.row, event);
+    };
+    return {
+      ns,
+      onStopPropagation,
+      onActionClick
+    };
+  },
+  render() {
+    var _a, _b, _c;
+    return createVNode("div", {
+      "class": [this.ns.b(), (_a = this.controller.model.cellSysCss) == null ? void 0 : _a.cssName],
+      "onDblclick": this.onStopPropagation,
+      "onClick": this.onStopPropagation
+    }, [((_c = (_b = this.controller.model.deuiactionGroup) == null ? void 0 : _b.uiactionGroupDetails) == null ? void 0 : _c.length) && createVNode(resolveComponent("iBizActionToolbar"), {
+      "action-details": this.controller.model.deuiactionGroup.uiactionGroupDetails,
+      "actions-state": this.row.uaColStates[this.controller.model.codeName],
+      "onActionClick": this.onActionClick
+    }, null)]);
+  }
+});
+
+export { GridUAColumn, GridUAColumn as default };

package/es/control/grid/grid-column/grid-ua-column/grid-ua-column.provider.mjs

@@ -0,0 +1,21 @@
+import { GridUAColumnController } from '@ibiz-template/runtime';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class GridUAColumnProvider {
+  constructor() {
+    __publicField(this, "component", "IBizGridUAColumn");
+  }
+  async createController(columnModel, grid) {
+    const c = new GridUAColumnController(columnModel, grid);
+    await c.init();
+    return c;
+  }
+}
+
+export { GridUAColumnProvider };

package/es/control/grid/grid-column/grid-ua-column/index.mjs

@@ -0,0 +1,12 @@
+import { registerGridColumnProvider } from '@ibiz-template/runtime';
+import { withInstall } from '@ibiz-template/vue3-util';
+import { GridUAColumn } from './grid-ua-column.mjs';
+import { GridUAColumnProvider } from './grid-ua-column.provider.mjs';
+
+"use strict";
+const IBizGridUAColumn = withInstall(GridUAColumn, function(v) {
+  v.component(GridUAColumn.name, GridUAColumn);
+  registerGridColumnProvider("UAGRIDCOLUMN", () => new GridUAColumnProvider());
+});
+
+export { IBizGridUAColumn, IBizGridUAColumn as default };

package/es/control/grid/grid-column/index.mjs

@@ -0,0 +1,6 @@
+export { IBizGridFieldColumn } from './grid-field-column/index.mjs';
+export { IBizGridUAColumn } from './grid-ua-column/index.mjs';
+export { IBizGridFieldEditColumn } from './grid-field-edit-column/index.mjs';
+export { IBizGridGroupColumn } from './grid-group-column/index.mjs';
+
+"use strict";

package/es/control/grid/index.mjs

@@ -0,0 +1,9 @@
+export { IBizGridControl } from './grid/index.mjs';
+import './grid-column/index.mjs';
+export { useAppGridBase, useAppGridPagination, useITableEvent } from './grid/grid-control.util.mjs';
+export { IBizGridFieldColumn } from './grid-column/grid-field-column/index.mjs';
+export { IBizGridUAColumn } from './grid-column/grid-ua-column/index.mjs';
+export { IBizGridFieldEditColumn } from './grid-column/grid-field-edit-column/index.mjs';
+export { IBizGridGroupColumn } from './grid-column/grid-group-column/index.mjs';
+
+"use strict";

package/es/control/grid/row-edit-popover/row-edit-popover.css

@@ -0,0 +1 @@
+.ibiz-row-edit-popover{position:absolute;z-index:2;padding:9px 16px;background-color:var(--ibiz-control-grid-row-edit-bg-color)}.ibiz-row-edit-popover.is-hidden{top:-9999px;left:-9999px;z-index:-9999}.ibiz-row-edit-popover::before{position:absolute;top:0;left:-50px;width:0;height:0;content:"";border-color:transparent var(--ibiz-control-grid-row-edit-bg-color) transparent transparent;border-style:solid;border-width:0 50px 50px 0}.ibiz-row-edit-popover::after{position:absolute;top:0;right:-50px;width:0;height:0;content:"";border-color:transparent transparent transparent var(--ibiz-control-grid-row-edit-bg-color);border-style:solid;border-width:0 0 50px 50px}.row-edit-popover__placeholder{height:50px}

package/es/control/grid/row-edit-popover/row-edit-popover.mjs

@@ -0,0 +1,63 @@
+import { ref, resolveComponent, createTextVNode, createVNode, defineComponent } from 'vue';
+import { useNamespace, useEventListener } from '@ibiz-template/vue3-util';
+import './row-edit-popover.css';
+
+"use strict";
+const IBizRowEditPopover = /* @__PURE__ */ defineComponent({
+  name: "IBizRowEditPopover",
+  props: {
+    show: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: {
+    confirm: () => true,
+    cancel: () => true
+  },
+  setup(props, {
+    emit
+  }) {
+    const ns = useNamespace("row-edit-popover");
+    const onCancel = () => {
+      emit("cancel");
+    };
+    const onConfirm = () => {
+      emit("confirm");
+    };
+    const componentRef = ref(document);
+    useEventListener(
+      componentRef,
+      "keydown",
+      (evt) => {
+        if (props.show && evt.key === "Escape") {
+          onCancel();
+        }
+      },
+      {
+        capture: true
+      }
+      // 捕获防止内部ui拦截点击事件
+    );
+    return {
+      ns,
+      onCancel,
+      onConfirm
+    };
+  },
+  render() {
+    return createVNode("div", {
+      "class": [this.ns.b(), this.ns.is("hidden", !this.show)]
+    }, [createVNode(resolveComponent("el-button"), {
+      "onClick": this.onConfirm
+    }, {
+      default: () => [createTextVNode("\u786E\u5B9A")]
+    }), createVNode(resolveComponent("el-button"), {
+      "onClick": this.onCancel
+    }, {
+      default: () => [createTextVNode("\u53D6\u6D88")]
+    })]);
+  }
+});
+
+export { IBizRowEditPopover };