qidian-vue-ui 2.4.1 → 2.5.0

package/dist/components/crud/search/index.vue.d.ts

@@ -8,9 +8,11 @@ type __VLS_Slots = {} & {
 declare const __VLS_component: import("vue").DefineComponent<QdCrudSearchProps, {
     submit: (params?: {
         showErrorMessage?: boolean;
+        showFirstErrorMessage?: boolean;
         scrollToFirstError?: import("../..").QdFormProps["scrollToFirstError"];
     }) => Promise<import("../..").QdFormSubmitContext<import("tdesign-vue-next").Data>>;
     validate: (params?: import("tdesign-vue-next").FormValidateParams & {
+        showFirstErrorMessage?: boolean;
         scrollToFirstError?: import("../..").QdFormProps["scrollToFirstError"];
     }) => Promise<import("tdesign-vue-next").FormValidateResult<import("tdesign-vue-next").Data>>;
     clearValidate: (fields?: (string | number)[] | undefined) => void;
@@ -36,6 +38,8 @@ declare const __VLS_component: import("vue").DefineComponent<QdCrudSearchProps,
     gutter: number | import("tdesign-vue-next").GutterObject | (number | import("tdesign-vue-next").GutterObject)[];
     grid: import("../..").QdGridItemProps;
     defaultClearable: boolean;
+    autoFill: boolean;
+    showFirstErrorMessage: boolean;
     btnDisabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/components/crud/search/index.vue2.mjs

@@ -25,6 +25,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     loadingProps: {},
     defaultClearable: { type: Boolean },
     descriptions: { type: Boolean },
+    autoFill: { type: Boolean },
+    showFirstErrorMessage: { type: Boolean },
     onSubmit: { type: Function },
     colon: { type: Boolean },
     data: {},

package/dist/components/crud/search/props.d.ts

@@ -23,6 +23,7 @@ export declare const qdCrudSearchProps: {
     };
     readonly gutter: () => number[];
     readonly data: () => any;
+    readonly autoFill: true;
     readonly disabled: undefined;
     readonly readonly: undefined;
     readonly labelWidth: "auto";
@@ -32,5 +33,6 @@ export declare const qdCrudSearchProps: {
     readonly preventSubmitDefault: true;
     readonly requiredMark: undefined;
     readonly showErrorMessage: true;
+    readonly showFirstErrorMessage: true;
     readonly statusIcon: undefined;
 };

package/dist/components/dialog/form.vue.mjs

@@ -23,6 +23,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     loadingProps: {},
     defaultClearable: { type: Boolean },
     descriptions: { type: Boolean },
+    autoFill: { type: Boolean },
+    showFirstErrorMessage: { type: Boolean },
     colon: { type: Boolean },
     data: {},
     disabled: { type: Boolean },

package/dist/components/dialog/props.d.ts

@@ -36,6 +36,7 @@ export declare const qdDialogFormProps: {
     readonly gutter: () => number[];
     readonly grid: () => {};
     readonly data: () => any;
+    readonly autoFill: true;
     readonly disabled: undefined;
     readonly readonly: undefined;
     readonly labelWidth: "auto";
@@ -45,6 +46,7 @@ export declare const qdDialogFormProps: {
     readonly preventSubmitDefault: true;
     readonly requiredMark: undefined;
     readonly showErrorMessage: true;
+    readonly showFirstErrorMessage: true;
     readonly statusIcon: undefined;
     readonly defaultClearable: undefined;
 };

package/dist/components/form/config.d.ts

@@ -1,5 +1,11 @@
-import type { InjectionKey } from 'vue';
+import type { ComputedRef, InjectionKey } from 'vue';
 import type { QdFormBeforeSubmitQueueItem } from './types';
+export interface QdFormGridItemRegistryEntry {
+    gridIndex: ComputedRef<number | undefined>;
+    visible: ComputedRef<boolean>;
+    colSpan: ComputedRef<number>;
+}
+export declare const PROVIDE_FORM_REGISTER_GRID_ITEM: InjectionKey<(entry: QdFormGridItemRegistryEntry) => void>;
 export declare const PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUEUE: InjectionKey<(item: QdFormBeforeSubmitQueueItem) => void>;
 export declare const PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE: InjectionKey<(item: QdFormBeforeSubmitQueueItem) => void>;
 export declare const PROVIDE_FORM_RESET_QUEUE: InjectionKey<(item: () => void) => void>;

package/dist/components/form/config.mjs

@@ -1,8 +1,10 @@
+const PROVIDE_FORM_REGISTER_GRID_ITEM = /* @__PURE__ */ Symbol("QdFormRegisterGridItem");
 const PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUEUE = /* @__PURE__ */ Symbol("QdFormAddBeforeSubmitQueue");
 const PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE = /* @__PURE__ */ Symbol("QdFormAddAfterSubmitQueue");
 const PROVIDE_FORM_RESET_QUEUE = /* @__PURE__ */ Symbol("QdFormResetQueue");
 export {
   PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE,
   PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUEUE,
+  PROVIDE_FORM_REGISTER_GRID_ITEM,
   PROVIDE_FORM_RESET_QUEUE
 };

package/dist/components/form/index.css

@@ -1,28 +1,28 @@
-.qd-form--small[data-v-10c3d73e] {
+.qd-form--small[data-v-151bafd6] {
   font: var(--td-font-body-small);
 }
-.qd-form--small[data-v-10c3d73e] .t-form__label--top {
+.qd-form--small[data-v-151bafd6] .t-form__label--top {
   min-height: var(--td-comp-margin-xxl);
   line-height: var(--td-comp-margin-xxl);
 }
-.qd-form--small[data-v-10c3d73e] .t-form__controls,
-.qd-form--small[data-v-10c3d73e] .t-form__controls-content {
+.qd-form--small[data-v-151bafd6] .t-form__controls,
+.qd-form--small[data-v-151bafd6] .t-form__controls-content {
   min-height: var(--td-comp-margin-xxl);
 }
-.qd-form--descriptions[data-v-10c3d73e] .qd-grid {
+.qd-form--descriptions[data-v-151bafd6] .qd-grid {
   border-top: 1px solid var(--td-component-border);
   border-left: 1px solid var(--td-component-border);
 }
-.qd-form--descriptions[data-v-10c3d73e] .qd-grid-item {
+.qd-form--descriptions[data-v-151bafd6] .qd-grid-item {
   border-right: 1px solid var(--td-component-border);
   border-bottom: 1px solid var(--td-component-border);
 }
-.qd-form--descriptions[data-v-10c3d73e] .t-form__item {
+.qd-form--descriptions[data-v-151bafd6] .t-form__item {
   display: flex;
   align-items: stretch;
   height: 100%;
 }
-.qd-form--descriptions[data-v-10c3d73e] .t-form__label {
+.qd-form--descriptions[data-v-151bafd6] .t-form__label {
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -30,17 +30,17 @@
   padding: var(--td-comp-paddingLR-m) var(--td-comp-paddingLR-l);
   height: 100%;
 }
-.qd-form--descriptions[data-v-10c3d73e] .t-form__label--top {
+.qd-form--descriptions[data-v-151bafd6] .t-form__label--top {
   border-bottom: 1px solid var(--td-component-border);
   align-items: center;
   height: var(--qd-form-description-label-height, auto);
   white-space: normal;
 }
-.qd-form--descriptions[data-v-10c3d73e] .t-form__label--top + .t-form__controls > .t-form__controls-content {
+.qd-form--descriptions[data-v-151bafd6] .t-form__label--top + .t-form__controls > .t-form__controls-content {
   justify-content: center;
   text-align: center;
 }
-.qd-form--descriptions[data-v-10c3d73e] .t-form__controls {
+.qd-form--descriptions[data-v-151bafd6] .t-form__controls {
   flex: 1 1 0;
   overflow: hidden;
   display: flex;
@@ -50,28 +50,31 @@
   margin-left: 0 !important;
   height: 100%;
 }
-.qd-form--descriptions[data-v-10c3d73e] .qd-form-item--label-top {
+.qd-form--descriptions[data-v-151bafd6] .qd-form-item--label-top {
   display: grid;
   grid-template-rows: auto minmax(min-content, auto);
   grid-row: span 2 !important;
 }
-.qd-form--descriptions[data-v-10c3d73e] .qd-form-item--label-top > .t-form__item {
+.qd-form--descriptions[data-v-151bafd6] .qd-form-item--label-top > .t-form__item {
   display: contents;
 }
-.qd-form--descriptions[data-v-10c3d73e] .qd-form-item--label-top .t-form__controls-content {
+.qd-form--descriptions[data-v-151bafd6] .qd-form-item--label-top .t-form__controls-content {
   white-space: normal;
 }
-.qd-form--descriptions[data-v-10c3d73e] .qd-form-item--empty-content .t-form__controls {
+.qd-form--descriptions[data-v-151bafd6] .qd-form-item--empty-content .t-form__controls {
   padding: 0 !important;
   min-height: 0;
   height: 0;
   overflow: hidden;
 }
-.qd-form--descriptions[data-v-10c3d73e] .qd-form-item:not(.qd-form-item--label-top):not(.qd-form-item--label-width-full) .t-form__label {
+.qd-form--descriptions[data-v-151bafd6] .qd-form-item:not(.qd-form-item--label-top):not(.qd-form-item--label-width-full) .t-form__label {
   border-right: 1px solid var(--td-component-border);
 }
-.qd-form--descriptions-mini[data-v-10c3d73e] .t-form__label,
-.qd-form--descriptions-mini[data-v-10c3d73e] .t-form__controls {
+.qd-form--descriptions[data-v-151bafd6] .qd-form-item--filler {
+  background-color: var(--td-bg-color-secondarycontainer);
+}
+.qd-form--descriptions-mini[data-v-151bafd6] .t-form__label,
+.qd-form--descriptions-mini[data-v-151bafd6] .t-form__controls {
   padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs);
   font: var(--td-font-body-small);
 }

package/dist/components/form/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 QdForm = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-10c3d73e"]]);
+const QdForm = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-151bafd6"]]);
 export {
   QdForm as default
 };

package/dist/components/form/index.vue2.mjs

@@ -1,15 +1,17 @@
 import './index.css'
-import { defineComponent, mergeDefaults, provide, nextTick, onBeforeUnmount, useTemplateRef, ref, computed, watch, onMounted, withDirectives, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot, normalizeProps, guardReactiveProps, createElementBlock, Fragment, renderList } from "vue";
+import { defineComponent, mergeDefaults, provide, nextTick, onBeforeUnmount, shallowRef, useTemplateRef, ref, computed, watch, onMounted, withDirectives, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot, normalizeProps, guardReactiveProps, createElementBlock, Fragment, renderList } from "vue";
 import { useVModels } from "../../node_modules/.pnpm/@vueuse_core@14.2.0_vue@3.5.26_typescript@5.9.3_/node_modules/@vueuse/core/dist/index.mjs";
 import { createExposeProxy, resizeDirective, easyCopy, hasOwn, to, suspectedWrapperPromise } from "qidian-shared";
 import { Form, LoadingDirective } from "tdesign-vue-next";
 import { useModal } from "../../hooks/useModal.mjs";
 import { useConfig } from "../config-provider/useConfig.mjs";
-import { PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUEUE, PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE, PROVIDE_FORM_RESET_QUEUE } from "./config.mjs";
+import { DEFAULT_COLUMNS } from "../grid/config.mjs";
+import { PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUEUE, PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE, PROVIDE_FORM_RESET_QUEUE, PROVIDE_FORM_REGISTER_GRID_ITEM } from "./config.mjs";
 import QdFormItem from "./item.vue.mjs";
 import { qdFormGrid, qdFormProps } from "./props.mjs";
 import merge from "../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/merge.mjs";
 import QdGrid from "../grid/index.vue.mjs";
+import QdGridItem from "../grid/item.vue.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: "QdForm"
@@ -23,6 +25,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     loadingProps: {},
     defaultClearable: { type: Boolean },
     descriptions: { type: Boolean },
+    autoFill: { type: Boolean },
+    showFirstErrorMessage: { type: Boolean },
     onSubmit: { type: Function },
     colon: { type: Boolean },
     data: {},
@@ -83,9 +87,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         resetQueue.splice(index, 1);
       });
     });
+    const gridItemRegistry = shallowRef([]);
+    provide(PROVIDE_FORM_REGISTER_GRID_ITEM, (entry) => {
+      nextTick(() => {
+        gridItemRegistry.value = [...gridItemRegistry.value, entry];
+      });
+      onBeforeUnmount(() => {
+        gridItemRegistry.value = gridItemRegistry.value.filter((it) => it !== entry);
+      });
+    });
     const formRef = useTemplateRef("form");
     const gridRef = useTemplateRef("gridInstance");
     const submitShowErrorMessage = ref();
+    const submitShowFirstErrorMessage = ref();
     const submitScrollToFirstError = ref();
     let submitResolver;
     const reProps = computed(() => {
@@ -97,6 +111,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         items,
         onSubmit,
         data: data2,
+        showFirstErrorMessage,
         scrollToFirstError,
         loading: externalLoad,
         size,
@@ -142,11 +157,45 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         ...props.loadingProps
       };
     });
+    const gridNodes = computed(() => {
+      const items = reProps.value.formItems;
+      if (!items?.length) return [];
+      if (!reProps.value.descriptions || !props.autoFill) {
+        return items.map((_, index) => ({ type: "item", index }));
+      }
+      const columns = reProps.value.gridOptions.columns ?? DEFAULT_COLUMNS;
+      const entryMap = new Map(gridItemRegistry.value.map((entry) => [entry.gridIndex.value, entry]));
+      const nodes = [];
+      let used = 0;
+      items.forEach((_, index) => {
+        const entry = entryMap.get(index);
+        if (entry?.visible.value) {
+          const span = entry.colSpan.value;
+          if (span > 0) {
+            if (used + span > columns) {
+              const remaining2 = columns - used;
+              if (remaining2 > 0) nodes.push({ type: "filler", span: remaining2 });
+              used = 0;
+            }
+            used += span;
+          }
+        }
+        nodes.push({ type: "item", index });
+      });
+      const remaining = columns - used;
+      if (remaining > 0) nodes.push({ type: "filler", span: remaining });
+      return nodes;
+    });
+    const descriptionsFillerRow = computed(
+      () => reProps.value.formOptions.labelAlign === "top" ? 2 : 1
+    );
     async function handleSubmit(context) {
       const showErrorMessage = submitShowErrorMessage.value ?? props.showErrorMessage;
+      const showFirstErrorMessage = submitShowFirstErrorMessage.value ?? props.showFirstErrorMessage;
       submitShowErrorMessage.value = void 0;
+      submitShowFirstErrorMessage.value = void 0;
       submitScrollToFirstError.value = void 0;
-      if (showErrorMessage && context.firstError) {
+      if (showFirstErrorMessage && context.firstError) {
         msgError(context.firstError);
       }
       const submitContext = {
@@ -167,6 +216,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const expose = {
       submit: async (params) => {
         submitShowErrorMessage.value = params?.showErrorMessage;
+        submitShowFirstErrorMessage.value = params?.showFirstErrorMessage;
         submitScrollToFirstError.value = params?.scrollToFirstError;
         const queueRes = await Promise.all(
           beforeSubmitQueue.map((item) => suspectedWrapperPromise(item()))
@@ -189,8 +239,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           }
         });
         const showErrorMessage = submitShowErrorMessage.value ?? props.showErrorMessage;
+        const showFirstErrorMessage = submitShowFirstErrorMessage.value ?? props.showFirstErrorMessage ?? showErrorMessage;
         if (reQueueRes.success === false) {
-          if (showErrorMessage && reQueueRes.message) {
+          if (showFirstErrorMessage && reQueueRes.message) {
             msgError(reQueueRes.message);
           }
           const context = {
@@ -201,6 +252,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             crudMode: reProps.value.formOptions.crudMode
           };
           submitShowErrorMessage.value = context.showErrorMessage;
+          submitShowFirstErrorMessage.value = false;
           handleSubmit(context);
           return context;
         }
@@ -229,12 +281,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       },
       validate: async (params) => {
         submitShowErrorMessage.value = params?.showErrorMessage;
+        submitShowFirstErrorMessage.value = params?.showFirstErrorMessage;
         submitScrollToFirstError.value = !params ? void 0 : hasOwn(params, "scrollToFirstError") ? params.scrollToFirstError : "";
         const [err, res] = await to(formRef.value.validate(params));
         submitShowErrorMessage.value = void 0;
+        submitShowFirstErrorMessage.value = void 0;
         submitScrollToFirstError.value = void 0;
         if (err) throw err;
-        if (params?.showErrorMessage && typeof res === "object" && Object.keys(res).length) {
+        const showFirstErrorMessage = params?.showFirstErrorMessage ?? props.showFirstErrorMessage ?? params?.showErrorMessage;
+        if (showFirstErrorMessage && typeof res === "object" && Object.keys(res).length) {
           const resValue = Object.values(res);
           let firstError = "";
           resValue.some((item) => {
@@ -316,16 +371,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(reProps.value.gridOptions)), () => [
             withDirectives((openBlock(), createBlock(unref(QdGrid), mergeProps({ ref: "gridInstance" }, reProps.value.gridOptions), {
               default: withCtx(() => [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(reProps.value.formItems, (item, index) => {
-                  return openBlock(), createBlock(QdFormItem, mergeProps({
-                    key: index,
-                    "crud-mode": __props.crudMode,
-                    context: unref(data),
-                    "default-clearable": __props.defaultClearable,
-                    "label-align": item.labelAlign ?? reProps.value.formOptions.labelAlign
-                  }, { ref_for: true }, item, {
-                    size: item.size ?? reProps.value.itemSize
-                  }), null, 16, ["crud-mode", "context", "default-clearable", "label-align", "size"]);
+                (openBlock(true), createElementBlock(Fragment, null, renderList(gridNodes.value, (node, index) => {
+                  return openBlock(), createElementBlock(Fragment, { key: index }, [
+                    node.type === "item" ? (openBlock(), createBlock(QdFormItem, mergeProps({
+                      key: 0,
+                      "crud-mode": __props.crudMode,
+                      context: unref(data),
+                      "default-clearable": __props.defaultClearable,
+                      "label-align": reProps.value.formItems?.[node.index].labelAlign ?? reProps.value.formOptions.labelAlign
+                    }, { ref_for: true }, reProps.value.formItems?.[node.index], {
+                      "grid-index": node.index,
+                      size: reProps.value.formItems?.[node.index].size ?? reProps.value.itemSize
+                    }), null, 16, ["crud-mode", "context", "default-clearable", "label-align", "grid-index", "size"])) : (openBlock(), createBlock(unref(QdGridItem), {
+                      key: 1,
+                      class: "qd-form-item--filler",
+                      col: node.span,
+                      row: descriptionsFillerRow.value
+                    }, null, 8, ["col", "row"]))
+                  ], 64);
                 }), 128))
               ]),
               _: 1

package/dist/components/form/item.css

@@ -1,6 +1,6 @@
-.qd-form-item[data-v-ad5e6a9f] >  .t-form__item > .t-form__controls > .t-form__controls-content > *:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
+.qd-form-item[data-v-e6936515] >  .t-form__item > .t-form__controls > .t-form__controls-content > *:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
   width: 100%;
 }
-.qd-form-item__component[data-v-ad5e6a9f]:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
+.qd-form-item__component[data-v-e6936515]:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
   width: 100%;
 }

package/dist/components/form/item.vue.mjs

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

package/dist/components/form/item.vue2.mjs

@@ -1,11 +1,14 @@
 import './item.css'
-import { defineComponent, mergeDefaults, computed, createBlock, createCommentVNode, openBlock, unref, mergeProps, withCtx, createVNode, normalizeProps, guardReactiveProps, createSlots, renderSlot, renderList } from "vue";
+import { defineComponent, mergeDefaults, computed, inject, ref, createBlock, createCommentVNode, openBlock, unref, mergeProps, withCtx, createVNode, normalizeProps, guardReactiveProps, createSlots, renderSlot, renderList } from "vue";
 import { isEmpty, filterSlots } from "qidian-shared";
 import { FormItem } from "tdesign-vue-next";
 import { useConfig } from "../config-provider/useConfig.mjs";
 import { qdUseComputeValue } from "../config-renderer/compute.mjs";
+import { PROVIDE_FORM_REGISTER_GRID_ITEM } from "./config.mjs";
 import { qdFormItemProps } from "./props.mjs";
 import { resolveQdFormItemOptions } from "./utils.mjs";
+import { PROVIDE_GRID_ITEM_PROPS_KEY, PROVIDE_GRID_WIDTH_KEY, DEFAULT_GRID_WIDTH } from "../grid/config.mjs";
+import { resolveGridSpan, mergeGridValue } from "../grid/utils.mjs";
 import QdGridItem from "../grid/item.vue.mjs";
 import _sfc_main$1 from "../config-renderer/index.vue.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -22,6 +25,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     rules: {},
     size: {},
     trimOnBlur: { type: Boolean },
+    gridIndex: {},
     for: {},
     label: {},
     labelAlign: {},
@@ -57,8 +61,25 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       return ifRender;
     });
+    const gridDefaultProps = inject(PROVIDE_GRID_ITEM_PROPS_KEY, void 0);
+    const gridWidth = inject(PROVIDE_GRID_WIDTH_KEY, ref(DEFAULT_GRID_WIDTH));
+    const colSpan = computed(
+      () => resolveGridSpan(mergeGridValue(props.col, gridDefaultProps?.value?.col), gridWidth.value)
+    );
+    const gridIndex = computed(() => props.gridIndex);
+    inject(PROVIDE_FORM_REGISTER_GRID_ITEM, void 0)?.({ visible: reIfRender, colSpan, gridIndex });
     const reProps = computed(() => {
-      const { col, row, component, required, rules, size, trimOnBlur, ...formItemOptions } = props;
+      const {
+        col,
+        row,
+        component,
+        required,
+        rules,
+        size,
+        trimOnBlur,
+        gridIndex: gridIndex2,
+        ...formItemOptions
+      } = props;
       const { component: reComponent, rules: wrappedRules } = resolveQdFormItemOptions({
         formItem: props,
         context: currentContext.value,

package/dist/components/form/props.d.ts

@@ -13,6 +13,7 @@ export declare const qdFormProps: {
     readonly gutter: () => number[];
     readonly grid: () => {};
     readonly data: () => any;
+    readonly autoFill: true;
     readonly disabled: undefined;
     readonly readonly: undefined;
     readonly labelWidth: "auto";
@@ -22,6 +23,7 @@ export declare const qdFormProps: {
     readonly preventSubmitDefault: true;
     readonly requiredMark: undefined;
     readonly showErrorMessage: true;
+    readonly showFirstErrorMessage: true;
     readonly statusIcon: undefined;
     readonly defaultClearable: undefined;
 };

package/dist/components/form/props.mjs

@@ -13,6 +13,7 @@ const qdFormProps = {
   gutter: () => qdFormGutter,
   grid: () => ({}),
   data: () => ({}),
+  autoFill: true,
   disabled: void 0,
   readonly: void 0,
   // labelAlign: 'top',
@@ -23,6 +24,7 @@ const qdFormProps = {
   preventSubmitDefault: true,
   requiredMark: void 0,
   showErrorMessage: true,
+  showFirstErrorMessage: true,
   statusIcon: void 0,
   defaultClearable: void 0
 };

package/dist/components/form/types.d.ts

@@ -19,6 +19,7 @@ export interface QdFormItemProps extends Omit<TdFormItemProps, 'rules' | 'help'>
     rules?: QdFormRule[];
     size?: SizeEnum;
     trimOnBlur?: boolean;
+    gridIndex?: number;
 }
 export interface QdFormSubmitContext<FD extends Data = Data> extends SubmitContext<FD>, Pick<QdFormProps, 'crudMode'> {
     showErrorMessage: boolean;
@@ -32,14 +33,18 @@ export interface QdFormProps<FD extends Data = Data> extends Omit<TdFormProps<FD
     loadingProps?: TdLoadingProps;
     defaultClearable?: boolean;
     descriptions?: boolean;
+    autoFill?: boolean;
+    showFirstErrorMessage?: boolean;
     onSubmit?: (context: QdFormSubmitContext<FD>) => void;
 }
 export interface QdFormInstanceFunctions<FD extends Data = Data> extends Omit<FormInstanceFunctions, 'submit' | 'validate'> {
     submit: (params?: {
         showErrorMessage?: boolean;
+        showFirstErrorMessage?: boolean;
         scrollToFirstError?: QdFormProps['scrollToFirstError'];
     }) => Promise<QdFormSubmitContext<FD>>;
     validate: (params?: FormValidateParams & {
+        showFirstErrorMessage?: boolean;
         scrollToFirstError?: QdFormProps['scrollToFirstError'];
     }) => Promise<FormValidateResult<FD>>;
 }

package/dist/components/grid/index.d.ts

@@ -1,4 +1,5 @@
-export { PROVIDE_GRID_ITEM_PROPS_KEY, PROVIDE_GRID_WIDTH_KEY } from './config';
+export { DEFAULT_GRID_WIDTH, PROVIDE_GRID_ITEM_PROPS_KEY, PROVIDE_GRID_WIDTH_KEY } from './config';
 export { default as QdGrid } from './index.vue';
 export { default as QdGridItem } from './item.vue';
 export type { QdGridItemProps, QdGridProps } from './types';
+export { mergeGridValue, resolveGridSpan } from './utils';

package/dist/components/grid/item.css

@@ -1,3 +1,3 @@
-.qd-grid-item[data-v-f601eb1d] {
+.qd-grid-item[data-v-0d5f57c8] {
   min-width: 0;
 }

package/dist/components/grid/item.vue.mjs

@@ -2,7 +2,7 @@ import './item.css'
 import _sfc_main from "./item.vue2.mjs";
 /* empty css           */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const QdGridItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f601eb1d"]]);
+const QdGridItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0d5f57c8"]]);
 export {
   QdGridItem as default
 };

package/dist/components/grid/item.vue2.mjs

@@ -1,7 +1,7 @@
 import './item.css'
 import { defineComponent, inject, ref, computed, createElementBlock, openBlock, normalizeStyle, renderSlot } from "vue";
-import { isEmpty } from "qidian-shared";
-import { PROVIDE_GRID_ITEM_PROPS_KEY, PROVIDE_GRID_WIDTH_KEY, DEFAULT_GRID_WIDTH, DEFAULT_COL, DEFAULT_BREAKPOINTS, DEFAULT_ROW } from "./config.mjs";
+import { PROVIDE_GRID_ITEM_PROPS_KEY, PROVIDE_GRID_WIDTH_KEY, DEFAULT_GRID_WIDTH, DEFAULT_ROW } from "./config.mjs";
+import { mergeGridValue, resolveGridSpan } from "./utils.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: "QdGridItem"
@@ -15,45 +15,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const props = __props;
     const defaultProps = inject(PROVIDE_GRID_ITEM_PROPS_KEY, void 0);
     const gridWidth = inject(PROVIDE_GRID_WIDTH_KEY, ref(DEFAULT_GRID_WIDTH));
-    const reProps = computed(() => {
-      const mergeGutterValue = (prop, defaultProp) => {
-        if (prop === void 0) return defaultProp;
-        if (!defaultProp) return prop;
-        if (typeof prop === "number" || typeof defaultProp === "number") return prop;
-        return {
-          ...defaultProp,
-          ...prop
-        };
-      };
-      return {
-        col: mergeGutterValue(props.col, defaultProps?.value?.col),
-        row: mergeGutterValue(props.row, defaultProps?.value?.row)
-      };
-    });
-    const getColSpan = computed(() => {
-      const { col } = reProps.value;
-      if (isEmpty(col)) return DEFAULT_COL;
-      if (typeof col === "number") return col;
-      const { span, xxl, xl, lg, md, sm, xs } = col;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.xxl && !isEmpty(xxl)) return xxl;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.xl && !isEmpty(xl)) return xl;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.lg && !isEmpty(lg)) return lg;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.md && !isEmpty(md)) return md;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.sm && !isEmpty(sm)) return sm;
-      return xs ?? span ?? DEFAULT_COL;
-    });
-    const getRowSpan = computed(() => {
-      const { row } = reProps.value;
-      if (isEmpty(row)) return DEFAULT_ROW;
-      if (typeof row === "number") return row;
-      const { span, xxl, xl, lg, md, sm, xs } = row;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.xxl && !isEmpty(xxl)) return xxl;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.xl && !isEmpty(xl)) return xl;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.lg && !isEmpty(lg)) return lg;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.md && !isEmpty(md)) return md;
-      if (gridWidth.value >= DEFAULT_BREAKPOINTS.sm && !isEmpty(sm)) return sm;
-      return xs ?? span ?? DEFAULT_ROW;
-    });
+    const reProps = computed(() => ({
+      col: mergeGridValue(props.col, defaultProps?.value?.col),
+      row: mergeGridValue(props.row, defaultProps?.value?.row)
+    }));
+    const getColSpan = computed(() => resolveGridSpan(reProps.value.col, gridWidth.value));
+    const getRowSpan = computed(
+      () => resolveGridSpan(reProps.value.row, gridWidth.value, DEFAULT_ROW)
+    );
     const itemStyle = computed(() => {
       if (getColSpan.value === 0 || getRowSpan.value === 0) {
         return { display: "none" };

package/dist/components/grid/utils.d.ts

@@ -0,0 +1,3 @@
+import type { GridGutterValue } from './types';
+export declare function mergeGridValue(prop: GridGutterValue | undefined, defaultProp: GridGutterValue | undefined): GridGutterValue | undefined;
+export declare function resolveGridSpan(value: GridGutterValue | undefined, gridWidth: number, fallback?: number): number;

package/dist/components/grid/utils.mjs

@@ -0,0 +1,26 @@
+import { isEmpty } from "qidian-shared";
+import { DEFAULT_COL, DEFAULT_BREAKPOINTS } from "./config.mjs";
+function mergeGridValue(prop, defaultProp) {
+  if (prop === void 0) return defaultProp;
+  if (!defaultProp) return prop;
+  if (typeof prop === "number" || typeof defaultProp === "number") return prop;
+  return {
+    ...defaultProp,
+    ...prop
+  };
+}
+function resolveGridSpan(value, gridWidth, fallback = DEFAULT_COL) {
+  if (isEmpty(value)) return fallback;
+  if (typeof value === "number") return value;
+  const { span, xxl, xl, lg, md, sm, xs } = value;
+  if (gridWidth >= DEFAULT_BREAKPOINTS.xxl && !isEmpty(xxl)) return xxl;
+  if (gridWidth >= DEFAULT_BREAKPOINTS.xl && !isEmpty(xl)) return xl;
+  if (gridWidth >= DEFAULT_BREAKPOINTS.lg && !isEmpty(lg)) return lg;
+  if (gridWidth >= DEFAULT_BREAKPOINTS.md && !isEmpty(md)) return md;
+  if (gridWidth >= DEFAULT_BREAKPOINTS.sm && !isEmpty(sm)) return sm;
+  return xs ?? span ?? fallback;
+}
+export {
+  mergeGridValue,
+  resolveGridSpan
+};

package/dist/index.mjs

@@ -34,9 +34,10 @@ import { PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE, PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUE
 import { default as default24 } from "./components/form/index.vue.mjs";
 import { default as default25 } from "./components/form/item.vue.mjs";
 import { qdFormGrid, qdFormGutter } from "./components/form/props.mjs";
-import { PROVIDE_GRID_ITEM_PROPS_KEY, PROVIDE_GRID_WIDTH_KEY } from "./components/grid/config.mjs";
+import { DEFAULT_GRID_WIDTH, PROVIDE_GRID_ITEM_PROPS_KEY, PROVIDE_GRID_WIDTH_KEY } from "./components/grid/config.mjs";
 import { default as default26 } from "./components/grid/index.vue.mjs";
 import { default as default27 } from "./components/grid/item.vue.mjs";
+import { mergeGridValue, resolveGridSpan } from "./components/grid/utils.mjs";
 import { default as default28 } from "./components/left-ribbon-tag/index.vue.mjs";
 import { default as default29 } from "./components/org/tag/index.vue.mjs";
 import { default as default30 } from "./components/read-write/index.vue.mjs";
@@ -68,6 +69,7 @@ import * as auth from "./utils/auth.mjs";
 import { useUICsl } from "./utils/tools.mjs";
 import { formatDuration } from "./utils/date.mjs";
 export {
+  DEFAULT_GRID_WIDTH,
   PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE,
   PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUEUE,
   PROVIDE_FORM_RESET_QUEUE,
@@ -125,6 +127,7 @@ export {
   hasPermiDirective,
   hasRole,
   hasRoleDirective,
+  mergeGridValue,
   parseVModelPath,
   qdAsyncCompute,
   qdCompute,
@@ -132,6 +135,7 @@ export {
   qdFormGutter,
   qdUploadAcceptMap,
   qdUseComputeValue,
+  resolveGridSpan,
   resolveVModelBinding,
   setValueByPath,
   useAgentChat,

package/package.json

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