ocpview-pro 0.1.3 → 0.1.5

package/dist/index.js

@@ -6,7 +6,7 @@ import md5 from "js-md5";
 import * as XLSX from "xlsx";
 import * as XLSXS from "xlsx-style-vite";
 import { saveAs } from "file-saver";
-import { watch, effectScope, reactive, computed, resolveComponent, openBlock, createElementBlock, normalizeStyle, createVNode, withCtx, withDirectives, createTextVNode, toDisplayString, vShow, createCommentVNode, Fragment, createBlock, renderList, createElementVNode, withKeys, withModifiers, renderSlot, createSlots, normalizeClass, defineComponent, onMounted, onBeforeUnmount, ref, nextTick, h as h$1, toRaw, unref, resolveDynamicComponent, mergeProps, normalizeProps, guardReactiveProps, shallowRef, watchEffect, inject, createApp, Teleport, provide, onUnmounted, TransitionGroup, getCurrentInstance, onActivated, onDeactivated } from "vue";
+import { watch, effectScope, reactive, computed, resolveComponent, openBlock, createElementBlock, normalizeStyle, createVNode, withCtx, withDirectives, createTextVNode, toDisplayString, vShow, createCommentVNode, Fragment, createBlock, renderList, createElementVNode, withKeys, withModifiers, renderSlot, createSlots, normalizeClass, defineComponent, onMounted, onBeforeUnmount, ref, nextTick, h as h$1, toRaw, unref, resolveDynamicComponent, mergeProps, toHandlers, normalizeProps, guardReactiveProps, shallowRef, watchEffect, inject, createApp, Teleport, provide, onUnmounted, TransitionGroup, getCurrentInstance, onActivated, onDeactivated } from "vue";
 import elementResizeDetectorMaker from "element-resize-detector";
 import pako, { gzip } from "pako";
 import Viewer from "viewerjs";
@@ -453,7 +453,7 @@ common.initEview = function(ViewUI2) {
   common.initAnchor(ViewUI2.Anchor);
 };
 const name = "ocpview-pro";
-const version$2 = "0.1.3";
+const version$2 = "0.1.4";
 const title = "ocpviewPlus";
 const description = "A high quality Service UI components Library with Vue.js";
 const homepage = "";
@@ -23191,15 +23191,15 @@ function _sfc_render$13(_ctx, _cache, $props, $setup, $data, $options) {
   });
 }
 var FormCardBox2 = /* @__PURE__ */ _export_sfc$1(_sfc_main$1a, [["render", _sfc_render$13]]);
+var showtext_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _sfc_main$19 = {
   name: "showText",
   data() {
     return {
       showTooltip: false,
-      labeltext: "",
-      showIcon: false,
-      iconWidth: 0,
-      textLink: false
+      tooltipDisabled: true,
+      tooltipTimer: null,
+      hasOverflow: false
     };
   },
   props: {
@@ -23221,26 +23221,89 @@ const _sfc_main$19 = {
     },
     config: {
       type: Object,
-      default: () => {
-      }
+      default: () => ({})
     },
     rowIndex: {
       type: [String, Number],
       default: ""
     }
   },
-  created() {
-    if (this.config && this.config.textLink !== void 0) {
-      this.textLink = this.config.textLink;
+  computed: {
+    labeltext() {
+      return this.label;
+    },
+    textLink() {
+      return !!(this.config && this.config.textLink);
+    },
+    displayText() {
+      if (this.resetText) {
+        return this.resetText(
+          this.doSpecialSymbols(this.label),
+          this.label
+        );
+      }
+      return this.doSpecialSymbols(this.label);
+    }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.checkOverflow();
+      this.setupResizeObserver();
+    });
+  },
+  beforeUnmount() {
+    if (this.tooltipTimer) {
+      clearTimeout(this.tooltipTimer);
+      this.tooltipTimer = null;
+    }
+    if (this.resizeObserver) {
+      this.resizeObserver.disconnect();
+      this.resizeObserver = null;
+    }
+    if (this.checkOverflowDebounced) {
+      this.checkOverflowDebounced.cancel();
+      this.checkOverflowDebounced = null;
     }
   },
   methods: {
+    checkOverflow() {
+      const content2 = this.$refs.content;
+      this.hasOverflow = !!(content2 && content2.scrollWidth > content2.offsetWidth);
+    },
+    setupResizeObserver() {
+      const content2 = this.$refs.content;
+      if (!content2 || !window.ResizeObserver)
+        return;
+      this.checkOverflowDebounced = this.$utils.debounce(
+        this.checkOverflow,
+        150
+      );
+      this.resizeObserver = new ResizeObserver(
+        this.checkOverflowDebounced
+      );
+      this.resizeObserver.observe(content2.parentElement);
+    },
     handleTooltipIn() {
-      const $content = this.$refs.content;
-      this.showTooltip = $content.scrollWidth > $content.offsetWidth;
+      if (this.tooltipTimer) {
+        clearTimeout(this.tooltipTimer);
+        this.tooltipTimer = null;
+      }
+      this.showTooltip = true;
+      this.tooltipTimer = setTimeout(() => {
+        this.tooltipDisabled = false;
+        this.tooltipTimer = null;
+      }, 300);
     },
     handleTooltipOut() {
-      this.showTooltip = false;
+      if (this.tooltipTimer) {
+        clearTimeout(this.tooltipTimer);
+        this.tooltipTimer = null;
+      }
+      this.tooltipDisabled = true;
+      this.tooltipTimer = setTimeout(() => {
+        this.showTooltip = false;
+        this.tooltipTimer = null;
+      }, 300);
     },
     doSpecialSymbols(str) {
       if (str) {
@@ -23252,67 +23315,40 @@ const _sfc_main$19 = {
       return str;
     },
     linkTo() {
-      if (this.config.onLinkTo) {
+      if (this.config && this.config.onLinkTo) {
         let obj = this.$Method.copy(this.config);
         obj.rowIndex = this.rowIndex;
         this.config.onLinkTo(obj);
       }
     }
-  },
-  watch: {
-    label: {
-      handler(data) {
-        this.labeltext = data;
-        if (this.resetText) {
-          this.showText = this.resetText(this.doSpecialSymbols(data), data);
-        } else {
-          this.showText = this.doSpecialSymbols(data);
-        }
-      },
-      immediate: true
-    }
   }
 };
-const _hoisted_1$P = ["innerHTML"];
+const _hoisted_1$P = { class: "showtext-tooltip-content" };
 const _hoisted_2$z = ["innerHTML"];
 function _sfc_render$12(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_Tooltip = resolveComponent("Tooltip");
-  return openBlock(), createBlock(_component_Tooltip, {
-    transfer: "",
-    content: $data.labeltext,
-    disabled: !$data.showTooltip,
-    "max-width": $props.maxWidth,
-    class: "ivu-table-cell-tooltip"
-  }, {
+  return openBlock(), createBlock(resolveDynamicComponent($data.showTooltip ? "Tooltip" : "div"), mergeProps($data.showTooltip ? { transfer: true, content: $options.labeltext, maxWidth: $props.maxWidth, disabled: $data.tooltipDisabled } : {}, { class: "ivu-table-cell-tooltip" }), createSlots({
     default: withCtx(() => [
-      $data.textLink ? (openBlock(), createElementBlock("a", {
-        key: 0,
-        href: "#",
-        style: { "text-decoration": "underline" },
-        onClick: _cache[2] || (_cache[2] = withModifiers((...args) => $options.linkTo && $options.linkTo(...args), ["prevent"]))
-      }, [
-        createElementVNode("span", {
-          ref: "content",
-          class: "ivu-table-cell-tooltip-content",
-          innerHTML: _ctx.showText,
-          style: normalizeStyle("text-align:" + $props.contentAlign),
-          onMouseenter: _cache[0] || (_cache[0] = (...args) => $options.handleTooltipIn && $options.handleTooltipIn(...args)),
-          onMouseleave: _cache[1] || (_cache[1] = (...args) => $options.handleTooltipOut && $options.handleTooltipOut(...args))
-        }, null, 44, _hoisted_1$P)
-      ])) : (openBlock(), createElementBlock("span", {
-        key: 1,
+      createElementVNode("span", mergeProps({
         ref: "content",
-        class: "ivu-table-cell-tooltip-content",
-        innerHTML: _ctx.showText,
-        style: normalizeStyle("text-align:" + $props.contentAlign),
-        onMouseenter: _cache[3] || (_cache[3] = (...args) => $options.handleTooltipIn && $options.handleTooltipIn(...args)),
-        onMouseleave: _cache[4] || (_cache[4] = (...args) => $options.handleTooltipOut && $options.handleTooltipOut(...args))
-      }, null, 44, _hoisted_2$z))
+        class: ["ivu-table-cell-tooltip-content", { "showtext-link": $options.textLink }],
+        innerHTML: $options.displayText,
+        style: { textAlign: $props.contentAlign, width: "100%" }
+      }, toHandlers($data.hasOverflow ? { mouseenter: $options.handleTooltipIn, mouseleave: $options.handleTooltipOut } : {}, true), {
+        onClick: _cache[0] || (_cache[0] = withModifiers(($event) => $options.textLink && $options.linkTo(), ["prevent"]))
+      }), null, 16, _hoisted_2$z)
     ]),
-    _: 1
-  }, 8, ["content", "disabled", "max-width"]);
+    _: 2
+  }, [
+    $data.showTooltip ? {
+      name: "content",
+      fn: withCtx(() => [
+        createElementVNode("span", _hoisted_1$P, toDisplayString($options.labeltext), 1)
+      ]),
+      key: "0"
+    } : void 0
+  ]), 1040);
 }
-var ShowText = /* @__PURE__ */ _export_sfc$1(_sfc_main$19, [["render", _sfc_render$12]]);
+var ShowText = /* @__PURE__ */ _export_sfc$1(_sfc_main$19, [["render", _sfc_render$12], ["__scopeId", "data-v-98a304ae"]]);
 var billimport_vue_vue_type_style_index_0_lang = "";
 const _sfc_main$18 = {
   name: "billimport",