cloud-web-corejs 1.0.54-dev.630 → 1.0.54-dev.633

package/src/components/table/index.js

@@ -26,6 +26,27 @@ function getGrid(that, tableRef) {
   return $grid;
 }
 
+/** 是否在列子树中包含目标叶子列（同级 ref 优先，兜底 id） */
+function columnSubtreeContainsLeaf(node, leaf) {
+  if (!node || !leaf) return false;
+  if (node === leaf) return true;
+  if (leaf.id && node.id && String(node.id) === String(leaf.id)) return true;
+  if (node.children && node.children.length) {
+    return node.children.some((child) =>
+      columnSubtreeContainsLeaf(child, leaf)
+    );
+  }
+  return false;
+}
+
+/** leaf 所属的 collectColumn 最顶层节点的下标（-1 表示未找到） */
+function collectTopRootIndex(collectColumn, leaf) {
+  if (!collectColumn || !collectColumn.length || !leaf) return -1;
+  return collectColumn.findIndex((root) =>
+    columnSubtreeContainsLeaf(root, leaf)
+  );
+}
+
 async function initVxeTable(option) {
   let tableName = option.tableName;
   if (
@@ -247,31 +268,51 @@ function columnDrop(t, tableName, tableRef) {
   if (!$table) {
     return;
   }
+  // if (!$table.params) $table.params = {};
   if ($table.sortable) {
     $table.sortable.destroy();
+    $table.sortable = null;
   }
+
+  let draggedColId = null;
+  let relatedColId = null;
   $table.sortable = configUtil.Sortable.create(
     $table.$el.querySelector(
       ".body--wrapper>.vxe-table--header .vxe-header--row"
     ),
     {
       handle: ".vxe-header--column:not(.col--fixed)",
-      onEnd: ({ item, newIndex, oldIndex }) => {
+      onMove: ({ dragged, related }) => {
+        let tableColumn = $table.getTableColumn().tableColumn;
+        draggedColId = dragged.getAttribute("colid");
+        relatedColId = related.getAttribute("colid");
+      },
+      onEnd: ({ item }) => {
         const { fullColumn, tableColumn, collectColumn } =
           $table.getTableColumn();
         const targetThElem = item;
         const wrapperElem = targetThElem.parentNode;
-        const newColumn = tableColumn[newIndex];
-        if (newColumn.fixed) {
+
+        // 叶子在 fullColumn 中的下标，与 collectColumn 顶层结构的下标不能直接混用
+        const oldColumnIndex = fullColumn.findIndex(
+          (item) => item.id === draggedColId
+        );
+        const newColumnIndex = fullColumn.findIndex(
+          (item) => item.id === relatedColId
+        );
+        const oldLeafColumn = fullColumn[oldColumnIndex];
+        const newLeafColumn = fullColumn[newColumnIndex];
+
+        if (newLeafColumn.fixed) {
           // 错误的移动
-          if (newIndex > oldIndex) {
+          if (newColumnIndex > oldColumnIndex) {
             wrapperElem.insertBefore(
               targetThElem,
-              wrapperElem.children[oldIndex]
+              wrapperElem.children[oldColumnIndex]
             );
           } else {
             wrapperElem.insertBefore(
-              wrapperElem.children[oldIndex],
+              wrapperElem.children[oldColumnIndex],
               targetThElem
             );
           }
@@ -281,18 +322,27 @@ function columnDrop(t, tableName, tableRef) {
           status: 'error'
         }) */
         }
-        // 转换真实索引
-        const oldColumnIndex = $table.getColumnIndex(collectColumn[oldIndex]);
-        const newColumnIndex = $table.getColumnIndex(collectColumn[newIndex]);
-        // 移动到目标列
-        let oldIndexFinal = oldColumnIndex;
-        let newIndexFinal = newColumnIndex;
-        // let oldIndexFinal = oldColumnIndex > newColumnIndex ? oldColumnIndex : newColumnIndex;
-        // let newIndexFinal = oldColumnIndex > newColumnIndex ? newColumnIndex : oldColumnIndex;
-        const currRow = collectColumn.splice(oldIndexFinal, 1)[0];
-        collectColumn.splice(newIndexFinal, 0, currRow);
-        $table.loadColumn(collectColumn);
-        addTableJson(that, $table, tableName, collectColumn);
+
+        // let oldLeafTitle = oldLeafColumn.title;
+        // let newLeafTitle = newLeafColumn.title;
+        if (oldColumnIndex === newColumnIndex) {
+          return;
+        }
+        const oldTopIdx = collectTopRootIndex(collectColumn, oldLeafColumn);
+        const newTopIdx = collectTopRootIndex(collectColumn, newLeafColumn);
+        if (oldTopIdx === -1 || newTopIdx === -1) {
+          return;
+        }
+        if (oldTopIdx !== newTopIdx) {
+          let oldTopColumn = collectColumn[oldTopIdx];
+          let newTopColumn = collectColumn[newTopIdx];
+          let oldTopTitle = oldTopColumn.title;
+          let newTopTitle = newTopColumn.title;
+          const currRow = collectColumn.splice(oldTopIdx, 1)[0];
+          collectColumn.splice(newTopIdx, 0, currRow);
+          $table.loadColumn(collectColumn);
+          addTableJson(that, $table, tableName, collectColumn);
+        }
       },
     }
   );
@@ -854,6 +904,7 @@ function initColumnIndex(columns) {
     if (!column.params) column.params = {};
     if (column.params) {
       column.params._index = index;
+      column.params._visible = column.visible ?? true;
     }
     if (column.children && column.children.length > 0) {
       initColumnIndex(column.children);
@@ -865,43 +916,31 @@ function initColumn(option, syncColumns) {
   let oldColumns = option.columns;
   let newColumns = [];
   if (syncColumns) {
-    let fields = [];
+    // 按列对象配对：DB 里同 field 多行时不得反复匹配同一 oldColumn；old 删了重复列时多余 sync 行应丢弃
+    const matchedOld = new Set();
     syncColumns.forEach(function (syncColumn) {
-      let field = syncColumn.field;
-      if (field) {
-        oldColumns.some(function (oldColumn, index) {
-          let flag = oldColumn.field === field;
-          if (flag) {
-            if (!oldColumn.params) oldColumn.params = {};
-            let visibleSync =
-              option.visibleSync !== false && oldColumn.visibleSync !== false;
-            oldColumn.params._visible = oldColumn.visible ?? true;
-            if (visibleSync) {
-              oldColumn.visible = syncColumn.visible;
-            }
-            if (
-              oldColumn.width !== undefined &&
-              oldColumn.width !== undefined
-            ) {
-              oldColumn.params._width = oldColumn.width;
-            }
-            if (syncColumn.width) oldColumn.width = syncColumn.width;
-            newColumns.push(oldColumn);
-            fields.push(field);
-          }
-          return flag;
-        });
+      const field = syncColumn.field;
+      if (!field) return;
+      const oldColumn = oldColumns.find(function (oc) {
+        return oc.field === field && !matchedOld.has(oc);
+      });
+      if (!oldColumn) return;
+      matchedOld.add(oldColumn);
+      if (!oldColumn.params) oldColumn.params = {};
+      const visibleSync =
+        option.visibleSync !== false && oldColumn.visibleSync !== false;
+      if (visibleSync) {
+        oldColumn.visible = syncColumn.visible;
+      }
+      if (oldColumn.width !== undefined) {
+        oldColumn.params._width = oldColumn.width;
       }
+      if (syncColumn.width) oldColumn.width = syncColumn.width;
+      newColumns.push(oldColumn);
     });
     oldColumns.forEach(function (oldColumn, index) {
-      let field = oldColumn.field;
-      if (field) {
-        if (!fields.includes(field)) {
-          newColumns.splice(index, 0, oldColumn);
-        }
-      } else {
-        newColumns.splice(index, 0, oldColumn);
-      }
+      if (matchedOld.has(oldColumn)) return;
+      newColumns.splice(index, 0, oldColumn);
     });
 
     // 处理 children 中的列
@@ -945,33 +984,28 @@ function initSearchColumns(oriColumns, syncColumns) {
   let oldColumns = oriColumns || [];
   let newColumns = [];
   if (syncColumns) {
-    let fields = [];
+    const matchedOld = new Set();
     syncColumns.forEach(function (syncColumn) {
-      let field = syncColumn.field;
-      if (field) {
-        oldColumns.some(function (oldColumn) {
-          let flag = oldColumn.field === field && !oldColumn.fixed;
-          if (flag) {
-            oldColumn.common = syncColumn.common || false;
-            if (syncColumn.defaultValue !== undefined) {
-              oldColumn.defaultValue = syncColumn.defaultValue;
-            }
-            newColumns.push(oldColumn);
-            fields.push(field);
-          }
-          return flag;
-        });
+      const field = syncColumn.field;
+      if (!field) return;
+      const oldColumn = oldColumns.find(function (oc) {
+        return oc.field === field && !oc.fixed && !matchedOld.has(oc);
+      });
+      if (!oldColumn) return;
+      matchedOld.add(oldColumn);
+      oldColumn.common = syncColumn.common || false;
+      if (syncColumn.defaultValue !== undefined) {
+        oldColumn.defaultValue = syncColumn.defaultValue;
       }
+      newColumns.push(oldColumn);
     });
     oldColumns.forEach(function (oldColumn, index) {
-      let field = oldColumn.field;
-      if (field && !oldColumn.fixed) {
-        if (!fields.includes(field)) {
-          newColumns.splice(index, 0, oldColumn);
-        }
-      } else {
+      if (oldColumn.fixed) {
         newColumns.splice(index, 0, oldColumn);
+        return;
       }
+      if (matchedOld.has(oldColumn)) return;
+      newColumns.splice(index, 0, oldColumn);
     });
   } else {
     newColumns = oldColumns;
@@ -1025,19 +1059,6 @@ function customHandle(option) {
     let tableName = originOption.tableName;
     if (option.type === "reset") {
       const { collectColumn } = $grid.getTableColumn();
-      /* const loopDo = (columns)=>{
-        columns.forEach((item)=>{
-          if(item.children && item.children.length){
-            loopDo(item.children);
-          }else{
-            if(item.params){
-              item.visible = item.params._visible ?? true;
-              if(item.params._width !== undefined)item.width = item.params._width;
-            }
-          }
-        })
-      }
-      loopDo(collectColumn); */
 
       // 还原列的位置
       let oldColumns = originOption.columns || [];
@@ -1048,9 +1069,6 @@ function customHandle(option) {
       } else {
         $grid.loadColumn(collectColumn);
       }
-      // let columns = that.$baseLodash.cloneDeep(originOption.columns);
-      // initColumnDefaulAttrs(columns, originOption);
-      // $grid.columns = columns;
     }
     if (tableName) {
       setTimeout(() => {