cloud-web-corejs 1.0.54-dev.80 → 1.0.54-dev.800

package/src/components/excelExport/exportFieldDialog.vue

@@ -1,211 +1,373 @@
-<template>
-  <el-dialog
-    :title="$t1('导出数据')"
-    width="355px"
-    custom-class="dialog-style list-dialog"
-    :visible.sync="showDialog"
-    :modal="false"
-    :append-to-body="false"
-    :modal-append-to-body="false"
-    :close-on-click-modal="false"
-    :destroy-on-close="true"
-    v-el-dialog-center
-    :before-close="handleBeforeClose"
-  >
-    <div class="cont" style="max-height: 500px">
-      <div class="tit" style="margin-bottom: 5px;"><b>{{ $t1('导出字段') }}</b></div>
-      <el-tree
-        :props="defaultProps"
-        :data="data"
-        show-checkbox
-        node-key="id"
-        ref="tree"
-        default-expand-all
-        check-on-click-node
-        :expand-on-click-node="false"
-        icon-class="el-icon-arrow-right"
-        :default-checked-keys="defaultCheckedKeys"
-      ></el-tree>
-    </div>
-    <span slot="footer" class="dialog-footer">
-      <el-button type="primary" plain class="button-sty" @click="handleDialogClose">
-        <i class="el-icon-close el-icon"></i>
-        {{ $t1('取 消') }}
-      </el-button>
-      <el-button type="primary" @click="dialogConfirm" class="button-sty">
-        <i class="el-icon-check el-icon"></i>
-        {{ $t1('确 定') }}
-      </el-button>
-    </span>
-  </el-dialog>
-</template>
-<script>
-export default {
-  name: "exportFieldDialog",
-  props: ['param'],
-  data() {
-    return {
-      showDialog: true,
-      data: [],
-      defaultProps: {
-        label: 'title', //这里是树结构中需显示的数据（即接口返回的需展示在页面上的参数）
-        children: 'children'
-      },
-      defaultCheckedKeys: [],
-      columns: [],
-      allFields: []
-    }
-  },
-  created() {
-    this.init();
-  },
-  methods: {
-    init() {
-      let target = this.getGrid();
-      let {fullColumn, collectColumn: columns} = target.getTableColumn();
-      // let columns = target.getTableColumn().collectColumn;
-      let exportColumns = target.exportColumns || [];
-      let yesFields = [];
-      let noFields = []
-      let allFields = [];
-      exportColumns.forEach(item => {
-        if (item.field) {
-          if (item.export) {
-            yesFields.push(item.field)
-          } else {
-            noFields.push(item.field)
-          }
-        }
-      })
-
-      let defaultCheckedKeys = []
-      let cols = [];
-      fullColumn.forEach(column => {
-        if (column.field) {
-          if (yesFields.includes(column.field)) {
-            defaultCheckedKeys.push(column.id)
-          } else if (!noFields.includes(column.field) && column.visible) {
-            defaultCheckedKeys.push(column.id)
-          }
-          allFields.push(column.field);
-        }
-      })
-      columns.forEach(column => {
-        if (column.title) {
-          cols.push(column);
-        }
-      });
-      this.allFields = allFields;
-      this.defaultCheckedKeys = defaultCheckedKeys;
-      let data = [
-        {
-          label: this.$t1('全部字段'),
-          id: -1,
-          leaf: true,
-          children: this.$baseLodash.cloneDeep(cols)
-        }
-      ]
-      this.data = this.$baseLodash.cloneDeep(cols);
-    },
-    addTableExportColumns() {
-      let $grid = this.getGrid();
-      let leafColumns = this.$refs.tree.getCheckedNodes(true)
-      let checkLeafIds = leafColumns.map(item => item.id)
-      let {fullColumn} = $grid.getTableColumn();
-      let exportColumns = []
-      fullColumn.map(column => {
-        if (column.field && column.title) {
-          let item = {
-            field: column.field,
-            export: checkLeafIds.includes(column.id)
-          }
-          exportColumns.push(item)
-        }
-      })
-      let originOption = $grid.originOption
-      $grid.exportColumns = exportColumns;
-      this.$vxeTableUtil.addTableJson(originOption.vue, $grid, originOption.tableName)
-    },
-    handleBeforeClose(hide) {
-      // this.$emit('cancel');
-      this.handleDialogClose();
-      hide();
-    },
-    handleDialogClose() {
-      this.$emit('close');
-      this.dialogClose()
-    },
-    dialogClose() {
-      this.showDialog = false;
-      this.$emit('update:visiable', false);
-    },
-    dialogConfirm() {
-      let target = this.getGrid();
-      let leafColumns = this.$refs.tree.getCheckedNodes(true)
-      let checkIds = this.$refs.tree.getCheckedNodes(false, true).map(item => item.id)
-      let collectColumn = target.getTableColumn().collectColumn;
-      let maxRowspan = 1;
-      leafColumns.forEach(item => {
-        maxRowspan = Math.max(maxRowspan, item.level);
-      })
-
-      let loopDo = (items, parent) => {
-        let datas = []
-        items.forEach(item => {
-          if (checkIds.includes(item.id)) {
-            let column = this.$baseLodash.cloneDeep(item);
-            if (item.children && item.children.length > 0) {
-              let children = this.$baseLodash.cloneDeep(loopDo(item.children));
-              column.children = children;
-              if (children.length) {
-                column.colSpan = children.length
-              } else {
-                column.colSpan = 1
-              }
-            } else if (!column.parentId) {
-              column.rowSpan = maxRowspan
-            }
-            ;
-            datas.push(column);
-          }
-        })
-        return datas;
-      }
-      let columns = loopDo(collectColumn, null)
-      this.$emit('confirm', {columns, leafColumns});
-      this.addTableExportColumns();
-      this.dialogClose();
-    },
-    getExportTitleJson() {
-      let target = this.getGrid();
-      let columns = target.getColumns();
-      let cols = [];
-      columns.forEach(column => {
-        if (column.title && column.visible) {
-          cols.push(column);
-        }
-      });
-      return cols;
-    },
-    getGrid() {
-      let that = this.param.vue;
-      let tableRef = this.param.targetRef;
-      let $grid;
-      if (Array.isArray(that.$refs[tableRef])) {
-        $grid = that.$refs[tableRef][0];
-      } else {
-        $grid = that.$refs[tableRef];
-      }
-      return $grid;
-    },
-    revert() {
-
-    }
-  }
-}
-</script>
-
-
-<style scoped>
-
-</style>
+<template>
+  <el-dialog
+    :title="$t1('导出数据')"
+    width="355px"
+    custom-class="dialog-style list-dialog"
+    :visible.sync="showDialog"
+    :modal="false"
+    :append-to-body="false"
+    :modal-append-to-body="false"
+    :close-on-click-modal="false"
+    :destroy-on-close="true"
+    v-el-dialog-center
+    :before-close="handleBeforeClose"
+  >
+    <div class="cont" style="max-height: 500px">
+      <div class="tit" style="margin-bottom: 5px">
+        <b>{{ $t1("导出字段") }}</b>
+      </div>
+      <el-tree
+        :props="defaultProps"
+        :data="data"
+        show-checkbox
+        node-key="id"
+        ref="tree"
+        default-expand-all
+        check-on-click-node
+        :expand-on-click-node="false"
+        icon-class="el-icon-arrow-right"
+        :default-checked-keys="defaultCheckedKeys"
+      ></el-tree>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button type="primary" plain class="button-sty" @click="handleDialogClose">
+        <i class="el-icon-close el-icon"></i>
+        {{ $t1("取 消") }}
+      </el-button>
+      <el-button type="primary" @click="dialogConfirm" class="button-sty">
+        <i class="el-icon-check el-icon"></i>
+        {{ $t1("确 定") }}
+      </el-button>
+    </span>
+  </el-dialog>
+</template>
+<script>
+import xeUtils from "xe-utils";
+import { isItemExport } from "./exportType";
+export default {
+  name: "exportFieldDialog",
+  props: ["param"],
+  data() {
+    return {
+      showDialog: true,
+      data: [],
+      defaultProps: {
+        label: "title", //这里是树结构中需显示的数据（即接口返回的需展示在页面上的参数）
+        children: "children",
+      },
+      defaultCheckedKeys: [],
+      columns: [],
+      allFields: [],
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    loopColumnHandle(items, handler) {
+      items.forEach((item) => {
+        handler(item);
+        if (item.children && item.children.length) {
+          this.loopColumnHandle(item.children, handler);
+        }
+      });
+    },
+    generateId() {
+      // 自增序号保证唯一：随机数范围小，列多时会碰撞导致树勾选(node-key)错乱
+      this.idSeed = (this.idSeed || 0) + 1;
+      return "expcol_" + Date.now() + "_" + this.idSeed;
+    },
+    filterExportVisible(items) {
+      if (!Array.isArray(items)) return [];
+
+      return items
+        .filter((item) => item.exportItemVisible === true) // 只保留 exportItemVisible 严格等于 true 的项
+        .map((item) => {
+          // 如果有 children，递归过滤
+          if (Array.isArray(item.children)) {
+            return {
+              ...item,
+              children: this.filterExportVisible(item.children),
+            };
+          }
+          return item;
+        });
+    },
+    filterNonDataExportColumns(items) {
+      if (!Array.isArray(items)) return [];
+      return items.reduce((result, item) => {
+        if (item.params?.exportDisabled) return result;
+        if (Array.isArray(item.children) && item.children.length) {
+          let children = this.filterNonDataExportColumns(item.children);
+          if (!children.length) return result;
+          result.push({ ...item, children });
+        } else {
+          result.push(item);
+        }
+        return result;
+      }, []);
+    },
+    init() {
+      let target = this.getGrid();
+      let { fullColumn, collectColumn: column1s } = target.getTableColumn();
+
+      let checkMethod = target.$refs.xTable.customOpts?.checkMethod;
+      // var checkMethod = $xetable ? $xetable.customOpts.checkMethod : null;
+      // let columns = target.getTableColumn().collectColumn;
+      let columns = [];
+      let allFields = [];
+      if (checkMethod) {
+        const handleColumnVisible = (column) => {
+          if (!column.title) return false;
+          let visible = true;
+
+          let isColGroup = column.children && column.children.length;
+
+          if (isColGroup) {
+            // 如果是分组字段，则根据子字段的显示状态来处理
+            let parentVisible = false;
+            column.children.forEach((item) => {
+              let itemVisible = handleColumnVisible(item);
+              if (itemVisible) {
+                parentVisible = true;
+              }
+            });
+            visible = parentVisible;
+            /* visible = column.children.some((item) => {
+              return handleColumnVisible(item);
+            }); */
+          } else {
+            let isDisabled = !checkMethod({
+              column: column,
+            });
+            if (isDisabled) {
+              // 如果字段被禁用勾选，根据显示状态来处理
+              visible = column.visible;
+            }
+            if (column.field && visible) {
+              allFields.push(column.field);
+            }
+          }
+          column.exportItemVisible = visible;
+          return visible;
+        };
+        column1s.forEach((column) => {
+          return handleColumnVisible(column);
+        });
+        columns = this.filterExportVisible(column1s);
+      } else {
+        columns = column1s;
+      }
+      columns = this.filterNonDataExportColumns(columns);
+
+      let exportItem = isItemExport(this.param.type);
+
+      let defaultCheckedKeys = [];
+      let cols = [];
+
+      let yesFields = [];
+      let noFields = [];
+
+      let exportColumns = !exportItem
+        ? target.exportColumns || []
+        : target.exportItemColumns || [];
+
+      this.loopColumnHandle(exportColumns, (item) => {
+        if (item.field) {
+          if (item.export) {
+            yesFields.push(item.field);
+          } else {
+            noFields.push(item.field);
+          }
+        }
+      });
+
+      if (!exportItem) {
+        //导出主表数据
+
+        fullColumn.forEach((column) => {
+          if (column.field && !column.params?.exportDisabled) {
+            if (yesFields.includes(column.field)) {
+              defaultCheckedKeys.push(column.id);
+            } else if (!noFields.includes(column.field) && column.visible) {
+              defaultCheckedKeys.push(column.id);
+            }
+          }
+        });
+        columns.forEach((column) => {
+          if (column.title) {
+            cols.push(column);
+          }
+        });
+      } else {
+        //导出子表数据
+        let exportItemColumns = target.exportItemColumns || [];
+        let originOption = target.params.originOption;
+        let oriExportItemColumns = originOption.exportItemConfig?.columns || [];
+
+        // 与主表分支一致的三态：记为导出→勾选，记为不导出→不勾，两者都无（新增列）→ 默认勾选。
+        // 这里曾以 allFields.includes(field) 为前置门槛，但 allFields 只在 custom-config
+        // 配了 checkMethod 时才有内容，而全库未配任何 checkMethod → 恒为空数组 → 明细列
+        // 一个都勾不上，连 exportItemColumns 的勾选记忆也一并失效。明细列与主表列本就是两套
+        // 字段，取交集没有意义，故去掉该门槛。
+        this.loopColumnHandle(oriExportItemColumns, (item) => {
+          item.id = this.generateId();
+          if (!item.field) return;
+          let isYes = yesFields.includes(item.field);
+          let isNo = noFields.includes(item.field);
+          if (isYes || !isNo) {
+            defaultCheckedKeys.push(item.id);
+          }
+        });
+        oriExportItemColumns.forEach((column) => {
+          if (column.title) {
+            cols.push(column);
+          }
+        });
+      }
+
+      this.allFields = allFields;
+      this.defaultCheckedKeys = defaultCheckedKeys;
+      /* let data = [
+        {
+          label: this.$t1("全部字段"),
+          id: -1,
+          leaf: true,
+          children: this.$baseLodash.cloneDeep(cols),
+        },
+      ]; */
+      this.data = this.$baseLodash.cloneDeep(cols);
+    },
+    addTableExportColumns() {
+      let exportItem = isItemExport(this.param.type);
+
+      let $grid = this.getGrid();
+      let originOption = $grid.params.originOption;
+      let leafColumns = this.$refs.tree.getCheckedNodes(true);
+      let checkLeafIds = leafColumns.map((item) => item.id);
+
+      // let syncEportItemColumns = $grid.exportItemColumns || [];
+      // let syncExportColumns = $grid.exportColumns || [];
+
+      if (!exportItem) {
+        //导出主表数据
+        let exportColumns = [];
+        let { fullColumn } = $grid.getTableColumn();
+        fullColumn.map((column) => {
+          if (column.field && column.title) {
+            let item = {
+              field: column.field,
+              export: checkLeafIds.includes(column.id),
+            };
+            exportColumns.push(item);
+          }
+        });
+        $grid.exportColumns = exportColumns;
+      } else {
+        //导出子表数据
+        let exportItemColumns = [];
+        if (originOption.exportItemConfig?.columns?.length) {
+          this.loopColumnHandle(originOption.exportItemConfig?.columns, (column) => {
+            if (column.field && column.title) {
+              let item = {
+                field: column.field,
+                export: checkLeafIds.includes(column.id),
+              };
+              exportItemColumns.push(item);
+            }
+          });
+          $grid.exportItemColumns = exportItemColumns;
+        }
+      }
+      this.$vxeTableUtil.addTableJson(originOption.vue, $grid, originOption.tableName);
+    },
+    handleBeforeClose(hide) {
+      // this.$emit('cancel');
+      this.handleDialogClose();
+      hide();
+    },
+    handleDialogClose() {
+      this.$emit("close");
+      this.dialogClose();
+    },
+    dialogClose() {
+      this.showDialog = false;
+      this.$emit("update:visiable", false);
+    },
+    dialogConfirm() {
+      let target = this.getGrid();
+      let originOption = target.params.originOption;
+      let leafColumns = this.$refs.tree.getCheckedNodes(true);
+      let checkIds = this.$refs.tree.getCheckedNodes(false, true).map((item) => item.id);
+      let exportItem = isItemExport(this.param.type);
+      let collectColumn = !exportItem
+        ? target.getTableColumn().collectColumn
+        : originOption.exportItemConfig?.columns;
+      // 明细导出列未维护时这里是 undefined，下面 depthDo/loopDo 直接遍历会抛错
+      collectColumn = collectColumn || [];
+      // 按勾选后的实际层级算表头总行数（item.level 在导出明细列上不存在，不可依赖）
+      let maxRowspan = 1;
+      let depthDo = (items, depth) => {
+        (items || []).forEach((item) => {
+          if (!checkIds.includes(item.id)) return;
+          if (item.children && item.children.length > 0) {
+            depthDo(item.children, depth + 1);
+          } else if (depth > maxRowspan) {
+            maxRowspan = depth;
+          }
+        });
+      };
+      depthDo(collectColumn, 1);
+
+      let loopDo = (items, depth) => {
+        let datas = [];
+        (items || []).forEach((item) => {
+          if (checkIds.includes(item.id) && !item.params?.exportDisabled) {
+            let column = this.$baseLodash.cloneDeep(item);
+            if (item.children && item.children.length > 0) {
+              let children = loopDo(item.children, depth + 1);
+              column.children = children;
+              column.colSpan = children.length ? children.length : 1;
+              column.rowSpan = 1;
+            } else {
+              // 任意层级的叶子列都要跨到表头底行，否则多层分组表头导出错位
+              column.rowSpan = maxRowspan - depth + 1;
+            }
+            datas.push(column);
+          }
+        });
+        return datas;
+      };
+      let columns = loopDo(collectColumn, 1);
+      this.$emit("confirm", { columns, leafColumns });
+      this.addTableExportColumns();
+      this.dialogClose();
+    },
+    /* getExportTitleJson() {
+      let target = this.getGrid();
+      let columns = target.getColumns();
+      let cols = [];
+      columns.forEach((column) => {
+        if (column.title && column.visible) {
+          cols.push(column);
+        }
+      });
+      return cols;
+    }, */
+    getGrid() {
+      let that = this.param.vue;
+      let tableRef = this.param.targetRef;
+      let $grid;
+      if (Array.isArray(that.$refs[tableRef])) {
+        $grid = that.$refs[tableRef][0];
+      } else {
+        $grid = that.$refs[tableRef];
+      }
+      return $grid;
+    },
+    revert() {},
+  },
+};
+</script>
+
+<style scoped></style>

package/src/components/excelExport/exportType.js

@@ -0,0 +1,49 @@
+/**
+ * 导出模式常量与判定。
+ *
+ * 导出的 type 此前以字面量散落在 excelExport 与 xform 两侧共 6 处，且存在三种**互不相同**
+ * 的分组口径（是否需要勾选行 / 是否走前端行导出 / 列取自哪一套），改一处漏一处就会出现
+ * "表头是主表列、数据是明细行"这类错位。统一收敛到这里，新增模式只需扩这三个谓词。
+ */
+
+export const EXPORT_TYPE = {
+  /** 主表·条件导出：按当前搜索条件后端分页拉全量。 */
+  CONDITION: null,
+  /** 主表·选择导出：导出前端已勾选行。 */
+  SELECTED: "selected",
+  /** 主表·当前页导出：当前无调用方，保留常量仅为兼容外部调用。 */
+  CURRENT: "current",
+  /** 明细·选择导出：以勾选行 id 为过滤条件，后端分页拉明细行。 */
+  ITEM_SELECTED: "exportItem",
+  /** 明细·条件导出：以当前搜索条件为过滤条件，后端分页拉明细行。 */
+  ITEM_CONDITION: "exportItemQuery",
+};
+
+/**
+ * 是否明细导出：列取自 `exportItemConfig.columns` 而非表格列。
+ * @param {String|null} type 导出模式。
+ * @returns {Boolean}
+ */
+export function isItemExport(type) {
+  return (
+    type === EXPORT_TYPE.ITEM_SELECTED || type === EXPORT_TYPE.ITEM_CONDITION
+  );
+}
+
+/**
+ * 是否前端行导出：直接取表格里的行一次性上送，不发分页请求。
+ * @param {String|null} type 导出模式。
+ * @returns {Boolean}
+ */
+export function isRowExport(type) {
+  return type === EXPORT_TYPE.SELECTED || type === EXPORT_TYPE.CURRENT;
+}
+
+/**
+ * 是否必须先勾选行：空勾选要拦截，且以勾选行 id 作为查询条件。
+ * @param {String|null} type 导出模式。
+ * @returns {Boolean}
+ */
+export function requiresCheckedRows(type) {
+  return type === EXPORT_TYPE.SELECTED || type === EXPORT_TYPE.ITEM_SELECTED;
+}