@gopowerteam/form-render 0.0.4 → 0.0.5

package/dist/cjs/defines/define-form.d.ts

@@ -1,2 +1,3 @@
-import type { DataRecord, FormItemsOptions } from '../interfaces';
-export declare function defineForm<T = DataRecord>(form: FormItemsOptions<T>): FormItemsOptions<T>;
+import type { DataRecord, FormItemsOptions, FormItemsStringKeyOptions, FormItemsTypeKeyOptions } from '../interfaces';
+export declare function defineForm<T = DataRecord>(form: FormItemsTypeKeyOptions<T>): FormItemsOptions<T>;
+export declare function defineForm<T = DataRecord>(form: FormItemsStringKeyOptions<T>): FormItemsOptions<T>;

package/dist/cjs/form-items/date/index.d.ts

@@ -1,10 +1,10 @@
-import type { FormItemOptions } from '../../interfaces';
+import type { DataRecord, FormItemOptions } from '../../interfaces';
 /**
  * 日期节点表单渲染
  * @param options 日期节点配置选项
  * @returns JSX
  */
-export declare function renderDateItem(options?: RenderDateItemOptions): (data: Record<string, any>, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderDateItem<T = DataRecord>(options?: RenderDateItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export interface RenderDateItemOptions {
     placeholder?: string;
     clearable?: boolean;

package/dist/cjs/form-items/date-range/index.d.ts

@@ -1,10 +1,10 @@
-import type { FormItemOptions } from '../../interfaces';
+import type { DataRecord, FormItemOptions } from '../../interfaces';
 /**
  * 日期节点表单渲染
  * @param options 日期节点配置选项
  * @returns JSX
  */
-export declare function renderDateRangeItem(options?: RenderDateRangeItemOptions): (data: Record<string, any>, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderDateRangeItem<T = DataRecord>(options?: RenderDateRangeItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export interface RenderDateRangeItemOptions {
     placeholder?: string;
     clearable?: boolean;

package/dist/cjs/form-items/index.d.ts

@@ -1,16 +1,9 @@
-import { renderDateItem } from './date';
-import { renderInputItem } from './input';
-import { renderSelectItem } from './select';
-import { renderSwitchItem } from './switch';
-import { renderDateRangeItem } from './date-range';
-import { renderTextareaItem } from './textarea';
-import { renderRenderItem } from './render';
-export declare const FormItemRenders: {
-    input: typeof renderInputItem;
-    textarea: typeof renderTextareaItem;
-    select: typeof renderSelectItem;
-    date: typeof renderDateItem;
-    switch: typeof renderSwitchItem;
-    dateRange: typeof renderDateRangeItem;
-    render: typeof renderRenderItem;
+export declare function FormItemRenders<T>(): {
+    input: (options?: import("./input").RenderInputItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    textarea: (options?: import("./textarea").RenderTextareaItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    select: (options: import("./select").RenderSelectItemOptions) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    date: (options?: import("./date").RenderDateItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    switch: (options?: import("./switch").RenderSwitchItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<Record<string, any>>) => import("vue/jsx-runtime").JSX.Element;
+    dateRange: (options?: import("./date-range").RenderDateRangeItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    render: (renderer: import("./render").RenderInputItemOptions<T>) => (data: T) => JSX.Element;
 };

package/dist/cjs/form-items/input/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord, FormItemOptions } from '../../interfaces';
-export declare function renderInputItem(options?: RenderInputItemOptions): (data: DataRecord, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderInputItem<T = DataRecord>(options?: RenderInputItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export interface RenderInputItemOptions {
     placeholder?: string;
     clearable?: boolean;

package/dist/cjs/form-items/render/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord } from '../../interfaces';
-export declare function renderRenderItem(renderer: RenderInputItemOptions): (data: DataRecord) => JSX.Element;
-export interface RenderInputItemOptions {
-    (record: any): JSX.Element;
+export declare function renderRenderItem<T = DataRecord>(renderer: RenderInputItemOptions<T>): (data: T) => JSX.Element;
+export interface RenderInputItemOptions<T> {
+    (record: T): JSX.Element;
 }

package/dist/cjs/form-items/select/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord, FormItemOptions } from '../../interfaces';
-export declare function renderSelectItem(options: RenderSelectItemOptions): (data: DataRecord, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderSelectItem<T = DataRecord>(options: RenderSelectItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export type SelectOptions = Map<string | number, string>;
 export interface RenderSelectItemOptions {
     placeholder?: string;

package/dist/cjs/form-items/switch/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord, FormItemOptions } from '../../interfaces';
-export declare function renderSwitchItem(options?: RenderSwitchItemOptions): (data: DataRecord, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderSwitchItem<T = DataRecord>(options?: RenderSwitchItemOptions): (data: T, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
 export type SelectOptions = Map<string | number, string>;
 export interface RenderSwitchItemOptions {
     size?: 'small' | 'medium';

package/dist/cjs/form-items/textarea/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord, FormItemOptions } from '../../interfaces';
-export declare function renderTextareaItem(options?: RenderTextareaItemOptions): (data: DataRecord, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderTextareaItem<T = DataRecord>(options?: RenderTextareaItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export interface RenderTextareaItemOptions {
     placeholder?: string;
     rows?: number;

package/dist/cjs/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),c=require("@arco-design/web-vue"),b=require("dayjs");const $=Symbol("ArcoConfigProvider"),N="arco",x="$arco",S=e=>{var t,r,a;const n=l.getCurrentInstance(),d=l.inject($,void 0),u=(a=(r=d==null?void 0:d.prefixCls)!=null?r:(t=n==null?void 0:n.appContext.config.globalProperties[x])==null?void 0:t.classPrefix)!=null?a:N;return e?`${u}-${e}`:u},w=Object.prototype.toString;function g(e){return w.call(e)==="[object Number]"&&e===e}var C=(e,t)=>{for(const[r,a]of t)e[r]=a;return e};const F=l.defineComponent({name:"IconDown",props:{size:{type:[Number,String]},strokeWidth:{type:Number,default:4},strokeLinecap:{type:String,default:"butt",validator:e=>["butt","round","square"].includes(e)},strokeLinejoin:{type:String,default:"miter",validator:e=>["arcs","bevel","miter","miter-clip","round"].includes(e)},rotate:Number,spin:Boolean},emits:{click:e=>!0},setup(e,{emit:t}){const r=S("icon"),a=l.computed(()=>[r,`${r}-down`,{[`${r}-spin`]:e.spin}]),n=l.computed(()=>{const u={};return e.size&&(u.fontSize=g(e.size)?`${e.size}px`:e.size),e.rotate&&(u.transform=`rotate(${e.rotate}deg)`),u});return{cls:a,innerStyle:n,onClick:u=>{t("click",u)}}}}),I=["stroke-width","stroke-linecap","stroke-linejoin"],D=l.createElementVNode("path",{d:"M39.6 17.443 24.043 33 8.487 17.443"},null,-1),_=[D];function j(e,t,r,a,n,d){return l.openBlock(),l.createElementBlock("svg",{viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",stroke:"currentColor",class:l.normalizeClass(e.cls),style:l.normalizeStyle(e.innerStyle),"stroke-width":e.strokeWidth,"stroke-linecap":e.strokeLinecap,"stroke-linejoin":e.strokeLinejoin,onClick:t[0]||(t[0]=(...u)=>e.onClick&&e.onClick(...u))},_,14,I)}var k=C(F,[["render",j]]);const P=Object.assign(k,{install:(e,t)=>{var r;const a=(r=t==null?void 0:t.iconPrefix)!=null?r:"";e.component(a+k.name,k)}}),z=l.defineComponent({name:"IconUp",props:{size:{type:[Number,String]},strokeWidth:{type:Number,default:4},strokeLinecap:{type:String,default:"butt",validator:e=>["butt","round","square"].includes(e)},strokeLinejoin:{type:String,default:"miter",validator:e=>["arcs","bevel","miter","miter-clip","round"].includes(e)},rotate:Number,spin:Boolean},emits:{click:e=>!0},setup(e,{emit:t}){const r=S("icon"),a=l.computed(()=>[r,`${r}-up`,{[`${r}-spin`]:e.spin}]),n=l.computed(()=>{const u={};return e.size&&(u.fontSize=g(e.size)?`${e.size}px`:e.size),e.rotate&&(u.transform=`rotate(${e.rotate}deg)`),u});return{cls:a,innerStyle:n,onClick:u=>{t("click",u)}}}}),B=["stroke-width","stroke-linecap","stroke-linejoin"],L=l.createElementVNode("path",{d:"M39.6 30.557 24.043 15 8.487 30.557"},null,-1),O=[L];function M(e,t,r,a,n,d){return l.openBlock(),l.createElementBlock("svg",{viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",stroke:"currentColor",class:l.normalizeClass(e.cls),style:l.normalizeStyle(e.innerStyle),"stroke-width":e.strokeWidth,"stroke-linecap":e.strokeLinecap,"stroke-linejoin":e.strokeLinejoin,onClick:t[0]||(t[0]=(...u)=>e.onClick&&e.onClick(...u))},O,14,B)}var y=C(z,[["render",M]]);const U=Object.assign(y,{install:(e,t)=>{var r;const a=(r=t==null?void 0:t.iconPrefix)!=null?r:"";e.component(a+y.name,y)}}),v={id:Symbol("ID"),source:Symbol("Source")};function q(e){const t=l.ref({});return e==null||e.forEach(a=>{t.value[a.key]=(typeof a.default=="function"?a.default():a.default)||null}),[t,a=>{t.value=a}]}function R(e){function t(r,a){return e!=null&&e.disabledDate?e.disabledDate(r,a):!1}return(r,a)=>{switch(e==null?void 0:e.type){case"week":return l.createVNode(c.WeekPicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null);case"month":return l.createVNode(c.MonthPicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null);case"quarter":return l.createVNode(c.QuarterPicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null);case"year":return l.createVNode(c.YearPicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null);case"date":default:return l.createVNode(c.DatePicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null)}}}function T(e){return(t,r)=>{switch(e==null?void 0:e.type){case"number":return l.createVNode(c.InputNumber,{modelValue:t[r.key],"onUpdate:modelValue":a=>t[r.key]=a,hideButton:!0,placeholder:e==null?void 0:e.placeholder,allowClear:e==null?void 0:e.clearable},null);case"string":default:return l.createVNode(c.Input,{modelValue:t[r.key],"onUpdate:modelValue":a=>t[r.key]=a,placeholder:e==null?void 0:e.placeholder,allowClear:e==null?void 0:e.clearable},null)}}}function E(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!l.isVNode(e)}function A(e){let t=!1;const r=l.ref(new Map);e.options instanceof Function?e.options().then(n=>r.value=n):e.options instanceof Promise?e.options.then(n=>r.value=n):r.value=e.options;function a(){e.autoSumbit}return(n,d)=>{let u;return e.default&&!t&&(n[d.key]=e.default,t=!0),l.createVNode(c.Select,{multiple:e.multiple,modelValue:n[d.key],"onUpdate:modelValue":i=>n[d.key]=i,placeholder:e.placeholder,allowClear:e.clearable,onChange:a},E(u=Array.from(r.value.entries()).map(([i,s])=>l.createVNode(c.Option,{key:i,value:i,label:s},null)))?u:{default:()=>[u]})}}function Y(e){function t(){e!=null&&e.autoSumbit}return(r,a)=>(e!=null&&e.default&&(r[a.key]=e.default),l.createVNode(c.Switch,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,checkedText:(e==null?void 0:e.openLabel)??"是",uncheckedText:(e==null?void 0:e.closeLabel)??"否",checkedValue:(e==null?void 0:e.openValue)??!0,uncheckedValue:(e==null?void 0:e.closeValue)??!1,onChange:t},null))}function W(e){return(t,r)=>{let a=[];function n(i){a=i}function d(i){if(i&&i.length===2){const[s,o]=i.sort(),m=b(s).startOf("days"),f=b(o).endOf("days");t[r.key]=[m.format((e==null?void 0:e.valueFormat)||"YYYY-MM-DD"),f.format((e==null?void 0:e.valueFormat)||"YYYY-MM-DD")]}}function u(i){return e!=null&&e.disabledDate?e.disabledDate(a,i):!1}return l.createVNode("div",null,[l.createVNode(c.RangePicker,{style:{width:"300px"},modelValue:t[r.key],"onUpdate:modelValue":i=>t[r.key]=i,onSelect:n,onChange:d,mode:e==null?void 0:e.type,allowClear:e==null?void 0:e.clearable,"disabled-date":u,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null)])}}function G(e){return(t,r)=>l.createVNode(c.Textarea,{modelValue:t[r.key],"onUpdate:modelValue":a=>t[r.key]=a,placeholder:e==null?void 0:e.placeholder,autoSize:e==null?void 0:e.autosize,maxLength:e==null?void 0:e.maxLength},null)}function K(e){return t=>e(t)}const Q={input:T,textarea:G,select:A,date:R,switch:Y,dateRange:W,render:K};function X(e,t){t.render||(t.render=a=>a.input());const r=t.render({...Q});return{default:()=>r(e,t)}}function H(e,t){return l.h(c.FormItem,{field:t.key,label:t.title},X(e,t))}function V(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!l.isVNode(e)}const J=l.defineComponent({props:{form:{type:Object,required:!0},minWidth:{type:Number,required:!1,default:300},name:{type:String,required:!1,default:"form"},submitable:{type:Boolean,required:!1,default:!1},searchable:{type:Boolean,required:!1,default:!1},footer:{type:Boolean,required:!1,default:!1}},emits:["submit","cancel"],expose:["formSource"],setup(e){const t=Math.random().toString(32).slice(2).toUpperCase(),r=l.ref(),[a]=q(e.form),n=l.ref(0),d=l.ref(!0),u=()=>d.value=!d.value;l.provide(v.id,t),l.provide(v.source,a);const i=l.computed(()=>{if(!n.value)return 1;const m=e.form.reduce((f,h)=>f+((h==null?void 0:h.span)||1),0);return n.value-m%n.value}),s=l.computed(()=>e.form.reduce((m,f)=>(f.rule&&(m[f.key]=f.rule),m),{}));function o(){var f;const m=(f=r.value)==null?void 0:f.$el;n.value=Math.floor(m.offsetWidth/e.minWidth)}return l.onMounted(()=>{o()}),window.addEventListener("resize",o),{formId:t,formSource:a,formInstance:r,formColumns:n,formRules:s,formCollspased:d,formActiosSpan:i,toggleFormCollapsed:u}},render(){const e=()=>{this.$emit("submit",this.formSource)},t=()=>{const r=[],a=this.footer?{span:this.formColumns}:{span:this.formActiosSpan};if(this.searchable&&(r.push(l.createVNode(c.Button,{type:"primary",htmlType:"submit"},{default:()=>[l.createTextVNode("搜索")]})),r.push(l.createVNode(c.Button,{type:"secondary",onClick:()=>{var n;return(n=this.formInstance)==null?void 0:n.resetFields()}},{default:()=>[l.createTextVNode("重置")]}))),this.submitable&&(r.push(l.createVNode(c.Button,{type:"primary",htmlType:"submit"},{default:()=>[l.createTextVNode("提交")]})),r.push(l.createVNode(c.Button,{type:"secondary",onClick:()=>this.$emit("cancel")},{default:()=>[l.createTextVNode("取消")]}))),this.form.some(n=>!!n.collapsed)&&r.push(l.createVNode(c.Button,{onClick:this.toggleFormCollapsed},{default:()=>this.formCollspased?"展开":"收起",icon:()=>this.formCollspased?l.createVNode(P,null,null):l.createVNode(U,null,null)})),this.$slots.actions&&r.push(...this.$slots.actions()),r.length)return l.createVNode(c.GridItem,a,{default:()=>[l.createVNode(c.FormItem,{hideLabel:!0,contentClass:this.footer?"form-footer":""},{default:()=>[l.createVNode(c.Space,null,V(r)?r:{default:()=>[r]})]})]})};return l.createVNode(c.Form,l.mergeProps({rules:this.formRules,onSubmitSuccess:e},{name:this.name},{"auto-label-width":!0,ref:r=>this.formInstance=r,model:this.formSource}),{default:()=>[l.createVNode(c.Grid,{cols:this.formColumns,"col-gap":10,"rol-gap":10},{default:()=>[this.form.filter(r=>this.formCollspased?!r.collapsed:!0).map(r=>{let a;return l.createVNode(c.GridItem,{span:r.span},V(a=H(this.formSource,r))?a:{default:()=>[a]})}),t()]})]})}});function Z(e){return e}exports.FormRender=J;exports.defineForm=Z;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),c=require("@arco-design/web-vue"),b=require("dayjs");const $=Symbol("ArcoConfigProvider"),N="arco",x="$arco",S=e=>{var t,r,a;const n=l.getCurrentInstance(),d=l.inject($,void 0),u=(a=(r=d==null?void 0:d.prefixCls)!=null?r:(t=n==null?void 0:n.appContext.config.globalProperties[x])==null?void 0:t.classPrefix)!=null?a:N;return e?`${u}-${e}`:u},w=Object.prototype.toString;function g(e){return w.call(e)==="[object Number]"&&e===e}var C=(e,t)=>{for(const[r,a]of t)e[r]=a;return e};const F=l.defineComponent({name:"IconDown",props:{size:{type:[Number,String]},strokeWidth:{type:Number,default:4},strokeLinecap:{type:String,default:"butt",validator:e=>["butt","round","square"].includes(e)},strokeLinejoin:{type:String,default:"miter",validator:e=>["arcs","bevel","miter","miter-clip","round"].includes(e)},rotate:Number,spin:Boolean},emits:{click:e=>!0},setup(e,{emit:t}){const r=S("icon"),a=l.computed(()=>[r,`${r}-down`,{[`${r}-spin`]:e.spin}]),n=l.computed(()=>{const u={};return e.size&&(u.fontSize=g(e.size)?`${e.size}px`:e.size),e.rotate&&(u.transform=`rotate(${e.rotate}deg)`),u});return{cls:a,innerStyle:n,onClick:u=>{t("click",u)}}}}),I=["stroke-width","stroke-linecap","stroke-linejoin"],D=l.createElementVNode("path",{d:"M39.6 17.443 24.043 33 8.487 17.443"},null,-1),_=[D];function j(e,t,r,a,n,d){return l.openBlock(),l.createElementBlock("svg",{viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",stroke:"currentColor",class:l.normalizeClass(e.cls),style:l.normalizeStyle(e.innerStyle),"stroke-width":e.strokeWidth,"stroke-linecap":e.strokeLinecap,"stroke-linejoin":e.strokeLinejoin,onClick:t[0]||(t[0]=(...u)=>e.onClick&&e.onClick(...u))},_,14,I)}var k=C(F,[["render",j]]);const P=Object.assign(k,{install:(e,t)=>{var r;const a=(r=t==null?void 0:t.iconPrefix)!=null?r:"";e.component(a+k.name,k)}}),z=l.defineComponent({name:"IconUp",props:{size:{type:[Number,String]},strokeWidth:{type:Number,default:4},strokeLinecap:{type:String,default:"butt",validator:e=>["butt","round","square"].includes(e)},strokeLinejoin:{type:String,default:"miter",validator:e=>["arcs","bevel","miter","miter-clip","round"].includes(e)},rotate:Number,spin:Boolean},emits:{click:e=>!0},setup(e,{emit:t}){const r=S("icon"),a=l.computed(()=>[r,`${r}-up`,{[`${r}-spin`]:e.spin}]),n=l.computed(()=>{const u={};return e.size&&(u.fontSize=g(e.size)?`${e.size}px`:e.size),e.rotate&&(u.transform=`rotate(${e.rotate}deg)`),u});return{cls:a,innerStyle:n,onClick:u=>{t("click",u)}}}}),B=["stroke-width","stroke-linecap","stroke-linejoin"],L=l.createElementVNode("path",{d:"M39.6 30.557 24.043 15 8.487 30.557"},null,-1),O=[L];function M(e,t,r,a,n,d){return l.openBlock(),l.createElementBlock("svg",{viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",stroke:"currentColor",class:l.normalizeClass(e.cls),style:l.normalizeStyle(e.innerStyle),"stroke-width":e.strokeWidth,"stroke-linecap":e.strokeLinecap,"stroke-linejoin":e.strokeLinejoin,onClick:t[0]||(t[0]=(...u)=>e.onClick&&e.onClick(...u))},O,14,B)}var y=C(z,[["render",M]]);const U=Object.assign(y,{install:(e,t)=>{var r;const a=(r=t==null?void 0:t.iconPrefix)!=null?r:"";e.component(a+y.name,y)}}),v={id:Symbol("ID"),source:Symbol("Source")};function q(e){const t=l.ref({});return e==null||e.forEach(a=>{t.value[a.key]=(typeof a.default=="function"?a.default():a.default)||null}),[t,a=>{t.value=a}]}function R(e){function t(r,a){return e!=null&&e.disabledDate?e.disabledDate(r,a):!1}return(r,a)=>{switch(e==null?void 0:e.type){case"week":return l.createVNode(c.WeekPicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null);case"month":return l.createVNode(c.MonthPicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null);case"quarter":return l.createVNode(c.QuarterPicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null);case"year":return l.createVNode(c.YearPicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null);case"date":default:return l.createVNode(c.DatePicker,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,"disabled-date":t,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null)}}}function T(e){return(t,r)=>{switch(e==null?void 0:e.type){case"number":return l.createVNode(c.InputNumber,{modelValue:t[r.key],"onUpdate:modelValue":a=>t[r.key]=a,hideButton:!0,placeholder:e==null?void 0:e.placeholder,allowClear:e==null?void 0:e.clearable},null);case"string":default:return l.createVNode(c.Input,{modelValue:t[r.key],"onUpdate:modelValue":a=>t[r.key]=a,placeholder:e==null?void 0:e.placeholder,allowClear:e==null?void 0:e.clearable},null)}}}function E(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!l.isVNode(e)}function A(e){let t=!1;const r=l.ref(new Map);e.options instanceof Function?e.options().then(n=>r.value=n):e.options instanceof Promise?e.options.then(n=>r.value=n):r.value=e.options;function a(){e.autoSumbit}return(n,d)=>{let u;return e.default&&!t&&(n[d.key]=e.default,t=!0),l.createVNode(c.Select,{multiple:e.multiple,modelValue:n[d.key],"onUpdate:modelValue":i=>n[d.key]=i,placeholder:e.placeholder,allowClear:e.clearable,onChange:a},E(u=Array.from(r.value.entries()).map(([i,s])=>l.createVNode(c.Option,{key:i,value:i,label:s},null)))?u:{default:()=>[u]})}}function Y(e){function t(){e!=null&&e.autoSumbit}return(r,a)=>(e!=null&&e.default&&(r[a.key]=e.default),l.createVNode(c.Switch,{modelValue:r[a.key],"onUpdate:modelValue":n=>r[a.key]=n,checkedText:(e==null?void 0:e.openLabel)??"是",uncheckedText:(e==null?void 0:e.closeLabel)??"否",checkedValue:(e==null?void 0:e.openValue)??!0,uncheckedValue:(e==null?void 0:e.closeValue)??!1,onChange:t},null))}function W(e){return(t,r)=>{let a=[];function n(i){a=i}function d(i){if(i&&i.length===2){const[s,o]=i.sort(),m=b(s).startOf("days"),f=b(o).endOf("days");t[r.key]=[m.format((e==null?void 0:e.valueFormat)||"YYYY-MM-DD"),f.format((e==null?void 0:e.valueFormat)||"YYYY-MM-DD")]}}function u(i){return e!=null&&e.disabledDate?e.disabledDate(a,i):!1}return l.createVNode("div",null,[l.createVNode(c.RangePicker,{style:{width:"300px"},modelValue:t[r.key],"onUpdate:modelValue":i=>t[r.key]=i,onSelect:n,onChange:d,mode:e==null?void 0:e.type,allowClear:e==null?void 0:e.clearable,"disabled-date":u,format:e==null?void 0:e.labelFormat,"value-format":e==null?void 0:e.valueFormat},null)])}}function G(e){return(t,r)=>l.createVNode(c.Textarea,{modelValue:t[r.key],"onUpdate:modelValue":a=>t[r.key]=a,placeholder:e==null?void 0:e.placeholder,autoSize:e==null?void 0:e.autosize,maxLength:e==null?void 0:e.maxLength},null)}function K(e){return t=>e(t)}function Q(){return{input:T,textarea:G,select:A,date:R,switch:Y,dateRange:W,render:K}}function X(e,t){t.render||(t.render=a=>a.input());const r=t.render({...Q()});return{default:()=>r(e,t)}}function H(e,t){return l.h(c.FormItem,{field:t.key,label:t.title},X(e,t))}function V(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!l.isVNode(e)}const J=l.defineComponent({props:{form:{type:Object,required:!0},minWidth:{type:Number,required:!1,default:300},name:{type:String,required:!1,default:"form"},submitable:{type:Boolean,required:!1,default:!1},searchable:{type:Boolean,required:!1,default:!1},footer:{type:Boolean,required:!1,default:!1}},emits:["submit","cancel"],expose:["formSource"],setup(e){const t=Math.random().toString(32).slice(2).toUpperCase(),r=l.ref(),[a]=q(e.form),n=l.ref(0),d=l.ref(!0),u=()=>d.value=!d.value;l.provide(v.id,t),l.provide(v.source,a);const i=l.computed(()=>{if(!n.value)return 1;const m=e.form.reduce((f,h)=>f+((h==null?void 0:h.span)||1),0);return n.value-m%n.value}),s=l.computed(()=>e.form.reduce((m,f)=>(f.rule&&(m[f.key]=f.rule),m),{}));function o(){var f;const m=(f=r.value)==null?void 0:f.$el;n.value=Math.floor(m.offsetWidth/e.minWidth)}return l.onMounted(()=>{o()}),window.addEventListener("resize",o),{formId:t,formSource:a,formInstance:r,formColumns:n,formRules:s,formCollspased:d,formActiosSpan:i,toggleFormCollapsed:u}},render(){const e=()=>{this.$emit("submit",this.formSource)},t=()=>{const r=[],a=this.footer?{span:this.formColumns}:{span:this.formActiosSpan};if(this.searchable&&(r.push(l.createVNode(c.Button,{type:"primary",htmlType:"submit"},{default:()=>[l.createTextVNode("搜索")]})),r.push(l.createVNode(c.Button,{type:"secondary",onClick:()=>{var n;return(n=this.formInstance)==null?void 0:n.resetFields()}},{default:()=>[l.createTextVNode("重置")]}))),this.submitable&&(r.push(l.createVNode(c.Button,{type:"primary",htmlType:"submit"},{default:()=>[l.createTextVNode("提交")]})),r.push(l.createVNode(c.Button,{type:"secondary",onClick:()=>this.$emit("cancel")},{default:()=>[l.createTextVNode("取消")]}))),this.form.some(n=>!!n.collapsed)&&r.push(l.createVNode(c.Button,{onClick:this.toggleFormCollapsed},{default:()=>this.formCollspased?"展开":"收起",icon:()=>this.formCollspased?l.createVNode(P,null,null):l.createVNode(U,null,null)})),this.$slots.actions&&r.push(...this.$slots.actions()),r.length)return l.createVNode(c.GridItem,a,{default:()=>[l.createVNode(c.FormItem,{hideLabel:!0,contentClass:this.footer?"form-footer":""},{default:()=>[l.createVNode(c.Space,null,V(r)?r:{default:()=>[r]})]})]})};return l.createVNode(c.Form,l.mergeProps({rules:this.formRules,onSubmitSuccess:e},{name:this.name},{"auto-label-width":!0,ref:r=>this.formInstance=r,model:this.formSource}),{default:()=>[l.createVNode(c.Grid,{cols:this.formColumns,"col-gap":10,"rol-gap":10},{default:()=>[this.form.filter(r=>this.formCollspased?!r.collapsed:!0).map(r=>{let a;return l.createVNode(c.GridItem,{span:r.span},V(a=H(this.formSource,r))?a:{default:()=>[a]})}),t()]})]})}});function Z(e){return e}exports.FormRender=J;exports.defineForm=Z;

package/dist/cjs/interfaces/form-item-options.d.ts

@@ -4,7 +4,7 @@ import type { FormItemRenders } from '../form-items';
  * 表单项配置
  */
 export interface FormItemOptions<T = Record<string, any>> {
-    key: string;
+    key: keyof T | string;
     title: string;
     default?: any | (() => any) | (() => Promise<any>);
     collapsed?: boolean;
@@ -14,19 +14,27 @@ export interface FormItemOptions<T = Record<string, any>> {
     rule?: FieldRule | FieldRule[];
     render?: FormItemRender<T>;
 }
+export interface FormItemStringKeyOptions<T = Record<string, any>> extends FormItemOptions<T> {
+    key: string;
+}
+export interface FormItemTypeKeyOptions<T = Record<string, any>> extends FormItemOptions<T> {
+    key: keyof T;
+}
 /**
  * 表单配置
  */
 export type FormItemsOptions<T = Record<string, any>> = Array<FormItemOptions<T>>;
+export type FormItemsTypeKeyOptions<T = Record<string, any>> = FormItemTypeKeyOptions<T>[];
+export type FormItemsStringKeyOptions<T = Record<string, any>> = FormItemStringKeyOptions<T>[];
 /**
  * Render函数
  */
 export interface FormItemRender<T = Record<string, any>> {
-    (render: FormItemRenderFun): (data: T, itemOptions: FormItemOptions<T>) => JSX.Element;
+    (render: FormItemRenderFun<T>): (data: T, itemOptions: FormItemOptions<T>) => JSX.Element;
 }
 /**
  * Render函数模板
  */
-export type FormItemRenderFun = typeof FormItemRenders & {
+export type FormItemRenderFun<T> = ReturnType<typeof FormItemRenders<T>> & {
     [key: string]: any;
 };

package/dist/es/defines/define-form.d.ts

@@ -1,2 +1,3 @@
-import type { DataRecord, FormItemsOptions } from '../interfaces';
-export declare function defineForm<T = DataRecord>(form: FormItemsOptions<T>): FormItemsOptions<T>;
+import type { DataRecord, FormItemsOptions, FormItemsStringKeyOptions, FormItemsTypeKeyOptions } from '../interfaces';
+export declare function defineForm<T = DataRecord>(form: FormItemsTypeKeyOptions<T>): FormItemsOptions<T>;
+export declare function defineForm<T = DataRecord>(form: FormItemsStringKeyOptions<T>): FormItemsOptions<T>;

package/dist/es/form-items/date/index.d.ts

@@ -1,10 +1,10 @@
-import type { FormItemOptions } from '../../interfaces';
+import type { DataRecord, FormItemOptions } from '../../interfaces';
 /**
  * 日期节点表单渲染
  * @param options 日期节点配置选项
  * @returns JSX
  */
-export declare function renderDateItem(options?: RenderDateItemOptions): (data: Record<string, any>, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderDateItem<T = DataRecord>(options?: RenderDateItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export interface RenderDateItemOptions {
     placeholder?: string;
     clearable?: boolean;

package/dist/es/form-items/date-range/index.d.ts

@@ -1,10 +1,10 @@
-import type { FormItemOptions } from '../../interfaces';
+import type { DataRecord, FormItemOptions } from '../../interfaces';
 /**
  * 日期节点表单渲染
  * @param options 日期节点配置选项
  * @returns JSX
  */
-export declare function renderDateRangeItem(options?: RenderDateRangeItemOptions): (data: Record<string, any>, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderDateRangeItem<T = DataRecord>(options?: RenderDateRangeItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export interface RenderDateRangeItemOptions {
     placeholder?: string;
     clearable?: boolean;

package/dist/es/form-items/index.d.ts

@@ -1,16 +1,9 @@
-import { renderDateItem } from './date';
-import { renderInputItem } from './input';
-import { renderSelectItem } from './select';
-import { renderSwitchItem } from './switch';
-import { renderDateRangeItem } from './date-range';
-import { renderTextareaItem } from './textarea';
-import { renderRenderItem } from './render';
-export declare const FormItemRenders: {
-    input: typeof renderInputItem;
-    textarea: typeof renderTextareaItem;
-    select: typeof renderSelectItem;
-    date: typeof renderDateItem;
-    switch: typeof renderSwitchItem;
-    dateRange: typeof renderDateRangeItem;
-    render: typeof renderRenderItem;
+export declare function FormItemRenders<T>(): {
+    input: (options?: import("./input").RenderInputItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    textarea: (options?: import("./textarea").RenderTextareaItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    select: (options: import("./select").RenderSelectItemOptions) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    date: (options?: import("./date").RenderDateItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    switch: (options?: import("./switch").RenderSwitchItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<Record<string, any>>) => import("vue/jsx-runtime").JSX.Element;
+    dateRange: (options?: import("./date-range").RenderDateRangeItemOptions | undefined) => (data: T, form: import("..").FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
+    render: (renderer: import("./render").RenderInputItemOptions<T>) => (data: T) => JSX.Element;
 };

package/dist/es/form-items/input/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord, FormItemOptions } from '../../interfaces';
-export declare function renderInputItem(options?: RenderInputItemOptions): (data: DataRecord, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderInputItem<T = DataRecord>(options?: RenderInputItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export interface RenderInputItemOptions {
     placeholder?: string;
     clearable?: boolean;

package/dist/es/form-items/render/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord } from '../../interfaces';
-export declare function renderRenderItem(renderer: RenderInputItemOptions): (data: DataRecord) => JSX.Element;
-export interface RenderInputItemOptions {
-    (record: any): JSX.Element;
+export declare function renderRenderItem<T = DataRecord>(renderer: RenderInputItemOptions<T>): (data: T) => JSX.Element;
+export interface RenderInputItemOptions<T> {
+    (record: T): JSX.Element;
 }

package/dist/es/form-items/select/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord, FormItemOptions } from '../../interfaces';
-export declare function renderSelectItem(options: RenderSelectItemOptions): (data: DataRecord, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderSelectItem<T = DataRecord>(options: RenderSelectItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export type SelectOptions = Map<string | number, string>;
 export interface RenderSelectItemOptions {
     placeholder?: string;

package/dist/es/form-items/switch/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord, FormItemOptions } from '../../interfaces';
-export declare function renderSwitchItem(options?: RenderSwitchItemOptions): (data: DataRecord, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderSwitchItem<T = DataRecord>(options?: RenderSwitchItemOptions): (data: T, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
 export type SelectOptions = Map<string | number, string>;
 export interface RenderSwitchItemOptions {
     size?: 'small' | 'medium';

package/dist/es/form-items/textarea/index.d.ts

@@ -1,5 +1,5 @@
 import type { DataRecord, FormItemOptions } from '../../interfaces';
-export declare function renderTextareaItem(options?: RenderTextareaItemOptions): (data: DataRecord, form: FormItemOptions) => import("vue/jsx-runtime").JSX.Element;
+export declare function renderTextareaItem<T = DataRecord>(options?: RenderTextareaItemOptions): (data: T, form: FormItemOptions<T>) => import("vue/jsx-runtime").JSX.Element;
 export interface RenderTextareaItemOptions {
     placeholder?: string;
     rows?: number;

package/dist/es/index.mjs

@@ -317,19 +317,21 @@ function Ve(e) {
 function Fe(e) {
   return (l) => e(l);
 }
-const Ie = {
-  input: ge,
-  textarea: Ve,
-  select: Ce,
-  date: Se,
-  switch: xe,
-  dateRange: we,
-  render: Fe
-};
+function Ie() {
+  return {
+    input: ge,
+    textarea: Ve,
+    select: Ce,
+    date: Se,
+    switch: xe,
+    dateRange: we,
+    render: Fe
+  };
+}
 function De(e, l) {
   l.render || (l.render = (t) => t.input());
   const r = l.render({
-    ...Ie
+    ...Ie()
   });
   return {
     default: () => r(e, l)

package/dist/es/interfaces/form-item-options.d.ts

@@ -4,7 +4,7 @@ import type { FormItemRenders } from '../form-items';
  * 表单项配置
  */
 export interface FormItemOptions<T = Record<string, any>> {
-    key: string;
+    key: keyof T | string;
     title: string;
     default?: any | (() => any) | (() => Promise<any>);
     collapsed?: boolean;
@@ -14,19 +14,27 @@ export interface FormItemOptions<T = Record<string, any>> {
     rule?: FieldRule | FieldRule[];
     render?: FormItemRender<T>;
 }
+export interface FormItemStringKeyOptions<T = Record<string, any>> extends FormItemOptions<T> {
+    key: string;
+}
+export interface FormItemTypeKeyOptions<T = Record<string, any>> extends FormItemOptions<T> {
+    key: keyof T;
+}
 /**
  * 表单配置
  */
 export type FormItemsOptions<T = Record<string, any>> = Array<FormItemOptions<T>>;
+export type FormItemsTypeKeyOptions<T = Record<string, any>> = FormItemTypeKeyOptions<T>[];
+export type FormItemsStringKeyOptions<T = Record<string, any>> = FormItemStringKeyOptions<T>[];
 /**
  * Render函数
  */
 export interface FormItemRender<T = Record<string, any>> {
-    (render: FormItemRenderFun): (data: T, itemOptions: FormItemOptions<T>) => JSX.Element;
+    (render: FormItemRenderFun<T>): (data: T, itemOptions: FormItemOptions<T>) => JSX.Element;
 }
 /**
  * Render函数模板
  */
-export type FormItemRenderFun = typeof FormItemRenders & {
+export type FormItemRenderFun<T> = ReturnType<typeof FormItemRenders<T>> & {
     [key: string]: any;
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@gopowerteam/form-render",
   "type": "module",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "author": {
     "name": "zhuchentong",
     "email": "2037630@gmail.com"