fast-element-plus 2.0.16 → 2.0.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +26 -0
- package/CONTRIBUTING.md +8 -0
- package/dist/component.d.ts +6564 -2
- package/dist/component.mjs.map +1 -1
- package/dist/components/avatar/src/avatar.d.ts +19 -7
- package/dist/components/avatar/src/avatar.mjs +5 -0
- package/dist/components/avatar/src/avatar.mjs.map +1 -1
- package/dist/components/button/src/button.d.ts +4 -4
- package/dist/components/button/src/button.mjs +3 -4
- package/dist/components/button/src/button.mjs.map +1 -1
- package/dist/components/carNumber/src/carNumber.mjs +7 -9
- package/dist/components/carNumber/src/carNumber.mjs.map +1 -1
- package/dist/components/contextMenu/src/contextMenu.mjs +8 -7
- package/dist/components/contextMenu/src/contextMenu.mjs.map +1 -1
- package/dist/components/dialog/src/dialog.d.ts +7 -4
- package/dist/components/dialog/src/dialog.mjs +6 -7
- package/dist/components/dialog/src/dialog.mjs.map +1 -1
- package/dist/components/drawer/src/drawer.mjs +14 -14
- package/dist/components/drawer/src/drawer.mjs.map +1 -1
- package/dist/components/form/src/form.d.ts +36 -24
- package/dist/components/form/src/form.mjs +8 -9
- package/dist/components/form/src/form.mjs.map +1 -1
- package/dist/components/form/src/formItem.d.ts +3 -3
- package/dist/components/form/src/formItem.mjs +18 -17
- package/dist/components/form/src/formItem.mjs.map +1 -1
- package/dist/components/form/utils/form.d.ts +2 -2
- package/dist/components/form/utils/form.mjs +2 -2
- package/dist/components/form/utils/form.mjs.map +1 -1
- package/dist/components/icon/src/icon.mjs.map +1 -1
- package/dist/components/iconSelector/src/iconSelector.d.ts +2 -2
- package/dist/components/iconSelector/src/iconSelector.mjs +4 -5
- package/dist/components/iconSelector/src/iconSelector.mjs.map +1 -1
- package/dist/components/image/src/image.d.ts +1 -1
- package/dist/components/image/src/image.mjs +2 -2
- package/dist/components/image/src/image.mjs.map +1 -1
- package/dist/components/inputDialogPage/src/inputDialogPage.mjs +10 -12
- package/dist/components/inputDialogPage/src/inputDialogPage.mjs.map +1 -1
- package/dist/components/layoutGrid/src/layoutGrid.d.ts +23 -11
- package/dist/components/layoutGrid/src/layoutGrid.mjs +42 -43
- package/dist/components/layoutGrid/src/layoutGrid.mjs.map +1 -1
- package/dist/components/layoutGrid/src/layoutGrid.type.d.ts +1 -1
- package/dist/components/layoutGrid/src/layoutGridItem.mjs +13 -14
- package/dist/components/layoutGrid/src/layoutGridItem.mjs.map +1 -1
- package/dist/components/select/src/select.d.ts +27 -12
- package/dist/components/select/src/select.mjs +46 -44
- package/dist/components/select/src/select.mjs.map +1 -1
- package/dist/components/select/src/selectOption.mjs +4 -5
- package/dist/components/select/src/selectOption.mjs.map +1 -1
- package/dist/components/selectPage/src/selectPage.d.ts +24 -9
- package/dist/components/selectPage/src/selectPage.mjs +45 -52
- package/dist/components/selectPage/src/selectPage.mjs.map +1 -1
- package/dist/components/selectV2/src/selectV2.d.ts +49 -29
- package/dist/components/selectV2/src/selectV2.mjs +64 -62
- package/dist/components/selectV2/src/selectV2.mjs.map +1 -1
- package/dist/components/table/src/table.d.ts +63 -29
- package/dist/components/table/src/table.mjs +77 -81
- package/dist/components/table/src/table.mjs.map +1 -1
- package/dist/components/table/src/table.type.d.ts +2 -2
- package/dist/components/table/src/table.type.mjs.map +1 -1
- package/dist/components/table/src/tableColumn.d.ts +13 -13
- package/dist/components/table/src/tableColumn.mjs +17 -30
- package/dist/components/table/src/tableColumn.mjs.map +1 -1
- package/dist/components/table/src/tableColumnSettingDialog.mjs +24 -14
- package/dist/components/table/src/tableColumnSettingDialog.mjs.map +1 -1
- package/dist/components/table/src/tablePagination.mjs +2 -3
- package/dist/components/table/src/tablePagination.mjs.map +1 -1
- package/dist/components/table/src/tableSearchForm.d.ts +4 -4
- package/dist/components/table/src/tableSearchForm.mjs +24 -27
- package/dist/components/table/src/tableSearchForm.mjs.map +1 -1
- package/dist/components/table/src/tableSearchFormItem.d.ts +1 -7
- package/dist/components/table/src/tableSearchFormItem.mjs +3 -6
- package/dist/components/table/src/tableSearchFormItem.mjs.map +1 -1
- package/dist/components/table/src/useTable.d.ts +4 -4
- package/dist/components/table/src/useTable.mjs +13 -14
- package/dist/components/table/src/useTable.mjs.map +1 -1
- package/dist/components/table/utils/table.mjs +5 -7
- package/dist/components/table/utils/table.mjs.map +1 -1
- package/dist/components/tree/src/tree.d.ts +6 -6
- package/dist/components/tree/src/tree.mjs +28 -26
- package/dist/components/tree/src/tree.mjs.map +1 -1
- package/dist/components/treeSelect/src/treeSelect.d.ts +30 -27
- package/dist/components/treeSelect/src/treeSelect.mjs +45 -43
- package/dist/components/treeSelect/src/treeSelect.mjs.map +1 -1
- package/dist/components/upload/src/upload.d.ts +1 -1
- package/dist/components/upload/src/upload.mjs +4 -5
- package/dist/components/upload/src/upload.mjs.map +1 -1
- package/dist/components/upload/src/useUpload.mjs +5 -7
- package/dist/components/upload/src/useUpload.mjs.map +1 -1
- package/dist/components/upload/utils/upload.mjs +1 -1
- package/dist/components/upload/utils/upload.mjs.map +1 -1
- package/dist/components/uploadImage/src/uploadImage.d.ts +4 -16
- package/dist/components/uploadImage/src/uploadImage.mjs +7 -13
- package/dist/components/uploadImage/src/uploadImage.mjs.map +1 -1
- package/dist/components/uploadImages/src/uploadImages.d.ts +1 -1
- package/dist/components/uploadImages/src/uploadImages.mjs +7 -8
- package/dist/components/uploadImages/src/uploadImages.mjs.map +1 -1
- package/dist/directives/click-copy/index.mjs +5 -9
- package/dist/directives/click-copy/index.mjs.map +1 -1
- package/dist/element-plus.mjs +5 -6
- package/dist/element-plus.mjs.map +1 -1
- package/dist/hooks/use-screenFull/index.mjs.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.global.min.js +4 -4
- package/dist/index.global.min.js.map +1 -1
- package/dist/utils/async/index.mjs.map +1 -1
- package/dist/utils/date/index.mjs.map +1 -1
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/object/index.d.ts +30 -0
- package/dist/utils/object/index.mjs +159 -0
- package/dist/utils/object/index.mjs.map +1 -0
- package/dist/utils/string/index.mjs.map +1 -1
- package/dist/utils/vue/emits.mjs.map +1 -1
- package/dist/utils/vue/install.mjs.map +1 -1
- package/dist/utils/vue/render.mjs.map +1 -1
- package/dist/version.d.ts +1 -1
- package/dist/version.mjs +1 -1
- package/dist/version.mjs.map +1 -1
- package/package.json +7 -11
|
@@ -4,11 +4,11 @@ import { callOptionalFunction } from "../../../utils/vue/func.mjs";
|
|
|
4
4
|
import { definePropType, useProps } from "../../../utils/vue/props.mjs";
|
|
5
5
|
import { useRender } from "../../../utils/vue/render.mjs";
|
|
6
6
|
import { makeSlots } from "../../../utils/vue/slots.mjs";
|
|
7
|
+
import { withDefineType } from "../../../utils/vue/with.mjs";
|
|
7
8
|
import { FullScreen, FullScreenExit } from "@fast-element-plus/icons-vue";
|
|
8
|
-
import { Fragment, computed, createVNode, defineComponent, mergeProps, nextTick, onBeforeUnmount, reactive,
|
|
9
|
+
import { Fragment, computed, createVNode, defineComponent, mergeProps, nextTick, onBeforeUnmount, reactive, resolveDirective, shallowRef, watch, withDirectives } from "vue";
|
|
9
10
|
import { Close, Eleme, Refresh } from "@element-plus/icons-vue";
|
|
10
11
|
import { ElButton, ElDrawer, ElIcon, ElMessage, ElMessageBox, ElScrollbar, drawerEmits, drawerProps, useGlobalSize } from "element-plus";
|
|
11
|
-
import { isBoolean } from "lodash-unified";
|
|
12
12
|
//#region src/components/drawer/src/drawer.tsx
|
|
13
13
|
/** FaDrawer 的运行时 Props 定义。 */
|
|
14
14
|
const faDrawerProps = {
|
|
@@ -71,7 +71,7 @@ const faDrawerProps = {
|
|
|
71
71
|
const faDrawerEmits = {
|
|
72
72
|
...drawerEmits,
|
|
73
73
|
/** @description v-model 回调 */
|
|
74
|
-
"update:modelValue": (value) =>
|
|
74
|
+
"update:modelValue": (value) => typeof value === "boolean",
|
|
75
75
|
/** @description 确认按钮点击事件 */
|
|
76
76
|
confirmClick: () => true
|
|
77
77
|
};
|
|
@@ -81,16 +81,16 @@ var drawer_default = defineComponent({
|
|
|
81
81
|
emits: faDrawerEmits,
|
|
82
82
|
slots: makeSlots(),
|
|
83
83
|
setup(props, { slots, emit, expose }) {
|
|
84
|
-
const
|
|
84
|
+
const globalSize = useGlobalSize();
|
|
85
|
+
const drawerRef = shallowRef(null);
|
|
85
86
|
const state = reactive({
|
|
86
87
|
loading: false,
|
|
87
88
|
visible: false,
|
|
88
89
|
fullscreen: false,
|
|
89
|
-
size:
|
|
90
|
+
size: withDefineType(),
|
|
90
91
|
dragging: false,
|
|
91
92
|
refreshing: false
|
|
92
93
|
});
|
|
93
|
-
const drawerRef = ref();
|
|
94
94
|
let cacheOpenFunction;
|
|
95
95
|
const handleOpen = async (openFunction) => {
|
|
96
96
|
state.visible = true;
|
|
@@ -145,7 +145,7 @@ var drawer_default = defineComponent({
|
|
|
145
145
|
if (state.loading) return;
|
|
146
146
|
if (document.querySelector(".el-image-viewer__wrapper")) return;
|
|
147
147
|
const newDone = () => {
|
|
148
|
-
return callOptionalFunction(props.beforeClose).then(() => {
|
|
148
|
+
return callOptionalFunction(props.beforeClose, done).then(() => {
|
|
149
149
|
emit("close");
|
|
150
150
|
done();
|
|
151
151
|
});
|
|
@@ -165,12 +165,6 @@ var drawer_default = defineComponent({
|
|
|
165
165
|
if (state.loading) return;
|
|
166
166
|
handleClose();
|
|
167
167
|
};
|
|
168
|
-
watch(() => state.visible, (newValue) => {
|
|
169
|
-
emit("update:modelValue", newValue);
|
|
170
|
-
});
|
|
171
|
-
watch(() => props.size, (newValue) => {
|
|
172
|
-
state.size = newValue;
|
|
173
|
-
});
|
|
174
168
|
const handleDraggablePointermove = (event) => {
|
|
175
169
|
const viewportSize = props.direction === "rtl" || props.direction === "ltr" ? document.documentElement.clientWidth : document.documentElement.clientHeight;
|
|
176
170
|
let nextSize;
|
|
@@ -199,6 +193,12 @@ var drawer_default = defineComponent({
|
|
|
199
193
|
document.addEventListener("pointermove", handleDraggablePointermove);
|
|
200
194
|
document.addEventListener("pointerup", stopDraggable, { once: true });
|
|
201
195
|
};
|
|
196
|
+
watch(() => state.visible, (newValue) => {
|
|
197
|
+
emit("update:modelValue", newValue);
|
|
198
|
+
});
|
|
199
|
+
watch(() => props.size, (newValue) => {
|
|
200
|
+
state.size = newValue;
|
|
201
|
+
}, { immediate: true });
|
|
202
202
|
onBeforeUnmount(stopDraggable);
|
|
203
203
|
const elDrawerProps = useProps(props, drawerProps, [
|
|
204
204
|
"modelValue",
|
|
@@ -215,7 +215,7 @@ var drawer_default = defineComponent({
|
|
|
215
215
|
"ref": drawerRef,
|
|
216
216
|
"class": [
|
|
217
217
|
"fa-drawer",
|
|
218
|
-
`fa-drawer-${
|
|
218
|
+
`fa-drawer-${globalSize.value}`,
|
|
219
219
|
{
|
|
220
220
|
"fa-drawer__fullscreen": state.fullscreen,
|
|
221
221
|
"fa-drawer__dragging": state.dragging
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.mjs","names":["update:modelValue"],"sources":["../../../../src/components/drawer/src/drawer.tsx"],"sourcesContent":["import { Fragment, computed, defineComponent, nextTick, onBeforeUnmount, reactive, ref, watch } from \"vue\";\nimport { Close, Eleme, Refresh } from \"@element-plus/icons-vue\";\nimport { ElButton, ElDrawer, ElIcon, ElMessage, ElMessageBox, ElScrollbar, drawerEmits, drawerProps, useGlobalSize } from \"element-plus\";\nimport { FullScreen, FullScreenExit } from \"@fast-element-plus/icons-vue\";\nimport { isBoolean } from \"lodash-unified\";\nimport { callOptionalFunction, definePropType, makeSlots, useEmits, useExpose, useProps, useRender } from \"../../../utils\";\nimport type { VNode } from \"vue\";\n\n/** FaDrawer 的运行时 Props 定义。 */\nexport const faDrawerProps = {\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- Element Plus 2.x 尚未提供可替代的公开运行时 props 定义。\n\t...drawerProps,\n\t/** @description whether to append Dialog itself to body. A nested Dialog should have this attribute set to `true` */\n\tappendToBody: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description enable dragging feature for Dialog */\n\tdraggable: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description destroy elements in Dialog when closed */\n\tdestroyOnClose: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示刷新按钮 */\n\tshowRefresh: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示全屏图标 */\n\tshowFullscreen: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示关闭按钮 */\n\tshowCloseButton: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示确认按钮 */\n\tshowConfirmButton: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 禁用确认按钮 */\n\tdisabledConfirmButton: Boolean,\n\t/** @description 关闭按钮文字,默认取消 */\n\tcloseButtonText: {\n\t\ttype: String,\n\t\tdefault: \"取消\",\n\t},\n\t/** @description 确认按钮文字,默认确认 */\n\tconfirmButtonText: {\n\t\ttype: String,\n\t\tdefault: \"确认\",\n\t},\n\t/** @description 隐藏底部操作 */\n\thideFooter: Boolean,\n\t/** @description 显示关闭回调 */\n\tshowBeforeClose: Boolean,\n\t/** @description 打开之后 */\n\tafterOpen: {\n\t\ttype: definePropType<() => void | Promise<void>>(Function),\n\t},\n};\n\n/** FaDrawer 的运行时 Emits 定义。 */\nexport const faDrawerEmits = {\n\t...drawerEmits,\n\t/** @description v-model 回调 */\n\t\"update:modelValue\": (value: boolean): boolean => isBoolean(value),\n\t/** @description 确认按钮点击事件 */\n\tconfirmClick: (): boolean => true,\n};\n\n/** FaDrawer 的插槽参数。 */\nexport interface FaDrawerSlots extends Record<string, unknown> {\n\t/** @description 默认内容插槽 */\n\tdefault: { loading: boolean };\n\t/** @description 头部插槽 */\n\theader: { loading: boolean; close: () => void; titleId: string; titleClass: string };\n\t/** @description 标题插槽 */\n\ttitle: { loading: boolean; close: () => void; titleId: string; titleClass: string };\n\t/** @description 底部插槽 */\n\tfooter: { loading: boolean; close: () => void };\n}\n\nexport default defineComponent({\n\tname: \"FaDrawer\",\n\tprops: faDrawerProps,\n\temits: faDrawerEmits,\n\tslots: makeSlots<FaDrawerSlots>(),\n\tsetup(props, { slots, emit, expose }) {\n\t\tconst _globalSize = useGlobalSize();\n\n\t\tconst state = reactive({\n\t\t\tloading: false,\n\t\t\tvisible: false,\n\t\t\tfullscreen: false,\n\t\t\tsize: props.size,\n\t\t\tdragging: false,\n\t\t\trefreshing: false,\n\t\t});\n\n\t\tconst drawerRef = ref<InstanceType<typeof ElDrawer>>();\n\n\t\tlet cacheOpenFunction: (() => void | Promise<void>) | undefined;\n\n\t\tconst handleOpen = async (openFunction?: () => void | Promise<void>): Promise<void> => {\n\t\t\tstate.visible = true;\n\t\t\tcacheOpenFunction = openFunction;\n\t\t\tawait nextTick();\n\t\t\tstate.loading = true;\n\t\t\ttry {\n\t\t\t\tawait callOptionalFunction(props.afterOpen ?? openFunction);\n\t\t\t\temit(\"open\");\n\t\t\t} catch (error) {\n\t\t\t\tstate.visible = false;\n\t\t\t\tthrow error;\n\t\t\t} finally {\n\t\t\t\tstate.loading = false;\n\t\t\t}\n\t\t};\n\n\t\tconst handleClose = async (closeFunction?: () => void | Promise<void>): Promise<void> => {\n\t\t\tstate.loading = true;\n\t\t\ttry {\n\t\t\t\tawait callOptionalFunction(closeFunction);\n\t\t\t\temit(\"close\");\n\t\t\t\tstate.visible = false;\n\t\t\t} finally {\n\t\t\t\tstate.loading = false;\n\t\t\t}\n\t\t};\n\n\t\tconst handleLoading = async (loadingFunction: () => void | Promise<void>): Promise<void> => {\n\t\t\tstate.loading = true;\n\t\t\ttry {\n\t\t\t\tawait callOptionalFunction(loadingFunction);\n\t\t\t} finally {\n\t\t\t\tstate.loading = false;\n\t\t\t}\n\t\t};\n\n\t\tconst handleRefresh = async (): Promise<void> => {\n\t\t\tif (state.loading) return;\n\t\t\tstate.refreshing = true;\n\t\t\tstate.loading = true;\n\t\t\ttry {\n\t\t\t\tawait new Promise<void>((resolve) => {\n\t\t\t\t\tsetTimeout(resolve, 500);\n\t\t\t\t});\n\t\t\t\tstate.refreshing = false;\n\t\t\t\tawait handleOpen(cacheOpenFunction);\n\t\t\t\tElMessage.success(\"刷新成功\");\n\t\t\t} finally {\n\t\t\t\tstate.refreshing = false;\n\t\t\t\tstate.loading = false;\n\t\t\t}\n\t\t};\n\n\t\tconst handleBeforeClose = (done: () => void): void => {\n\t\t\tif (state.loading) return;\n\t\t\t// 解决 image 预览摁下 ese 会关闭弹窗的问题\n\t\t\tif (document.querySelector(\".el-image-viewer__wrapper\")) return;\n\n\t\t\tconst newDone = (): Promise<void> => {\n\t\t\t\t// 组件对外约定为无参数完成钩子,不采用 Element Plus 的 done 回调签名。\n\t\t\t\treturn callOptionalFunction(props.beforeClose as unknown as (() => void | PromiseLike<void>) | undefined).then(() => {\n\t\t\t\t\temit(\"close\");\n\t\t\t\t\tdone();\n\t\t\t\t});\n\t\t\t};\n\n\t\t\tif (props.showBeforeClose) {\n\t\t\t\t// 用户取消关闭属于正常分支,无需继续执行 beforeClose。\n\t\t\t\tElMessageBox.confirm(\"确定关闭?\", { type: \"warning\" }).then(() => newDone());\n\t\t\t} else {\n\t\t\t\tnewDone();\n\t\t\t}\n\t\t};\n\n\t\tconst handleFullscreen = (): void => {\n\t\t\tif (state.loading) return;\n\t\t\tstate.fullscreen = !state.fullscreen;\n\t\t};\n\n\t\tconst handleConfirmClick = (): void => {\n\t\t\tif (state.loading) return;\n\t\t\temit(\"confirmClick\");\n\t\t};\n\n\t\tconst handleCloseClick = (): void => {\n\t\t\tif (state.loading) return;\n\t\t\thandleClose();\n\t\t};\n\n\t\twatch(\n\t\t\t() => state.visible,\n\t\t\t(newValue) => {\n\t\t\t\temit(\"update:modelValue\", newValue);\n\t\t\t}\n\t\t);\n\n\t\twatch(\n\t\t\t() => props.size,\n\t\t\t(newValue) => {\n\t\t\t\tstate.size = newValue;\n\t\t\t}\n\t\t);\n\n\t\tconst handleDraggablePointermove = (event: PointerEvent): void => {\n\t\t\tconst horizontal = props.direction === \"rtl\" || props.direction === \"ltr\";\n\t\t\tconst viewportSize = horizontal ? document.documentElement.clientWidth : document.documentElement.clientHeight;\n\t\t\tlet nextSize: number;\n\t\t\tswitch (props.direction) {\n\t\t\t\tcase \"ltr\":\n\t\t\t\t\tnextSize = event.clientX;\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"ttb\":\n\t\t\t\t\tnextSize = event.clientY;\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"btt\":\n\t\t\t\t\tnextSize = viewportSize - event.clientY;\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"rtl\":\n\t\t\t\tdefault:\n\t\t\t\t\tnextSize = viewportSize - event.clientX;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t\tstate.size = `${Math.min(Math.max(nextSize, viewportSize * 0.2), viewportSize * 0.95).toString()}px`;\n\t\t};\n\n\t\tconst stopDraggable = (): void => {\n\t\t\tstate.dragging = false;\n\t\t\tdocument.removeEventListener(\"pointermove\", handleDraggablePointermove);\n\t\t\tdocument.removeEventListener(\"pointerup\", stopDraggable);\n\t\t};\n\n\t\tconst handleDraggablePointerdown = (event: PointerEvent): void => {\n\t\t\tevent.preventDefault();\n\t\t\tstate.dragging = true;\n\t\t\tdocument.addEventListener(\"pointermove\", handleDraggablePointermove);\n\t\t\tdocument.addEventListener(\"pointerup\", stopDraggable, { once: true });\n\t\t};\n\n\t\tonBeforeUnmount(stopDraggable);\n\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- 透传范围必须与继承的 Element Plus 2.x 运行时 props 保持一致。\n\t\tconst elDrawerProps = useProps(props, drawerProps, [\"modelValue\", \"size\", \"showClose\", \"beforeClose\"]);\n\t\t// open、close 是 Fast 异步业务流程完成事件,不直接透传 Element Plus 的同名生命周期事件。\n\t\tconst elDrawerEmits = useEmits(drawerEmits, emit, [\"open\", \"close\", \"update:modelValue\"]);\n\n\t\tuseRender(() => (\n\t\t\t<ElDrawer\n\t\t\t\t{...elDrawerProps.value}\n\t\t\t\t{...elDrawerEmits.value}\n\t\t\t\tref={drawerRef}\n\t\t\t\tclass={[\n\t\t\t\t\t\"fa-drawer\",\n\t\t\t\t\t`fa-drawer-${_globalSize.value}`,\n\t\t\t\t\t{ \"fa-drawer__fullscreen\": state.fullscreen, \"fa-drawer__dragging\": state.dragging },\n\t\t\t\t]}\n\t\t\t\tvModel={state.visible}\n\t\t\t\tsize={state.size}\n\t\t\t\tshowClose={false}\n\t\t\t\tbeforeClose={handleBeforeClose}\n\t\t\t>\n\t\t\t\t{{\n\t\t\t\t\theader: ({ titleId, titleClass }: { close: () => void; titleId: string; titleClass: string }) => (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<div id={titleId} class={[\"fa-drawer__header-title\", titleClass]}>\n\t\t\t\t\t\t\t\t{slots.title?.({ loading: state.loading, close: handleCloseClick, titleId, titleClass }) ?? props.title}\n\t\t\t\t\t\t\t\t{slots.header?.({ loading: state.loading, close: handleCloseClick, titleId, titleClass })}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{props.showRefresh && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle=\"刷新\"\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleRefresh}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon class=\"icon\">\n\t\t\t\t\t\t\t\t\t\t<Refresh />\n\t\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{props.showFullscreen && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle={state.fullscreen ? \"关闭全屏显示\" : \"全屏显示\"}\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleFullscreen}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon>{state.fullscreen ? <FullScreenExit /> : <FullScreen />}</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{props.showClose && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle=\"关闭\"\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleCloseClick}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon class=\"icon\">\n\t\t\t\t\t\t\t\t\t\t<Close />\n\t\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t),\n\t\t\t\t\tdefault: () => (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t{props.draggable && <div class=\"fa-drawer__draggable\" onPointerdown={handleDraggablePointerdown} />}\n\t\t\t\t\t\t\t<ElScrollbar vLoading={state.loading} element-loading-text=\"加载中...\">\n\t\t\t\t\t\t\t\t{!state.refreshing && slots.default?.(state)}\n\t\t\t\t\t\t\t</ElScrollbar>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t),\n\t\t\t\t\t...(!props.hideFooter && {\n\t\t\t\t\t\tfooter: (): VNode[] => [\n\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t{slots.footer?.({ loading: state.loading, close: handleCloseClick })}\n\t\t\t\t\t\t\t\t{props.showCloseButton && (\n\t\t\t\t\t\t\t\t\t<ElButton disabled={state.loading} onClick={handleCloseClick}>\n\t\t\t\t\t\t\t\t\t\t{props.closeButtonText}\n\t\t\t\t\t\t\t\t\t</ElButton>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{props.showConfirmButton && (\n\t\t\t\t\t\t\t\t\t<ElButton\n\t\t\t\t\t\t\t\t\t\tloading={state.loading}\n\t\t\t\t\t\t\t\t\t\tloadingIcon={Eleme}\n\t\t\t\t\t\t\t\t\t\tdisabled={props.disabledConfirmButton}\n\t\t\t\t\t\t\t\t\t\ttype=\"primary\"\n\t\t\t\t\t\t\t\t\t\tonClick={handleConfirmClick}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{state.loading ? \"加载中...\" : props.confirmButtonText}\n\t\t\t\t\t\t\t\t\t</ElButton>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</Fragment>,\n\t\t\t\t\t\t],\n\t\t\t\t\t}),\n\t\t\t\t}}\n\t\t\t</ElDrawer>\n\t\t));\n\n\t\treturn useExpose(expose, {\n\t\t\t/** @description 用于关闭 Drawer, 该方法会调用传入的 before-close 方法 */\n\t\t\thandleClose: computed(() => drawerRef.value?.handleClose),\n\t\t\t/** @description 加载状态 */\n\t\t\tloading: computed(() => state.loading),\n\t\t\t/** @description 是否显示 */\n\t\t\tvisible: computed(() => state.visible),\n\t\t\t/** @description 打开弹窗 */\n\t\t\topen: handleOpen,\n\t\t\t/** @description 关闭弹窗 */\n\t\t\tclose: handleClose,\n\t\t\t/** @description 刷新弹窗 */\n\t\t\trefresh: handleRefresh,\n\t\t\t/** @description 弹窗加载 */\n\t\t\tdoLoading: handleLoading,\n\t\t});\n\t},\n});\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"drawer.mjs","names":["update:modelValue"],"sources":["../../../../src/components/drawer/src/drawer.tsx"],"sourcesContent":["import { Fragment, computed, defineComponent, nextTick, onBeforeUnmount, reactive, shallowRef, watch } from \"vue\";\nimport { Close, Eleme, Refresh } from \"@element-plus/icons-vue\";\nimport { ElButton, ElDrawer, ElIcon, ElMessage, ElMessageBox, ElScrollbar, drawerEmits, drawerProps, useGlobalSize } from \"element-plus\";\nimport { FullScreen, FullScreenExit } from \"@fast-element-plus/icons-vue\";\nimport { callOptionalFunction, definePropType, makeSlots, useEmits, useExpose, useProps, useRender, withDefineType } from \"../../../utils\";\n\n/** FaDrawer 的运行时 Props 定义。 */\nexport const faDrawerProps = {\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- Element Plus 2.x 尚未提供可替代的公开运行时 props 定义。\n\t...drawerProps,\n\t/** @description whether to append Dialog itself to body. A nested Dialog should have this attribute set to `true` */\n\tappendToBody: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description enable dragging feature for Dialog */\n\tdraggable: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description destroy elements in Dialog when closed */\n\tdestroyOnClose: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示刷新按钮 */\n\tshowRefresh: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示全屏图标 */\n\tshowFullscreen: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示关闭按钮 */\n\tshowCloseButton: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示确认按钮 */\n\tshowConfirmButton: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 禁用确认按钮 */\n\tdisabledConfirmButton: Boolean,\n\t/** @description 关闭按钮文字,默认取消 */\n\tcloseButtonText: {\n\t\ttype: String,\n\t\tdefault: \"取消\",\n\t},\n\t/** @description 确认按钮文字,默认确认 */\n\tconfirmButtonText: {\n\t\ttype: String,\n\t\tdefault: \"确认\",\n\t},\n\t/** @description 隐藏底部操作 */\n\thideFooter: Boolean,\n\t/** @description 显示关闭回调 */\n\tshowBeforeClose: Boolean,\n\t/** @description 打开之后 */\n\tafterOpen: {\n\t\ttype: definePropType<() => void | Promise<void>>(Function),\n\t},\n};\n\n/** FaDrawer 的运行时 Emits 定义。 */\nexport const faDrawerEmits = {\n\t...drawerEmits,\n\t/** @description v-model 回调 */\n\t\"update:modelValue\": (value: boolean) => typeof value === \"boolean\",\n\t/** @description 确认按钮点击事件 */\n\tconfirmClick: () => true,\n};\n\n/** FaDrawer 的插槽参数。 */\nexport interface FaDrawerSlots extends Record<string, unknown> {\n\t/** @description 默认内容插槽 */\n\tdefault: { loading: boolean };\n\t/** @description 头部插槽 */\n\theader: { loading: boolean; close: () => void; titleId: string; titleClass: string };\n\t/** @description 标题插槽 */\n\ttitle: { loading: boolean; close: () => void; titleId: string; titleClass: string };\n\t/** @description 底部插槽 */\n\tfooter: { loading: boolean; close: () => void };\n}\n\nexport default defineComponent({\n\tname: \"FaDrawer\",\n\tprops: faDrawerProps,\n\temits: faDrawerEmits,\n\tslots: makeSlots<FaDrawerSlots>(),\n\tsetup(props, { slots, emit, expose }) {\n\t\tconst globalSize = useGlobalSize();\n\t\tconst drawerRef = shallowRef<InstanceType<typeof ElDrawer> | null>(null);\n\n\t\tconst state = reactive({\n\t\t\tloading: false,\n\t\t\tvisible: false,\n\t\t\tfullscreen: false,\n\t\t\tsize: withDefineType<typeof props.size>(),\n\t\t\tdragging: false,\n\t\t\trefreshing: false,\n\t\t});\n\n\t\tlet cacheOpenFunction: (() => void | Promise<void>) | undefined;\n\n\t\tconst handleOpen = async (openFunction?: () => void | Promise<void>) => {\n\t\t\tstate.visible = true;\n\t\t\tcacheOpenFunction = openFunction;\n\t\t\tawait nextTick();\n\t\t\tstate.loading = true;\n\t\t\ttry {\n\t\t\t\tawait callOptionalFunction(props.afterOpen ?? openFunction);\n\t\t\t\temit(\"open\");\n\t\t\t} catch (error) {\n\t\t\t\tstate.visible = false;\n\t\t\t\tthrow error;\n\t\t\t} finally {\n\t\t\t\tstate.loading = false;\n\t\t\t}\n\t\t};\n\n\t\tconst handleClose = async (closeFunction?: () => void | Promise<void>) => {\n\t\t\tstate.loading = true;\n\t\t\ttry {\n\t\t\t\tawait callOptionalFunction(closeFunction);\n\t\t\t\temit(\"close\");\n\t\t\t\tstate.visible = false;\n\t\t\t} finally {\n\t\t\t\tstate.loading = false;\n\t\t\t}\n\t\t};\n\n\t\tconst handleLoading = async (loadingFunction: () => void | Promise<void>) => {\n\t\t\tstate.loading = true;\n\t\t\ttry {\n\t\t\t\tawait callOptionalFunction(loadingFunction);\n\t\t\t} finally {\n\t\t\t\tstate.loading = false;\n\t\t\t}\n\t\t};\n\n\t\tconst handleRefresh = async () => {\n\t\t\tif (state.loading) return;\n\t\t\tstate.refreshing = true;\n\t\t\tstate.loading = true;\n\t\t\ttry {\n\t\t\t\tawait new Promise<void>((resolve) => {\n\t\t\t\t\tsetTimeout(resolve, 500);\n\t\t\t\t});\n\t\t\t\tstate.refreshing = false;\n\t\t\t\tawait handleOpen(cacheOpenFunction);\n\t\t\t\tElMessage.success(\"刷新成功\");\n\t\t\t} finally {\n\t\t\t\tstate.refreshing = false;\n\t\t\t\tstate.loading = false;\n\t\t\t}\n\t\t};\n\n\t\tconst handleBeforeClose = (done: () => void) => {\n\t\t\tif (state.loading) return;\n\t\t\t// 解决 image 预览摁下 ese 会关闭弹窗的问题\n\t\t\tif (document.querySelector(\".el-image-viewer__wrapper\")) return;\n\n\t\t\tconst newDone = () => {\n\t\t\t\t// 组件对外约定为无参数完成钩子,不采用 Element Plus 的 done 回调签名。\n\t\t\t\treturn callOptionalFunction(props.beforeClose, done).then(() => {\n\t\t\t\t\temit(\"close\");\n\t\t\t\t\tdone();\n\t\t\t\t});\n\t\t\t};\n\n\t\t\tif (props.showBeforeClose) {\n\t\t\t\t// 用户取消关闭属于正常分支,无需继续执行 beforeClose。\n\t\t\t\tElMessageBox.confirm(\"确定关闭?\", { type: \"warning\" }).then(() => newDone());\n\t\t\t} else {\n\t\t\t\tnewDone();\n\t\t\t}\n\t\t};\n\n\t\tconst handleFullscreen = () => {\n\t\t\tif (state.loading) return;\n\t\t\tstate.fullscreen = !state.fullscreen;\n\t\t};\n\n\t\tconst handleConfirmClick = () => {\n\t\t\tif (state.loading) return;\n\t\t\temit(\"confirmClick\");\n\t\t};\n\n\t\tconst handleCloseClick = () => {\n\t\t\tif (state.loading) return;\n\t\t\thandleClose();\n\t\t};\n\n\t\tconst handleDraggablePointermove = (event: PointerEvent) => {\n\t\t\tconst horizontal = props.direction === \"rtl\" || props.direction === \"ltr\";\n\t\t\tconst viewportSize = horizontal ? document.documentElement.clientWidth : document.documentElement.clientHeight;\n\t\t\tlet nextSize: number;\n\t\t\tswitch (props.direction) {\n\t\t\t\tcase \"ltr\":\n\t\t\t\t\tnextSize = event.clientX;\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"ttb\":\n\t\t\t\t\tnextSize = event.clientY;\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"btt\":\n\t\t\t\t\tnextSize = viewportSize - event.clientY;\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"rtl\":\n\t\t\t\tdefault:\n\t\t\t\t\tnextSize = viewportSize - event.clientX;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t\tstate.size = `${Math.min(Math.max(nextSize, viewportSize * 0.2), viewportSize * 0.95).toString()}px`;\n\t\t};\n\n\t\tconst stopDraggable = () => {\n\t\t\tstate.dragging = false;\n\t\t\tdocument.removeEventListener(\"pointermove\", handleDraggablePointermove);\n\t\t\tdocument.removeEventListener(\"pointerup\", stopDraggable);\n\t\t};\n\n\t\tconst handleDraggablePointerdown = (event: PointerEvent) => {\n\t\t\tevent.preventDefault();\n\t\t\tstate.dragging = true;\n\t\t\tdocument.addEventListener(\"pointermove\", handleDraggablePointermove);\n\t\t\tdocument.addEventListener(\"pointerup\", stopDraggable, { once: true });\n\t\t};\n\n\t\twatch(\n\t\t\t() => state.visible,\n\t\t\t(newValue) => {\n\t\t\t\temit(\"update:modelValue\", newValue);\n\t\t\t}\n\t\t);\n\n\t\twatch(\n\t\t\t() => props.size,\n\t\t\t(newValue) => {\n\t\t\t\tstate.size = newValue;\n\t\t\t},\n\t\t\t{ immediate: true }\n\t\t);\n\n\t\tonBeforeUnmount(stopDraggable);\n\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- 透传范围必须与继承的 Element Plus 2.x 运行时 props 保持一致。\n\t\tconst elDrawerProps = useProps(props, drawerProps, [\"modelValue\", \"size\", \"showClose\", \"beforeClose\"]);\n\t\t// open、close 是 Fast 异步业务流程完成事件,不直接透传 Element Plus 的同名生命周期事件。\n\t\tconst elDrawerEmits = useEmits(drawerEmits, emit, [\"open\", \"close\", \"update:modelValue\"]);\n\n\t\tuseRender(() => (\n\t\t\t<ElDrawer\n\t\t\t\t{...elDrawerProps.value}\n\t\t\t\t{...elDrawerEmits.value}\n\t\t\t\tref={drawerRef}\n\t\t\t\tclass={[\n\t\t\t\t\t\"fa-drawer\",\n\t\t\t\t\t`fa-drawer-${globalSize.value}`,\n\t\t\t\t\t{ \"fa-drawer__fullscreen\": state.fullscreen, \"fa-drawer__dragging\": state.dragging },\n\t\t\t\t]}\n\t\t\t\tvModel={state.visible}\n\t\t\t\tsize={state.size}\n\t\t\t\tshowClose={false}\n\t\t\t\tbeforeClose={handleBeforeClose}\n\t\t\t>\n\t\t\t\t{{\n\t\t\t\t\theader: ({ titleId, titleClass }: { close: () => void; titleId: string; titleClass: string }) => (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<div id={titleId} class={[\"fa-drawer__header-title\", titleClass]}>\n\t\t\t\t\t\t\t\t{slots.title?.({ loading: state.loading, close: handleCloseClick, titleId, titleClass }) ?? props.title}\n\t\t\t\t\t\t\t\t{slots.header?.({ loading: state.loading, close: handleCloseClick, titleId, titleClass })}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{props.showRefresh && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle=\"刷新\"\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleRefresh}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon class=\"icon\">\n\t\t\t\t\t\t\t\t\t\t<Refresh />\n\t\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{props.showFullscreen && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle={state.fullscreen ? \"关闭全屏显示\" : \"全屏显示\"}\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleFullscreen}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon>{state.fullscreen ? <FullScreenExit /> : <FullScreen />}</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{props.showClose && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle=\"关闭\"\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleCloseClick}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon class=\"icon\">\n\t\t\t\t\t\t\t\t\t\t<Close />\n\t\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t),\n\t\t\t\t\tdefault: () => (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t{props.draggable && <div class=\"fa-drawer__draggable\" onPointerdown={handleDraggablePointerdown} />}\n\t\t\t\t\t\t\t<ElScrollbar vLoading={state.loading} element-loading-text=\"加载中...\">\n\t\t\t\t\t\t\t\t{!state.refreshing && slots.default?.(state)}\n\t\t\t\t\t\t\t</ElScrollbar>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t),\n\t\t\t\t\t...(!props.hideFooter && {\n\t\t\t\t\t\tfooter: () => [\n\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t{slots.footer?.({ loading: state.loading, close: handleCloseClick })}\n\t\t\t\t\t\t\t\t{props.showCloseButton && (\n\t\t\t\t\t\t\t\t\t<ElButton disabled={state.loading} onClick={handleCloseClick}>\n\t\t\t\t\t\t\t\t\t\t{props.closeButtonText}\n\t\t\t\t\t\t\t\t\t</ElButton>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{props.showConfirmButton && (\n\t\t\t\t\t\t\t\t\t<ElButton\n\t\t\t\t\t\t\t\t\t\tloading={state.loading}\n\t\t\t\t\t\t\t\t\t\tloadingIcon={Eleme}\n\t\t\t\t\t\t\t\t\t\tdisabled={props.disabledConfirmButton}\n\t\t\t\t\t\t\t\t\t\ttype=\"primary\"\n\t\t\t\t\t\t\t\t\t\tonClick={handleConfirmClick}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{state.loading ? \"加载中...\" : props.confirmButtonText}\n\t\t\t\t\t\t\t\t\t</ElButton>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</Fragment>,\n\t\t\t\t\t\t],\n\t\t\t\t\t}),\n\t\t\t\t}}\n\t\t\t</ElDrawer>\n\t\t));\n\n\t\treturn useExpose(expose, {\n\t\t\t/** @description 用于关闭 Drawer, 该方法会调用传入的 before-close 方法 */\n\t\t\thandleClose: computed(() => drawerRef.value?.handleClose),\n\t\t\t/** @description 加载状态 */\n\t\t\tloading: computed(() => state.loading),\n\t\t\t/** @description 是否显示 */\n\t\t\tvisible: computed(() => state.visible),\n\t\t\t/** @description 打开弹窗 */\n\t\t\topen: handleOpen,\n\t\t\t/** @description 关闭弹窗 */\n\t\t\tclose: handleClose,\n\t\t\t/** @description 刷新弹窗 */\n\t\t\trefresh: handleRefresh,\n\t\t\t/** @description 弹窗加载 */\n\t\t\tdoLoading: handleLoading,\n\t\t});\n\t},\n});\n"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
import type {
|
|
1
|
+
import type { FormValidateCallback } from "element-plus";
|
|
2
|
+
import type { FaLayoutGridBreakpoint } from "../../layoutGrid";
|
|
3
3
|
/** FaForm 的运行时 Props 定义。 */
|
|
4
4
|
export declare const faFormProps: {
|
|
5
5
|
/** @description Width of label, e.g. `'50px'`. All its direct child form items will inherit this value. `auto` is supported. */
|
|
@@ -26,8 +26,14 @@ export declare const faFormProps: {
|
|
|
26
26
|
};
|
|
27
27
|
/** @description Grid布局列配置 */
|
|
28
28
|
cols: {
|
|
29
|
-
type: import("vue").PropType<string | number | Record<
|
|
30
|
-
default: () =>
|
|
29
|
+
type: import("vue").PropType<string | number | Record<FaLayoutGridBreakpoint, number>>;
|
|
30
|
+
default: () => {
|
|
31
|
+
xs: number;
|
|
32
|
+
sm: number;
|
|
33
|
+
md: number;
|
|
34
|
+
lg: number;
|
|
35
|
+
xl: number;
|
|
36
|
+
};
|
|
31
37
|
};
|
|
32
38
|
model: ObjectConstructor;
|
|
33
39
|
rules: {
|
|
@@ -44,9 +50,7 @@ export declare const faFormProps: {
|
|
|
44
50
|
showMessage: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
|
|
45
51
|
validateOnRuleChange: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
|
|
46
52
|
hideRequiredAsterisk: BooleanConstructor;
|
|
47
|
-
scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...
|
|
48
|
-
/** @description 对整个表单的内容进行验证,带滚动。 接收一个回调函数,或返回 Promise。 */
|
|
49
|
-
... /** @description 对整个表单的内容进行验证,带滚动。 接收一个回调函数,或返回 Promise。 */args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
|
|
53
|
+
scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions) | (((new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
|
|
50
54
|
size: {
|
|
51
55
|
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", unknown>>;
|
|
52
56
|
readonly required: false;
|
|
@@ -63,7 +67,7 @@ export declare const faFormEmits: {
|
|
|
63
67
|
export interface FaFormSlots extends Record<string, unknown> {
|
|
64
68
|
/** @description 默认内容插槽 */
|
|
65
69
|
default: {
|
|
66
|
-
cols: Record<
|
|
70
|
+
cols: Record<FaLayoutGridBreakpoint, number>;
|
|
67
71
|
gap: [number, number];
|
|
68
72
|
};
|
|
69
73
|
}
|
|
@@ -92,8 +96,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
92
96
|
};
|
|
93
97
|
/** @description Grid布局列配置 */
|
|
94
98
|
cols: {
|
|
95
|
-
type: import("vue").PropType<string | number | Record<
|
|
96
|
-
default: () =>
|
|
99
|
+
type: import("vue").PropType<string | number | Record<FaLayoutGridBreakpoint, number>>;
|
|
100
|
+
default: () => {
|
|
101
|
+
xs: number;
|
|
102
|
+
sm: number;
|
|
103
|
+
md: number;
|
|
104
|
+
lg: number;
|
|
105
|
+
xl: number;
|
|
106
|
+
};
|
|
97
107
|
};
|
|
98
108
|
model: ObjectConstructor;
|
|
99
109
|
rules: {
|
|
@@ -110,9 +120,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
110
120
|
showMessage: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
|
|
111
121
|
validateOnRuleChange: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
|
|
112
122
|
hideRequiredAsterisk: BooleanConstructor;
|
|
113
|
-
scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...
|
|
114
|
-
/** @description 对整个表单的内容进行验证,带滚动。 接收一个回调函数,或返回 Promise。 */
|
|
115
|
-
... /** @description 对整个表单的内容进行验证,带滚动。 接收一个回调函数,或返回 Promise。 */args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
|
|
123
|
+
scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions) | (((new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
|
|
116
124
|
size: {
|
|
117
125
|
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", unknown>>;
|
|
118
126
|
readonly required: false;
|
|
@@ -122,9 +130,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
122
130
|
disabled: BooleanConstructor;
|
|
123
131
|
}>, {
|
|
124
132
|
/** @description 对整个表单的内容进行验证。 接收一个回调函数,或返回 Promise。 */
|
|
125
|
-
validate: (callback?: FormValidateCallback) => FormValidationResult;
|
|
133
|
+
validate: (callback?: FormValidateCallback) => import("element-plus").FormValidationResult;
|
|
126
134
|
/** @description 验证具体的某个字段。 */
|
|
127
|
-
validateField: import("vue").ComputedRef<((props?: import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemProp>, callback?: FormValidateCallback) => FormValidationResult) | undefined>;
|
|
135
|
+
validateField: import("vue").ComputedRef<((props?: import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemProp>, callback?: FormValidateCallback) => import("element-plus").FormValidationResult) | undefined>;
|
|
128
136
|
/** @description 重置该表单项,将其值重置为初始值,并移除校验结果 */
|
|
129
137
|
resetFields: import("vue").ComputedRef<((props?: import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemProp>) => void) | undefined>;
|
|
130
138
|
/** @description 清理某个字段的表单验证信息。 */
|
|
@@ -132,13 +140,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
132
140
|
/** @description 滚动到指定的字段 */
|
|
133
141
|
scrollToField: import("vue").ComputedRef<((prop: import("element-plus").FormItemProp) => void) | undefined>;
|
|
134
142
|
/** @description 获取所有字段的 context */
|
|
135
|
-
fields: import("vue").ComputedRef<FormItemContext[]>;
|
|
143
|
+
fields: import("vue").ComputedRef<import("vue").Reactive<import("element-plus").FormItemContext[]> | undefined>;
|
|
136
144
|
/** @description 获取指定字段的 context。 */
|
|
137
|
-
getField: import("vue").ComputedRef<((prop: import("element-plus").FormItemProp) => FormItemContext | undefined) | undefined>;
|
|
145
|
+
getField: import("vue").ComputedRef<((prop: import("element-plus").FormItemProp) => import("element-plus").FormItemContext | undefined) | undefined>;
|
|
138
146
|
/** @description 设置表单字段的初始值。 */
|
|
139
147
|
setInitialValues: import("vue").ComputedRef<((initModel: Record<string, any>) => void) | undefined>;
|
|
140
148
|
/** @description 对整个表单的内容进行验证,带滚动。 接收一个回调函数,或返回 Promise。 */
|
|
141
|
-
validateScrollToField: () => FormValidationResult;
|
|
149
|
+
validateScrollToField: () => import("element-plus").FormValidationResult;
|
|
142
150
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
143
151
|
validate: (prop: import("element-plus").FormItemProp, isValid: boolean, message: string) => boolean;
|
|
144
152
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
@@ -166,8 +174,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
166
174
|
};
|
|
167
175
|
/** @description Grid布局列配置 */
|
|
168
176
|
cols: {
|
|
169
|
-
type: import("vue").PropType<string | number | Record<
|
|
170
|
-
default: () =>
|
|
177
|
+
type: import("vue").PropType<string | number | Record<FaLayoutGridBreakpoint, number>>;
|
|
178
|
+
default: () => {
|
|
179
|
+
xs: number;
|
|
180
|
+
sm: number;
|
|
181
|
+
md: number;
|
|
182
|
+
lg: number;
|
|
183
|
+
xl: number;
|
|
184
|
+
};
|
|
171
185
|
};
|
|
172
186
|
model: ObjectConstructor;
|
|
173
187
|
rules: {
|
|
@@ -184,9 +198,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
184
198
|
showMessage: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
|
|
185
199
|
validateOnRuleChange: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
|
|
186
200
|
hideRequiredAsterisk: BooleanConstructor;
|
|
187
|
-
scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...
|
|
188
|
-
/** @description 对整个表单的内容进行验证,带滚动。 接收一个回调函数,或返回 Promise。 */
|
|
189
|
-
... /** @description 对整个表单的内容进行验证,带滚动。 接收一个回调函数,或返回 Promise。 */args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
|
|
201
|
+
scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions) | (((new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
|
|
190
202
|
size: {
|
|
191
203
|
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", unknown>>;
|
|
192
204
|
readonly required: false;
|
|
@@ -199,7 +211,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
199
211
|
}>, {
|
|
200
212
|
disabled: boolean;
|
|
201
213
|
grid: boolean;
|
|
202
|
-
cols: string | number | Record<
|
|
214
|
+
cols: string | number | Record<FaLayoutGridBreakpoint, number>;
|
|
203
215
|
inline: boolean;
|
|
204
216
|
labelPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "left" | "right" | "top", unknown>;
|
|
205
217
|
requireAsteriskPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "left" | "right", unknown>;
|
|
@@ -5,9 +5,8 @@ import { useRender } from "../../../utils/vue/render.mjs";
|
|
|
5
5
|
import { makeSlots } from "../../../utils/vue/slots.mjs";
|
|
6
6
|
import { FaLayoutGrid } from "../../layoutGrid/index.mjs";
|
|
7
7
|
import { formUtil } from "../utils/form.mjs";
|
|
8
|
-
import { computed, createVNode, defineComponent, mergeProps, provide, reactive,
|
|
8
|
+
import { computed, createVNode, defineComponent, mergeProps, provide, reactive, shallowRef } from "vue";
|
|
9
9
|
import { ElForm, formEmits, formProps, useGlobalSize } from "element-plus";
|
|
10
|
-
import { isNumber, isObject } from "lodash-unified";
|
|
11
10
|
//#region src/components/form/src/form.tsx
|
|
12
11
|
/** FaForm 的运行时 Props 定义。 */
|
|
13
12
|
const faFormProps = {
|
|
@@ -58,12 +57,13 @@ var form_default = defineComponent({
|
|
|
58
57
|
emits: faFormEmits,
|
|
59
58
|
slots: makeSlots(),
|
|
60
59
|
setup(props, { slots, expose, emit }) {
|
|
61
|
-
const
|
|
60
|
+
const globalSize = useGlobalSize();
|
|
61
|
+
const formRef = shallowRef(null);
|
|
62
62
|
const state = reactive({
|
|
63
63
|
cols: computed(() => {
|
|
64
|
-
if (
|
|
64
|
+
if (typeof props.cols === "object" && props.cols !== null) return props.cols;
|
|
65
65
|
else {
|
|
66
|
-
const colsNumber =
|
|
66
|
+
const colsNumber = typeof props.cols === "number" ? props.cols : Number(props.cols);
|
|
67
67
|
return {
|
|
68
68
|
xs: 1,
|
|
69
69
|
sm: colsNumber,
|
|
@@ -73,9 +73,8 @@ var form_default = defineComponent({
|
|
|
73
73
|
};
|
|
74
74
|
}
|
|
75
75
|
}),
|
|
76
|
-
gap: computed(() =>
|
|
76
|
+
gap: computed(() => globalSize.value === "small" ? [15, 0] : [20, 0])
|
|
77
77
|
});
|
|
78
|
-
const formRef = ref();
|
|
79
78
|
provide("faFormCols", state.cols);
|
|
80
79
|
const elFormProps = useProps(props, formProps);
|
|
81
80
|
const elFormEmits = useEmits(formEmits, emit);
|
|
@@ -83,8 +82,8 @@ var form_default = defineComponent({
|
|
|
83
82
|
"ref": formRef,
|
|
84
83
|
"class": [
|
|
85
84
|
"fa-form",
|
|
86
|
-
`fa-form-${
|
|
87
|
-
{ [`fa-form-detail fa-form-detail_${
|
|
85
|
+
`fa-form-${globalSize.value}`,
|
|
86
|
+
{ [`fa-form-detail fa-form-detail_${globalSize.value}`]: props.detailForm }
|
|
88
87
|
]
|
|
89
88
|
}), { default: () => props.grid ? createVNode(FaLayoutGrid, {
|
|
90
89
|
"collapsed": true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form.mjs","names":[],"sources":["../../../../src/components/form/src/form.tsx"],"sourcesContent":["import { computed, defineComponent, provide, reactive,
|
|
1
|
+
{"version":3,"file":"form.mjs","names":[],"sources":["../../../../src/components/form/src/form.tsx"],"sourcesContent":["import { computed, defineComponent, provide, reactive, shallowRef } from \"vue\";\nimport { ElForm, formEmits, formProps, useGlobalSize } from \"element-plus\";\nimport { definePropType, makeSlots, useEmits, useExpose, useProps, useRender } from \"../../../utils\";\nimport { FaLayoutGrid } from \"../../layoutGrid\";\nimport { formUtil } from \"../utils/form\";\nimport type { FormInstance, FormValidateCallback } from \"element-plus\";\nimport type { FaLayoutGridBreakpoint } from \"../../layoutGrid\";\n\n/** FaForm 的运行时 Props 定义。 */\nexport const faFormProps = {\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- Element Plus 2.x 尚未提供可替代的公开运行时 props 定义。\n\t...formProps,\n\t/** @description Width of label, e.g. `'50px'`. All its direct child form items will inherit this value. `auto` is supported. */\n\tlabelWidth: {\n\t\ttype: [String, Number],\n\t\tdefault: \"auto\",\n\t},\n\t/** @description Suffix of the label. */\n\tlabelSuffix: {\n\t\ttype: String,\n\t\tdefault: \":\",\n\t},\n\t/** @description When validation fails, scroll to the first error form entry. */\n\tscrollToError: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 详情From,会删除 FormItem 的 paddinfa-bottom */\n\tdetailForm: Boolean,\n\t/** @description Grid布局*/\n\tgrid: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description Grid布局列配置 */\n\tcols: {\n\t\ttype: definePropType<string | number | Record<FaLayoutGridBreakpoint, number>>([String, Number, Object]),\n\t\tdefault: () => ({ xs: 1, sm: 2, md: 3, lg: 4, xl: 5 }),\n\t},\n};\n\n/** FaForm 的运行时事件定义。 */\nexport const faFormEmits = {\n\t...formEmits,\n};\n\n/** FaForm 的插槽参数。 */\nexport interface FaFormSlots extends Record<string, unknown> {\n\t/** @description 默认内容插槽 */\n\tdefault: { cols: Record<FaLayoutGridBreakpoint, number>; gap: [number, number] };\n}\n\nexport default defineComponent({\n\tname: \"FaForm\",\n\tprops: faFormProps,\n\temits: faFormEmits,\n\tslots: makeSlots<FaFormSlots>(),\n\tsetup(props, { slots, expose, emit }) {\n\t\tconst globalSize = useGlobalSize();\n\t\tconst formRef = shallowRef<FormInstance | null>(null);\n\n\t\tconst state = reactive({\n\t\t\tcols: computed(() => {\n\t\t\t\tif (typeof props.cols === \"object\" && props.cols !== null) {\n\t\t\t\t\treturn props.cols;\n\t\t\t\t} else {\n\t\t\t\t\tconst colsNumber = typeof props.cols === \"number\" ? props.cols : Number(props.cols);\n\t\t\t\t\treturn { xs: 1, sm: colsNumber, md: colsNumber, lg: colsNumber, xl: colsNumber };\n\t\t\t\t}\n\t\t\t}),\n\t\t\tgap: computed<[number, number]>(() => (globalSize.value === \"small\" ? [15, 0] : [20, 0])),\n\t\t});\n\n\t\t// 注入 cols\n\t\tprovide(\"faFormCols\", state.cols);\n\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- 透传范围必须与继承的 Element Plus 2.x 运行时 props 保持一致。\n\t\tconst elFormProps = useProps(props, formProps);\n\t\tconst elFormEmits = useEmits(formEmits, emit);\n\n\t\tuseRender(() => (\n\t\t\t<ElForm\n\t\t\t\t{...elFormProps.value}\n\t\t\t\t{...elFormEmits.value}\n\t\t\t\tref={formRef}\n\t\t\t\tclass={[\"fa-form\", `fa-form-${globalSize.value}`, { [`fa-form-detail fa-form-detail_${globalSize.value}`]: props.detailForm }]}\n\t\t\t>\n\t\t\t\t{{\n\t\t\t\t\tdefault: () =>\n\t\t\t\t\t\tprops.grid ? (\n\t\t\t\t\t\t\t<FaLayoutGrid collapsed gap={state.gap} cols={state.cols}>\n\t\t\t\t\t\t\t\t{slots.default?.(state)}\n\t\t\t\t\t\t\t</FaLayoutGrid>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\tslots.default?.(state)\n\t\t\t\t\t\t),\n\t\t\t\t}}\n\t\t\t</ElForm>\n\t\t));\n\n\t\treturn useExpose(expose, {\n\t\t\t/** @description 对整个表单的内容进行验证。 接收一个回调函数,或返回 Promise。 */\n\t\t\tvalidate: (callback?: FormValidateCallback) =>\n\t\t\t\tcallback ? (formRef.value?.validate(callback) ?? Promise.reject(new Error(\"ElForm 实例尚未挂载。\"))) : formUtil.validate(formRef),\n\t\t\t/** @description 验证具体的某个字段。 */\n\t\t\tvalidateField: computed(() => formRef.value?.validateField),\n\t\t\t/** @description 重置该表单项,将其值重置为初始值,并移除校验结果 */\n\t\t\tresetFields: computed(() => formRef.value?.resetFields),\n\t\t\t/** @description 清理某个字段的表单验证信息。 */\n\t\t\tclearValidate: computed(() => formRef.value?.clearValidate),\n\t\t\t/** @description 滚动到指定的字段 */\n\t\t\tscrollToField: computed(() => formRef.value?.scrollToField),\n\t\t\t/** @description 获取所有字段的 context */\n\t\t\tfields: computed(() => formRef.value?.fields),\n\t\t\t/** @description 获取指定字段的 context。 */\n\t\t\tgetField: computed(() => formRef.value?.getField),\n\t\t\t/** @description 设置表单字段的初始值。 */\n\t\t\tsetInitialValues: computed(() => formRef.value?.setInitialValues),\n\t\t\t/** @description 对整个表单的内容进行验证,带滚动。 接收一个回调函数,或返回 Promise。 */\n\t\t\tvalidateScrollToField: () => formUtil.validateScrollToField(formRef),\n\t\t});\n\t},\n});\n"],"mappings":";;;;;;;;;;;AASA,MAAa,cAAc;CAE1B,GAAG;;CAEH,YAAY;EACX,MAAM,CAAC,QAAQ,MAAM;EACrB,SAAS;CACV;;CAEA,aAAa;EACZ,MAAM;EACN,SAAS;CACV;;CAEA,eAAe;EACd,MAAM;EACN,SAAS;CACV;;CAEA,YAAY;;CAEZ,MAAM;EACL,MAAM;EACN,SAAS;CACV;;CAEA,MAAM;EACL,MAAM,eAAyE;GAAC;GAAQ;GAAQ;EAAM,CAAC;EACvG,gBAAgB;GAAE,IAAI;GAAG,IAAI;GAAG,IAAI;GAAG,IAAI;GAAG,IAAI;EAAE;CACrD;AACD;;AAGA,MAAa,cAAc,EAC1B,GAAG,UACJ;AAQA,IAAA,eAAe,gBAAgB;CAC9B,MAAM;CACN,OAAO;CACP,OAAO;CACP,OAAO,UAAuB;CAC9B,MAAM,OAAO,EAAE,OAAO,QAAQ,QAAQ;EACrC,MAAM,aAAa,cAAc;EACjC,MAAM,UAAU,WAAgC,IAAI;EAEpD,MAAM,QAAQ,SAAS;GACtB,MAAM,eAAe;IACpB,IAAI,OAAO,MAAM,SAAS,YAAY,MAAM,SAAS,MACpD,OAAO,MAAM;SACP;KACN,MAAM,aAAa,OAAO,MAAM,SAAS,WAAW,MAAM,OAAO,OAAO,MAAM,IAAI;KAClF,OAAO;MAAE,IAAI;MAAG,IAAI;MAAY,IAAI;MAAY,IAAI;MAAY,IAAI;KAAW;IAChF;GACD,CAAC;GACD,KAAK,eAAkC,WAAW,UAAU,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAE;EACzF,CAAC;EAGD,QAAQ,cAAc,MAAM,IAAI;EAGhC,MAAM,cAAc,SAAS,OAAO,SAAS;EAC7C,MAAM,cAAc,SAAS,WAAW,IAAI;EAE5C,gBAAU,YAAA,QAAA,WAEJ,YAAY,OACZ,YAAY,OAAK;GAAA,OAChB;GAAO,SACL;IAAC;IAAW,WAAW,WAAW;IAAS,GAAG,iCAAiC,WAAW,UAAU,MAAM,WAAW;GAAC;EAAC,CAAA,GAAA,EAG7H,eACC,MAAM,OAAI,YAAA,cAAA;GAAA,aAAA;GAAA,OACoB,MAAM;GAAG,QAAQ,MAAM;EAAI,GAAA,EAAA,eAAA,CACtD,MAAM,UAAU,KAAK,CAAC,EAAA,CAAA,IAGxB,MAAM,UAAU,KAAK,EACrB,CAAA,CAGJ;EAED,OAAO,UAAU,QAAQ;;GAExB,WAAW,aACV,WAAY,QAAQ,OAAO,SAAS,QAAQ,KAAK,QAAQ,uBAAO,IAAI,MAAM,gBAAgB,CAAC,IAAK,SAAS,SAAS,OAAO;;GAE1H,eAAe,eAAe,QAAQ,OAAO,aAAa;;GAE1D,aAAa,eAAe,QAAQ,OAAO,WAAW;;GAEtD,eAAe,eAAe,QAAQ,OAAO,aAAa;;GAE1D,eAAe,eAAe,QAAQ,OAAO,aAAa;;GAE1D,QAAQ,eAAe,QAAQ,OAAO,MAAM;;GAE5C,UAAU,eAAe,QAAQ,OAAO,QAAQ;;GAEhD,kBAAkB,eAAe,QAAQ,OAAO,gBAAgB;;GAEhE,6BAA6B,SAAS,sBAAsB,OAAO;EACpE,CAAC;CACF;AACD,CAAC"}
|
|
@@ -34,7 +34,7 @@ export declare const faFormItemProps: {
|
|
|
34
34
|
};
|
|
35
35
|
required: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
|
|
36
36
|
rules: {
|
|
37
|
-
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<(new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>) | (((new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>)) | null)[], unknown, unknown>>;
|
|
37
|
+
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<(new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>) | (((new (... /** @description 校验状态 */args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>)) | null)[], unknown, unknown>>;
|
|
38
38
|
readonly required: false;
|
|
39
39
|
readonly validator: ((val: unknown) => boolean) | undefined;
|
|
40
40
|
__epPropKey: true;
|
|
@@ -104,7 +104,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
104
104
|
};
|
|
105
105
|
required: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
|
|
106
106
|
rules: {
|
|
107
|
-
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<(new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>) | (((new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>)) | null)[], unknown, unknown>>;
|
|
107
|
+
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<(new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>) | (((new (... /** @description 校验状态 */args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>)) | null)[], unknown, unknown>>;
|
|
108
108
|
readonly required: false;
|
|
109
109
|
readonly validator: ((val: unknown) => boolean) | undefined;
|
|
110
110
|
__epPropKey: true;
|
|
@@ -175,7 +175,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
175
175
|
};
|
|
176
176
|
required: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
|
|
177
177
|
rules: {
|
|
178
|
-
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<(new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>) | (((new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>)) | null)[], unknown, unknown>>;
|
|
178
|
+
readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<(new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>) | (((new (... /** @description 校验状态 */args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>)) | null)[], unknown, unknown>>;
|
|
179
179
|
readonly required: false;
|
|
180
180
|
readonly validator: ((val: unknown) => boolean) | undefined;
|
|
181
181
|
__epPropKey: true;
|
|
@@ -4,9 +4,8 @@ import { useRender } from "../../../utils/vue/render.mjs";
|
|
|
4
4
|
import { makeSlots } from "../../../utils/vue/slots.mjs";
|
|
5
5
|
import { FaLayoutGridItem } from "../../layoutGrid/index.mjs";
|
|
6
6
|
import { FaFormItemTip } from "../../formItemTip/index.mjs";
|
|
7
|
-
import { Fragment, computed, createVNode, defineComponent, inject, mergeProps, ref } from "vue";
|
|
7
|
+
import { Fragment, computed, createVNode, defineComponent, inject, mergeProps, ref, shallowRef } from "vue";
|
|
8
8
|
import { ElFormItem, formItemProps } from "element-plus";
|
|
9
|
-
import { isNumber } from "lodash-unified";
|
|
10
9
|
//#region src/components/form/src/formItem.tsx
|
|
11
10
|
/** FaFormItem 的运行时 Props 定义。 */
|
|
12
11
|
const faFormItemProps = {
|
|
@@ -33,35 +32,37 @@ var formItem_default = defineComponent({
|
|
|
33
32
|
props: faFormItemProps,
|
|
34
33
|
slots: makeSlots(),
|
|
35
34
|
setup(props, { slots, expose }) {
|
|
36
|
-
const formItemRef =
|
|
35
|
+
const formItemRef = shallowRef(null);
|
|
37
36
|
const cols = inject("cols", ref(4));
|
|
38
37
|
const getResponsive = () => {
|
|
39
38
|
if (!props.grid) return {};
|
|
40
39
|
if (props.span) return {
|
|
41
|
-
span:
|
|
42
|
-
offset:
|
|
40
|
+
span: typeof props.span === "number" ? props.span : Number(props.span),
|
|
41
|
+
offset: typeof props.offset === "number" ? props.offset : Number(props.offset)
|
|
43
42
|
};
|
|
44
43
|
else {
|
|
45
44
|
const result = {
|
|
46
45
|
span: 1,
|
|
47
|
-
offset:
|
|
46
|
+
offset: typeof props.offset === "number" ? props.offset : Number(props.offset)
|
|
48
47
|
};
|
|
49
48
|
if (props.row) result.span = cols.value;
|
|
50
49
|
return result;
|
|
51
50
|
}
|
|
52
51
|
};
|
|
53
52
|
const elFormItemProps = useProps(props, formItemProps);
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
53
|
+
useRender(() => {
|
|
54
|
+
const FormItemWrapper = props.grid ? FaLayoutGridItem : Fragment;
|
|
55
|
+
return createVNode(FormItemWrapper, getResponsive(), { default: () => [createVNode(ElFormItem, mergeProps({ "ref": formItemRef }, elFormItemProps.value), {
|
|
56
|
+
default: () => slots.default?.() ?? [],
|
|
57
|
+
...slots.label && !props.tips && { label: ({ label }) => slots.label?.({ label }) ?? [] },
|
|
58
|
+
...slots.label && props.tips && { label: ({ label }) => [createVNode(FaFormItemTip, null, { label: () => slots.label?.({ label }) ?? [] })] },
|
|
59
|
+
...!slots.label && props.tips && { label: ({ label }) => [createVNode(FaFormItemTip, {
|
|
60
|
+
"label": label ?? props.label,
|
|
61
|
+
"tips": props.tips
|
|
62
|
+
}, null)] },
|
|
63
|
+
...slots.error && { error: ({ error }) => slots.error?.({ error }) ?? [] }
|
|
64
|
+
})] });
|
|
65
|
+
});
|
|
65
66
|
return useExpose(expose, {
|
|
66
67
|
/** @description 表单项大小 */
|
|
67
68
|
size: computed(() => formItemRef.value?.size),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formItem.mjs","names":[],"sources":["../../../../src/components/form/src/formItem.tsx"],"sourcesContent":["import { Fragment, computed, defineComponent, inject, ref } from \"vue\";\nimport { ElFormItem, formItemProps } from \"element-plus\";\nimport {
|
|
1
|
+
{"version":3,"file":"formItem.mjs","names":[],"sources":["../../../../src/components/form/src/formItem.tsx"],"sourcesContent":["import { Fragment, computed, defineComponent, inject, ref, shallowRef } from \"vue\";\nimport { ElFormItem, formItemProps } from \"element-plus\";\nimport { makeSlots, useExpose, useProps, useRender } from \"../../../utils\";\nimport { FaFormItemTip } from \"../../formItemTip\";\nimport { FaLayoutGridItem } from \"../../layoutGrid\";\nimport type { FormItemInstance } from \"element-plus\";\nimport type { Ref } from \"vue\";\n\n/** FaFormItem 的运行时 Props 定义。 */\nexport const faFormItemProps = {\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- Element Plus 2.x 尚未提供可替代的公开运行时 props 定义。\n\t...formItemProps,\n\t/** @description Label tips 提示 */\n\ttips: String,\n\t/** @description Grid 布局 */\n\tgrid: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 偏移量 */\n\toffset: {\n\t\ttype: [String, Number],\n\t\tdefault: 0,\n\t},\n\t/** @description 栅格跨度 */\n\tspan: {\n\t\ttype: [String, Number],\n\t},\n\t/** @description 独占一行。如果设置 span 则无效 */\n\trow: Boolean,\n};\n\n/** FaFormItem 的插槽参数。 */\nexport interface FaFormItemSlots extends Record<string, unknown> {\n\t/** @description 默认内容插槽 */\n\tdefault: never;\n\t/** @description 标签位置显示的内容 */\n\tlabel: { label: string };\n\t/** @description 验证错误信息的显示内容 */\n\terror: { error: string };\n}\n\nexport default defineComponent({\n\tname: \"FaFormItem\",\n\tprops: faFormItemProps,\n\tslots: makeSlots<FaFormItemSlots>(),\n\tsetup(props, { slots, expose }) {\n\t\tconst formItemRef = shallowRef<FormItemInstance | null>(null);\n\n\t\tconst cols = inject<Ref<number>>(\"cols\", ref(4));\n\n\t\t// 获取响应式设置\n\t\tconst getResponsive = () => {\n\t\t\tif (!props.grid) return {};\n\t\t\tif (props.span) {\n\t\t\t\treturn {\n\t\t\t\t\tspan: typeof props.span === \"number\" ? props.span : Number(props.span),\n\t\t\t\t\toffset: typeof props.offset === \"number\" ? props.offset : Number(props.offset),\n\t\t\t\t};\n\t\t\t} else {\n\t\t\t\tconst result = {\n\t\t\t\t\tspan: 1,\n\t\t\t\t\toffset: typeof props.offset === \"number\" ? props.offset : Number(props.offset),\n\t\t\t\t};\n\t\t\t\tif (props.row) {\n\t\t\t\t\tresult.span = cols.value;\n\t\t\t\t}\n\t\t\t\treturn result;\n\t\t\t}\n\t\t};\n\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- 透传范围必须与继承的 Element Plus 2.x 运行时 props 保持一致。\n\t\tconst elFormItemProps = useProps(props, formItemProps);\n\n\t\tuseRender(() => {\n\t\t\tconst FormItemWrapper = props.grid ? FaLayoutGridItem : Fragment;\n\t\t\treturn (\n\t\t\t\t<FormItemWrapper {...getResponsive()}>\n\t\t\t\t\t<ElFormItem ref={formItemRef} {...elFormItemProps.value}>\n\t\t\t\t\t\t{{\n\t\t\t\t\t\t\tdefault: () => slots.default?.() ?? [],\n\t\t\t\t\t\t\t...(slots.label && !props.tips && { label: ({ label }: { label: string }) => slots.label?.({ label }) ?? [] }),\n\t\t\t\t\t\t\t...(slots.label &&\n\t\t\t\t\t\t\t\tprops.tips && {\n\t\t\t\t\t\t\t\t\tlabel: ({ label }: { label: string }) => [\n\t\t\t\t\t\t\t\t\t\t<FaFormItemTip>\n\t\t\t\t\t\t\t\t\t\t\t{{\n\t\t\t\t\t\t\t\t\t\t\t\tlabel: () => slots.label?.({ label }) ?? [],\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t</FaFormItemTip>,\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t...(!slots.label &&\n\t\t\t\t\t\t\t\tprops.tips && {\n\t\t\t\t\t\t\t\t\tlabel: ({ label }: { label?: string }) => [<FaFormItemTip label={label ?? props.label} tips={props.tips} />],\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t...(slots.error && { error: ({ error }: { error: string }) => slots.error?.({ error }) ?? [] }),\n\t\t\t\t\t\t}}\n\t\t\t\t\t</ElFormItem>\n\t\t\t\t</FormItemWrapper>\n\t\t\t);\n\t\t});\n\n\t\treturn useExpose(expose, {\n\t\t\t/** @description 表单项大小 */\n\t\t\tsize: computed(() => formItemRef.value?.size),\n\t\t\t/** @description 校验消息 */\n\t\t\tvalidateMessage: computed(() => formItemRef.value?.validateMessage),\n\t\t\t/** @description 校验状态 */\n\t\t\tvalidateState: computed(() => formItemRef.value?.validateState),\n\t\t\t/** @description 验证表单项 */\n\t\t\tvalidate: computed(() => formItemRef.value?.validate),\n\t\t\t/** @description 移除该表单项的校验结果 */\n\t\t\tclearValidate: computed(() => formItemRef.value?.clearValidate),\n\t\t\t/** @description 对该表单项进行重置,将其值重置为初始值并移除校验结果 */\n\t\t\tresetField: computed(() => formItemRef.value?.resetField),\n\t\t\t/** @description 设置该表单项的初始值。 */\n\t\t\tsetInitialValue: computed(() => formItemRef.value?.setInitialValue),\n\t\t});\n\t},\n});\n"],"mappings":";;;;;;;;;;AASA,MAAa,kBAAkB;CAE9B,GAAG;;CAEH,MAAM;;CAEN,MAAM;EACL,MAAM;EACN,SAAS;CACV;;CAEA,QAAQ;EACP,MAAM,CAAC,QAAQ,MAAM;EACrB,SAAS;CACV;;CAEA,MAAM,EACL,MAAM,CAAC,QAAQ,MAAM,EACtB;;CAEA,KAAK;AACN;AAYA,IAAA,mBAAe,gBAAgB;CAC9B,MAAM;CACN,OAAO;CACP,OAAO,UAA2B;CAClC,MAAM,OAAO,EAAE,OAAO,UAAU;EAC/B,MAAM,cAAc,WAAoC,IAAI;EAE5D,MAAM,OAAO,OAAoB,QAAQ,IAAI,CAAC,CAAC;EAG/C,MAAM,sBAAsB;GAC3B,IAAI,CAAC,MAAM,MAAM,OAAO,CAAC;GACzB,IAAI,MAAM,MACT,OAAO;IACN,MAAM,OAAO,MAAM,SAAS,WAAW,MAAM,OAAO,OAAO,MAAM,IAAI;IACrE,QAAQ,OAAO,MAAM,WAAW,WAAW,MAAM,SAAS,OAAO,MAAM,MAAM;GAC9E;QACM;IACN,MAAM,SAAS;KACd,MAAM;KACN,QAAQ,OAAO,MAAM,WAAW,WAAW,MAAM,SAAS,OAAO,MAAM,MAAM;IAC9E;IACA,IAAI,MAAM,KACT,OAAO,OAAO,KAAK;IAEpB,OAAO;GACR;EACD;EAGA,MAAM,kBAAkB,SAAS,OAAO,aAAa;EAErD,gBAAgB;GACf,MAAM,kBAAkB,MAAM,OAAO,mBAAmB;GACxD,OAAA,YAAA,iBACsB,cAAc,GAAC,EAAA,eAAA,CAAA,YAAA,YAAA,WAAA,EAAA,OAClB,YAAW,GAAM,gBAAgB,KAAK,GAAA;IAErD,eAAe,MAAM,UAAU,KAAK,CAAA;IACpC,GAAI,MAAM,SAAS,CAAC,MAAM,QAAQ,EAAE,QAAQ,EAAE,YAA+B,MAAM,QAAQ,EAAE,MAAM,CAAC,KAAK,CAAA,EAAG;IAC5G,GAAI,MAAM,SACT,MAAM,QAAQ,EACb,QAAQ,EAAE,YAA+B,CAAA,YAAA,eAAA,MAAA,EAGtC,aAAa,MAAM,QAAQ,EAAE,MAAM,CAAC,KAAK,CAAA,EAAE,CAAA,CAAA,EAI/C;IACD,GAAI,CAAC,MAAM,SACV,MAAM,QAAQ,EACb,QAAQ,EAAE,YAAgC,CAAA,YAAA,eAAA;KAAA,SAAuB,SAAS,MAAM;KAAK,QAAQ,MAAM;IAAI,GAAA,IAAA,CAAA,EACxG;IACD,GAAI,MAAM,SAAS,EAAE,QAAQ,EAAE,YAA+B,MAAM,QAAQ,EAAE,MAAM,CAAC,KAAK,CAAA,EAAG;GAAE,CAAA,CAAA,EAAA,CAAA;EAKpG,CAAC;EAED,OAAO,UAAU,QAAQ;;GAExB,MAAM,eAAe,YAAY,OAAO,IAAI;;GAE5C,iBAAiB,eAAe,YAAY,OAAO,eAAe;;GAElE,eAAe,eAAe,YAAY,OAAO,aAAa;;GAE9D,UAAU,eAAe,YAAY,OAAO,QAAQ;;GAEpD,eAAe,eAAe,YAAY,OAAO,aAAa;;GAE9D,YAAY,eAAe,YAAY,OAAO,UAAU;;GAExD,iBAAiB,eAAe,YAAY,OAAO,eAAe;EACnE,CAAC;CACF;AACD,CAAC"}
|
|
@@ -9,12 +9,12 @@ export declare const formUtil: {
|
|
|
9
9
|
* ElForm 表单验证
|
|
10
10
|
* @param elFormRef ElForm 组件ref
|
|
11
11
|
*/
|
|
12
|
-
validate(elFormRef: Ref<FormInstance | undefined
|
|
12
|
+
validate(elFormRef: Readonly<Ref<FormInstance | null | undefined>>): FormValidationResult;
|
|
13
13
|
/**
|
|
14
14
|
* ElForm 表单验证,带滚动
|
|
15
15
|
* @param elFormRef ElForm 组件ref
|
|
16
16
|
*/
|
|
17
|
-
validateScrollToField(elFormRef: Ref<FormInstance | undefined
|
|
17
|
+
validateScrollToField(elFormRef: Readonly<Ref<FormInstance | null | undefined>>): FormValidationResult;
|
|
18
18
|
/**
|
|
19
19
|
* 手机号
|
|
20
20
|
*/
|
|
@@ -11,7 +11,7 @@ const formUtil = {
|
|
|
11
11
|
validate(elFormRef) {
|
|
12
12
|
return new Promise((resolve, reject) => {
|
|
13
13
|
const form = elFormRef.value;
|
|
14
|
-
if (form
|
|
14
|
+
if (form == null) {
|
|
15
15
|
reject(/* @__PURE__ */ new Error("ElForm 实例尚未挂载。"));
|
|
16
16
|
return;
|
|
17
17
|
}
|
|
@@ -28,7 +28,7 @@ const formUtil = {
|
|
|
28
28
|
validateScrollToField(elFormRef) {
|
|
29
29
|
return new Promise((resolve, reject) => {
|
|
30
30
|
const form = elFormRef.value;
|
|
31
|
-
if (form
|
|
31
|
+
if (form == null) {
|
|
32
32
|
reject(/* @__PURE__ */ new Error("ElForm 实例尚未挂载。"));
|
|
33
33
|
return;
|
|
34
34
|
}
|