@vunk/form 2.7.0 → 2.8.0

package/components/form-item-renderer/index.cjs

@@ -25,6 +25,20 @@ const props = {
   }
 };
 
+const genInputEffectFunc = (inputEffectRaw) => {
+  if (!inputEffectRaw) {
+    return;
+  }
+  if (typeof inputEffectRaw === "function") {
+    return inputEffectRaw;
+  }
+  if (typeof inputEffectRaw === "string") {
+    const inputEffect = new Function("value", "context", inputEffectRaw);
+    return inputEffect;
+  }
+  return _function.noop;
+};
+
 const VkfFormItemRenderer$1 = vue.defineComponent({
   name: "VkfFormItemRenderer",
   props: props,
@@ -65,10 +79,12 @@ const VkfFormItemRenderer$1 = vue.defineComponent({
             _function.isCallable(c.templateProps) ? c.templateProps(rendererData?.value) : c.templateProps
           );
           const informationProps = _function.isCallable(slotData.informationProps) ? slotData.informationProps(rendererData?.value) : slotData.informationProps;
+          const inputEffect = genInputEffectFunc(slotData.inputEffect);
           Reflect.deleteProperty(slotData, "templateType");
           Reflect.deleteProperty(slotData, "templateIf");
           Reflect.deleteProperty(slotData, "templateProps");
           Reflect.deleteProperty(slotData, "informationProps");
+          Reflect.deleteProperty(slotData, "inputEffect");
           const nodeKey = currentK.join(",") + "-" + c.templateType + "-" + (c.prop || "no-prop");
           const modelValue = vue.computed({
             get: () => c.prop && getDataValue?.(c.prop),
@@ -77,7 +93,7 @@ const VkfFormItemRenderer$1 = vue.defineComponent({
               v
             })
           });
-          const nodes = getTemplateInstance(c.templateType)?.slots.default?.({
+          const defaultSlotArguments = {
             // for legacy
             data: slotData,
             raw: c,
@@ -85,13 +101,21 @@ const VkfFormItemRenderer$1 = vue.defineComponent({
             k: currentK,
             key: nodeKey,
             value: modelValue.value,
-            input: (v) => modelValue.value = v,
+            input: (v) => {
+              modelValue.value = v;
+              inputEffect?.(v, {
+                ...defaultSlotArguments,
+                parentProp: [c.prop].flat(Infinity).slice(0, -1)
+              });
+            },
             informationProps,
             templateIf,
             Renderer,
             getDataValue,
-            emitSetData
-          });
+            emitSetData,
+            inputEffect
+          };
+          const nodes = getTemplateInstance(c.templateType)?.slots.default?.(defaultSlotArguments);
           nodes && a.push(nodes);
         } else {
           validateTemplateType();

package/components/form-item-renderer/index.mjs

@@ -2,7 +2,7 @@ import { defineComponent, computed, h, nextTick, openBlock, createBlock, withCtx
 import { VkfTemplateInstancesProvider } from '@vunk/form/components/template-instances-provider';
 import { genTemplateIfFunc } from '@vunk/form/shared/form';
 import { useTemplateInstancesContext, useRendererData } from '@vunk/form/composables';
-import { isCallable } from '@vunk/shared/function';
+import { noop, isCallable } from '@vunk/shared/function';
 import { _ as _export_sfc } from '../_plugin-vue_export-helper.mjs';
 
 const props = {
@@ -21,6 +21,20 @@ const props = {
   }
 };
 
+const genInputEffectFunc = (inputEffectRaw) => {
+  if (!inputEffectRaw) {
+    return;
+  }
+  if (typeof inputEffectRaw === "function") {
+    return inputEffectRaw;
+  }
+  if (typeof inputEffectRaw === "string") {
+    const inputEffect = new Function("value", "context", inputEffectRaw);
+    return inputEffect;
+  }
+  return noop;
+};
+
 const VkfFormItemRenderer$1 = defineComponent({
   name: "VkfFormItemRenderer",
   props: props,
@@ -61,10 +75,12 @@ const VkfFormItemRenderer$1 = defineComponent({
             isCallable(c.templateProps) ? c.templateProps(rendererData?.value) : c.templateProps
           );
           const informationProps = isCallable(slotData.informationProps) ? slotData.informationProps(rendererData?.value) : slotData.informationProps;
+          const inputEffect = genInputEffectFunc(slotData.inputEffect);
           Reflect.deleteProperty(slotData, "templateType");
           Reflect.deleteProperty(slotData, "templateIf");
           Reflect.deleteProperty(slotData, "templateProps");
           Reflect.deleteProperty(slotData, "informationProps");
+          Reflect.deleteProperty(slotData, "inputEffect");
           const nodeKey = currentK.join(",") + "-" + c.templateType + "-" + (c.prop || "no-prop");
           const modelValue = computed({
             get: () => c.prop && getDataValue?.(c.prop),
@@ -73,7 +89,7 @@ const VkfFormItemRenderer$1 = defineComponent({
               v
             })
           });
-          const nodes = getTemplateInstance(c.templateType)?.slots.default?.({
+          const defaultSlotArguments = {
             // for legacy
             data: slotData,
             raw: c,
@@ -81,13 +97,21 @@ const VkfFormItemRenderer$1 = defineComponent({
             k: currentK,
             key: nodeKey,
             value: modelValue.value,
-            input: (v) => modelValue.value = v,
+            input: (v) => {
+              modelValue.value = v;
+              inputEffect?.(v, {
+                ...defaultSlotArguments,
+                parentProp: [c.prop].flat(Infinity).slice(0, -1)
+              });
+            },
             informationProps,
             templateIf,
             Renderer,
             getDataValue,
-            emitSetData
-          });
+            emitSetData,
+            inputEffect
+          };
+          const nodes = getTemplateInstance(c.templateType)?.slots.default?.(defaultSlotArguments);
           nodes && a.push(nodes);
         } else {
           validateTemplateType();

package/components/form-item-renderer/src/utils.d.ts

@@ -0,0 +1,5 @@
+import { BasicSource } from '@vunk/form/shared';
+import { Func } from '@vunk/core';
+export declare const genInputEffectFunc: Func<[
+    any
+], BasicSource['inputEffect']>;

package/components/form-item-renderer-template/src/types.d.ts

@@ -2,7 +2,9 @@ import { __VkfFormItemRenderer } from '@vunk/form/components/form-item-renderer'
 import { NormalObject } from '@vunk/shared';
 import type { VkfFormItemRenderer } from '@vunk/form/components/form-item-renderer';
 import { MaybeArray, SetDataEvent } from '@vunk/core';
+import { InputEffectContext } from '@vunk/form/shared';
 type RendererTreeData = __VkfFormItemRenderer.RendererTreeData;
+type InternalField = 'templateType' | 'templateIf' | 'informationProps' | 'templateProps' | 'inputEffect';
 export interface DefaultSlotArguments {
     raw: RendererTreeData;
     /**
@@ -16,7 +18,7 @@ export interface DefaultSlotArguments {
     /**
      * 当前表单项的数据，排除渲染占用字段
      */
-    props: Omit<RendererTreeData, 'templateType' | 'templateIf' | 'informationProps' | 'templateProps'>;
+    props: Omit<RendererTreeData, InternalField>;
     /**
      * 提供给 Information 组件的 props
      */
@@ -37,6 +39,10 @@ export interface DefaultSlotArguments {
      * 更新表单数据（如果formItem提供prop)
      */
     input?: (v: any) => void;
+    /**
+     * input 执行后的副操作
+     */
+    inputEffect?: (v: any, e: InputEffectContext) => void;
     /**
      * 从表单数据中获取对应的值
      */

package/components/information-collection/index.cjs

@@ -11,6 +11,10 @@ var _pluginVue_exportHelper = require('../_plugin-vue_export-helper.cjs');
 
 const props = {
   ...formItem._VkfFormItemCtx.props,
+  information: {
+    type: Boolean,
+    default: true
+  },
   modelValue: {
     type: Array,
     default: () => []
@@ -22,6 +26,10 @@ const props = {
   labelRender: {
     type: Function,
     default: void 0
+  },
+  typeRender: {
+    type: Function,
+    default: void 0
   }
 };
 const emits = {};
@@ -35,8 +43,7 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
   }) {
     const formItemProps = formItem._VkfFormItemCtx.createBindProps(props2);
     return () => vue.createVNode(formItem.VkfFormItem, vue.mergeProps({
-      "class": "vk-information-collection",
-      "information": true
+      "class": "vk-information-collection"
     }, formItemProps.value), {
       default: () => [vue.createVNode("div", {
         "class": "vk-information-collection-value"
@@ -45,6 +52,7 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
         default: () => props2.modelValue.map((item, index) => vue.createVNode(informationTag.VkfInformationTag, {
           "key": index,
           "data": item,
+          "type": props2.typeRender?.(item),
           "labelRender": props2.labelRender,
           "formItems": props2.columns.map(v => ({
             ...v,

package/components/information-collection/index.mjs

@@ -7,6 +7,10 @@ import { _ as _export_sfc } from '../_plugin-vue_export-helper.mjs';
 
 const props = {
   ..._VkfFormItemCtx.props,
+  information: {
+    type: Boolean,
+    default: true
+  },
   modelValue: {
     type: Array,
     default: () => []
@@ -18,6 +22,10 @@ const props = {
   labelRender: {
     type: Function,
     default: void 0
+  },
+  typeRender: {
+    type: Function,
+    default: void 0
   }
 };
 const emits = {};
@@ -31,8 +39,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   }) {
     const formItemProps = _VkfFormItemCtx.createBindProps(props2);
     return () => createVNode(VkfFormItem, mergeProps({
-      "class": "vk-information-collection",
-      "information": true
+      "class": "vk-information-collection"
     }, formItemProps.value), {
       default: () => [createVNode("div", {
         "class": "vk-information-collection-value"
@@ -41,6 +48,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         default: () => props2.modelValue.map((item, index) => createVNode(VkfInformationTag, {
           "key": index,
           "data": item,
+          "type": props2.typeRender?.(item),
           "labelRender": props2.labelRender,
           "formItems": props2.columns.map(v => ({
             ...v,

package/components/information-collection/src/ctx.d.ts

@@ -1,7 +1,12 @@
 import { Func } from '@vunk/core';
 import { NormalObject } from '@vunk/shared';
 import { PropType } from 'vue';
+import { TagProps } from 'element-plus';
 export declare const props: {
+    information: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     modelValue: {
         type: {
             (arrayLength: number): NormalObject[];
@@ -44,6 +49,10 @@ export declare const props: {
         type: PropType<Func<any, string>>;
         default: any;
     };
+    typeRender: {
+        type: PropType<Func<any, TagProps["type"]>>;
+        default: any;
+    };
     required: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
     formItemSize: {
         type: PropType<"default" | "small" | "large">;
@@ -74,10 +83,6 @@ export declare const props: {
         type: StringConstructor;
         default: any;
     };
-    information: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     label: StringConstructor;
     labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
     labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "" | "top" | "left" | "right", unknown, "", boolean>;

package/components/information-collection/src/index.vue.d.ts

@@ -1,4 +1,8 @@
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    information: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     modelValue: {
         type: {
             (arrayLength: number): import("@vunk/shared").NormalObject[];
@@ -41,6 +45,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: import("vue").PropType<import("@vunk/core").Func<any, string>>;
         default: any;
     };
+    typeRender: {
+        type: import("vue").PropType<import("@vunk/core").Func<any, import("element-plus").TagProps["type"]>>;
+        default: any;
+    };
     required: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
     formItemSize: {
         type: import("vue").PropType<"default" | "small" | "large">;
@@ -71,10 +79,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         default: any;
     };
-    information: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     label: StringConstructor;
     labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
     labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "" | "top" | "left" | "right", unknown, "", boolean>;
@@ -101,6 +105,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     inlineMessage: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, BooleanConstructor], unknown, unknown, "", boolean>;
     showMessage: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
 }>, () => JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    information: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     modelValue: {
         type: {
             (arrayLength: number): import("@vunk/shared").NormalObject[];
@@ -143,6 +151,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: import("vue").PropType<import("@vunk/core").Func<any, string>>;
         default: any;
     };
+    typeRender: {
+        type: import("vue").PropType<import("@vunk/core").Func<any, import("element-plus").TagProps["type"]>>;
+        default: any;
+    };
     required: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
     formItemSize: {
         type: import("vue").PropType<"default" | "small" | "large">;
@@ -173,10 +185,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         default: any;
     };
-    information: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     label: StringConstructor;
     labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
     labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "" | "top" | "left" | "right", unknown, "", boolean>;
@@ -219,5 +227,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     modelValue: import("@vunk/shared").NormalObject[];
     columns: any[];
     labelRender: ((...args: any) => string) | ((arg: any) => string);
+    typeRender: ((...args: any) => import("element-plus/es/utils").EpPropMergeType<StringConstructor, "success" | "warning" | "info" | "primary" | "danger", unknown>) | ((arg: any) => import("element-plus/es/utils").EpPropMergeType<StringConstructor, "success" | "warning" | "info" | "primary" | "danger", unknown>);
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/components/information-collection/src/types.d.ts

@@ -1,4 +1,6 @@
 import { __VkfInputCollection } from '@vunk/form/components/input-collection';
 import { __VkfTemplatesDefault } from '@vunk/form';
-import { Keyof, NormalObject } from '@vunk/shared';
+import { Keyof, NormalObject, VueComponentPropsType } from '@vunk/shared';
+import type Core from './index.vue';
 export type Column<R extends NormalObject = NormalObject, SourceType extends NormalObject = __VkfTemplatesDefault.CoreSource<Keyof<R>>> = __VkfInputCollection.Column<R, SourceType>;
+export type ComponentProps = VueComponentPropsType<typeof Core>;

package/components/information-tag/src/index.vue.d.ts

@@ -98,9 +98,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     round: boolean;
     formItems: any[];
     title: string | ((data: any) => string);
-    labelRender: (data: import("@vunk/shared").NormalObject) => string;
     closable: boolean;
     disableTransitions: boolean;
     hit: boolean;
+    labelRender: (data: import("@vunk/shared").NormalObject) => string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/components/input-collection/src/types.d.ts

@@ -4,12 +4,11 @@ import type { __VkTableColumns } from '@vunk/plus/components/table-columns';
 import type { Keyof, NormalObject, VueComponentPropsType } from '@vunk/shared';
 import type { TableColumnCtx } from 'element-plus';
 import type Core from './index.vue';
+import type { __VkfInformationCollection } from '@vunk/form/components/information-collection';
 export interface Source<P extends string = string> extends VueComponentPropsType<typeof Core>, BasicSource {
     prop?: P | P[];
     templateType: 'VkfInputCollection';
-    informationProps?: {
-        labelRender?: (row: any) => string;
-    };
+    informationProps?: Partial<__VkfInformationCollection.ComponentProps>;
 }
 export type Column<R extends NormalObject = NormalObject, SourceType extends NormalObject = __VkfTemplatesDefault.CoreSource<Keyof<R>>> = Omit<__VkTableColumns.Source<R>, 'slots'> & {
     templateType: SourceType['templateType'];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vunk/form",
-  "version": "2.7.0",
+  "version": "2.8.0",
   "description": "",
   "main": "index.esm.js",
   "scripts": {

package/shared/types/source/index.d.ts

@@ -4,24 +4,31 @@ import { __VkfTemplatesElementPlus } from '@vunk/form/components/templates-eleme
 import { __VkfTemplatesEsri } from '@vunk/form/components/templates-esri';
 import { AnyFunc, NormalObject } from '@vunk/core';
 import { __VkfTemplatesVariant } from '@vunk/form/components/templates-variant';
+import { __VkfFormItemRendererTemplate } from '@vunk/form/components/form-item-renderer-template';
+export interface InputEffectContext extends __VkfFormItemRendererTemplate.DefaultSlotArguments {
+    parentProp: Array<string | number>;
+}
 export interface BasicSource {
     /**
      * @description 渲染的组件
      */
     templateType?: string;
-    /**
-     * @description 渲染时提供给组件的 props
-     */
-    templateProps?: NormalObject | AnyFunc;
     /**
      *  @description 条件渲染
      */
     templateIf?: ((data: NormalObject) => boolean) | string | boolean;
+    /**
+     * @description 渲染时提供给组件的 props
+     */
+    templateProps?: NormalObject | AnyFunc;
     /**
      * @description 当被 Information 渲染时, 提供的 props
-     *
      */
     informationProps?: NormalObject | AnyFunc;
+    /**
+     * @description 当 input 触发时, 产生的副作用
+     */
+    inputEffect?: (value: any, context: InputEffectContext) => void;
     /**
      * @description dom class
      */