cloud-web-corejs 1.1.0-dev.11 → 1.1.0-dev.13

package/src/components/xform/form-render/container-item/data-table-mixin.js

@@ -1,3 +1,4 @@
+import Vue from "vue";
 import emitter from "../../../../components/xform/utils/emitter";
 import i18n from "../../../../components/xform/utils/i18n";
 import refMixin from "../../../../components/xform/form-render/refMixin";
@@ -47,6 +48,7 @@ import {
   getDynamicSchemaOption,
   isActionColumnFormat,
   isNonDataExportColumn,
+  isBlankExportColumn,
   normalizeDynamicColumns as normalizeDynamicColumnList,
   resolveDynamicSchemaResponse,
 } from "../../utils/dynamicSchemaUtil";
@@ -72,6 +74,22 @@ import {
 } from "../../utils/treeTableUtil";
 import { tableTreeMixins } from "../../../../mixins/tableTree/index.js";
 
+/**
+ * 列一直建不出来时，行级 schema 重建的最大重试次数（每次隔一帧）。
+ * 见 initFieldSchemaData：那里的 $nextTick 自递归原本没有上限。
+ */
+const MAX_SCHEMA_INIT_RETRY = 50;
+
+/**
+ * 超过多少行就不再预建全量行级 schema，改由 getRowFieldSchema 按需建。
+ * 预建是按「行数 × 组件列数」做 deepClone（createRowFieldSchemaMap），万行量级是
+ * GB 级内存 —— 与条件导出那次标签页崩溃是同一个根因，只是这里常驻 fieldSchemaMap。
+ * 触发口：表单导入一次灌入大批行、树表全量加载（BOM）。
+ * 阈值取 1000：列表分页最大档是 500，普通分页列表永远不会进懒建模式，行为零变化。
+ * 可由 widget.options.lazyRowSchemaThreshold 覆盖。
+ */
+const LAZY_ROW_SCHEMA_THRESHOLD = 1000;
+
 let modules = {};
 const baseRefUtil = {
   emitter,
@@ -300,6 +318,74 @@ modules = {
       }
       return widget.options.labelKey || "label";
     },
+    /** @returns {Number} 超过多少行改走行级 schema 懒建。 */
+    getLazyRowSchemaThreshold() {
+      let value = Number(this.widget?.options?.lazyRowSchemaThreshold);
+      if (isFinite(value) && value > 0) return value;
+      return LAZY_ROW_SCHEMA_THRESHOLD;
+    },
+    /**
+     * 行级 schema 的统一读取口：预建模式下就是 fieldSchemaMap 里的那份，懒建模式下
+     * （行数超阈值，见 LAZY_ROW_SCHEMA_THRESHOLD）按需创建，只有真正渲染/校验到的行
+     * 才付克隆代价 —— vxe 虚拟滚动下这远小于全量。
+     *
+     * 懒建刻意**不用 $set**：本方法会在渲染期被模板调用（#widget / #widgetList /
+     * #editWidget 都要读行级 schema），给被 render 依赖的 fieldSchemaMap 新增响应式
+     * 属性会当场触发重渲染，形成 "infinite update loop"。改为 Vue.observable 让 schema
+     * 对象自身保持响应（行内脚本 setDisabled / setOptionItems 仍能刷新视图），再普通
+     * 赋值挂进 map；同一行同一次渲染内多次读取拿到的是同一个对象，不会对不上。
+     * @param {Object} row 行数据。
+     * @returns {Object|null}
+     */
+    getRowFieldSchema(row) {
+      let rowKey = row && row._X_ROW_KEY;
+      if (!rowKey) return null;
+      // 导出行有自己的惰性克隆通道（getExportRowWidget），不进 fieldSchemaMap
+      if (row._X_EXPORT_ROW) return null;
+      let rowSchema = this.fieldSchemaMap[rowKey];
+      if (rowSchema) return rowSchema;
+      if (!this.getTableFullColumns().length) return null;
+      rowSchema = Vue.observable(this.createRowFieldSchemaMap());
+      this.fieldSchemaMap[rowKey] = rowSchema;
+      return rowSchema;
+    },
+    /**
+     * 导出行的行级组件 schema：按需惰性克隆，缓存挂在行对象上、随行一起丢弃。
+     *
+     * 导出行不进 fieldSchemaMap（见 initExportRows），但**不能**直接把列模板交出去：
+     * 仍会逐单元格挂载的那几类列（widgetRender 自定义组件列、Image2 但本次没开
+     * showImageAtTable 的附件列）在挂载时会跑用户脚本，而 setDisabled / setHidden /
+     * setOptionItems 这些 API 是直接写 field.options 的 —— 交出模板就等于让脚本改到
+     * 列模板本身，而 createRowFieldSchemaMap 又是从该模板克隆各行 schema，污染会一直
+     * 留到重新加载表单配置为止。
+     *
+     * 必须**记忆化**：`#widget` 插槽一个单元格里会多次调用取值（v-if / :field / :key /
+     * 字段名），每次返回新对象会让这几处互相对不上。
+     *
+     * 代价只落在真正会挂载的少数列上，不会退回按「行数 × 列数」克隆。
+     * @param {Object} row 导出行。
+     * @param {Object} widget 列模板组件 schema。
+     * @returns {Object|null}
+     */
+    getExportRowWidget(row, widget) {
+      if (!widget || !widget.id) return widget || null;
+      let cache = row.__X_EXPORT_WIDGETS;
+      if (!cache) {
+        cache = {};
+        // 不可枚举：避免混进行数据被序列化或遍历到
+        Object.defineProperty(row, "__X_EXPORT_WIDGETS", {
+          value: cache,
+          enumerable: false,
+          configurable: true,
+          writable: true,
+        });
+      }
+      // 用原模板 id 做键：克隆体自己的 id 是新生成的，不能拿来查
+      if (!cache[widget.id]) {
+        cache[widget.id] = this.cloneFieldSchema(widget);
+      }
+      return cache[widget.id];
+    },
     /**
      * 获取当前行独立的列组件 schema；缺失时按列模板即时创建。
      * @param {Object} obj VXE 单元格参数。
@@ -311,11 +397,17 @@ modules = {
       if (!rowKey || !widget?.id) {
         return null;
       }
-      let rowSchema = this.fieldSchemaMap[rowKey];
-      if (!rowSchema) {
-        rowSchema = this.createRowFieldSchemaMap();
-        this.$set(this.fieldSchemaMap, rowKey, rowSchema);
-      } else if (!rowSchema[widget.id]) {
+      // 导出行不进 fieldSchemaMap（见 initExportRows）。这里必须短路：取值兜底渲染会
+      // 走到本方法，缺 schema 时下面那段会按行懒建一整套再 $set 进 fieldSchemaMap，把
+      // initExportRows 省下的开销原样加回来，且因为走 $set 还会被深度观测，比原来更贵。
+      // 但也不能直接交出列模板——挂载时跑的用户脚本会写进 field.options，
+      // 详见 getExportRowWidget。
+      if (obj.row._X_EXPORT_ROW) {
+        return this.getExportRowWidget(obj.row, widget);
+      }
+      let rowSchema = this.getRowFieldSchema(obj.row);
+      if (!rowSchema) return null;
+      if (!rowSchema[widget.id]) {
         this.$set(rowSchema, widget.id, this.cloneFieldSchema(widget));
       }
       return rowSchema[widget.id] || null;
@@ -595,7 +687,14 @@ modules = {
       let row = rowParam.row;
       let params = rowParam.column.params;
       let widgetId = fieldWidget ? fieldWidget.id : params.widget.id;
-      let widget = this.fieldSchemaMap[row._X_ROW_KEY][widgetId];
+      // 导出行不进 fieldSchemaMap，不短路会在 fieldSchemaMap[undefined] 上取值直接崩。
+      // 同样走惰性克隆而不是直接交模板，理由见 getExportRowWidget。
+      if (row._X_EXPORT_ROW) {
+        return this.getExportRowWidget(row, fieldWidget || params.widget);
+      }
+      // 懒建模式下这一行可能还没建过 schema，直接下标取值会 TypeError
+      let rowSchema = this.getRowFieldSchema(row);
+      let widget = rowSchema ? rowSchema[widgetId] : null;
       return widget;
     },
     /** @param {String} name 组件名。@param {Function} callback 每行回调。 */
@@ -919,7 +1018,7 @@ modules = {
       if (!row || !templateWidget) {
         return templateWidget;
       }
-      const schema = this.fieldSchemaMap[row._X_ROW_KEY];
+      const schema = this.getRowFieldSchema(row);
       if (schema && schema[templateWidget.id]) {
         return schema[templateWidget.id];
       }
@@ -1762,6 +1861,11 @@ modules = {
               t.type || t.widget?.type,
               t.widget?.options || t.options
             ),
+            exportBlank: isBlankExportColumn(
+              t.formatS,
+              t.type || t.widget?.type,
+              t.exportType
+            ),
           },
           visible: this.getColumnVisible(t),
           slots: {},
@@ -1849,6 +1953,12 @@ modules = {
           "textarea",
           "a-link",
           "a-text",
+          // 脚本输入框：展示值就是 fieldModel，不做任何转换，走纯函数完全等价。
+          // 不走这里会落到 getCellValue 的 vNode 挂载兜底，而它内部是**异步组件**
+          // code-editor —— 同步挂载后立刻爬 DOM 根本读不到内容（异步组件那一刻还没
+          // 解析完），所以这类列此前导出为空；顺带每个单元格挂一个代码编辑器，是所有
+          // 类型里最贵的一种。
+          "script-input",
         ];
         if (widget && types.includes(widget.type)) {
           const func = (obj) => {
@@ -1867,9 +1977,14 @@ modules = {
             if (fieldWidget && !fieldWidget.options.hidden) {
               let widgetType = fieldWidget.type;
               if (
-                ["input", "number", "textarea", "a-link", "a-text"].includes(
-                  widgetType
-                )
+                [
+                  "input",
+                  "number",
+                  "textarea",
+                  "a-link",
+                  "a-text",
+                  "script-input",
+                ].includes(widgetType)
               ) {
                 return value;
               }
@@ -2526,6 +2641,9 @@ modules = {
           let customParam = {
             config: {
               modal: false,
+              // 导出取消时要能掐断在途取数请求。令牌由 excelExport 生成后随导出参数
+              // 带过来，这里塞进 config，formHttp 的 ...opts 会透传给 axios。
+              cancelToken: options?.cancelToken,
             },
             export: true,
             exportParam: options,
@@ -2642,8 +2760,8 @@ modules = {
                         : [];
                       // that.handleNullValue(rows);
                       if (customParam?.export) {
-                        //导出
-                        this.initExportFieldSchemaData(rows);
+                        //导出：只补行主键+标记，不建行级 schema（大数据量会 OOM）
+                        this.initExportRows(rows);
                       } else {
                         // VXE 与表单必须共用同一批标准化行，否则 _X_ROW_KEY 不一致，
                         // 行虽能进入编辑态，但 editWidget 无法取得对应的行级 schema。
@@ -2656,7 +2774,7 @@ modules = {
                       }
 
                       resolve(res);
-                      if (res.type === "success") {
+                      if (that.shouldEmitQueryLoaded(res, customParam)) {
                         if (that.widget.options.isTreeTable) {
                           if (rows.length > 0) {
                             let fullAllDataRowMap =
@@ -2722,18 +2840,7 @@ modules = {
                             }
                           }
                         }
-                        that.$nextTick(() => {
-                          setTimeout(function () {
-                            dataTableConfig.callback &&
-                              dataTableConfig.callback(rows);
-                            tableOption.callback && tableOption.callback(rows);
-                            that.handleCustomEvent(
-                              that.widget.options.formScriptCallback,
-                              ["rows"],
-                              [rows]
-                            );
-                          }, 0);
-                        });
+                        that.emitTableDataLoaded(rows, tableOption);
                       }
                     };
                     this.loadDefaultQueryList(reqData, done, customParam);
@@ -3141,6 +3248,53 @@ modules = {
       let scriptCode = this.widget.options.formScriptCode || defaultScriptCode;
       return scriptCode;
     },
+    /**
+     * 本次取数要不要跑「屏幕上那张表格」的成功副作用（树表展开、宿主回调、
+     * tableOption.callback 回写表单模型、formScriptCallback）。
+     *
+     * 导出取数复用的是普通查询这条 proxyConfig.ajax.query，此前只在「建不建行级
+     * schema」那一处分了叉，成功副作用整段照跑，而它们对导出**零意义**：数据在
+     * `resolve(res)` 时就已经交给 excelExport 了，回调还都排在 $nextTick +
+     * setTimeout 之后，改什么也影响不到导出内容。跑了反而有害：
+     * 1. `formScriptCallback`（用户配的「数据加载完成」脚本）会按导出页数被连着触发
+     *    N 次，`rows` 是屏幕上根本看不见的数据；脚本里发的请求还会跟导出取数抢连接；
+     * 2. `tableOption.callback` 是 `formModel[fieldKeyName] = rows`，会把表单模型覆盖
+     *    成导出的最后一页 —— 导出之后 `getValue()` 返回的不再是当前页，且页面上看不
+     *    出任何异常，直到下次查询才被冲掉；
+     * 3. 树表分支会对没进表格的导出行 `setTreeExpand`、去 `fullAllDataRowMap` 里查它们，
+     *    中途还反复开关 `$grid.treeConfig.lazy`，并发几页时互相打架。
+     *
+     * `customParam.export` 由 exportAjax 统一置位，覆盖条件导出与明细的选择/条件导出
+     * 三条会发请求的通道（勾选导出/当前页导出不走这里）。
+     * @param {Object} res 取数响应。
+     * @param {Object} [customParam] 调用方附加参数。
+     * @returns {Boolean}
+     */
+    shouldEmitQueryLoaded(res, customParam) {
+      if (res?.type !== "success") return false;
+      return !customParam?.export;
+    },
+    /**
+     * 派发「表格数据加载完成」的三个回调：宿主注入的 callback、tableOption.callback
+     * （回写表单模型），以及用户配的 formScriptCallback。
+     * 是否该派发由 shouldEmitQueryLoaded 判定，这里只负责发。
+     * @param {Array} rows 本次加载的行。
+     * @param {Object} tableOption 表格配置（callback 挂在它上面）。
+     */
+    emitTableDataLoaded(rows, tableOption) {
+      this.$nextTick(() => {
+        setTimeout(() => {
+          let dataTableConfig = this.dataTableConfig || {};
+          dataTableConfig.callback && dataTableConfig.callback(rows);
+          tableOption && tableOption.callback && tableOption.callback(rows);
+          this.handleCustomEvent(
+            this.widget.options.formScriptCallback,
+            ["rows"],
+            [rows]
+          );
+        }, 0);
+      });
+    },
     /**
      * 执行默认列表查询。
      * @param {Object} reqData 查询请求数据。
@@ -3379,6 +3533,8 @@ modules = {
      *   可以挂多个明细导出按钮、各导各自的列、各走各自的脚本），组装成 exportItemConfig 随
      *   导出参数下发，下游（字段选择弹框 / 分页取数 / 脱敏剔除）一律优先读它，读不到才回落
      *   表格属性那套。
+     *   option.exportButtonName 为导出按钮标识，原样透传给字段选择弹框，用于按按钮分组存放
+     *   勾选记忆（见 excelExport/exportColumnMemory.js）。
      */
     exportData(option) {
       let exportOption = { ...option };
@@ -3612,11 +3768,13 @@ modules = {
       const fieldsToValidate = [];
       let tableColumns = this.widget.options.tableColumns;
       checkRows.forEach((row) => {
-        let fieldSchema = this.fieldSchemaMap[row._X_ROW_KEY];
+        let fieldSchema = this.getRowFieldSchema(row) || {};
         tableColumns.forEach((column) => {
           if (column.widget) {
+            // 列未就绪时 getRowFieldSchema 会给 null，取不到行级组件就按"不必填"跳过，
+            // 而不是在这里抛异常把整个校验打断
             let widget = fieldSchema[column.widget.id];
-            let required = widget.options.required || false;
+            let required = widget?.options?.required || false;
             if (required) {
               let propName = this.getColumnWidgetProp(widget, row);
               fieldsToValidate.push(propName);
@@ -3625,7 +3783,7 @@ modules = {
           if (column.widgetList) {
             column.widgetList.forEach((itemWidget) => {
               let widget = fieldSchema[itemWidget.id];
-              let required = widget.options.required || false;
+              let required = widget?.options?.required || false;
               if (required) {
                 let propName = this.getColumnWidgetProp(widget, row);
                 fieldsToValidate.push(propName);
@@ -3666,9 +3824,9 @@ modules = {
       let sourceWidgetId = isEdit
         ? obj.column?.params?.editWidget?.id
         : obj.column?.params?.widget?.id;
-      if (!sourceWidgetId || !this.fieldSchemaMap[obj.row._X_ROW_KEY])
-        return "false";
-      let fieldWidget = this.fieldSchemaMap[obj.row._X_ROW_KEY][sourceWidgetId];
+      let rowSchema = this.getRowFieldSchema(obj.row);
+      if (!sourceWidgetId || !rowSchema) return "false";
+      let fieldWidget = rowSchema[sourceWidgetId];
       if (!fieldWidget) {
         return "false";
       }
@@ -5690,8 +5848,9 @@ modules = {
     /**
      * 为每一行创建独立字段 schema，避免组件状态在不同行之间共享。
      * @param {Boolean} initFlag true 时忽略旧 schema 并全部重新创建。
+     * @param {Number} retryCount 列未就绪时已重试的次数，见 MAX_SCHEMA_INIT_RETRY。
      */
-    initFieldSchemaData(initFlag) {
+    initFieldSchemaData(initFlag, retryCount = 0) {
       //初始化fieldSchemaData！！！
       /*if (this.widget.type !== 'sub-form') {
         return
@@ -5706,6 +5865,14 @@ modules = {
           if (!this.getTableFullColumns().length) {
             return false;
           }
+          // 大数据量不再预建：按「行数 × 组件列数」深克隆，万行量级直接把标签页撑爆
+          // （与条件导出那次崩溃同源）。交给 getRowFieldSchema 在渲染/校验时按需建。
+          if (rowLength > this.getLazyRowSchemaThreshold()) {
+            // initFlag 表示"整体重建"，此时旧 schema 必须丢弃；否则（addRow /
+            // deleteRow）保留已建的那些，避免把行内脚本写进去的状态一起清掉。
+            if (initFlag) this.fieldSchemaMap = {};
+            return true;
+          }
           let fieldSchemaMap = {};
           let fieldSchemaMap0 = this.fieldSchemaMap;
           for (let i = 0; i < rowLength; i++) {
@@ -5714,10 +5881,12 @@ modules = {
             if (initFlag) {
               fieldSchemaMap2 = this.createRowFieldSchemaMap();
             } else {
-              let fieldSchemaMap01 = fieldSchemaMap0[rowId];
-              fieldSchemaMap2 = fieldSchemaMap01
-                ? this.$baseLodash.cloneDeep(fieldSchemaMap01)
-                : this.createRowFieldSchemaMap();
+              // 沿用旧行的 schema 对象本身，不再 cloneDeep：该对象本来就是这一行
+              // 独享的（按 rowId 分桶），克隆只会产出语义完全相同的另一份，白占一份
+              // 内存。而本分支的调用方是 addRow / deleteRow —— 每增删一行都把全表深
+              // 克隆一遍是 O(N²)，千行树表上每次增删都要停顿数秒并制造等量垃圾。
+              fieldSchemaMap2
+                = fieldSchemaMap0[rowId] || this.createRowFieldSchemaMap();
             }
             fieldSchemaMap[rowId] = fieldSchemaMap2;
           }
@@ -5725,9 +5894,19 @@ modules = {
           return true;
         };
         if (!build()) {
+          // 列未就绪时隔一帧重试。必须有上限：动态列请求失败 / 列配置为空时列永远不会
+          // 出现，而 rowIdData 非空，这条 $nextTick 自递归就成了每帧一次的死循环，
+          // 页面永久卡死（setValue 侧另有 pendingSchemaInit 挡了一条入口，但
+          // initValue / addRow / deleteRow / 动态列重载都能直接进到这里）。
+          if (retryCount >= MAX_SCHEMA_INIT_RETRY) {
+            console.warn(
+              "[data-table] 表格列始终未就绪，已停止行级 schema 重建重试"
+            );
+            return;
+          }
           this.$nextTick(() => {
             if (this.rowIdData.length) {
-              this.initFieldSchemaData(initFlag);
+              this.initFieldSchemaData(initFlag, retryCount + 1);
             }
           });
         }
@@ -5824,6 +6003,30 @@ modules = {
       return newFieldSchema;
     },
     //end1
+    /**
+     * 导出取数的行初始化：只补行主键并打导出标记，**不建行级 schema**。
+     *
+     * 行级 schema 的意义是让同一列的组件在不同行之间互不干扰（行内脚本改 options、
+     * 编辑态等）。导出行既不进 vxe 表格也不会被编辑，createRowFieldSchemaMap 产出的
+     * 只是列模板的等价深克隆（仅 id 不同）—— 异步选项同步写的是列模板本身
+     * (collectColumnWidgetConfigRequests)，行内脚本改的是已挂载的组件实例，都不会让
+     * 导出行的 schema 与列模板产生差异。
+     *
+     * 但代价是按「行数 × 组件列数」做 deepClone 并常驻 fieldSchemaMap，而该 map 在导出
+     * 期间没有任何释放路径（只有删行、或下次正常查询走 initFieldSchemaData 整体重建才清），
+     * 10 万行量级直接把标签页撑爆。取值侧对缺失行级 schema 本就有回退列模板的分支
+     * （列 filterVal、getTableColumnWidget、getRowWidget），故跳过构建不改变导出内容。
+     *
+     * 注意：树表懒加载走的仍是 initExportFieldSchemaData —— 那批行是要进表格的真实行。
+     * @param {Array} rows 导出取回的当页数据。
+     */
+    initExportRows(rows) {
+      if (!rows) return;
+      for (let row of rows) {
+        if (!row._X_ROW_KEY) row._X_ROW_KEY = "row_" + generateId();
+        row._X_EXPORT_ROW = true;
+      }
+    },
     /** @param {Array} rows 导出数据。为无行主键的数据创建临时 schema。 */
     initExportFieldSchemaData(rows) {
       if (!rows) return;

package/src/components/xform/form-render/container-item/list-h5-item.vue

@@ -481,7 +481,7 @@
       width="100%"
       top="0px"
       v-el-drag-dialog
-      v-el-dialog-center
+      v-el-dialog-center
       :append-to-body	="true"
       :destroy-on-close="true"
     >