qidian-vue-ui 2.0.2 → 2.0.3

package/dist/components/service/table/index.css

@@ -1,58 +1,58 @@
-.qd-service-table[data-v-ae90af38] {
+.qd-service-table[data-v-616e3cad] {
   height: 100%;
   display: flex;
   flex-direction: column;
 }
-.qd-service-table[data-v-ae90af38] >  .t-table__content {
+.qd-service-table[data-v-616e3cad] >  .t-table__content {
   flex: 1;
 }
-.qd-service-table[data-v-ae90af38] .t-table__tree-col:not(:has(.t-table__tree-op-icon)) {
+.qd-service-table[data-v-616e3cad] .t-table__tree-col:not(:has(.t-table__tree-op-icon)) {
   margin-left: calc(var(--td-font-size-body-large) + var(--td-comp-margin-s));
 }
-.qd-service-table[data-v-ae90af38] .t-table__tree-leaf-node .t-table__tree-op-icon:empty {
+.qd-service-table[data-v-616e3cad] .t-table__tree-leaf-node .t-table__tree-op-icon:empty {
   width: calc(var(--td-font-size-body-large) + var(--td-comp-margin-s));
 }
-.qd-service-table[data-v-ae90af38] .t-affix > .t-table__affixed-header-elm-wrap,
-.qd-service-table[data-v-ae90af38] .t-affix > .t-table__scrollbar--obvious {
-  transform: var(--v42be12ab);
+.qd-service-table[data-v-616e3cad] .t-affix > .t-table__affixed-header-elm-wrap,
+.qd-service-table[data-v-616e3cad] .t-affix > .t-table__scrollbar--obvious {
+  transform: var(--v17ef397a);
 }
-.qd-service-table--horizontal-bar-static[data-v-ae90af38] .t-table__scrollbar--obvious {
+.qd-service-table--horizontal-bar-static[data-v-616e3cad] .t-table__scrollbar--obvious {
   visibility: hidden;
   pointer-events: none;
 }
-.qd-service-table[data-v-ae90af38] .t-table__affixed-header-elm-wrap {
+.qd-service-table[data-v-616e3cad] .t-table__affixed-header-elm-wrap {
   height: auto !important;
 }
-.qd-service-table[data-v-ae90af38] .t-table__affixed-header-elm {
+.qd-service-table[data-v-616e3cad] .t-table__affixed-header-elm {
   position: relative;
   scrollbar-width: none;
 }
-.qd-service-table[data-v-ae90af38] .t-table__affixed-header-elm::-webkit-scrollbar {
+.qd-service-table[data-v-616e3cad] .t-table__affixed-header-elm::-webkit-scrollbar {
   display: none;
   width: 0;
   height: 0;
 }
-.qd-service-table[data-v-ae90af38] .t-table__virtual-scroll-cursor + table {
+.qd-service-table[data-v-616e3cad] .t-table__virtual-scroll-cursor + table {
   border-collapse: separate;
 }
-.qd-service-table[data-v-ae90af38] .t-table__expanded-row-inner {
+.qd-service-table[data-v-616e3cad] .t-table__expanded-row-inner {
   position: sticky;
   left: 0;
-  width: var(--cf433440) !important;
+  width: var(--v61770878) !important;
 }
-.qd-service-table[data-v-ae90af38] .t-table__cell-wrap > *:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
+.qd-service-table[data-v-616e3cad] .t-table__cell-wrap > *:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
   width: 100%;
 }
-.qd-service-table[data-v-ae90af38] .qd-service-table__non-editable-col {
+.qd-service-table[data-v-616e3cad] .qd-service-table__non-editable-col {
   background-color: color-mix(in srgb, var(--td-bg-color-component) 50%, transparent);
 }
-.qd-service-table[data-v-ae90af38]  .qd-service-table__non-editable-col:is(
+.qd-service-table[data-v-616e3cad]  .qd-service-table__non-editable-col:is(
         .t-table__cell--fixed-left,
         .t-table__cell--fixed-right
       ) {
   background-color: inherit;
   background-image: linear-gradient(color-mix(in srgb, var(--td-bg-color-secondarycontainer) 50%, transparent), color-mix(in srgb, var(--td-bg-color-secondarycontainer) 50%, transparent));
 }
-.qd-service-table--disable-horizontal-scroll[data-v-ae90af38] colgroup > col {
+.qd-service-table--disable-horizontal-scroll[data-v-616e3cad] colgroup > col {
   width: auto !important;
 }

package/dist/components/service/table/index.vue.mjs

@@ -2,7 +2,7 @@ import './index.css'
 import _sfc_main from "./index.vue2.mjs";
 /* empty css            */
 import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
-const QdServiceTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ae90af38"]]);
+const QdServiceTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-616e3cad"]]);
 export {
   QdServiceTable as default
 };

package/dist/components/service/table/index.vue2.mjs

@@ -4,6 +4,7 @@ import { useVModels, useElementSize, useElementBounding, useIntersectionObserver
 import { useActivated, useTimer, easyCopy, isEmpty, suspectedWrapperPromise, useServicePagination, createExposeProxy, resizeDirective, getScrollEl } from "qidian-shared";
 import { LoadingIcon, AddRectangleIcon, MinusRectangleIcon } from "tdesign-icons-vue-next";
 import { EnhancedTable, Table, Empty } from "tdesign-vue-next";
+import { validate } from "tdesign-vue-next/es/form/utils/form-model.mjs";
 import { useModal } from "../../../hooks/useModal.mjs";
 import { getTransformOffset } from "../../../utils/tools.mjs";
 import { useConfig } from "../../config-provider/useConfig.mjs";
@@ -13,6 +14,7 @@ import { qdServiceTableTreeConfig, qdServiceTableProps, getSortParams } from "./
 import { PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUEUE } from "../../form/config.mjs";
 import get from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/get.mjs";
 import QdForm from "../../form/index.vue.mjs";
+import set from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/set.mjs";
 const defaultMinWidth = 80;
 const defaultVirtualScrollBufferSize = 2;
 const defaultVirtualScrollUpdateInterval = 16;
@@ -318,8 +320,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     emit: __emit
   }) {
     useCssVars((_ctx) => ({
-      "v42be12ab": affixedHeaderTransform.value,
-      "cf433440": expandedRowWidth.value
+      "v17ef397a": affixedHeaderTransform.value,
+      "v61770878": expandedRowWidth.value
     }));
     const props = __props;
     const emit = __emit;
@@ -986,6 +988,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (getQdFormComponentName(formItem.component).includes("upload")) return true;
       return false;
     }
+    function shouldRenderVirtualFormItem(column, row) {
+      if (!resolveFormItemVirtualRender(column)) return false;
+      if (column.formItem?.virtualValidateRender !== void 0) return true;
+      if (!getQdFormComponentName(column.formItem?.component).includes("upload")) return true;
+      const filesModel = column.formItem?.component?.vModelFiles;
+      if (typeof filesModel !== "string") return true;
+      const files = get(row, filesModel);
+      return Array.isArray(files) && files.some((file) => file.status !== "success");
+    }
     function removeEditingCell(target) {
       editingCells.value = editingCells.value.filter((item) => !isSameEditingCell(item, target));
       if (!activeEditingCell.value || !isSameEditingCell(activeEditingCell.value, target)) return;
@@ -1144,45 +1155,68 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         row
       });
     }
-    function buildRowFormItems(row) {
-      return editableColumns.value.filter(({
-        column
-      }) => (column.formItem || column.edit?.rules) && column.colKey).map(({
-        column
-      }) => {
-        const formItem = column.formItem;
-        const label = typeof column.title === "string" ? column.title : "";
-        const shouldRender = resolveFormItemVirtualRender(column);
-        const {
-          component: _,
-          ...restFormItem
-        } = formItem ?? {};
-        const resolved = resolveQdFormItemOptions({
-          formItem: {
-            ...formItem ?? {},
-            rules: formItem?.rules ?? resolveColumnRules(column.edit?.rules, row)
-          },
-          context: row,
-          label,
-          t: formT
-        });
-        return {
-          name: column.colKey,
-          label,
-          ...shouldRender ? formItem ?? {} : restFormItem,
-          rules: resolved.rules,
-          context: row
-        };
-      });
+    function buildOffscreenForm(rows, renderVirtualComponents) {
+      const formData = {};
+      const fields = [];
+      const items = [];
+      for (const row of rows) {
+        for (const {
+          column
+        } of editableColumns.value) {
+          if (!column.formItem && !column.edit?.rules || !column.colKey) continue;
+          if (!resolveFormItemIfRender(column, row)) continue;
+          const formItem = column.formItem;
+          const label = typeof column.title === "string" ? column.title : "";
+          const shouldRender = renderVirtualComponents && shouldRenderVirtualFormItem(column, row);
+          const resolved = resolveQdFormItemOptions({
+            formItem: {
+              ...formItem ?? {},
+              rules: formItem?.rules ?? resolveColumnRules(column.edit?.rules, row)
+            },
+            context: row,
+            label,
+            t: formT
+          });
+          if (!resolved.rules.length && !shouldRender) continue;
+          const name = getCellKey(row, column.colKey);
+          Object.defineProperty(formData, name, {
+            configurable: true,
+            enumerable: true,
+            get: () => get(row, column.colKey),
+            set: (value) => set(row, column.colKey, value)
+          });
+          if (resolved.rules.length) fields.push({
+            name,
+            rules: resolved.rules
+          });
+          if (shouldRender) {
+            const submitFormItem = {
+              ...formItem ?? {}
+            };
+            delete submitFormItem.required;
+            delete submitFormItem.rules;
+            items.push({
+              name,
+              label,
+              ...submitFormItem,
+              context: row
+            });
+          }
+        }
+      }
+      return {
+        fields,
+        formData,
+        items
+      };
     }
     function serializeOffscreen(task) {
       const run2 = offscreenChain.then(task, task);
       offscreenChain = run2.then(() => void 0, () => void 0);
       return run2;
     }
-    async function mountOffscreenForm(row) {
+    async function mountOffscreenForm(formData, items) {
       unmountOffscreenForm();
-      const items = buildRowFormItems(row);
       const container = document.createElement("div");
       container.setAttribute("aria-hidden", "true");
       Object.assign(container.style, {
@@ -1197,7 +1231,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       });
       document.body.appendChild(container);
       const vnode = h(QdForm, {
-        data: row,
+        data: formData,
         items
       });
       vnode.appContext = offscreenAppContext;
@@ -1217,139 +1251,120 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       offscreenContainer = null;
       offscreenInstance = null;
     }
-    async function validateRowViaOffscreenForm(row) {
-      await mountOffscreenForm(row);
-      return offscreenInstance.validate({
-        showErrorMessage: false
-      });
-    }
-    async function submitRowViaOffscreenForm(row) {
-      await mountOffscreenForm(row);
-      return offscreenInstance.submit({
-        showErrorMessage: false
-      });
-    }
-    function mergeRowValidateResult(result, row, rowResult) {
-      if (typeof rowResult !== "object" || !rowResult) return;
-      for (const [colKey, errorList] of Object.entries(rowResult)) {
-        if (!Array.isArray(errorList) || !errorList.length) continue;
-        result[getCellKey(row, colKey)] = errorList;
-      }
+    async function validateRowsViaOffscreenRules(rows) {
+      const {
+        fields,
+        formData
+      } = buildOffscreenForm(rows, false);
+      const result = {};
+      await Promise.all(fields.map(async ({
+        name,
+        rules
+      }) => {
+        const ruleResults = await validate(get(formData, name), rules, {
+          formData,
+          name
+        });
+        if (ruleResults.some((item) => item.result !== true)) result[name] = ruleResults;
+      }));
+      return result;
     }
-    async function validateTableViaOffscreenForm() {
+    async function runOffscreenBeforeSubmit(rows) {
+      const {
+        formData,
+        items
+      } = buildOffscreenForm(rows, true);
+      if (!items.length) return {
+        success: true,
+        message: ""
+      };
       try {
-        const result = {};
-        for (const row of data.value) {
-          const rowResult = await validateRowViaOffscreenForm(row);
-          mergeRowValidateResult(result, row, rowResult);
-        }
-        return result;
+        await mountOffscreenForm(formData, items);
+        const submitContext = await offscreenInstance.submit({
+          showErrorMessage: false
+        });
+        return {
+          success: submitContext.validateResult === true,
+          message: submitContext.firstError ?? ""
+        };
       } finally {
         unmountOffscreenForm();
       }
     }
+    async function validateTableViaOffscreenForm() {
+      return validateRowsViaOffscreenRules(data.value);
+    }
     async function validateSingleRowViaOffscreenForm(rowValue) {
-      try {
-        const row = data.value.find((item) => getRowValue(item) === rowValue);
-        if (!row) return [];
-        const rowResult = await validateRowViaOffscreenForm(row);
-        const result = {};
-        mergeRowValidateResult(result, row, rowResult);
-        return resolveValidationResults(result);
-      } finally {
-        unmountOffscreenForm();
-      }
+      const row = data.value.find((item) => getRowValue(item) === rowValue);
+      if (!row) return [];
+      const result = await validateRowsViaOffscreenRules([row]);
+      return resolveValidationResults(result);
     }
     async function submitTableViaOffscreenForm(params, showErrorMessage) {
-      try {
-        const result = {};
-        for (const row of data.value) {
-          const submitContext = await submitRowViaOffscreenForm(row);
-          if (submitContext.validateResult === true) continue;
-          const rowValidateResult = submitContext.validateResult;
-          if (rowValidateResult && typeof rowValidateResult === "object") {
-            mergeRowValidateResult(result, row, rowValidateResult);
-            continue;
-          }
-          if (showErrorMessage && submitContext.firstError) msgError(submitContext.firstError);
-          return {
-            result: {},
-            results: [],
-            validateResult: false,
-            firstError: submitContext.firstError,
-            showErrorMessage,
-            tableData: easyCopy(data.value)
-          };
-        }
-        const cellResults = resolveValidationResults(result);
-        if (cellResults.length) await showFirstValidationError(cellResults, {
-          ...params,
-          showErrorMessage
-        });
+      const queueResult = await runOffscreenBeforeSubmit(data.value);
+      if (!queueResult.success) {
+        if (showErrorMessage && queueResult.message) msgError(queueResult.message);
         return {
-          result,
-          results: cellResults,
-          validateResult: !cellResults.length,
-          firstError: getFirstValidationError(cellResults),
+          result: {},
+          results: [],
+          validateResult: false,
+          firstError: queueResult.message,
           showErrorMessage,
           tableData: easyCopy(data.value)
         };
-      } finally {
-        unmountOffscreenForm();
       }
+      const result = await validateRowsViaOffscreenRules(data.value);
+      const cellResults = resolveValidationResults(result);
+      if (cellResults.length) await showFirstValidationError(cellResults, {
+        ...params,
+        showErrorMessage
+      });
+      return {
+        result,
+        results: cellResults,
+        validateResult: !cellResults.length,
+        firstError: getFirstValidationError(cellResults),
+        showErrorMessage,
+        tableData: easyCopy(data.value)
+      };
     }
     async function submitSingleRowViaOffscreenForm(row, params, showErrorMessage) {
-      try {
-        if (!row) {
-          return {
-            result: [],
-            trigger: "parent",
-            validateResult: false,
-            showErrorMessage,
-            rowData: void 0
-          };
-        }
-        const submitContext = await submitRowViaOffscreenForm(row);
-        const rowData = easyCopy(row);
-        if (submitContext.validateResult === true) {
-          return {
-            result: [],
-            trigger: "parent",
-            validateResult: true,
-            showErrorMessage,
-            rowData
-          };
-        }
-        const rowValidateResult = submitContext.validateResult;
-        if (rowValidateResult && typeof rowValidateResult === "object") {
-          const result = {};
-          mergeRowValidateResult(result, row, rowValidateResult);
-          const cellResults = resolveValidationResults(result);
-          await showFirstValidationError(cellResults, {
-            ...params,
-            showErrorMessage
-          });
-          return {
-            result: cellResults,
-            trigger: "parent",
-            validateResult: false,
-            firstError: getFirstValidationError(cellResults),
-            showErrorMessage,
-            rowData
-          };
-        }
-        if (showErrorMessage && submitContext.firstError) msgError(submitContext.firstError);
+      if (!row) {
         return {
           result: [],
           trigger: "parent",
           validateResult: false,
-          firstError: submitContext.firstError,
+          showErrorMessage,
+          rowData: void 0
+        };
+      }
+      const queueResult = await runOffscreenBeforeSubmit([row]);
+      const rowData = easyCopy(row);
+      if (!queueResult.success) {
+        if (showErrorMessage && queueResult.message) msgError(queueResult.message);
+        return {
+          result: [],
+          trigger: "parent",
+          validateResult: false,
+          firstError: queueResult.message,
           showErrorMessage,
           rowData
         };
-      } finally {
-        unmountOffscreenForm();
       }
+      const result = await validateRowsViaOffscreenRules([row]);
+      const cellResults = resolveValidationResults(result);
+      await showFirstValidationError(cellResults, {
+        ...params,
+        showErrorMessage
+      });
+      return {
+        result: cellResults,
+        trigger: "parent",
+        validateResult: !cellResults.length,
+        firstError: getFirstValidationError(cellResults),
+        showErrorMessage,
+        rowData
+      };
     }
     async function validateTableData(params) {
       const result = isVirtualScroll.value ? await serializeOffscreen(() => validateTableViaOffscreenForm()) : (await tableRef.value?.validateTableData())?.result ?? {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "qidian-vue-ui",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "基于 TDesign 的 QiDian Vue UI 组件库",
   "author": "qidian",
   "license": "MIT",