CRM系统前端
查看 | 历史 | 提交 | 提交对比
bowen
2023-10-12 f87e07840217af1bb059200eba04100e44c5d783
提交 | 用户 | age
2407b3 1 import type { NamePath, RuleObject } from 'ant-design-vue/lib/form/interface';
8e5a6b 2 import type { VNode, CSSProperties } from 'vue';
b5046f 3 import type { ButtonProps as AntdButtonProps } from '/@/components/Button';
2f6253 4 import type { FormItem } from './formItem';
陈 5 import type { ColEx, ComponentType } from './index';
73c8e0 6 import type { TableActionType } from '/@/components/Table/src/types/table';
785732 7 import type { RowProps } from 'ant-design-vue/lib/grid/Row';
2f6253 8
bc4997 9 export type FieldMapToTime = [string, [string, string], (string | [string, string])?][];
2f6253 10
1d4561 11 export type Rule = RuleObject & {
V 12   trigger?: 'blur' | 'change' | ['change', 'blur'];
13 };
14
2f6253 15 export interface RenderCallbackParams {
陈 16   schema: FormSchema;
4ff1c4 17   values: Recordable;
V 18   model: Recordable;
2f6253 19   field: string;
陈 20 }
a0c319 21
73c8e0 22 export interface ButtonProps extends AntdButtonProps {
a0c319 23   text?: string;
V 24 }
25
2407b3 26 export interface FormActionType {
a0c319 27   submit: () => Promise<void>;
7bbb86 28   setFieldsValue: (values: Recordable) => Promise<void>;
4ff1c4 29   resetFields: () => Promise<void>;
V 30   getFieldsValue: () => Recordable;
31   clearValidate: (name?: string | string[]) => Promise<void>;
32   updateSchema: (data: Partial<FormSchema> | Partial<FormSchema>[]) => Promise<void>;
c639e4 33   resetSchema: (data: Partial<FormSchema> | Partial<FormSchema>[]) => Promise<void>;
4ff1c4 34   setProps: (formProps: Partial<FormProps>) => Promise<void>;
768fad 35   removeSchemaByField: (field: string | string[]) => Promise<void>;
de5bf7 36   appendSchemaByField: (
098621 37     schema: FormSchema | FormSchema[],
de5bf7 38     prefixField: string | undefined,
56a966 39     first?: boolean | undefined,
de5bf7 40   ) => Promise<void>;
a0c319 41   validateFields: (nameList?: NamePath[]) => Promise<any>;
f87e07 42   validate: <T = Recordable>(nameList?: NamePath[] | false) => Promise<T>;
4ff1c4 43   scrollToField: (name: NamePath, options?: ScrollOptions) => Promise<void>;
2f6253 44 }
4ff1c4 45
2f6253 46 export type RegisterFn = (formInstance: FormActionType) => void;
陈 47
48 export type UseFormReturnType = [RegisterFn, FormActionType];
49
50 export interface FormProps {
a343b4 51   name?: string;
785732 52   layout?: 'vertical' | 'inline' | 'horizontal';
46e087 53   // Form value
4ff1c4 54   model?: Recordable;
46e087 55   // The width of all items in the entire form
2f6253 56   labelWidth?: number | string;
5fca9c 57   // alignment
785732 58   labelAlign?: 'left' | 'right';
5fca9c 59   // Row configuration for the entire form
785732 60   rowProps?: RowProps;
46e087 61   // Submit form on reset
d09406 62   submitOnReset?: boolean;
f96453 63   // Submit form on form changing
1 64   submitOnChange?: boolean;
46e087 65   // Col configuration for the entire form
2f6253 66   labelCol?: Partial<ColEx>;
46e087 67   // Col configuration for the entire form
2f6253 68   wrapperCol?: Partial<ColEx>;
陈 69
b9d3d6 70   // General row style
4ff1c4 71   baseRowStyle?: CSSProperties;
b9d3d6 72
46e087 73   // General col configuration
a0c319 74   baseColProps?: Partial<ColEx>;
2f6253 75
46e087 76   // Form configuration rules
2f6253 77   schemas?: FormSchema[];
46e087 78   // Function values used to merge into dynamic control form items
4ff1c4 79   mergeDynamicData?: Recordable;
46e087 80   // Compact mode for search forms
2f6253 81   compact?: boolean;
46e087 82   // Blank line span
2f6253 83   emptySpan?: number | Partial<ColEx>;
46e087 84   // Internal component size of the form
5a6db8 85   size?: 'default' | 'small' | 'large';
46e087 86   // Whether to disable
2f6253 87   disabled?: boolean;
46e087 88   // Time interval fields are mapped into multiple
2f6253 89   fieldMapToTime?: FieldMapToTime;
46e087 90   // Placeholder is set automatically
a0c319 91   autoSetPlaceHolder?: boolean;
9b2d41 92   // Auto submit on press enter on input
N 93   autoSubmitOnEnter?: boolean;
46e087 94   // Check whether the information is added to the label
2f6253 95   rulesMessageJoinLabel?: boolean;
46e087 96   // Whether to show collapse and expand buttons
2f6253 97   showAdvancedButton?: boolean;
ac1a36 98   // Whether to focus on the first input box, only works when the first form item is input
V 99   autoFocusFirstItem?: boolean;
46e087 100   // Automatically collapse over the specified number of rows
2f6253 101   autoAdvancedLine?: number;
93f9a1 102   // Always show lines
无 103   alwaysShowLines?: number;
46e087 104   // Whether to show the operation button
5a6db8 105   showActionButtonGroup?: boolean;
2f6253 106
46e087 107   // Reset button configuration
a0c319 108   resetButtonOptions?: Partial<ButtonProps>;
2f6253 109
46e087 110   // Confirm button configuration
a0c319 111   submitButtonOptions?: Partial<ButtonProps>;
2f6253 112
46e087 113   // Operation column configuration
5a6db8 114   actionColOptions?: Partial<ColEx>;
2f6253 115
46e087 116   // Show reset button
5a6db8 117   showResetButton?: boolean;
46e087 118   // Show confirmation button
5a6db8 119   showSubmitButton?: boolean;
2f6253 120
5a6db8 121   resetFunc?: () => Promise<void>;
V 122   submitFunc?: () => Promise<void>;
123   transformDateFunc?: (date: any) => string;
2f6253 124   colon?: boolean;
陈 125 }
a065de 126 export type RenderOpts = {
L 127   disabled: boolean;
128   [key: string]: any;
129 };
2f6253 130 export interface FormSchema {
46e087 131   // Field name
2f6253 132   field: string;
a065de 133   // Extra Fields name[]
L 134   fields?: string[];
46e087 135   // Event name triggered by internal value change, default change
2f6253 136   changeEvent?: string;
46e087 137   // Variable name bound to v-model Default value
1d4561 138   valueField?: string;
46e087 139   // Label name
a065de 140   label?: string | VNode;
46e087 141   // Auxiliary text
0b6110 142   subLabel?: string;
46e087 143   // Help text on the right side of the text
9b2d41 144   helpMessage?:
N 145     | string
146     | string[]
147     | ((renderCallbackParams: RenderCallbackParams) => string | string[]);
46e087 148   // BaseHelp component props
2f6253 149   helpComponentProps?: Partial<HelpComponentProps>;
46e087 150   // Label width, if it is passed, the labelCol and WrapperCol configured by itemProps will be invalid
2f6253 151   labelWidth?: string | number;
46e087 152   // Disable the adjustment of labelWidth with global settings of formModel, and manually set labelCol and wrapperCol by yourself
2f6253 153   disabledLabelWidth?: boolean;
46e087 154   // render component
2f6253 155   component: ComponentType;
46e087 156   // Component parameters
5832ee 157   componentProps?:
1d4561 158     | ((opt: {
V 159         schema: FormSchema;
160         tableAction: TableActionType;
161         formActionType: FormActionType;
4ff1c4 162         formModel: Recordable;
V 163       }) => Recordable)
5832ee 164     | object;
46e087 165   // Required
765064 166   required?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
2f6253 167
ac1a36 168   suffix?: string | number | ((values: RenderCallbackParams) => string | number);
V 169
46e087 170   // Validation rules
1d4561 171   rules?: Rule[];
46e087 172   // Check whether the information is added to the label
2f6253 173   rulesMessageJoinLabel?: boolean;
陈 174
46e087 175   // Reference formModelItem
2f6253 176   itemProps?: Partial<FormItem>;
陈 177
46e087 178   // col configuration outside formModelItem
2f6253 179   colProps?: Partial<ColEx>;
陈 180
181   // 默认值
182   defaultValue?: any;
bc4997 183
a065de 184   // 额外默认值数组对象
L 185   defaultValueObj?: { [key: string]: any };
186
bc4997 187   // 是否自动处理与时间相关组件的默认值
S 188   isHandleDateDefaultValue?: boolean;
189
2f6253 190   isAdvanced?: boolean;
陈 191
46e087 192   // Matching details components
2f6253 193   span?: number;
陈 194
195   ifShow?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
196
197   show?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
198
46e087 199   // Render the content in the form-item tag
a065de 200   render?: (
L 201     renderCallbackParams: RenderCallbackParams,
202     opts: RenderOpts,
203   ) => VNode | VNode[] | string;
2f6253 204
46e087 205   // Rendering col content requires outer wrapper form-item
a065de 206   renderColContent?: (
L 207     renderCallbackParams: RenderCallbackParams,
208     opts: RenderOpts,
209   ) => VNode | VNode[] | string;
2f6253 210
1d4561 211   renderComponentContent?:
a065de 212     | ((renderCallbackParams: RenderCallbackParams, opts: RenderOpts) => any)
1d4561 213     | VNode
V 214     | VNode[]
215     | string;
2f6253 216
46e087 217   // Custom slot, in from-item
2f6253 218   slot?: string;
陈 219
46e087 220   // Custom slot, similar to renderColContent
2f6253 221   colSlot?: string;
陈 222
223   dynamicDisabled?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
224
1d4561 225   dynamicRules?: (renderCallbackParams: RenderCallbackParams) => Rule[];
2f6253 226 }
陈 227 export interface HelpComponentProps {
228   maxWidth: string;
46e087 229   // Whether to display the serial number
2f6253 230   showIndex: boolean;
46e087 231   // Text list
2f6253 232   text: any;
46e087 233   // colour
2f6253 234   color: string;
46e087 235   // font size
2f6253 236   fontSize: string;
陈 237   icon: string;
238   absolute: boolean;
46e087 239   // Positioning
2f6253 240   position: any;
陈 241 }