@fmdevui/fm-dev 1.0.58 → 1.0.60

package/es/core/hook/useVxeTableOptionsHook.d.ts

@@ -12,6 +12,9 @@ import { VNode } from 'vue';
 interface iVxeOption {
     id?: string;
     name?: string;
+    spanFields?: Array<string>;
+    spanValueField?: string;
+    spanMethod: VxeTablePropTypes.SpanMethod<any>;
     columns: VxeGridPropTypes.Columns<any>;
     data?: VxeTablePropTypes.Data<any>;
     sortConfig?: VxeTablePropTypes.SortConfig<any>;

package/es/packages/core/hook/useVxeTableOptionsHook.mjs

@@ -8,6 +8,8 @@ import { pinia } from '../stores/inpinia.mjs';
 const vxeSize = useThemeConfig(pinia).themeConfig.globalComponentSize == "small" ? "mini" : useThemeConfig(pinia).themeConfig.globalComponentSize == "default" ? "small" : "medium";
 const useVxeTable = (opt, extras) => {
   opt.id = opt.id ? opt.id : String((/* @__PURE__ */ new Date()).getTime());
+  const spanFields = opt.spanFields ?? [];
+  const spanValueField = opt.spanValueField ?? "id";
   const options = reactive({
     id: opt.id,
     height: "auto",
@@ -17,6 +19,24 @@ const useVxeTable = (opt, extras) => {
     align: "center",
     // 自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到）
     // data: [] as Array<T>,
+    spanMethod: spanFields ? ({ row, rowIndex, column, visibleData }) => {
+      const cellValue = row[spanValueField];
+      if (cellValue && spanFields.includes(column.field)) {
+        const prevRow = visibleData[rowIndex - 1];
+        let nextRow = visibleData[rowIndex + 1];
+        if (prevRow && prevRow[spanValueField] === cellValue) {
+          return { rowspan: 0, colspan: 0 };
+        } else {
+          let countRowspan = 1;
+          while (nextRow && nextRow[spanValueField] === cellValue) {
+            nextRow = visibleData[++countRowspan + rowIndex];
+          }
+          if (countRowspan > 1) {
+            return { rowspan: countRowspan, colspan: 1 };
+          }
+        }
+      }
+    } : opt.spanMethod,
     columns: opt.columns,
     showFooter: opt.showFooter,
     footerData: opt.footerData,

package/index.js

@@ -1,4 +1,4 @@
-/*! fm-dev v1.0.58 */
+/*! fm-dev v1.0.60 */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('crypto'), require('url'), require('http'), require('https'), require('util'), require('stream'), require('assert'), require('zlib'), require('element-plus')) :
   typeof define === 'function' && define.amd ? define(['exports', 'vue', 'crypto', 'url', 'http', 'https', 'util', 'stream', 'assert', 'zlib', 'element-plus'], factory) :
@@ -52798,6 +52798,8 @@
   const vxeSize = useThemeConfig(pinia).themeConfig.globalComponentSize == "small" ? "mini" : useThemeConfig(pinia).themeConfig.globalComponentSize == "default" ? "small" : "medium";
   const useVxeTable = (opt, extras) => {
     opt.id = opt.id ? opt.id : String((/* @__PURE__ */ new Date()).getTime());
+    const spanFields = opt.spanFields ?? [];
+    const spanValueField = opt.spanValueField ?? "id";
     const options = vue.reactive({
       id: opt.id,
       height: "auto",
@@ -52807,6 +52809,24 @@
       align: "center",
       // 自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到）
       // data: [] as Array<T>,
+      spanMethod: spanFields ? ({ row, rowIndex, column, visibleData }) => {
+        const cellValue = row[spanValueField];
+        if (cellValue && spanFields.includes(column.field)) {
+          const prevRow = visibleData[rowIndex - 1];
+          let nextRow = visibleData[rowIndex + 1];
+          if (prevRow && prevRow[spanValueField] === cellValue) {
+            return { rowspan: 0, colspan: 0 };
+          } else {
+            let countRowspan = 1;
+            while (nextRow && nextRow[spanValueField] === cellValue) {
+              nextRow = visibleData[++countRowspan + rowIndex];
+            }
+            if (countRowspan > 1) {
+              return { rowspan: countRowspan, colspan: 1 };
+            }
+          }
+        }
+      } : opt.spanMethod,
       columns: opt.columns,
       showFooter: opt.showFooter,
       footerData: opt.footerData,