From 207c5b3fc4e52bb06baa36cd4b659e14893785ba Mon Sep 17 00:00:00 2001 From: kailong321200875 <321200875@qq.com> Date: Mon, 5 Jun 2023 16:30:35 +0800 Subject: [PATCH] =?UTF-8?q?style:=20=E4=BF=AE=E6=94=B9=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Editor/src/Editor.vue | 3 +- src/components/Form/src/Form.vue | 39 +------ src/components/Form/src/helper/index.ts | 10 +- src/components/Form/src/types/index.ts | 15 ++- .../InputPassword/src/InputPassword.vue | 10 +- src/locales/en.ts | 5 +- src/locales/zh-CN.ts | 5 +- src/router/index.ts | 42 +++---- src/views/Components/Form/DefaultForm.vue | 109 ++++++++---------- types/custom-types.d.ts | 27 ----- 10 files changed, 98 insertions(+), 167 deletions(-) delete mode 100644 types/custom-types.d.ts diff --git a/src/components/Editor/src/Editor.vue b/src/components/Editor/src/Editor.vue index 30e5689..0d6872b 100644 --- a/src/components/Editor/src/Editor.vue +++ b/src/components/Editor/src/Editor.vue @@ -99,7 +99,6 @@ const handleChange = (editor: IDomEditor) => { // 组件销毁时，及时销毁编辑器 onBeforeUnmount(() => { const editor = unref(editorRef.value) - if (editor === null) return // 销毁，并移除 editor editor?.destroy() @@ -121,7 +120,7 @@ defineExpose({ { - // 单独给只有options属性的组件做判断 - // const notRenderOptions = ['SelectV2', 'Cascader', 'Transfer'] - - // if ( - // item?.component !== 'SelectV2' && - // item?.component !== 'Cascader' && - // item?.componentProps?.options - // ) { - // slotsMap.default = () => renderOptions(item) - // } - - // const formItemSlots: Recordable = setFormItemSlots(slots, item.field) - // 如果有 labelMessage，自动使用插槽渲染 - // if (item?.labelMessage) { - // formItemSlots.label = () => { - // return ( - // <> - // {item.label} - // - // {{ - // content: () => , - // default: () => ( - // - // ) - // }} - // - // - // ) - // } - // } + const formItemSlots: Recordable = setFormItemSlots(slots, item.field) return ( {{ @@ -291,7 +257,8 @@ export default defineComponent({ ) } - } + }, + ...formItemSlots }} ) diff --git a/src/components/Form/src/helper/index.ts b/src/components/Form/src/helper/index.ts index 6eecbca..e4a7bc4 100644 --- a/src/components/Form/src/helper/index.ts +++ b/src/components/Form/src/helper/index.ts @@ -86,7 +86,7 @@ export const setGridProp = (col: ColProps = {}): ColProps => { export const setComponentProps = (item: FormSchema): Recordable => { // const notNeedClearable = ['ColorPicker'] // 拆分事件并组合 - const onEvents = item?.componentProps?.on || {} + const onEvents = (item?.componentProps as any)?.on || {} const newOnEvents: Recordable = {} for (const key in onEvents) { @@ -165,13 +165,13 @@ export const initModel = (schema: FormSchema[], formModel: Recordable) => { export const setFormItemSlots = (slots: Slots, field: string): Recordable => { const slotObj: Recordable = {} if (slots[`${field}-error`]) { - slotObj['error'] = (data: Recordable) => { - return getSlot(slots, `${field}-error`, data) + slotObj['error'] = (...args: any[]) => { + return getSlot(slots, `${field}-error`, args) } } if (slots[`${field}-label`]) { - slotObj['label'] = (data: Recordable) => { - return getSlot(slots, `${field}-label`, data) + slotObj['label'] = (...args: any[]) => { + return getSlot(slots, `${field}-label`, args) } } return slotObj diff --git a/src/components/Form/src/types/index.ts b/src/components/Form/src/types/index.ts index 04290fd..72b4b87 100644 --- a/src/components/Form/src/types/index.ts +++ b/src/components/Form/src/types/index.ts @@ -5,9 +5,11 @@ import { InputNumberProps, CascaderProps, CascaderNode, - CascaderValue + CascaderValue, + FormItemRule } from 'element-plus' import type { AxiosPromise } from 'axios' +import { IEditorConfig } from '@wangeditor/editor' export interface PlaceholderModel { placeholder?: string @@ -731,6 +733,11 @@ export interface TimeSelectComponentProps { style?: CSSProperties } +export interface EditorComponentProps { + editorConfig?: IEditorConfig + style?: CSSProperties +} + export interface ColProps { span?: number xs?: number @@ -752,10 +759,13 @@ export type FormValueType = string | number | string[] | number[] | boolean | un export interface FormItemProps { labelWidth?: string | number required?: boolean - rules?: Recordable + rules?: FormItemRule | FormItemRule[] error?: string showMessage?: boolean inlineMessage?: boolean + size?: ElementPlusSize + for?: string + validateStatus?: '' | 'error' | 'validating' | 'success' style?: CSSProperties } @@ -800,6 +810,7 @@ export interface FormSchema { | DatePickerComponentProps | DateTimePickerComponentProps | TimePickerComponentProps + | EditorComponentProps /** * formItem组件属性，具体可以查看element-plus文档 diff --git a/src/components/InputPassword/src/InputPassword.vue b/src/components/InputPassword/src/InputPassword.vue index 137ff41..cb0a1c3 100644 --- a/src/components/InputPassword/src/InputPassword.vue +++ b/src/components/InputPassword/src/InputPassword.vue @@ -53,19 +53,11 @@ const getPasswordStrength = computed(() => { const zxcvbnRef = zxcvbn(unref(valueRef)) as ZxcvbnResult return value ? zxcvbnRef.score : -1 }) - -const getIconName = computed(() => - unref(textType) === 'password' ? 'ant-design:eye-invisible-outlined' : 'ant-design:eye-outlined' -)