@fangzhongya/fang-ui 0.1.18 → 0.1.20

package/dist/components/tables/common/pagin.cjs

@@ -52,7 +52,7 @@ const dataProps = {
     }
   }
 };
-const dataEmit = ["list-events", "selection"];
+const dataEmit = ["list-events", "selection", "drag", "update:value"];
 const useInit = (props2, emit, refTable, getLocale, isEl) => {
   var _a, _b;
   const loading = vue.ref(false);
@@ -75,8 +75,11 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
   const pagconfig = vue.ref(mpagconfig);
   const paginat = vue.reactive({
     is: false,
+    // 跨页多选
     cross: false,
+    // 前端分页
     front: false,
+    // 滚动加载
     scroll: false,
     current: 1,
     pageSize: mpagconfig.pageSize,
@@ -222,24 +225,26 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
     console.log("crossPageData", crossPageData);
   }
   function getCrossPageValue(sarr, index) {
+    var _a2;
     const cross = paginat.cross;
     if (cross) {
-      if (typeof cross === "string") {
+      const rowKey = typeof cross === "string" ? cross : (_a2 = tableConfig.value.config) == null ? void 0 : _a2.rowKey;
+      if (rowKey) {
         const sv = /* @__PURE__ */ new Set();
         const is = [];
         if (sarr && index) {
           crossPageData.value.forEach((arr, i) => {
             if (i === index) {
               sarr.forEach((v) => {
-                if (!is.includes(v[cross])) {
-                  is.push(v[cross]);
+                if (!is.includes(v[rowKey])) {
+                  is.push(v[rowKey]);
                   sv.add(v);
                 }
               });
             } else {
               arr.forEach((v) => {
-                if (!is.includes(v[cross])) {
-                  is.push(v[cross]);
+                if (!is.includes(v[rowKey])) {
+                  is.push(v[rowKey]);
                   sv.add(v);
                 }
               });
@@ -247,8 +252,8 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
           });
           if (!crossPageData.value[index]) {
             sarr.forEach((v) => {
-              if (!is.includes(v[cross])) {
-                is.push(v[cross]);
+              if (!is.includes(v[rowKey])) {
+                is.push(v[rowKey]);
                 sv.add(v);
               }
             });
@@ -256,8 +261,8 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
         } else {
           crossPageData.value.forEach((arr) => {
             arr.forEach((v) => {
-              if (!is.includes(v[cross])) {
-                is.push(v[cross]);
+              if (!is.includes(v[rowKey])) {
+                is.push(v[rowKey]);
                 sv.add(v);
               }
             });
@@ -297,14 +302,16 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
     }
   }
   function toggleCrossPage() {
+    var _a2;
     const cross = paginat.cross;
     if (paginat.is && cross && !paginat.scroll) {
       const datas = data.list;
       const vs = getCrossPageValue();
-      if (typeof cross == "string") {
-        const iss = vs.map((o) => o[cross]);
+      const rowKey = typeof cross === "string" ? cross : (_a2 = tableConfig.value.config) == null ? void 0 : _a2.rowKey;
+      if (rowKey) {
+        const iss = vs.map((o) => o[rowKey]);
         const ts = datas.filter((v) => {
-          return iss.includes(v[cross]);
+          return iss.includes(v[rowKey]);
         });
         vue.nextTick(() => {
           ts.forEach((v) => {
@@ -485,7 +492,7 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
       const total = list.length;
       const c = paginat.current;
       const z = paginat.pageSize;
-      const data2 = list.slice((c - 1) * z, c * z);
+      const v = list.slice((c - 1) * z, c * z);
       const value = {};
       let ajaxData = {};
       if (typeof tableConfig.value.ajax === "object") {
@@ -493,7 +500,7 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
       }
       const l = (ajaxData == null ? void 0 : ajaxData.list) ?? mpagconfig.data.list;
       const t = (ajaxData == null ? void 0 : ajaxData.total) ?? mpagconfig.data.total;
-      objValue.setObjValue(value, l, data2);
+      objValue.setObjValue(value, l, v);
       objValue.setObjValue(value, t, total);
       obj.value = value;
     }
@@ -637,6 +644,41 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
       onChange: onScroll
     };
   });
+  function onSortable({
+    oldIndex,
+    newIndex
+  }) {
+    if (oldIndex === newIndex) return;
+    const movedItem = data.list.splice(oldIndex, 1)[0];
+    data.list.splice(newIndex, 0, movedItem);
+    if (paginat.is && paginat.front) {
+      const q = (paginat.current - 1) * paginat.pageSize;
+      const movedItem2 = props2.value.splice(q + oldIndex, 1)[0];
+      props2.value.splice(q + newIndex, 0, movedItem2);
+      if (props2.isValue) {
+        emit("update:value", props2.value);
+      }
+    } else {
+      if (props2.isValue) {
+        emit("update:value", data.list);
+      }
+    }
+    emit("drag", data.list, newIndex, oldIndex);
+  }
+  const sortable = vue.computed(() => {
+    var _a2;
+    let is = false;
+    if ((_a2 = tableConfig.value.config) == null ? void 0 : _a2.isdrag) {
+      is = true;
+    }
+    return {
+      is,
+      onEnd: onSortable
+    };
+  });
+  const datavalue = vue.computed(() => {
+    return data.list;
+  });
   setValue();
   return {
     height,
@@ -650,6 +692,7 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
     empty,
     loading,
     scroll,
+    sortable,
     onSortChange,
     onListEvents,
     onSelect,
@@ -660,7 +703,8 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
     onSizeChange,
     onCurrentChange,
     paginat,
-    data
+    data,
+    datavalue
   };
 };
 exports.dataEmit = dataEmit;

package/dist/components/tables/common/pagin.d.ts

@@ -266,6 +266,13 @@ export declare const useInit: (props: ExtractPropTypes<typeof dataProps>, emit:
         loadText: string;
         onChange: () => void;
     }>;
+    sortable: ComputedRef<{
+        is: boolean;
+        onEnd: ({ oldIndex, newIndex, }: {
+            oldIndex: number;
+            newIndex: number;
+        }) => void;
+    }>;
     onSortChange: (obj: ObjAny) => void;
     onListEvents: (...arr: any) => void;
     onSelect: (s: ObjAny, row: ObjStr) => void;
@@ -335,4 +342,5 @@ export declare const useInit: (props: ExtractPropTypes<typeof dataProps>, emit:
         total: number;
         list: ObjAny[];
     };
+    datavalue: ComputedRef<ObjAny[]>;
 };

package/dist/components/tables/common/pagin.js

@@ -50,7 +50,7 @@ const dataProps = {
     }
   }
 };
-const dataEmit = ["list-events", "selection"];
+const dataEmit = ["list-events", "selection", "drag", "update:value"];
 const useInit = (props2, emit, refTable, getLocale, isEl) => {
   var _a, _b;
   const loading = ref(false);
@@ -73,8 +73,11 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
   const pagconfig = ref(mpagconfig);
   const paginat = reactive({
     is: false,
+    // 跨页多选
     cross: false,
+    // 前端分页
     front: false,
+    // 滚动加载
     scroll: false,
     current: 1,
     pageSize: mpagconfig.pageSize,
@@ -220,24 +223,26 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
     console.log("crossPageData", crossPageData);
   }
   function getCrossPageValue(sarr, index) {
+    var _a2;
     const cross = paginat.cross;
     if (cross) {
-      if (typeof cross === "string") {
+      const rowKey = typeof cross === "string" ? cross : (_a2 = tableConfig.value.config) == null ? void 0 : _a2.rowKey;
+      if (rowKey) {
         const sv = /* @__PURE__ */ new Set();
         const is = [];
         if (sarr && index) {
           crossPageData.value.forEach((arr, i) => {
             if (i === index) {
               sarr.forEach((v) => {
-                if (!is.includes(v[cross])) {
-                  is.push(v[cross]);
+                if (!is.includes(v[rowKey])) {
+                  is.push(v[rowKey]);
                   sv.add(v);
                 }
               });
             } else {
               arr.forEach((v) => {
-                if (!is.includes(v[cross])) {
-                  is.push(v[cross]);
+                if (!is.includes(v[rowKey])) {
+                  is.push(v[rowKey]);
                   sv.add(v);
                 }
               });
@@ -245,8 +250,8 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
           });
           if (!crossPageData.value[index]) {
             sarr.forEach((v) => {
-              if (!is.includes(v[cross])) {
-                is.push(v[cross]);
+              if (!is.includes(v[rowKey])) {
+                is.push(v[rowKey]);
                 sv.add(v);
               }
             });
@@ -254,8 +259,8 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
         } else {
           crossPageData.value.forEach((arr) => {
             arr.forEach((v) => {
-              if (!is.includes(v[cross])) {
-                is.push(v[cross]);
+              if (!is.includes(v[rowKey])) {
+                is.push(v[rowKey]);
                 sv.add(v);
               }
             });
@@ -295,14 +300,16 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
     }
   }
   function toggleCrossPage() {
+    var _a2;
     const cross = paginat.cross;
     if (paginat.is && cross && !paginat.scroll) {
       const datas = data.list;
       const vs = getCrossPageValue();
-      if (typeof cross == "string") {
-        const iss = vs.map((o) => o[cross]);
+      const rowKey = typeof cross === "string" ? cross : (_a2 = tableConfig.value.config) == null ? void 0 : _a2.rowKey;
+      if (rowKey) {
+        const iss = vs.map((o) => o[rowKey]);
         const ts = datas.filter((v) => {
-          return iss.includes(v[cross]);
+          return iss.includes(v[rowKey]);
         });
         nextTick(() => {
           ts.forEach((v) => {
@@ -483,7 +490,7 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
       const total = list.length;
       const c = paginat.current;
       const z = paginat.pageSize;
-      const data2 = list.slice((c - 1) * z, c * z);
+      const v = list.slice((c - 1) * z, c * z);
       const value = {};
       let ajaxData = {};
       if (typeof tableConfig.value.ajax === "object") {
@@ -491,7 +498,7 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
       }
       const l = (ajaxData == null ? void 0 : ajaxData.list) ?? mpagconfig.data.list;
       const t = (ajaxData == null ? void 0 : ajaxData.total) ?? mpagconfig.data.total;
-      setObjValue(value, l, data2);
+      setObjValue(value, l, v);
       setObjValue(value, t, total);
       obj.value = value;
     }
@@ -635,6 +642,41 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
       onChange: onScroll
     };
   });
+  function onSortable({
+    oldIndex,
+    newIndex
+  }) {
+    if (oldIndex === newIndex) return;
+    const movedItem = data.list.splice(oldIndex, 1)[0];
+    data.list.splice(newIndex, 0, movedItem);
+    if (paginat.is && paginat.front) {
+      const q = (paginat.current - 1) * paginat.pageSize;
+      const movedItem2 = props2.value.splice(q + oldIndex, 1)[0];
+      props2.value.splice(q + newIndex, 0, movedItem2);
+      if (props2.isValue) {
+        emit("update:value", props2.value);
+      }
+    } else {
+      if (props2.isValue) {
+        emit("update:value", data.list);
+      }
+    }
+    emit("drag", data.list, newIndex, oldIndex);
+  }
+  const sortable = computed(() => {
+    var _a2;
+    let is = false;
+    if ((_a2 = tableConfig.value.config) == null ? void 0 : _a2.isdrag) {
+      is = true;
+    }
+    return {
+      is,
+      onEnd: onSortable
+    };
+  });
+  const datavalue = computed(() => {
+    return data.list;
+  });
   setValue();
   return {
     height,
@@ -648,6 +690,7 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
     empty,
     loading,
     scroll,
+    sortable,
     onSortChange,
     onListEvents,
     onSelect,
@@ -658,7 +701,8 @@ const useInit = (props2, emit, refTable, getLocale, isEl) => {
     onSizeChange,
     onCurrentChange,
     paginat,
-    data
+    data,
+    datavalue
   };
 };
 export {

package/dist/components/tables/common/tooltip.cjs

@@ -0,0 +1,101 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const index = require("../../tooltip/index.cjs");
+const mergeObject = require("@fangzhongya/utils/basic/object/mergeObject");
+exports.removePopper = null;
+const getCell = function(event) {
+  var _a;
+  return (_a = event.target) == null ? void 0 : _a.closest("td");
+};
+const getContent = function(event) {
+  const target = event.target;
+  return target.innerText || target.textContent;
+};
+function isGreaterThan(a, b, epsilon = 0.03) {
+  return a - b > epsilon;
+}
+const getPadding = (el) => {
+  const style = window.getComputedStyle(el, null);
+  const paddingLeft = Number.parseInt(style.paddingLeft, 10) || 0;
+  const paddingRight = Number.parseInt(style.paddingRight, 10) || 0;
+  const paddingTop = Number.parseInt(style.paddingTop, 10) || 0;
+  const paddingBottom = Number.parseInt(style.paddingBottom, 10) || 0;
+  return {
+    left: paddingLeft,
+    right: paddingRight,
+    top: paddingTop,
+    bottom: paddingBottom
+  };
+};
+function hideTooltip(event) {
+  const cellChild = event.target;
+  cellChild.title = "";
+}
+function isExceed(cellChild, lineClamp = 1) {
+  const range = document.createRange();
+  range.setStart(cellChild, 0);
+  range.setEnd(cellChild, cellChild.childNodes.length);
+  const { width: rangeWidth, height: rangeHeight } = range.getBoundingClientRect();
+  const { width: cellChildWidth, height: cellChildHeight } = cellChild.getBoundingClientRect();
+  const { top, left, right, bottom } = getPadding(cellChild);
+  const verticalPadding = top + bottom;
+  const horizontalPadding = left + right;
+  if (lineClamp > 1) {
+    if (isGreaterThan(rangeWidth + horizontalPadding, cellChildWidth) || isGreaterThan(rangeHeight + verticalPadding, cellChildHeight) || isGreaterThan(cellChild.scrollWidth, cellChildWidth)) {
+      return true;
+    }
+  } else {
+    if (isGreaterThan(rangeHeight + verticalPadding, cellChildHeight)) {
+      return true;
+    }
+  }
+  return false;
+}
+function showTooltip(event, parentNode, showOverflow, lineClamp = 1, props = {}) {
+  const cellChild = event.target;
+  if (isExceed(cellChild, lineClamp)) {
+    if (showOverflow == "title") {
+      cellChild.title = getContent(event);
+    } else {
+      const trigger = event.target;
+      createTablePopper(
+        trigger,
+        { ...props, content: getContent(event) },
+        parentNode
+      );
+    }
+  }
+}
+function createTablePopper(trigger, mergedProps, parentNode) {
+  var _a, _b;
+  if (((_a = exports.removePopper) == null ? void 0 : _a.trigger) === trigger) {
+    const comp = exports.removePopper.vm.component;
+    mergeObject.mergeObject(comp.props, mergedProps);
+    return;
+  }
+  (_b = exports.removePopper) == null ? void 0 : _b.call(exports);
+  const vm = vue.createVNode(index.Tooltip, {
+    virtualTriggering: true,
+    virtualRef: trigger,
+    appendTo: parentNode,
+    placement: "top",
+    transition: "none",
+    hideAfter: 0,
+    ...mergedProps
+  });
+  const container = document.createElement("div");
+  vue.render(vm, container);
+  vm.component.exposed.onOpen();
+  exports.removePopper = () => {
+    vue.render(null, container);
+    exports.removePopper = null;
+  };
+  exports.removePopper.trigger = trigger;
+  exports.removePopper.vm = vm;
+}
+exports.createTablePopper = createTablePopper;
+exports.getCell = getCell;
+exports.getContent = getContent;
+exports.hideTooltip = hideTooltip;
+exports.showTooltip = showTooltip;

package/dist/components/tables/common/tooltip.d.ts

@@ -0,0 +1,6 @@
+export declare let removePopper: any | null;
+export declare const getCell: (event: Event) => HTMLTableCellElement | null;
+export declare const getContent: (event: Event) => string;
+export declare function hideTooltip(event: MouseEvent): void;
+export declare function showTooltip(event: MouseEvent, parentNode: HTMLElement, showOverflow: string | boolean, lineClamp?: number, props?: ObjAny): void;
+export declare function createTablePopper(trigger: HTMLElement, mergedProps: ObjAny, parentNode: HTMLElement): void;

package/dist/components/tables/common/tooltip.js

@@ -0,0 +1,101 @@
+import { createVNode, render } from "vue";
+import { Tooltip } from "../../tooltip/index.js";
+import { mergeObject } from "@fangzhongya/utils/basic/object/mergeObject";
+let removePopper = null;
+const getCell = function(event) {
+  var _a;
+  return (_a = event.target) == null ? void 0 : _a.closest("td");
+};
+const getContent = function(event) {
+  const target = event.target;
+  return target.innerText || target.textContent;
+};
+function isGreaterThan(a, b, epsilon = 0.03) {
+  return a - b > epsilon;
+}
+const getPadding = (el) => {
+  const style = window.getComputedStyle(el, null);
+  const paddingLeft = Number.parseInt(style.paddingLeft, 10) || 0;
+  const paddingRight = Number.parseInt(style.paddingRight, 10) || 0;
+  const paddingTop = Number.parseInt(style.paddingTop, 10) || 0;
+  const paddingBottom = Number.parseInt(style.paddingBottom, 10) || 0;
+  return {
+    left: paddingLeft,
+    right: paddingRight,
+    top: paddingTop,
+    bottom: paddingBottom
+  };
+};
+function hideTooltip(event) {
+  const cellChild = event.target;
+  cellChild.title = "";
+}
+function isExceed(cellChild, lineClamp = 1) {
+  const range = document.createRange();
+  range.setStart(cellChild, 0);
+  range.setEnd(cellChild, cellChild.childNodes.length);
+  const { width: rangeWidth, height: rangeHeight } = range.getBoundingClientRect();
+  const { width: cellChildWidth, height: cellChildHeight } = cellChild.getBoundingClientRect();
+  const { top, left, right, bottom } = getPadding(cellChild);
+  const verticalPadding = top + bottom;
+  const horizontalPadding = left + right;
+  if (lineClamp > 1) {
+    if (isGreaterThan(rangeWidth + horizontalPadding, cellChildWidth) || isGreaterThan(rangeHeight + verticalPadding, cellChildHeight) || isGreaterThan(cellChild.scrollWidth, cellChildWidth)) {
+      return true;
+    }
+  } else {
+    if (isGreaterThan(rangeHeight + verticalPadding, cellChildHeight)) {
+      return true;
+    }
+  }
+  return false;
+}
+function showTooltip(event, parentNode, showOverflow, lineClamp = 1, props = {}) {
+  const cellChild = event.target;
+  if (isExceed(cellChild, lineClamp)) {
+    if (showOverflow == "title") {
+      cellChild.title = getContent(event);
+    } else {
+      const trigger = event.target;
+      createTablePopper(
+        trigger,
+        { ...props, content: getContent(event) },
+        parentNode
+      );
+    }
+  }
+}
+function createTablePopper(trigger, mergedProps, parentNode) {
+  if ((removePopper == null ? void 0 : removePopper.trigger) === trigger) {
+    const comp = removePopper.vm.component;
+    mergeObject(comp.props, mergedProps);
+    return;
+  }
+  removePopper == null ? void 0 : removePopper();
+  const vm = createVNode(Tooltip, {
+    virtualTriggering: true,
+    virtualRef: trigger,
+    appendTo: parentNode,
+    placement: "top",
+    transition: "none",
+    hideAfter: 0,
+    ...mergedProps
+  });
+  const container = document.createElement("div");
+  render(vm, container);
+  vm.component.exposed.onOpen();
+  removePopper = () => {
+    render(null, container);
+    removePopper = null;
+  };
+  removePopper.trigger = trigger;
+  removePopper.vm = vm;
+}
+export {
+  createTablePopper,
+  getCell,
+  getContent,
+  hideTooltip,
+  removePopper,
+  showTooltip
+};

package/dist/components/tables/common/util.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const vue = require("vue");
 require("../../../utils/index.cjs");
-const index = require("../../../hooks/inherit/index.cjs");
+const getAttrValue = require("../../../utils/vues/getAttrValue.cjs");
 const firstUpper = require("@fangzhongya/utils/basic/string/firstUpper");
 const splitUpper = require("@fangzhongya/utils/basic/string/splitUpper");
 const isArray = require("@fangzhongya/utils/basic/array/isArray");
@@ -11,7 +11,7 @@ function setMinWidth(obj, props) {
   if (obj.width) {
     return;
   }
-  const minWidth = index.useAttrValue(obj, "minWidth");
+  const minWidth = getAttrValue.getAttrValue(obj, "minWidth");
   if (minWidth) {
     if (typeof minWidth == "function") {
       return minWidth(obj, config);
@@ -21,7 +21,7 @@ function setMinWidth(obj, props) {
       return minWidth;
     }
   } else {
-    const minWidth2 = index.useAttrValue(config, "minWidth");
+    const minWidth2 = getAttrValue.getAttrValue(config, "minWidth");
     if (minWidth2) {
       return minWidth2;
     } else {

package/dist/components/tables/common/util.js

@@ -1,6 +1,6 @@
 import { withModifiers } from "vue";
 import "../../../utils/index.js";
-import { useAttrValue } from "../../../hooks/inherit/index.js";
+import { getAttrValue } from "../../../utils/vues/getAttrValue.js";
 import { firstUpper } from "@fangzhongya/utils/basic/string/firstUpper";
 import { splitUpper } from "@fangzhongya/utils/basic/string/splitUpper";
 import { isArray } from "@fangzhongya/utils/basic/array/isArray";
@@ -9,7 +9,7 @@ function setMinWidth(obj, props) {
   if (obj.width) {
     return;
   }
-  const minWidth = useAttrValue(obj, "minWidth");
+  const minWidth = getAttrValue(obj, "minWidth");
   if (minWidth) {
     if (typeof minWidth == "function") {
       return minWidth(obj, config);
@@ -19,7 +19,7 @@ function setMinWidth(obj, props) {
       return minWidth;
     }
   } else {
-    const minWidth2 = useAttrValue(config, "minWidth");
+    const minWidth2 = getAttrValue(config, "minWidth");
     if (minWidth2) {
       return minWidth2;
     } else {