@dt-frames/ui 2.0.9 → 2.0.11

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.
Files changed (60) hide show
  1. package/es/components/curd/index.js +6 -2973
  2. package/es/components/curd/src/components/Curd.d.ts +13 -881
  3. package/es/components/curd/src/hooks/useCurd.d.ts +3 -3
  4. package/es/components/curd/src/props.d.ts +3 -4
  5. package/es/components/curd/src/types/curd.type.d.ts +2 -2
  6. package/es/components/drawer/index.d.ts +9 -166
  7. package/es/components/drawer/index.js +20 -458
  8. package/es/components/drawer/src/components/DrawerFooter.d.ts +1 -84
  9. package/es/components/drawer/src/index.d.ts +9 -166
  10. package/es/components/drawer/src/types/index.type.d.ts +1 -1
  11. package/es/components/form/index.d.ts +5 -1
  12. package/es/components/form/index.js +97 -491
  13. package/es/components/form/index.less +18 -0
  14. package/es/components/form/src/components/FormButtons.d.ts +13 -3
  15. package/es/components/form/src/components/FormItem.d.ts +0 -1
  16. package/es/components/form/src/components/formIcon.d.ts +3 -3
  17. package/es/components/form/src/components/formInputUseDialog.d.ts +2 -2
  18. package/es/components/form/src/hooks/useLabelWidth.d.ts +2 -18
  19. package/es/components/form/src/props.d.ts +3 -4
  20. package/es/components/form/src/types/form.type.d.ts +5 -3
  21. package/es/components/form/src/types/items.type.d.ts +12 -5
  22. package/es/components/modal/index.d.ts +2 -1
  23. package/es/components/modal/index.js +19 -456
  24. package/es/components/modal/src/components/Modal.d.ts +2 -2
  25. package/es/components/modal/src/components/ModalFooter.d.ts +2 -85
  26. package/es/components/modal/src/components/ModalWrap.d.ts +1 -75
  27. package/es/components/modal/src/index.d.ts +14 -171
  28. package/es/components/modal/src/props.d.ts +2 -1
  29. package/es/components/table/index.js +47 -1849
  30. package/es/components/table/index.less +3 -3
  31. package/es/components/table/src/components/TableAction.d.ts +1 -1
  32. package/es/components/table/src/components/editTable/EditTableCell.d.ts +1 -1
  33. package/es/components/table/src/components/tableSetting/DownloadCtrl.d.ts +1 -867
  34. package/es/components/table/src/index.d.ts +10 -10
  35. package/es/components/tree/index.js +29 -39
  36. package/es/components/tree/src/components/TreeHeader.d.ts +1 -1
  37. package/es/components/tree/src/index.d.ts +2 -2
  38. package/es/components/upload/index.d.ts +2 -0
  39. package/es/components/upload/index.js +16 -0
  40. package/es/components/upload/index.less +0 -0
  41. package/es/components/upload/src/index.d.ts +2 -0
  42. package/es/theme/index.d.ts +2 -1
  43. package/es/theme/index.js +11 -4
  44. package/es/theme/index.less +1 -0
  45. package/es/theme/src/components/header/components/size.d.ts +5 -5
  46. package/es/theme/src/components/header/index.d.ts +5 -5
  47. package/es/theme/src/components/header/multiple-header.d.ts +5 -5
  48. package/es/theme/src/hooks/useMenu.d.ts +1 -1
  49. package/es/theme/src/index.d.ts +10 -10
  50. package/es/theme/transition.less +105 -0
  51. package/index.js +21 -1
  52. package/manualContentPath.js +110 -0
  53. package/package.json +5 -2
  54. package/vite.config.ts +16 -4
  55. package/vite.config.ts.timestamp-1678694558071.mjs +59 -0
  56. package/vite.config.ts.timestamp-1678700851971.mjs +61 -0
  57. package/es/components/form/src/index.d.ts +0 -2922
  58. package/es/components/table/src/components/TableHeader.d.ts +0 -1136
  59. package/es/components/table/src/components/tableSetting/Download.d.ts +0 -922
  60. package/es/components/table/src/components/tableSetting/index.d.ts +0 -1030
@@ -1,2975 +1,8 @@
1
- import { toRaw, unref, computed, getCurrentInstance, reactive, readonly, watchEffect, nextTick, defineComponent, useAttrs, openBlock, createBlock, mergeProps, isRef, withCtx, createElementBlock, Fragment, renderList, createTextVNode, toDisplayString, createElementVNode, createVNode, normalizeProps, guardReactiveProps, createCommentVNode, toRefs, isVNode, ref, watch, resolveDirective, normalizeStyle, withDirectives, normalizeClass, onMounted, withKeys, createSlots, renderSlot, onUnmounted, inject, h, provide, onBeforeUnmount, resolveDynamicComponent } from "vue";
2
- import { RadioButton, RadioGroup, Button, FormItem as FormItem$1, Col as Col$1, Row, Form as Form$1, Tooltip as Tooltip$1, Spin } from "ant-design-vue/es";
3
- import "ant-design-vue/es/form/style";
4
- import "ant-design-vue/es/row/style";
5
- import { DtCache, CacheKey, deepMerge, Pages, useGo, useRedo, Language, useAppStore, isNumber, useI18n, isString, isFunction, error, useSlots, isArray, isBoolean, isNull, dispatchResize, isObject, isNullAndUnDef, isEmpty, useTimeoutFn, useApp, off, on, windowResizeFn, useMessage } from "@dt-frames/core";
6
- import { cloneDeep, isEqual, omit, upperFirst, uniqBy, set } from "lodash-es";
7
- import { Input, Select, TreeSelect, Radio, Checkbox, AutoComplete, Cascader, DatePicker, InputNumber, Switch, TimePicker, Slider, Rate, Divider, Col, Tooltip, Form, FormItem, Modal } from "ant-design-vue";
8
- import { defineStore } from "pinia";
9
- import "ant-design-vue/es/radio/style";
10
- import "ant-design-vue/es/cascader/style";
11
- import "ant-design-vue/es/input-number/style";
12
- import "ant-design-vue/es/switch/style";
13
- import "ant-design-vue/es/tree-select/style";
14
- import "ant-design-vue/es/slider/style";
15
- import "ant-design-vue/es/rate/style";
16
- import "ant-design-vue/es/date-picker/style";
17
- import "ant-design-vue/es/col/style";
18
- import "ant-design-vue/es/button/style";
19
- import dayjs from "dayjs";
20
- import "ant-design-vue/es/spin/style";
21
- import "ant-design-vue/es/modal/style";
22
- import "ant-design-vue/es/tooltip/style";
23
- var Theme = /* @__PURE__ */ ((Theme2) => {
24
- Theme2["DARK"] = "dark";
25
- Theme2["LIGHT"] = "light";
26
- return Theme2;
27
- })(Theme || {});
28
- var MenuType = /* @__PURE__ */ ((MenuType2) => {
29
- MenuType2["SIDE"] = "sidebar";
30
- MenuType2["TOP_MENU"] = "top-menu";
31
- MenuType2["MIX"] = "mix";
32
- MenuType2["MIX_SIDEBAR"] = "mix-sidebar";
33
- return MenuType2;
34
- })(MenuType || {});
35
- var MenuMode = /* @__PURE__ */ ((MenuMode2) => {
36
- MenuMode2["INLINE"] = "inline";
37
- MenuMode2["HORIZONTAL"] = "horizontal";
38
- MenuMode2["VERTICAL"] = "vertical";
39
- return MenuMode2;
40
- })(MenuMode || {});
41
- var ContentMode = /* @__PURE__ */ ((ContentMode2) => {
42
- ContentMode2["FULL"] = "full";
43
- ContentMode2["FIXED"] = "fixed";
44
- return ContentMode2;
45
- })(ContentMode || {});
46
- var UiSize = /* @__PURE__ */ ((UiSize2) => {
47
- UiSize2["LARGE"] = "large";
48
- UiSize2["MIDDLE"] = "middle";
49
- UiSize2["SMALL"] = "small";
50
- return UiSize2;
51
- })(UiSize || {});
52
- const defaultThemeConf = {
53
- content: {
54
- contentMode: ContentMode.FULL
55
- },
56
- headOptions: {
57
- fixed: true,
58
- theme: Theme.LIGHT,
59
- showLogo: true,
60
- showBackToTop: true,
61
- useLockPage: true,
62
- size: UiSize.SMALL,
63
- showSize: true,
64
- showBreadCrumb: true,
65
- showFullScreen: true,
66
- showSearch: true,
67
- showNotice: true,
68
- showLocaleSwitch: true,
69
- showSettingTheme: true,
70
- showLoginOut: true
71
- },
72
- menuOptions: {
73
- fixed: true,
74
- theme: Theme.DARK,
75
- collapsed: false,
76
- collapsedShowTitle: false,
77
- canDrag: true,
78
- show: true,
79
- hidden: false,
80
- split: false,
81
- menuWidth: 240,
82
- trigger: true,
83
- type: MenuType.SIDE,
84
- mode: MenuMode.INLINE,
85
- mixSideTrigger: "hover"
86
- },
87
- footerOptions: {
88
- show: false,
89
- height: 48,
90
- title: "Copyright(C) 2021 by www.ithinkdt.com. All rights reserved.",
91
- subTitle: "Privacy Statement"
92
- },
93
- routeReuse: {
94
- show: true,
95
- cache: false,
96
- canDrag: true,
97
- showQuick: true,
98
- showRedo: true,
99
- showFold: true
100
- }
101
- };
102
- const useThemeStore = defineStore({
103
- id: "dt-theme",
104
- state: () => ({
105
- themeConf: DtCache.getLocal(CacheKey.THEME) ?? cloneDeep(defaultThemeConf),
106
- pageLoading: false,
107
- mixSiderHasSubMenu: false
108
- }),
109
- getters: {
110
- getThemeConf() {
111
- return this.themeConf;
112
- },
113
- getHeaderConf() {
114
- return this.themeConf.headOptions;
115
- },
116
- getMenuConf() {
117
- return this.themeConf.menuOptions;
118
- },
119
- getFooterConf() {
120
- return this.themeConf.footerOptions;
121
- },
122
- getRouteReuseConf() {
123
- return this.themeConf.routeReuse;
124
- },
125
- getPageLoading() {
126
- return this.pageLoading;
127
- },
128
- getMixSiderIsHasMenu() {
129
- return this.mixSiderHasSubMenu;
130
- }
131
- },
132
- actions: {
133
- setThemeConf(options = {}) {
134
- let newThemeConf = deepMerge(this.themeConf, options);
135
- this.themeConf = deepMerge(defaultThemeConf, newThemeConf);
136
- DtCache.setLocal(CacheKey.THEME, this.themeConf);
137
- },
138
- setMixSiderIsHasMenu(val) {
139
- this.mixSiderHasSubMenu = val;
140
- },
141
- resetState() {
142
- DtCache.removeLocal(CacheKey.THEME);
143
- this.themeConf = cloneDeep(defaultThemeConf);
144
- }
145
- }
146
- });
147
- function handleGotoPage(router) {
148
- const go = useGo(router);
149
- go(unref(router.currentRoute).path, true);
150
- }
151
- defineStore({
152
- id: "route-reuse",
153
- state: () => ({
154
- cacheTabList: /* @__PURE__ */ new Set(),
155
- tabList: DtCache.getLocal(CacheKey.ROUTE_REUSE) || [],
156
- lastDragEndIndex: 0
157
- }),
158
- getters: {
159
- getTabList() {
160
- return this.tabList;
161
- },
162
- getCachedTabList() {
163
- return Array.from(this.cacheTabList);
164
- },
165
- getLastDragEndIndex() {
166
- return this.lastDragEndIndex;
167
- }
168
- },
169
- actions: {
170
- async addTab(route) {
171
- const { path, name, fullPath, params, query, meta } = route;
172
- if (path === Pages.NOT_FOUND || path === Pages.LOGIN || path === Pages.BASE_PAGE) {
173
- return;
174
- }
175
- let updateIndex = -1;
176
- const tabHasExits = this.tabList.some((tab, index) => {
177
- updateIndex = index;
178
- return (tab.fullPath || tab.path) === (fullPath || path);
179
- });
180
- if (tabHasExits) {
181
- const curTab = toRaw(this.tabList)[updateIndex];
182
- curTab.params = params || curTab.params;
183
- curTab.query = query || curTab.query;
184
- curTab.fullPath = fullPath || curTab.fullPath;
185
- this.tabList.splice(updateIndex, 1, curTab);
186
- } else {
187
- this.tabList.push(JSON.parse(JSON.stringify(route)));
188
- }
189
- this.updateCacheTab();
190
- },
191
- closeTab(route, router) {
192
- const go = useGo(router);
193
- const index = this.tabList.findIndex((item) => item.path === route.path);
194
- let page;
195
- if (index === 0) {
196
- if (this.tabList.length !== 1) {
197
- page = this.tabList[index + 1];
198
- }
199
- } else {
200
- page = this.tabList[index - 1];
201
- }
202
- this.bulkCloseTabs([route.path]);
203
- this.updateCacheTab();
204
- route.path === router.currentRoute.value.path && go(page.path);
205
- },
206
- closeAllTab(currentRoute, router) {
207
- const go = useGo(router);
208
- let filterTabList = this.tabList.filter((item) => item?.meta?.affix ?? false);
209
- const route = filterTabList.length > 0 ? filterTabList[filterTabList.length - 1] : unref(currentRoute);
210
- this.tabList = [route];
211
- this.updateCacheTab();
212
- go(route.path);
213
- },
214
- closeLeftTabs(route, router) {
215
- const index = this.tabList.findIndex((item) => item.path === route.path);
216
- if (index > 0) {
217
- const leftTabs = this.tabList.slice(0, index);
218
- const pathList = [];
219
- for (const item of leftTabs) {
220
- const affix = item?.meta?.affix ?? false;
221
- if (!affix) {
222
- pathList.push(item.fullPath);
223
- }
224
- }
225
- this.bulkCloseTabs(pathList);
226
- }
227
- this.updateCacheTab();
228
- handleGotoPage(router);
229
- },
230
- closeRightTabs(route, router) {
231
- const index = this.tabList.findIndex((item) => item.path === route.path);
232
- if (index >= 0 && index < this.tabList.length - 1) {
233
- const rightTabs = this.tabList.slice(index + 1, this.tabList.length);
234
- const pathList = [];
235
- for (const item of rightTabs) {
236
- const affix = item?.meta?.affix ?? false;
237
- if (!affix) {
238
- pathList.push(item.fullPath);
239
- }
240
- }
241
- this.bulkCloseTabs(pathList);
242
- }
243
- this.updateCacheTab();
244
- handleGotoPage(router);
245
- },
246
- closeOtherTabs(route, router) {
247
- const pathList = [];
248
- for (let item of this.tabList) {
249
- const affix = item?.meta?.affix ?? false;
250
- if (item.path !== route.path && !affix) {
251
- pathList.push(item.path);
252
- }
253
- }
254
- this.bulkCloseTabs(pathList);
255
- this.updateCacheTab();
256
- handleGotoPage(router);
257
- },
258
- closeTabByKey(path, router) {
259
- const go = useGo(router);
260
- const index = this.tabList.findIndex((item) => item.path === path);
261
- let page;
262
- if (index === 0) {
263
- if (this.tabList.length !== 1) {
264
- page = this.tabList[index + 1];
265
- }
266
- } else {
267
- page = this.tabList[index - 1];
268
- }
269
- this.bulkCloseTabs([path]);
270
- this.updateCacheTab();
271
- path === router.currentRoute.value.path && go(page.path);
272
- },
273
- bulkCloseTabs(pathList) {
274
- this.tabList = this.tabList.filter((item) => !pathList.includes(item.fullPath));
275
- },
276
- updateCacheTab() {
277
- DtCache.setLocal(CacheKey.ROUTE_REUSE, this.tabList);
278
- const cacheMap = /* @__PURE__ */ new Set();
279
- for (const tab of this.tabList) {
280
- if (tab.meta?.hideTab) {
281
- continue;
282
- }
283
- const name = tab.name;
284
- cacheMap.add(name);
285
- }
286
- this.cacheTabList = cacheMap;
287
- },
288
- async refreshPage(router) {
289
- const findTab = this.getCachedTabList.find((item) => item === unref(router.currentRoute).name);
290
- if (findTab) {
291
- this.cacheTabList.delete(findTab.toString());
292
- }
293
- const redo = useRedo(router);
294
- await redo();
295
- },
296
- sortTabs(oldIndex, newIndex) {
297
- const currentTab = this.tabList[oldIndex];
298
- this.tabList.splice(oldIndex, 1);
299
- this.tabList.splice(newIndex, 0, currentTab);
300
- this.lastDragEndIndex = this.lastDragEndIndex + 1;
301
- },
302
- resetState() {
303
- this.tabList = [];
304
- this.updateCacheTab();
305
- }
306
- }
307
- });
308
- function useMenu() {
309
- const { setThemeConf } = useThemeStore();
310
- const getCollapsedShowTitle = computed(() => useThemeStore().getMenuConf.collapsedShowTitle);
311
- const getIsSidebarType = computed(() => useThemeStore().getMenuConf.type === MenuType.SIDE);
312
- const getMenuFixed = computed(() => useThemeStore().getMenuConf.fixed);
313
- const getShowMenu = computed(() => useThemeStore().getMenuConf.show);
314
- const getShowSidebar = computed(() => {
315
- return unref(getSplit) || unref(getShowMenu) && unref(getMenuMode) !== MenuMode.HORIZONTAL;
316
- });
317
- const getMenuHidden = computed(() => useThemeStore().getMenuConf.hidden);
318
- const getMenuTheme = computed(() => useThemeStore().getMenuConf.theme);
319
- const getTrigger = computed(() => useThemeStore().getMenuConf.trigger);
320
- const getCanDrag = computed(() => useThemeStore().getMenuConf.canDrag);
321
- const getIsMixMode = computed(() => {
322
- return unref(getMenuMode) === MenuMode.INLINE && unref(getMenuType) === MenuType.MIX;
323
- });
324
- const getIsMixSidebar = computed(() => unref(getMenuType) === MenuType.MIX_SIDEBAR);
325
- const getMenuWidth = computed(() => {
326
- if (unref(getIsMixMode)) {
327
- return Number(useThemeStore().getMenuConf.menuWidth) - 40;
328
- } else if (unref(getIsMixSidebar)) {
329
- return Number(useThemeStore().getMenuConf.menuWidth) - 10;
330
- } else {
331
- return Number(useThemeStore().getMenuConf.menuWidth);
332
- }
333
- });
334
- const getMixSideTrigger = computed(() => useThemeStore().getMenuConf.mixSideTrigger);
335
- const getLogoWidth = computed(() => unref(getIsMixSidebar) ? "80px" : useThemeStore().getMenuConf.menuWidth);
336
- const getMenuType = computed(() => useThemeStore().getMenuConf.type);
337
- const getIsTopMenu = computed(() => unref(getMenuType) === MenuType.TOP_MENU);
338
- const getMenuMode = computed(() => useThemeStore().getMenuConf.mode);
339
- const getSplit = computed(() => useThemeStore().getMenuConf.split);
340
- const getCollapsed = computed(() => useThemeStore().getMenuConf.collapsed);
341
- const getIsHorizontal = computed(() => unref(getMenuMode) === MenuMode.HORIZONTAL);
342
- const setThemeStore = (conf = {}) => setThemeConf(conf);
343
- const toggleCollapsed = () => setThemeStore({
344
- menuOptions: {
345
- collapsed: !unref(getCollapsed)
346
- }
347
- });
348
- const getMiniWidthNumber = computed(() => useThemeStore().getMenuConf.collapsedShowTitle ? 80 : 48);
349
- const getRealWidth = computed(() => {
350
- return unref(getCollapsed) ? unref(getMiniWidthNumber) : unref(getMenuWidth);
351
- });
352
- const getCalcContentWidth = computed(() => {
353
- const width = unref(getIsTopMenu) || !unref(getShowMenu) || unref(getSplit) && unref(getMenuHidden) ? 0 : unref(getRealWidth);
354
- return `calc(100% - ${unref(width)}px)`;
355
- });
356
- return {
357
- getCollapsedShowTitle,
358
- getIsSidebarType,
359
- getMenuFixed,
360
- getShowMenu,
361
- getShowSidebar,
362
- getMenuHidden,
363
- getMenuTheme,
364
- getTrigger,
365
- getMenuWidth,
366
- getLogoWidth,
367
- getMenuType,
368
- getIsTopMenu,
369
- getMenuMode,
370
- getSplit,
371
- getCollapsed,
372
- getIsHorizontal,
373
- getMiniWidthNumber,
374
- getRealWidth,
375
- getCalcContentWidth,
376
- getIsMixMode,
377
- getIsMixSidebar,
378
- getCanDrag,
379
- getMixSideTrigger,
380
- toggleCollapsed,
381
- setThemeStore
382
- };
383
- }
384
- function useMultipleTab() {
385
- const { getRouteReuseConf } = useThemeStore();
386
- const getShowMultipleTab = computed(() => getRouteReuseConf.show);
387
- const getShowQuick = computed(() => getRouteReuseConf.showQuick);
388
- const getMultipleTabPosIsTop = computed(() => getRouteReuseConf.position === "top");
389
- const getShowRedo = computed(() => getRouteReuseConf.showRedo);
390
- const getCanCache = computed(() => getRouteReuseConf.cache);
391
- const getCanDrag = computed(() => getRouteReuseConf.canDrag);
392
- return {
393
- getShowMultipleTab,
394
- getShowQuick,
395
- getMultipleTabPosIsTop,
396
- getShowRedo,
397
- getCanCache,
398
- getCanDrag
399
- };
400
- }
401
- function useHeader() {
402
- const HEADER_HEIGHT = 48;
403
- const TABS_HEIGHT = 33;
404
- const { getHeaderConf = {} } = useThemeStore();
405
- const {
406
- getIsSidebarType,
407
- getMenuType,
408
- getShowMenu,
409
- getMenuHidden,
410
- getTrigger,
411
- getMenuMode,
412
- getSplit,
413
- getIsTopMenu,
414
- getIsMixSidebar
415
- } = useMenu();
416
- const { getShowMultipleTab, getMultipleTabPosIsTop } = useMultipleTab();
417
- const getHeaderTheme = computed(() => getHeaderConf.theme);
418
- const getFixed = computed(() => getHeaderConf.fixed);
419
- const getShowHeaderLogo = computed(() => unref(getShowLogo) && !unref(getIsSidebarType) && !unref(getIsMixSidebar));
420
- const getShowSearch = computed(() => getHeaderConf.showSearch);
421
- const getShowHeaderTrigger = computed(() => {
422
- if (unref(getMenuType) === MenuType.TOP_MENU || !unref(getShowMenu) || unref(getMenuHidden)) {
423
- return false;
424
- }
425
- return unref(getTrigger);
426
- });
427
- const getShowBreadCrumb = computed(() => getHeaderConf.showBreadCrumb);
428
- const getShowBread = computed(
429
- () => unref(getMenuMode) !== MenuMode.HORIZONTAL && !unref(getSplit) && unref(getShowBreadCrumb)
430
- );
431
- const getShowTopMenu = computed(() => unref(getMenuMode) === MenuMode.HORIZONTAL || unref(getSplit));
432
- const getShowNotice = computed(() => getHeaderConf.showNotice);
433
- const getShowFullScreen = computed(() => getHeaderConf.showFullScreen);
434
- const getShowLocale = computed(() => getHeaderConf.showLocaleSwitch);
435
- const getShowSettingTheme = computed(() => getHeaderConf.showSettingTheme);
436
- const getShowFullHeaderRef = computed(() => {
437
- return !unref(getIsSidebarType) && !unref(getIsMixSidebar) && !unref(getIsTopMenu);
438
- });
439
- const getHeaderHeight = computed(() => {
440
- let height = 0;
441
- height += HEADER_HEIGHT;
442
- if (unref(getShowMultipleTab) && !unref(getSplit) && !unref(getMultipleTabPosIsTop)) {
443
- height += TABS_HEIGHT;
444
- }
445
- return height;
446
- });
447
- const getTabsHeight = computed(() => TABS_HEIGHT);
448
- const getShowInsetHeaderRef = computed(() => {
449
- return unref(getIsSidebarType) || unref(getIsTopMenu) || unref(getIsMixSidebar);
450
- });
451
- const getShowBackToTop = computed(() => getHeaderConf.showBackToTop);
452
- const getIsZH = computed(() => {
453
- let local = DtCache.getLocal(CacheKey.LOCALE);
454
- if (!local)
455
- return true;
456
- return local === Language.ZH;
457
- });
458
- const getUiSize = computed(() => getHeaderConf?.size ?? UiSize.SMALL);
459
- const getShowUiSize = computed(() => getHeaderConf?.showSize);
460
- const getShowLogo = computed(() => getHeaderConf.showLogo);
461
- const getShowLoginOut = computed(() => getHeaderConf.showLoginOut);
462
- const loginOutClick = getHeaderConf.logoutClick;
463
- return {
464
- getHeaderTheme,
465
- getFixed,
466
- getShowSearch,
467
- getShowHeaderLogo,
468
- getShowHeaderTrigger,
469
- getShowBread,
470
- getShowTopMenu,
471
- getShowFullScreen,
472
- getShowLocale,
473
- getShowSettingTheme,
474
- getShowNotice,
475
- getShowFullHeaderRef,
476
- getHeaderHeight,
477
- getTabsHeight,
478
- getShowInsetHeaderRef,
479
- getShowBackToTop,
480
- getIsZH,
481
- getUiSize,
482
- getShowLogo,
483
- getShowLoginOut,
484
- getShowUiSize,
485
- loginOutClick
486
- };
487
- }
488
- function useLabelWidth(schemaItemRef, propsRef) {
489
- const { getIsZH } = useHeader();
490
- const { appConf } = useAppStore();
491
- return computed(() => {
492
- const { labelWidth, enLabelWidth, labelCol = {}, wrapperCol = {} } = unref(schemaItemRef);
493
- const {
494
- labelWidth: gLabelWidth,
495
- enLabelWidth: gEnLabelWidth,
496
- labelCol: glabelCol = {},
497
- wrapperCol: gwrapperCol = {},
498
- layout = appConf.ui.form.layout
499
- } = unref(propsRef);
500
- let width = (unref(getIsZH) ? labelWidth ?? gLabelWidth : enLabelWidth ?? gEnLabelWidth) ?? labelWidth ?? gLabelWidth ?? 0;
501
- const labelcol = { ...glabelCol, ...labelCol };
502
- const wrapcol = { ...gwrapperCol, ...wrapperCol };
503
- width = isNumber(width) ? `${width}px` : width;
504
- return {
505
- labelCol: {
506
- style: { width },
507
- ...labelcol
508
- },
509
- wrapperCol: {
510
- style: { width: layout === "vertical" ? "100%" : `calc(100% - ${width})` },
511
- ...wrapcol
512
- }
513
- };
514
- });
515
- }
516
- const SINGLE_DATA_TYPE = ["DatePicker", "MonthPicker", "WeekPicker", "TimePicker"];
517
- const MULTIFY_DATA_TYPE = ["RangePicker"];
518
- const DATE_PICKER_TYPES = [...SINGLE_DATA_TYPE, ...MULTIFY_DATA_TYPE];
519
- function createPlaceholder(component) {
520
- const { t } = useI18n("UI");
521
- if (component.includes("Input") || component.includes("Complete")) {
522
- return t("PLEASE_INPUT");
523
- }
524
- if (component.includes("Picker") || component.includes("Select") || component.includes("Cascader") || component.includes("Checkbox") || component.includes("Radio") || component.includes("Switch")) {
525
- return t("PLEASE_SELECT");
526
- }
527
- if (component.includes("Icon")) {
528
- return t("PLEASE_SET_ICON");
529
- }
530
- return "";
531
- }
532
- function setComponentRuleType(rule, component, valueFormat) {
533
- if (SINGLE_DATA_TYPE.includes(component)) {
534
- rule.type = valueFormat ? "string" : "object";
535
- } else if (["RangePicker", "Upload", "CheckboxGroup", "TimePicker"].includes(component)) {
536
- rule.type = "array";
537
- } else if (["InputNumber"].includes(component)) {
538
- rule.type = "number";
539
- }
540
- }
541
- function handleInputNumberValue(component, val) {
542
- if (!component)
543
- return val;
544
- if ([
545
- "Input",
546
- "InputPassword",
547
- "InputSearch",
548
- "InputTextArea"
549
- ].includes(component)) {
550
- return val && isNumber(val) ? `${val}` : val;
551
- }
552
- return val;
553
- }
554
- function useFormValue(props, key = "value", changeEvent = "change", emitData) {
555
- const instance = getCurrentInstance();
556
- const emit = instance?.emit;
557
- const innerState = reactive({
558
- value: props[key]
559
- });
560
- const defaultState = readonly(innerState);
561
- const setState = (val) => {
562
- innerState.value = val;
563
- nextTick(() => {
564
- emit?.(changeEvent, val, ...toRaw(unref(emitData)) || []);
565
- });
566
- };
567
- watchEffect(() => {
568
- innerState.value = props[key];
569
- });
570
- const state = computed({
571
- get() {
572
- return innerState.value;
573
- },
574
- set(value) {
575
- if (isEqual(value, defaultState.value))
576
- return;
577
- innerState.value = value;
578
- nextTick(() => {
579
- emit?.(changeEvent, value, ...toRaw(unref(emitData)) || []);
580
- });
581
- }
582
- });
583
- return [state, setState, defaultState];
584
- }
585
- const _sfc_main$d = /* @__PURE__ */ defineComponent({
586
- __name: "radioButton",
587
- props: {
588
- value: {
589
- type: [String, Number, Boolean]
590
- },
591
- options: {
592
- type: Array,
593
- default: () => []
594
- }
595
- },
596
- setup(__props) {
597
- const props = __props;
598
- const attrs = useAttrs();
599
- const [state] = useFormValue(props);
600
- const getOptions = computed(() => {
601
- const { options } = props;
602
- if (!options || options?.length === 0)
603
- return [];
604
- const isStringArr = options.some((item) => isString(item));
605
- if (!isStringArr)
606
- return options;
607
- return options.map((item) => ({ label: item, value: item }));
608
- });
609
- return (_ctx, _cache) => {
610
- const _component_ARadioButton = RadioButton;
611
- const _component_ARadioGroup = RadioGroup;
612
- return openBlock(), createBlock(_component_ARadioGroup, mergeProps(unref(attrs), {
613
- value: unref(state),
614
- "onUpdate:value": _cache[0] || (_cache[0] = ($event) => isRef(state) ? state.value = $event : null),
615
- "button-style": "solid"
616
- }), {
617
- default: withCtx(() => [
618
- (openBlock(true), createElementBlock(Fragment, null, renderList(unref(getOptions), (item) => {
619
- return openBlock(), createBlock(_component_ARadioButton, {
620
- key: `${item.value}`,
621
- value: item.value,
622
- disabled: item.disabled
623
- }, {
624
- default: withCtx(() => [
625
- createTextVNode(toDisplayString(item.label), 1)
626
- ]),
627
- _: 2
628
- }, 1032, ["value", "disabled"]);
629
- }), 128))
630
- ]),
631
- _: 1
632
- }, 16, ["value"]);
633
- };
634
- }
635
- });
636
- const _hoisted_1$2 = { class: "input-with-dialog" };
637
- const _sfc_main$c = /* @__PURE__ */ defineComponent({
638
- __name: "formInputUseDialog",
639
- setup(__props) {
640
- const { t } = useI18n("UI");
641
- const attrs = useAttrs();
642
- const bindProps = computed(() => {
643
- return {
644
- ...omit(attrs, [
645
- "formValues"
646
- ]),
647
- disabled: true
648
- };
649
- });
650
- function onClickInput() {
651
- const { model, schema = {} } = attrs.formValues;
652
- if (!schema.openDialog || !isFunction(schema.openDialog)) {
653
- error(t("MUSE_FUNCTION"));
654
- return;
655
- }
656
- schema.openDialog(model);
657
- }
658
- function clearProps() {
659
- const { model, schema = {} } = attrs.formValues;
660
- [...schema.linkProps, schema.name].forEach((it) => model[it] = null);
661
- }
662
- return (_ctx, _cache) => {
663
- return openBlock(), createElementBlock("div", _hoisted_1$2, [
664
- createElementVNode("div", { onClick: onClickInput }, [
665
- createVNode(unref(Input), normalizeProps(guardReactiveProps(unref(bindProps))), null, 16)
666
- ]),
667
- unref(attrs).formValues?.schema?.linkProps?.length ? (openBlock(), createElementBlock("i", {
668
- key: 0,
669
- class: "i mdi:close-circle",
670
- onClick: clearProps
671
- })) : createCommentVNode("", true)
672
- ]);
673
- };
674
- }
675
- });
676
- const components = {
677
- Input,
678
- InputWithDialog: _sfc_main$c,
679
- InputTextArea: Input.TextArea,
680
- InputSearch: Input.Search,
681
- InputGroup: Input.Group,
682
- InputPassword: Input.Password,
683
- Select,
684
- TreeSelect,
685
- Radio,
686
- RadioGroup: Radio.Group,
687
- RadioButtonGroup: _sfc_main$d,
688
- Checkbox,
689
- CheckboxGroup: Checkbox.Group,
690
- AutoComplete,
691
- Cascader,
692
- DatePicker,
693
- MonthPicker: DatePicker.MonthPicker,
694
- WeekPicker: DatePicker.WeekPicker,
695
- RangePicker: DatePicker.RangePicker,
696
- InputNumber,
697
- Switch,
698
- TimePicker,
699
- Slider,
700
- Rate,
701
- Divider
702
- };
703
- const componentMap = /* @__PURE__ */ new Map();
704
- for (let item in components) {
705
- componentMap.set(item, components[item]);
706
- }
707
- function _isSlot$1(s) {
708
- return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
709
- }
710
- const _sfc_main$b = {
711
- name: "FormItem",
712
- inheritAttrs: false,
713
- props: {
714
- schema: {
715
- type: Object,
716
- default: () => ({})
717
- },
718
- formProps: {
719
- type: Object,
720
- default: () => ({})
721
- },
722
- defaultValues: {
723
- type: Object,
724
- default: () => ({})
725
- },
726
- formModel: {
727
- type: Object,
728
- default: () => ({})
729
- },
730
- setFormModel: {
731
- type: Function
732
- },
733
- formActionType: {
734
- type: Object
735
- }
736
- },
737
- setup(props, {
738
- emit,
739
- slots
740
- }) {
741
- const {
742
- getSlot
743
- } = useSlots();
744
- const {
745
- t
746
- } = useI18n("UI");
747
- const {
748
- getUiSize
749
- } = useHeader();
750
- const {
751
- appConf
752
- } = useAppStore();
753
- const {
754
- schema,
755
- formProps
756
- } = toRefs(props);
757
- const getValues = computed(() => {
758
- const {
759
- defaultValues,
760
- formModel,
761
- schema: schema2
762
- } = props;
763
- let name = schema2.name;
764
- return {
765
- name: isArray(name) ? name.join("-") : name,
766
- model: formModel,
767
- schema: schema2,
768
- values: {
769
- ...defaultValues,
770
- ...formModel
771
- }
772
- };
773
- });
774
- const getShow = computed(() => {
775
- const {
776
- show = true,
777
- isAdvanced = true
778
- } = props.schema;
779
- if (!isAdvanced) {
780
- return false;
781
- }
782
- if (isFunction(show)) {
783
- return show(unref(getValues).model);
784
- }
785
- return show;
786
- });
787
- const getComponentProps = computed(() => {
788
- const {
789
- schema: schema2
790
- } = props;
791
- let {
792
- props: cProps = {}
793
- } = schema2;
794
- if (isFunction(cProps)) {
795
- cProps = cProps(unref(getValues).model) ?? {};
796
- }
797
- if (schema2.component === "Divider") {
798
- cProps = Object.assign({
799
- type: "horizontal"
800
- }, cProps, {
801
- orientation: "left"
802
- });
803
- }
804
- return cProps;
805
- });
806
- function renderItem() {
807
- const {
808
- component,
809
- slot,
810
- render,
811
- name,
812
- colon = appConf.ui.form.colon,
813
- suffix,
814
- prefix
815
- } = props.schema;
816
- const {
817
- labelCol,
818
- wrapperCol
819
- } = unref(useLabelWidth(schema, formProps));
820
- const getContent = () => {
821
- const value = unref(getValues);
822
- let _con = slot ? getSlot(slots, slot, value.model) : render ? render(value.model) : renderFormItem();
823
- return component === "InputGroup" || component === "Icon" ? createVNode(FormItem, {
824
- "class": "m-0"
825
- }, _isSlot$1(_con) ? _con : {
826
- default: () => [_con]
827
- }) : _con;
828
- };
829
- const getSuffix = () => {
830
- return isFunction(suffix) ? suffix(unref(getValues).model) : suffix;
831
- };
832
- const getPrefix = () => {
833
- return isFunction(prefix) ? prefix(unref(getValues).model) : prefix;
834
- };
835
- return createVNode(Form.Item, {
836
- "name": isArray(name) ? name.join("-") : name,
837
- "colon": colon,
838
- "class": [unref(getUiSize), {
839
- "suffix-item": !!suffix
840
- }],
841
- "label": renderLabel(),
842
- "rules": handleRules(),
843
- "labelCol": labelCol,
844
- "wrapperCol": wrapperCol
845
- }, {
846
- default: () => [createVNode("div", {
847
- "style": "display:flex"
848
- }, [!!prefix && createVNode("span", {
849
- "class": "prefix px-2"
850
- }, [getPrefix()]), createVNode("div", {
851
- "style": "flex:1; width: 100%;"
852
- }, [getContent()]), !!suffix && createVNode("span", {
853
- "class": "suffix px-2"
854
- }, [getSuffix()])])]
855
- });
856
- }
857
- function renderLabel() {
858
- const {
859
- label,
860
- toolTip,
861
- subLabel,
862
- toolTipProps = {}
863
- } = props.schema;
864
- const renderLabel2 = subLabel ? createVNode("span", null, [createTextVNode(" "), label, createTextVNode(" "), createVNode("span", {
865
- "class": "text-secondary opacity-50"
866
- }, [createTextVNode("("), subLabel, createTextVNode(")")])]) : label;
867
- const _toolTip = isFunction(toolTip) ? toolTip(unref(getValues).model) : toolTip;
868
- const _toolTipProps = {
869
- title: renderLabel2,
870
- autoAdjustOverflow: true,
871
- placement: "top",
872
- ...toolTipProps
873
- };
874
- return _toolTip ? createVNode("span", null, [createVNode(Tooltip, _toolTipProps, _isSlot$1(renderLabel2) ? renderLabel2 : {
875
- default: () => [renderLabel2]
876
- })]) : renderLabel2;
877
- }
878
- function renderFormItem() {
879
- const {
880
- schema: schema2,
881
- formModel,
882
- formActionType
883
- } = props;
884
- const {
885
- component,
886
- name,
887
- changeEvent = "change",
888
- valueField,
889
- renderComponent,
890
- props: sProps
891
- } = props.schema;
892
- const isCheck = component && ["Switch", "Checkbox"].includes(component);
893
- const eventKey = `on${upperFirst(changeEvent)}`;
894
- const _sProps = isFunction(sProps) ? sProps(formModel) : sProps;
895
- const on2 = {
896
- [eventKey]: (...args) => {
897
- const [e] = args;
898
- const target = e ? e.target : null;
899
- const value = target ? isCheck ? target.checked : target.value : e;
900
- if (isString(name)) {
901
- props.setFormModel(name, value);
902
- } else if (isArray(name)) {
903
- name.map((key) => props.setFormModel(key, value));
904
- }
905
- if (_sProps && _sProps[eventKey])
906
- _sProps[eventKey](...args, formModel);
907
- }
908
- };
909
- for (let it in _sProps) {
910
- if (it.startsWith("on") && it !== eventKey) {
911
- on2[it] = (...args) => {
912
- _sProps[it](...args, formModel);
913
- };
914
- }
915
- }
916
- const getDisable = computed(() => {
917
- const {
918
- disabled: gDisabled
919
- } = props.formProps;
920
- const {
921
- disabled
922
- } = props.schema;
923
- const {
924
- disabled: itemDisabled = false
925
- } = unref(getComponentProps);
926
- let _disabled = !!gDisabled || itemDisabled;
927
- if (isBoolean(disabled))
928
- _disabled = disabled;
929
- if (isFunction(disabled))
930
- _disabled = disabled(unref(getValues).model);
931
- return _disabled;
932
- });
933
- const getSize = () => {
934
- if (component === "Switch" && unref(getUiSize) === UiSize.LARGE) {
935
- return "default";
936
- }
937
- return unref(getUiSize) === UiSize.MIDDLE ? "default" : unref(getUiSize);
938
- };
939
- const itemProps = {
940
- allowClear: _sProps?.allowClear ?? appConf.ui.form.allowClear,
941
- size: getSize(),
942
- ...unref(getComponentProps),
943
- disabled: unref(getDisable)
944
- };
945
- if (component === "Select") {
946
- {
947
- itemProps.showSearch = true;
948
- itemProps.optionFilterProp = "label";
949
- }
950
- }
951
- if (!itemProps.disabled && component !== "RangePicker") {
952
- itemProps.placeholder = unref(getComponentProps)?.placeholder || createPlaceholder(component);
953
- }
954
- if (["DatePicker", "MonthPicker", "RangePicker"].includes(component)) {
955
- itemProps.defaultValue = props.formModel[name];
956
- }
957
- itemProps.codeName = name;
958
- itemProps.formValues = unref(getValues);
959
- if (["Select", "DatePicker", "MonthPicker", "WeekPicker", "RangePicker"].includes(component)) {
960
- itemProps.dropdownClassName += ` ${unref(getUiSize)}`;
961
- }
962
- const bindValue = {
963
- [valueField || (isCheck ? "checked" : "value")]: props.formModel[name]
964
- };
965
- let compAttr = {
966
- ...itemProps,
967
- ...bindValue,
968
- ...on2
969
- };
970
- const Comp = componentMap.get(component);
971
- if (!renderComponent) {
972
- return createVNode(Comp, compAttr, null);
973
- }
974
- const compSlot = isFunction(renderComponent) ? {
975
- ...renderComponent(unref(getValues))
976
- } : {
977
- default: () => renderComponent
978
- };
979
- return createVNode(Comp, compAttr, _isSlot$1(compSlot) ? compSlot : {
980
- default: () => [compSlot]
981
- });
982
- }
983
- function handleRules() {
984
- const {
985
- rules: defaultRules = [],
986
- component,
987
- label,
988
- dynamicRules,
989
- required
990
- } = props.schema;
991
- if (!component)
992
- return [];
993
- if (isFunction(dynamicRules)) {
994
- return dynamicRules(unref(getValues).model);
995
- }
996
- const defaultMsg = createPlaceholder(component) + label;
997
- let rules = cloneDeep(defaultRules);
998
- const getRequired = isFunction(required) ? required(unref(getValues).model) : required;
999
- function validator(rule, value) {
1000
- const msg = rule.message || defaultMsg;
1001
- if (value === void 0 || isNull(value) || Array.isArray(value) && value.length === 0 || typeof value === "string" && value.trim() === "" || typeof value === "object" && Reflect.has(value, "checked") && Reflect.has(value, "halfChecked") && Array.isArray(value.checked) && Array.isArray(value.halfChecked) && value.checked.length === 0 && value.halfChecked.length === 0) {
1002
- return Promise.reject(msg);
1003
- }
1004
- return Promise.resolve();
1005
- }
1006
- if (!rules || !rules.length) {
1007
- let _required = isBoolean(getRequired) ? getRequired : unref(getRequired);
1008
- rules = _required ? [{
1009
- required: _required,
1010
- validator
1011
- }] : [];
1012
- }
1013
- const requiredIndex = rules.findIndex((rule) => Reflect.has(rule, "required") && !Reflect.has(rule, "validator"));
1014
- if (requiredIndex !== -1) {
1015
- const rule = rules[requiredIndex];
1016
- if (!unref(getShow)) {
1017
- rule.required = false;
1018
- }
1019
- if (!Reflect.has(rule, "type")) {
1020
- rule.type = component === "InputNumber" ? "number" : "string";
1021
- }
1022
- rule.message = rule.message || defaultMsg;
1023
- if (component.includes("Input") || component.includes("Textarea")) {
1024
- rule.whitespace = true;
1025
- }
1026
- const valueFormat = unref(getComponentProps)?.valueFormat;
1027
- setComponentRuleType(rule, component, valueFormat);
1028
- }
1029
- const maxIndex = rules.findIndex((val) => val.max);
1030
- if (maxIndex !== -1 && !rules[maxIndex].validator) {
1031
- rules[maxIndex].message = rules[maxIndex].message || `\u6700\u5927\u503C\u4E3A${rules[maxIndex].max}`;
1032
- }
1033
- return rules;
1034
- }
1035
- return () => {
1036
- let _slot2;
1037
- const {
1038
- colSlot,
1039
- renderCol,
1040
- colProps,
1041
- component,
1042
- render,
1043
- slot
1044
- } = props.schema;
1045
- const {
1046
- colProps: gColProps,
1047
- mode
1048
- } = props.formProps;
1049
- let _colProps = colProps || gColProps || (mode === "search" ? appConf.ui.form.searchColspan : appConf.ui.form.dialogColspan);
1050
- const values = unref(getValues);
1051
- if (!component) {
1052
- if (!render && !renderCol && !slot) {
1053
- error(t("NEED_RENDER"));
1054
- return;
1055
- }
1056
- }
1057
- if (component === "Divider") {
1058
- let _slot;
1059
- let cprops = unref(getComponentProps);
1060
- const span = cprops?.span ?? 24;
1061
- return createVNode(Col, {
1062
- "span": span
1063
- }, {
1064
- default: () => [createVNode(Divider, cprops, _isSlot$1(_slot = renderLabel()) ? _slot : {
1065
- default: () => [_slot]
1066
- })]
1067
- });
1068
- }
1069
- const getContent = () => {
1070
- return colSlot ? getSlot(slots, colSlot, values) : renderCol ? renderCol(values) : renderItem();
1071
- };
1072
- return unref(getShow) && createVNode(Col, _colProps, _isSlot$1(_slot2 = getContent()) ? _slot2 : {
1073
- default: () => [_slot2]
1074
- });
1075
- };
1076
- }
1077
- };
1078
- const _hoisted_1$1 = {
1079
- key: 0,
1080
- className: "preIcon pr-1"
1081
- };
1082
- const _hoisted_2 = {
1083
- key: 0,
1084
- className: "preIcon pl-1"
1085
- };
1086
- const _hoisted_3 = { class: "text" };
1087
- const _hoisted_4 = /* @__PURE__ */ createElementVNode("i", { class: "text-2xl i ic:baseline-arrow-drop-down" }, null, -1);
1088
- const _hoisted_5 = [
1089
- _hoisted_4
1090
- ];
1091
- const _sfc_main$a = /* @__PURE__ */ defineComponent({
1092
- __name: "FormButtons",
1093
- props: {
1094
- mode: {
1095
- type: String,
1096
- default: "search"
1097
- },
1098
- show: {
1099
- type: Boolean,
1100
- default: true
1101
- },
1102
- showAdvancedButton: {
1103
- type: Boolean,
1104
- default: true
1105
- },
1106
- minShowColumn: {
1107
- type: Number,
1108
- default: 2
1109
- },
1110
- buttonList: {
1111
- type: [Array],
1112
- default: []
1113
- },
1114
- isAdvanced: {
1115
- type: Boolean,
1116
- default: true
1117
- }
1118
- },
1119
- emits: ["handle-method"],
1120
- setup(__props, { emit: emits }) {
1121
- const props = __props;
1122
- const { t } = useI18n();
1123
- const advancedRef = ref(props.isAdvanced);
1124
- let key = 0;
1125
- const showAdvanceRef = computed(() => {
1126
- return props.mode === "search" ? props.showAdvancedButton : false;
1127
- });
1128
- const colOpt = computed(() => {
1129
- let style = {
1130
- textAlign: "right"
1131
- };
1132
- if (props.mode === "dialog") {
1133
- Object.assign(style, {
1134
- display: "inline-block"
1135
- });
1136
- }
1137
- return { style };
1138
- });
1139
- const getAdvanceClass = computed(() => {
1140
- return [
1141
- "basic-arrow",
1142
- { "basic-arrow--active": !advancedRef.value }
1143
- ];
1144
- });
1145
- const toggleAdvanced = () => {
1146
- advancedRef.value = !advancedRef.value;
1147
- dispatchResize();
1148
- emits("handle-method", advancedRef.value);
1149
- };
1150
- function handleBtnClick(button) {
1151
- if (button.onClick && isFunction(button.onClick)) {
1152
- button.onClick();
1153
- } else {
1154
- emits("handle-method", button);
1155
- }
1156
- }
1157
- watch(() => props.isAdvanced, (v) => {
1158
- if (v) {
1159
- nextTick(() => toggleAdvanced());
1160
- }
1161
- }, {
1162
- immediate: true
1163
- });
1164
- watch(
1165
- () => props.buttonList,
1166
- (v) => key = new Date().getTime(),
1167
- {
1168
- immediate: true,
1169
- deep: true
1170
- }
1171
- );
1172
- return (_ctx, _cache) => {
1173
- const _component_AButton = Button;
1174
- const _component_AFormItem = FormItem$1;
1175
- const _component_ACol = Col$1;
1176
- const _directive_icon = resolveDirective("icon");
1177
- const _directive_auth = resolveDirective("auth");
1178
- return __props.show ? (openBlock(), createBlock(_component_ACol, normalizeProps(mergeProps({ key: 0 }, unref(colOpt))), {
1179
- default: withCtx(() => [
1180
- createVNode(_component_AFormItem, {
1181
- class: "dt-form-btns",
1182
- style: normalizeStyle({
1183
- "margin-bottom": __props.mode === "search" ? "16px" : "0px"
1184
- })
1185
- }, {
1186
- default: withCtx(() => [
1187
- (openBlock(true), createElementBlock(Fragment, null, renderList(__props.buttonList, (button) => {
1188
- return openBlock(), createElementBlock(Fragment, null, [
1189
- (button.show === void 0 ? true : button.show) ? withDirectives((openBlock(), createBlock(_component_AButton, {
1190
- class: normalizeClass(["items-center", button.class]),
1191
- type: button.type,
1192
- loading: button.loading,
1193
- disabled: button.disabled,
1194
- key: unref(key),
1195
- onClick: ($event) => handleBtnClick(button)
1196
- }, {
1197
- icon: withCtx(() => [
1198
- button.preIcon ? withDirectives((openBlock(), createElementBlock("span", _hoisted_1$1, null, 512)), [
1199
- [_directive_icon, button.preIcon]
1200
- ]) : createCommentVNode("", true)
1201
- ]),
1202
- default: withCtx(() => [
1203
- createTextVNode(" " + toDisplayString(unref(t)(button.label)) + " ", 1),
1204
- button.postIcon ? withDirectives((openBlock(), createElementBlock("span", _hoisted_2, null, 512)), [
1205
- [_directive_icon, button.postIcon]
1206
- ]) : createCommentVNode("", true)
1207
- ]),
1208
- _: 2
1209
- }, 1032, ["type", "class", "loading", "disabled", "onClick"])), [
1210
- [_directive_auth, button.auth]
1211
- ]) : createCommentVNode("", true)
1212
- ], 64);
1213
- }), 256)),
1214
- unref(showAdvanceRef) ? (openBlock(), createBlock(_component_AButton, {
1215
- key: 0,
1216
- type: "link",
1217
- class: "advanced",
1218
- onClick: toggleAdvanced
1219
- }, {
1220
- default: withCtx(() => [
1221
- createElementVNode("span", _hoisted_3, toDisplayString(advancedRef.value ? unref(t)("UI.ADVANCED") : unref(t)("UI.EXPAND")), 1),
1222
- createElementVNode("span", {
1223
- class: normalizeClass(unref(getAdvanceClass))
1224
- }, _hoisted_5, 2)
1225
- ]),
1226
- _: 1
1227
- })) : createCommentVNode("", true)
1228
- ]),
1229
- _: 1
1230
- }, 8, ["style"])
1231
- ]),
1232
- _: 1
1233
- }, 16)) : createCommentVNode("", true);
1234
- };
1235
- }
1236
- });
1237
- const SEARCH_BTN_NAME = "UI.SEARCH";
1238
- const RESET_BTN_NAME = "UI.RESET";
1239
- const SEARCH_BTNS = [
1240
- { label: SEARCH_BTN_NAME, preIcon: "mdi:magnify", type: "primary" },
1241
- { label: RESET_BTN_NAME, preIcon: "mdi:refresh", type: "default" }
1242
- ];
1243
- function useFormEvents({
1244
- emits,
1245
- getSchema,
1246
- formModel,
1247
- defaultValue,
1248
- formElRef,
1249
- schemaRef,
1250
- getProps,
1251
- handleFormValues
1252
- }) {
1253
- function getFormValues() {
1254
- const formEl = unref(formElRef);
1255
- if (!formEl)
1256
- return {};
1257
- return handleFormValues(toRaw(unref(formModel)));
1258
- }
1259
- function updateSchema(data) {
1260
- let updateItems = [];
1261
- updateItems = isObject(data) ? [data] : [...data];
1262
- if (updateItems?.length && !updateItems.every((it) => it.component !== "Divider" && it.name)) {
1263
- console.error("\u6240\u6709\u7684\u5143\u7D20\u90FD\u5FC5\u987B\u8BBE\u7F6Ename\u5C5E\u6027");
1264
- return;
1265
- }
1266
- const schema = [];
1267
- updateItems.forEach((it) => {
1268
- unref(getSchema).forEach((val) => {
1269
- if (val.name === it.name) {
1270
- const newSchema = deepMerge(val, it);
1271
- schema.push(newSchema);
1272
- } else {
1273
- schema.push(val);
1274
- }
1275
- });
1276
- });
1277
- let shcemas = uniqBy(schema, "name");
1278
- _setValue(shcemas);
1279
- schemaRef.value = shcemas;
1280
- }
1281
- function resetSchema(data) {
1282
- let updateItems = [];
1283
- updateItems = isObject(data) ? [data] : [...data];
1284
- _setValue(updateItems, true);
1285
- schemaRef.value = updateItems;
1286
- }
1287
- function _setValue(data, isReset = false) {
1288
- data = isArray(data) ? data : [data];
1289
- let obj = {};
1290
- data.map((it) => {
1291
- let name = isArray(it.name) ? it.name[0] : it.name;
1292
- obj[name] = null;
1293
- if (!isNullAndUnDef(it.defaultValue))
1294
- return obj[name] = it.defaultValue;
1295
- let props = isFunction(it.props) ? it.props(toRaw(unref(formModel))) : it.props;
1296
- if (!isNullAndUnDef(props?.defaultValue))
1297
- obj[name] = props.defaultValue;
1298
- });
1299
- if (isReset) {
1300
- let oldValues = getFormValues();
1301
- let oldObj = {};
1302
- Object.keys(oldValues).map((key) => oldObj[key] = null);
1303
- obj = {
1304
- ...oldObj,
1305
- ...obj
1306
- };
1307
- }
1308
- setFormValues(obj);
1309
- }
1310
- async function clearValidate(name) {
1311
- await unref(formElRef)?.clearValidate(name);
1312
- }
1313
- function resetForms() {
1314
- const { resetFunc } = unref(getProps);
1315
- resetFunc && isFunction(resetFunc) && resetFunc();
1316
- if (!unref(formElRef))
1317
- return;
1318
- Object.keys(formModel).forEach((key) => {
1319
- const schema = unref(getSchema).find((item) => item.name === key);
1320
- const isInput = schema?.component && ["Input", "InputPassword", "InputSearch", "InputTextArea"].includes(schema.component);
1321
- formModel[key] = isInput ? defaultValue.value[key] || "" : defaultValue.value[key];
1322
- });
1323
- nextTick(() => clearValidate());
1324
- emits("reset", toRaw(formModel));
1325
- }
1326
- function removeFormByName(names) {
1327
- if (!names)
1328
- return;
1329
- const schemaList = cloneDeep(unref(getSchema));
1330
- const nameList = isString(names) ? [names] : names;
1331
- for (const name of nameList) {
1332
- _removeSchemaByName(name, schemaList);
1333
- }
1334
- schemaRef.value = schemaList;
1335
- }
1336
- function _removeSchemaByName(name, schemaList) {
1337
- const index = schemaList.findIndex((schema) => schema.name === name);
1338
- if (index !== -1) {
1339
- delete formModel[name];
1340
- schemaList.splice(index, 1);
1341
- }
1342
- }
1343
- function appendFormItems(schema, prefixName, first = false) {
1344
- const schemaList = cloneDeep(unref(getSchema));
1345
- const index = schemaList.findIndex((schema2) => schema2.name === prefixName);
1346
- if (!prefixName || index === -1 || first) {
1347
- first ? schemaList.unshift(...schema) : schemaList.push(...schema);
1348
- schemaRef.value = schemaList;
1349
- return;
1350
- }
1351
- if (index !== -1) {
1352
- schemaList.splice(index + 1, 0, ...schema);
1353
- }
1354
- schemaRef.value = schemaList;
1355
- }
1356
- function itemIsDateType(key) {
1357
- return unref(getSchema).some((item) => {
1358
- return item.name === key ? ["DatePicker", "MonthPicker", "WeekPicker", "TimePicker", "RangePicker"].includes(item.component) : false;
1359
- });
1360
- }
1361
- async function validateFields(nameList) {
1362
- return unref(formElRef)?.validateFields(nameList);
1363
- }
1364
- function setFormValues(values) {
1365
- if (!values || !Object.keys(values).length) {
1366
- for (let it in formModel)
1367
- formModel[it] = Array.isArray(formModel[it]) ? [] : null;
1368
- return;
1369
- }
1370
- const names = unref(getSchema).map((item) => item.name).filter(Boolean);
1371
- const validKeys = [];
1372
- Object.keys(values).forEach((key) => {
1373
- const schema = unref(getSchema).find((item) => item.name === key);
1374
- let value = values[key];
1375
- const hasKey = Reflect.has(values, key);
1376
- value = handleInputNumberValue(schema?.component, value);
1377
- if (hasKey && names.includes(key)) {
1378
- if (itemIsDateType(key)) {
1379
- if (Array.isArray(value)) {
1380
- const arr = [];
1381
- for (const ele of value) {
1382
- arr.push(ele ? dayjs(ele) : null);
1383
- }
1384
- formModel[key] = arr;
1385
- } else {
1386
- const { props } = schema || {};
1387
- let _props = props;
1388
- if (typeof props === "function") {
1389
- _props = props({ formModel });
1390
- }
1391
- formModel[key] = value ? _props?.valueFormat ? value : dayjs(value) : null;
1392
- }
1393
- } else {
1394
- formModel[key] = value;
1395
- }
1396
- validKeys.push(key);
1397
- } else {
1398
- formModel[key] = value;
1399
- }
1400
- });
1401
- return validateFields(validKeys);
1402
- }
1403
- async function validate(nameList) {
1404
- return await unref(formElRef)?.validate(nameList);
1405
- }
1406
- return {
1407
- getFormValues,
1408
- updateSchema,
1409
- resetSchema,
1410
- clearValidate,
1411
- resetForms,
1412
- removeFormByName,
1413
- validateFields,
1414
- setFormValues,
1415
- validate,
1416
- appendFormItems
1417
- };
1418
- }
1419
- function useFormValues({
1420
- defaultValue,
1421
- getSchema,
1422
- formModel
1423
- }) {
1424
- const getComMap = () => {
1425
- let comMap = /* @__PURE__ */ new Map();
1426
- unref(getSchema).map((it) => {
1427
- if (it.component && it.name) {
1428
- comMap.set(it.name, it);
1429
- }
1430
- });
1431
- return comMap;
1432
- };
1433
- function handleFormValues(model) {
1434
- if (!isObject(model))
1435
- return {};
1436
- const vals = {};
1437
- let comMap = getComMap();
1438
- for (let [key, val] of Object.entries(model)) {
1439
- let component = comMap.get(key)?.component;
1440
- if (!key || Array.isArray(val) && val.length === 0 || isFunction(val)) {
1441
- continue;
1442
- }
1443
- if (component) {
1444
- if (SINGLE_DATA_TYPE.includes(component)) {
1445
- val = dayjs(val).valueOf();
1446
- } else if (MULTIFY_DATA_TYPE.includes(component)) {
1447
- val = (val || []).map((it) => dayjs(it).valueOf());
1448
- if (comMap.get(key).extraName?.length) {
1449
- comMap.get(key).extraName.map((it, i) => {
1450
- set(vals, it, val.length > 0 ? val[i] : null);
1451
- });
1452
- }
1453
- }
1454
- }
1455
- if (isString(val)) {
1456
- val = val.trim();
1457
- }
1458
- set(vals, key, val);
1459
- }
1460
- return vals;
1461
- }
1462
- function initDefault() {
1463
- const schema = unref(getSchema), obj = {};
1464
- schema.forEach((item) => {
1465
- const { props = {}, name, component, defaultValue: gDefaultValue, extraName } = item;
1466
- const { defaultValue: itemDefaultValue, mode, format, treeCheckable } = isFunction(props) ? props(formModel) : props;
1467
- if (!name)
1468
- return;
1469
- let names = [];
1470
- if (component === "InputWithDialog") {
1471
- names = [name, ...extraName];
1472
- } else if (isArray(name)) {
1473
- names = name;
1474
- } else {
1475
- names = [name];
1476
- }
1477
- const defaultValue2 = itemDefaultValue ?? gDefaultValue;
1478
- if (!isNullAndUnDef(defaultValue2)) {
1479
- if (DATE_PICKER_TYPES.includes(component)) {
1480
- if (isArray(defaultValue2)) {
1481
- let vals = defaultValue2.map((it) => format ? dayjs(it, format) : dayjs(it));
1482
- if (names.length > 1) {
1483
- names.map((key, index) => obj[key] = vals[index] ?? null);
1484
- } else {
1485
- obj[names[0]] = vals;
1486
- }
1487
- } else {
1488
- obj[names[0]] = format ? dayjs(defaultValue2, format) : dayjs(defaultValue2);
1489
- }
1490
- } else {
1491
- if (names.length > 1) {
1492
- names.forEach((key, index) => {
1493
- if (!defaultValue2 || defaultValue2.length - 1 < index) {
1494
- obj[key] = null;
1495
- } else {
1496
- obj[key] = defaultValue2[index];
1497
- }
1498
- });
1499
- } else {
1500
- obj[names[0]] = defaultValue2;
1501
- }
1502
- }
1503
- } else {
1504
- names.map((it) => {
1505
- if (component === "TreeSelect" || (mode === "multiple" || treeCheckable) || component === "Select" && mode === "multiple") {
1506
- obj[it] = [];
1507
- } else {
1508
- obj[it] = null;
1509
- }
1510
- });
1511
- }
1512
- });
1513
- defaultValue.value = { ...obj };
1514
- for (let key in obj) {
1515
- formModel[key] = obj[key];
1516
- }
1517
- }
1518
- return {
1519
- initDefault,
1520
- handleFormValues
1521
- };
1522
- }
1523
- function useFormActions(opt) {
1524
- const { getProps, defaultValue, updateSchema, getFormValues, setFormValues } = opt;
1525
- const { appConf } = useAppStore();
1526
- function handleAdvanced(isAdvanced) {
1527
- const {
1528
- schemas,
1529
- minShowColumn = appConf.ui.form?.minShowColumn || 2,
1530
- showAdvancedButton = true
1531
- } = unref(getProps);
1532
- let schema = [...schemas];
1533
- if (showAdvancedButton) {
1534
- schema = schemas.reduce((t, it, index) => {
1535
- if (index > minShowColumn - 1)
1536
- it.isAdvanced = isAdvanced;
1537
- t.push(it);
1538
- return t;
1539
- }, []);
1540
- }
1541
- updateSchema(schema);
1542
- }
1543
- function handleMethod(params) {
1544
- const { onSearch, onReset } = unref(getProps);
1545
- if (isBoolean(params)) {
1546
- handleAdvanced(params);
1547
- } else if (params.label === SEARCH_BTN_NAME) {
1548
- onSearch(getFormValues());
1549
- } else if (params.label === RESET_BTN_NAME) {
1550
- setFormValues(toRaw(defaultValue.value));
1551
- onReset(getFormValues());
1552
- } else {
1553
- params.onClick();
1554
- }
1555
- }
1556
- return [handleMethod];
1557
- }
1558
- const BasicProps = {
1559
- mode: {
1560
- type: String,
1561
- default: "search"
1562
- },
1563
- autoFetch: {
1564
- type: Boolean,
1565
- default: true
1566
- },
1567
- model: {
1568
- type: Object,
1569
- default: () => ({})
1570
- },
1571
- layout: {
1572
- type: String,
1573
- default: "horizontal"
1574
- },
1575
- labelWidth: {
1576
- type: [Number, String],
1577
- default: 100
1578
- },
1579
- enLabelWidth: {
1580
- type: [Number, String],
1581
- default: 100
1582
- },
1583
- labelAlign: {
1584
- type: String,
1585
- default: "right"
1586
- },
1587
- labelCol: {
1588
- type: Object,
1589
- default: () => ({})
1590
- },
1591
- wrapperCol: {
1592
- type: Object,
1593
- default: () => ({})
1594
- },
1595
- rowProps: {
1596
- type: Object,
1597
- default: () => ({})
1598
- },
1599
- colProps: {
1600
- type: Object,
1601
- default: () => ({})
1602
- },
1603
- size: {
1604
- type: String,
1605
- default: "small"
1606
- },
1607
- disabled: {
1608
- type: Boolean,
1609
- default: false
1610
- },
1611
- compact: {
1612
- type: Boolean,
1613
- default: null
1614
- },
1615
- schemas: {
1616
- type: Array,
1617
- default: () => []
1618
- },
1619
- autoSearchOnEnter: {
1620
- type: Boolean,
1621
- default: true
1622
- },
1623
- minShowColumn: {
1624
- type: Number,
1625
- default: 2
1626
- },
1627
- showAdvancedButton: {
1628
- type: Boolean,
1629
- default: true
1630
- },
1631
- allowClear: {
1632
- type: Boolean,
1633
- default: true
1634
- },
1635
- scrollToFirstError: {
1636
- type: Boolean,
1637
- default: true
1638
- },
1639
- colon: {
1640
- type: Boolean,
1641
- default: true
1642
- },
1643
- loading: {
1644
- type: Object,
1645
- default: () => {
1646
- return {};
1647
- }
1648
- },
1649
- onSearch: {
1650
- type: Function,
1651
- default: (params) => {
1652
- }
1653
- },
1654
- onReset: {
1655
- type: Function,
1656
- default: (params) => {
1657
- }
1658
- },
1659
- buttons: {
1660
- type: [Array, null, Boolean],
1661
- default: false
1662
- },
1663
- resetFunc: {
1664
- type: Function
1665
- },
1666
- registerInstance: {
1667
- type: Function
1668
- }
1669
- };
1670
- const _sfc_main$9 = /* @__PURE__ */ defineComponent({
1671
- __name: "index",
1672
- props: BasicProps,
1673
- emits: ["register"],
1674
- setup(__props, { emit: emits }) {
1675
- const props = __props;
1676
- const { getAppConf } = useAppStore();
1677
- const attrs = useAttrs();
1678
- const formElRef = ref(null);
1679
- const formModel = reactive({});
1680
- const defaultValue = ref({});
1681
- const propsRef = ref();
1682
- const schemaRef = ref(null);
1683
- const getProps = computed(() => {
1684
- let colProps = props.colProps;
1685
- if (isEmpty(props.colProps)) {
1686
- colProps = props.mode === "search" ? getAppConf.ui.form.searchColspan || { span: 8 } : getAppConf.ui.form.dialogColspan || { span: 12 };
1687
- }
1688
- return {
1689
- ...props,
1690
- ...getAppConf.ui.form,
1691
- colProps,
1692
- ...unref(propsRef)
1693
- };
1694
- });
1695
- const getBindValue = computed(() => {
1696
- return {
1697
- ...attrs,
1698
- ...unref(getProps)
1699
- };
1700
- });
1701
- const getSchema = computed(() => {
1702
- return unref(schemaRef) || unref(getProps).schemas;
1703
- });
1704
- const getFormClass = computed(() => {
1705
- const { compact, mode } = unref(getProps);
1706
- const getCompact = compact === null ? mode === "dialog" ? false : true : compact;
1707
- return [
1708
- "basic-form",
1709
- `basic-form__${mode}`,
1710
- {
1711
- "basic-form__compact": getCompact
1712
- }
1713
- ];
1714
- });
1715
- function setProps(formProps) {
1716
- propsRef.value = deepMerge(unref(propsRef) || {}, formProps);
1717
- return null;
1718
- }
1719
- function setFormModel(key, value) {
1720
- formModel[key] = value;
1721
- const { validateTrigger } = unref(getBindValue);
1722
- if (!validateTrigger || validateTrigger === "change") {
1723
- validateFields([key]);
1724
- }
1725
- }
1726
- function handleEnterPress() {
1727
- }
1728
- const { initDefault, handleFormValues } = useFormValues({
1729
- defaultValue,
1730
- getSchema,
1731
- formModel
1732
- });
1733
- const {
1734
- updateSchema,
1735
- resetSchema,
1736
- clearValidate,
1737
- resetForms,
1738
- removeFormByName,
1739
- setFormValues,
1740
- appendFormItems,
1741
- validate,
1742
- validateFields,
1743
- getFormValues
1744
- } = useFormEvents({
1745
- emits,
1746
- getSchema,
1747
- formModel,
1748
- formElRef,
1749
- defaultValue,
1750
- schemaRef,
1751
- getProps,
1752
- handleFormValues
1753
- });
1754
- const formActionMethods = {
1755
- setProps,
1756
- updateSchema,
1757
- resetSchema,
1758
- clearValidate,
1759
- resetForms,
1760
- removeFormByName,
1761
- setFormValues,
1762
- appendFormItems,
1763
- validate,
1764
- validateFields,
1765
- getFormValues
1766
- };
1767
- const getActionsProps = computed(() => {
1768
- const {
1769
- mode,
1770
- minShowColumn = getAppConf.ui.form.minShowColumn || 2,
1771
- schemas = [],
1772
- showAdvancedButton: advanced,
1773
- loading,
1774
- buttons
1775
- } = unref(getProps);
1776
- let showAdvancedButton = mode === "search" ? true : false;
1777
- if (advanced !== void 0) {
1778
- showAdvancedButton = advanced;
1779
- }
1780
- if (schemas.length <= minShowColumn) {
1781
- showAdvancedButton = false;
1782
- }
1783
- let buttonList = [];
1784
- if (isArray(buttons)) {
1785
- buttonList = [...buttons];
1786
- } else if (mode === "search" && !buttons) {
1787
- SEARCH_BTNS.forEach((it) => {
1788
- it.loading = it.name === SEARCH_BTN_NAME ? loading?.onSearch : loading?.onReset;
1789
- buttonList.push(it);
1790
- });
1791
- }
1792
- let colspan = mode === "search" ? getAppConf.ui.form.searchColspan : getAppConf.ui.form.dialogColspan;
1793
- return {
1794
- ...colspan,
1795
- ...{
1796
- showAdvancedButton,
1797
- buttonList
1798
- }
1799
- };
1800
- });
1801
- const [handleMethod] = useFormActions({
1802
- getProps,
1803
- defaultValue,
1804
- updateSchema,
1805
- getFormValues,
1806
- setFormValues
1807
- });
1808
- onMounted(() => {
1809
- setFormValues(null);
1810
- emits("register", formActionMethods);
1811
- initDefault();
1812
- if (unref(getProps)?.registerInstance) {
1813
- unref(getProps)?.registerInstance(formActionMethods);
1814
- }
1815
- });
1816
- watch(
1817
- () => unref(getProps).onSearch,
1818
- () => {
1819
- useTimeoutFn(() => {
1820
- const { onSearch, autoFetch } = unref(getProps);
1821
- if (autoFetch && onSearch && isFunction(onSearch)) {
1822
- onSearch(toRaw(defaultValue.value));
1823
- }
1824
- }, 1);
1825
- }
1826
- );
1827
- watch(
1828
- () => unref(getProps).model,
1829
- (v) => {
1830
- const { model } = unref(getProps);
1831
- if (!model || !Object.keys(model).length)
1832
- return;
1833
- setFormValues(model);
1834
- },
1835
- {
1836
- immediate: true,
1837
- deep: true
1838
- }
1839
- );
1840
- return (_ctx, _cache) => {
1841
- const _component_ARow = Row;
1842
- const _component_AForm = Form$1;
1843
- return openBlock(), createBlock(_component_AForm, mergeProps(unref(getBindValue), {
1844
- ref_key: "formElRef",
1845
- ref: formElRef,
1846
- class: unref(getFormClass),
1847
- model: formModel,
1848
- layout: unref(getProps).layout,
1849
- onKeypress: withKeys(handleEnterPress, ["enter"])
1850
- }), {
1851
- default: withCtx(() => [
1852
- createVNode(_component_ARow, mergeProps(unref(getProps).rowProps, { style: {
1853
- margin: 0
1854
- } }), {
1855
- default: withCtx(() => [
1856
- (openBlock(true), createElementBlock(Fragment, null, renderList(unref(getSchema), (schema) => {
1857
- return openBlock(), createBlock(unref(_sfc_main$b), {
1858
- key: schema.name,
1859
- schema,
1860
- formProps: unref(getProps),
1861
- formModel,
1862
- defaultValues: defaultValue.value,
1863
- setFormModel,
1864
- formActionType: formActionMethods
1865
- }, createSlots({ _: 2 }, [
1866
- renderList(Object.keys(_ctx.$slots), (item) => {
1867
- return {
1868
- name: item,
1869
- fn: withCtx((data) => [
1870
- renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))
1871
- ])
1872
- };
1873
- })
1874
- ]), 1032, ["schema", "formProps", "formModel", "defaultValues"]);
1875
- }), 128)),
1876
- unref(getActionsProps).buttonList?.length ? (openBlock(), createBlock(unref(_sfc_main$a), mergeProps({ key: 0 }, unref(getActionsProps), { onHandleMethod: unref(handleMethod) }), null, 16, ["onHandleMethod"])) : createCommentVNode("", true)
1877
- ]),
1878
- _: 3
1879
- }, 16)
1880
- ]),
1881
- _: 3
1882
- }, 16, ["class", "model", "layout", "onKeypress"]);
1883
- };
1884
- }
1885
- });
1886
- function useForm(props) {
1887
- const formRef = ref(null);
1888
- const loadedRef = ref(false);
1889
- function register(instance) {
1890
- if (unref(loadedRef) && instance === unref(formRef))
1891
- return;
1892
- formRef.value = instance;
1893
- loadedRef.value = true;
1894
- watch(
1895
- () => props,
1896
- () => props && instance.setProps(props),
1897
- {
1898
- immediate: true,
1899
- deep: true
1900
- }
1901
- );
1902
- }
1903
- async function getForm() {
1904
- const form = unref(formRef);
1905
- if (!form)
1906
- console.error("\u8868\u5355\u672A\u7533\u660E!");
1907
- await nextTick();
1908
- return form;
1909
- }
1910
- const methods = {
1911
- setProps: async (props2) => {
1912
- const form = await getForm();
1913
- form.setProps(props2);
1914
- },
1915
- updateSchema: async (data) => {
1916
- const form = await getForm();
1917
- form.updateSchema(data);
1918
- },
1919
- resetSchema: async (data) => {
1920
- const form = await getForm();
1921
- form.resetSchema(data);
1922
- },
1923
- clearValidate: async (name) => {
1924
- const form = await getForm();
1925
- form.clearValidate(name);
1926
- },
1927
- resetForms: async () => {
1928
- const form = await getForm();
1929
- form.resetForms();
1930
- },
1931
- removeFormByName: async (name) => {
1932
- unref(formRef)?.removeFormByName(name);
1933
- },
1934
- setFormValues: async (values) => {
1935
- const form = await getForm();
1936
- form.setFormValues(values);
1937
- },
1938
- appendFormItems: async (schema, prefixName, first) => {
1939
- const form = await getForm();
1940
- form.appendFormItems(schema, prefixName, first);
1941
- },
1942
- validate: async (nameList) => {
1943
- const form = await getForm();
1944
- return form.validate(nameList);
1945
- },
1946
- validateFields: async (nameList) => {
1947
- const form = await getForm();
1948
- return form.validateFields(nameList);
1949
- },
1950
- getFormValues: () => {
1951
- return unref(formRef)?.getFormValues();
1952
- }
1953
- };
1954
- return [register, methods];
1955
- }
1956
- const withInstall = (comp) => {
1957
- comp.install = (app) => {
1958
- app.component(comp.name, comp);
1959
- };
1960
- return comp;
1961
- };
1962
- const DtForm = withInstall(_sfc_main$9);
1963
- const orgDialogProp = reactive({});
1964
- const cbTransfer = reactive({});
1965
- const dataTransfer = reactive({});
1966
- function useModalOut() {
1967
- const modal = ref(null);
1968
- const loaded = ref(true);
1969
- const uid = ref(null);
1970
- const { isProd } = useApp();
1971
- function register(modalMethod, uuid) {
1972
- if (!getCurrentInstance()) {
1973
- throw new Error("useModal\u53EA\u80FD\u5728setup()\u6216\u8005\u51FD\u6570\u4E2D\u4F7F\u7528");
1974
- }
1975
- uid.value = uuid;
1976
- onUnmounted(() => {
1977
- if (unref(isProd)) {
1978
- modal.value = null;
1979
- loaded.value = false;
1980
- dataTransfer[unref(uid)] = null;
1981
- orgDialogProp[unref(uid)] = null;
1982
- cbTransfer[unref(uid)] = (res) => {
1983
- };
1984
- }
1985
- });
1986
- if (unref(loaded) && modalMethod === unref(modal))
1987
- return;
1988
- modal.value = modalMethod;
1989
- loaded.value = true;
1990
- }
1991
- const getInstance = () => {
1992
- const instance = unref(modal);
1993
- if (!instance) {
1994
- error("useModalOut \u5B9E\u4F8B\u672A\u5B9A\u4E49");
1995
- }
1996
- return instance;
1997
- };
1998
- const methods = {
1999
- setModalProps: (props) => {
2000
- getInstance()?.setModalProps(props);
2001
- },
2002
- redoModalHeight: () => {
2003
- getInstance()?.redoModalHeight?.();
2004
- },
2005
- openModal: (params, afterClose) => {
2006
- const id = unref(uid);
2007
- dataTransfer[id] = isObject(params) ? { ...toRaw(params) } : params;
2008
- getInstance()?.setModalProps({
2009
- footer: [],
2010
- defaultFullscreen: false,
2011
- ...orgDialogProp[id],
2012
- visible: true
2013
- });
2014
- cbTransfer[id] = (res) => {
2015
- if (afterClose && isFunction(afterClose)) {
2016
- afterClose(res);
2017
- }
2018
- };
2019
- },
2020
- closeModal: () => {
2021
- getInstance()?.setModalProps({ visible: false });
2022
- }
2023
- };
2024
- return [register, methods];
2025
- }
2026
- function useModal(props, setModalData) {
2027
- const modalInstanceRef = ref(null);
2028
- const currentInstance = getCurrentInstance();
2029
- const uidRef = ref(null);
2030
- const { isProd } = useApp();
2031
- const getInstance = () => {
2032
- const instance = unref(modalInstanceRef);
2033
- if (!instance) {
2034
- error("useModal \u5B9E\u4F8B\u672A\u5B9A\u4E49");
2035
- }
2036
- return instance;
2037
- };
2038
- const register = (modalInstance, uuid) => {
2039
- if (unref(isProd)) {
2040
- modalInstanceRef.value = null;
2041
- }
2042
- uidRef.value = uuid;
2043
- modalInstanceRef.value = modalInstance;
2044
- currentInstance?.emit("register", modalInstance, uuid);
2045
- orgDialogProp[uuid] = toRaw(props);
2046
- modalInstance.setModalProps(props);
2047
- };
2048
- watchEffect(() => {
2049
- const data = dataTransfer[unref(uidRef)];
2050
- if (!setModalData || !isFunction(setModalData))
2051
- return;
2052
- nextTick(() => {
2053
- setModalData(data);
2054
- });
2055
- });
2056
- const methods = {
2057
- setLoading: (loading = true) => {
2058
- getInstance()?.setModalProps({ loading });
2059
- },
2060
- closeModal: (rsp) => {
2061
- if (cbTransfer[unref(uidRef)])
2062
- cbTransfer[unref(uidRef)](rsp);
2063
- getInstance()?.setModalProps({ visible: false });
2064
- },
2065
- setModalProps: (props2) => {
2066
- getInstance()?.setModalProps(props2);
2067
- },
2068
- redoModalHeight: () => {
2069
- const callRedo = getInstance()?.redoModalHeight;
2070
- callRedo && callRedo();
2071
- }
2072
- };
2073
- return [register, methods];
2074
- }
2075
- const basicProps$1 = {
2076
- t: {
2077
- type: String
2078
- },
2079
- visible: {
2080
- type: Boolean
2081
- },
2082
- closable: {
2083
- type: Boolean,
2084
- default: true
2085
- },
2086
- destroyOnClose: {
2087
- type: Boolean
2088
- },
2089
- scrollTop: {
2090
- type: Boolean,
2091
- default: true
2092
- },
2093
- height: { type: Number },
2094
- minHeight: { type: Number },
2095
- width: { type: [String, Number] },
2096
- draggable: {
2097
- type: Boolean,
2098
- default: true
2099
- },
2100
- defaultFullscreen: {
2101
- type: Boolean
2102
- },
2103
- canFullscreen: {
2104
- type: Boolean,
2105
- default: true
2106
- },
2107
- title: {
2108
- type: String
2109
- },
2110
- loading: { type: Boolean, default: false },
2111
- loadingTip: { type: String, default: "\u52A0\u8F7D\u4E2D..." },
2112
- useWrapper: {
2113
- type: Boolean,
2114
- default: true
2115
- },
2116
- wrapClassName: { type: String },
2117
- zIndex: { type: Number },
2118
- centered: { type: Boolean },
2119
- showOkBtn: {
2120
- type: Boolean,
2121
- default: true
2122
- },
2123
- showCancelBtn: {
2124
- type: Boolean,
2125
- default: true
2126
- },
2127
- okText: {
2128
- type: String
2129
- },
2130
- cancelText: {
2131
- type: String
2132
- },
2133
- mask: { type: Boolean, default: true },
2134
- maskClosable: { type: Boolean, default: true },
2135
- keyboard: { type: Boolean, default: true },
2136
- maskStyle: Object,
2137
- footer: {
2138
- type: Object
2139
- },
2140
- bodyStyle: Object,
2141
- wrapperProps: Object,
2142
- getContainer: Function,
2143
- closeFunc: Function,
2144
- afterClose: Function
2145
- };
2146
- function useDragMove(context) {
2147
- const getStyle = (dom, attr) => {
2148
- return getComputedStyle(dom)[attr];
2149
- };
2150
- const drag = (wrap) => {
2151
- if (!wrap)
2152
- return;
2153
- wrap.setAttribute("data-drag", unref(context.draggable));
2154
- const dialogHeaderEl = wrap.querySelector(".ant-modal-header");
2155
- const dragDom = wrap.querySelector(".ant-modal");
2156
- if (!dialogHeaderEl || !dragDom || !unref(context.draggable))
2157
- return;
2158
- dialogHeaderEl.style.cursor = "move";
2159
- dialogHeaderEl.onmousedown = (e) => {
2160
- if (!e)
2161
- return;
2162
- const disX = e.clientX;
2163
- const disY = e.clientY;
2164
- const screenWidth = document.body.clientWidth;
2165
- const screenHeight = document.documentElement.clientHeight;
2166
- const dragDomWidth = dragDom.offsetWidth;
2167
- const dragDomheight = dragDom.offsetHeight;
2168
- const minDragDomLeft = dragDom.offsetLeft;
2169
- const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth;
2170
- const minDragDomTop = dragDom.offsetTop;
2171
- const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomheight;
2172
- const domLeft = getStyle(dragDom, "left");
2173
- const domTop = getStyle(dragDom, "top");
2174
- let styL = +domLeft;
2175
- let styT = +domTop;
2176
- if (domLeft.includes("%")) {
2177
- styL = +document.body.clientWidth * (+domLeft.replace(/%/g, "") / 100);
2178
- styT = +document.body.clientHeight * (+domTop.replace(/%/g, "") / 100);
2179
- } else {
2180
- styL = +domLeft.replace(/px/g, "");
2181
- styT = +domTop.replace(/px/g, "");
2182
- }
2183
- document.onmousemove = function(e2) {
2184
- let left = e2.clientX - disX;
2185
- let top = e2.clientY - disY;
2186
- if (-left > minDragDomLeft) {
2187
- left = -minDragDomLeft;
2188
- } else if (left > maxDragDomLeft) {
2189
- left = maxDragDomLeft;
2190
- }
2191
- if (-top > minDragDomTop) {
2192
- top = -minDragDomTop;
2193
- } else if (top > maxDragDomTop) {
2194
- top = maxDragDomTop;
2195
- }
2196
- dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`;
2197
- };
2198
- document.onmouseup = () => {
2199
- document.onmousemove = null;
2200
- document.onmouseup = null;
2201
- };
2202
- };
2203
- };
2204
- const handleDrag = () => {
2205
- const dragWraps = document.querySelectorAll(".ant-modal-wrap");
2206
- for (const wrap of Array.from(dragWraps)) {
2207
- if (!wrap)
2208
- continue;
2209
- const display = getStyle(wrap, "display");
2210
- const draggable = wrap.getAttribute("data-drag");
2211
- if (display !== "none") {
2212
- if (draggable === null || unref(context.destroyOnClose)) {
2213
- drag(wrap);
2214
- }
2215
- }
2216
- }
2217
- };
2218
- watchEffect(() => {
2219
- if (!unref(context.visible) || !unref(context.draggable)) {
2220
- return;
2221
- }
2222
- useTimeoutFn(() => {
2223
- handleDrag();
2224
- }, 30);
2225
- });
2226
- }
2227
- function _isSlot(s) {
2228
- return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
2229
- }
2230
- const _sfc_main$8 = {
2231
- name: "Modal",
2232
- inheritAttrs: false,
2233
- props: basicProps$1,
2234
- emits: ["cancel"],
2235
- setup(props, {
2236
- slots,
2237
- emit
2238
- }) {
2239
- const {
2240
- visible,
2241
- draggable,
2242
- destroyOnClose
2243
- } = toRefs(props);
2244
- const attrs = useAttrs();
2245
- useDragMove({
2246
- visible,
2247
- destroyOnClose,
2248
- draggable
2249
- });
2250
- const {
2251
- extendSlots
2252
- } = useSlots();
2253
- const onCancel = (e) => emit("cancel", e);
2254
- return () => {
2255
- let _slot;
2256
- const propsData = {
2257
- ...unref(attrs),
2258
- ...props,
2259
- destroyOnClose: true,
2260
- onCancel
2261
- };
2262
- if (!propsData?.visible)
2263
- return null;
2264
- return createVNode(Modal, propsData, _isSlot(_slot = extendSlots(slots)) ? _slot : {
2265
- default: () => [_slot]
2266
- });
2267
- };
2268
- }
2269
- };
2270
- const _sfc_main$7 = /* @__PURE__ */ defineComponent({
2271
- __name: "CloseIcon",
2272
- props: {
2273
- canFullscreen: { type: Boolean, default: true },
2274
- fullScreen: { type: Boolean }
2275
- },
2276
- emits: ["cancel", "fullscreen"],
2277
- setup(__props, { emit }) {
2278
- const props = __props;
2279
- const { t } = useI18n("UI");
2280
- const getClass = computed(() => {
2281
- return [
2282
- "dt-basic-modal-close",
2283
- `dt-basic-modal-close--custom`,
2284
- {
2285
- [`dt-basic-modal-close--can-full`]: props.canFullscreen
2286
- }
2287
- ];
2288
- });
2289
- function handleCancel(e) {
2290
- emit("cancel", e);
2291
- }
2292
- function handleFullScreen(e) {
2293
- e?.stopPropagation();
2294
- e?.preventDefault();
2295
- emit("fullscreen");
2296
- }
2297
- return (_ctx, _cache) => {
2298
- const _component_ATooltip = Tooltip$1;
2299
- return openBlock(), createElementBlock("div", {
2300
- class: normalizeClass(["flex h-14 items-center justify-center", unref(getClass)])
2301
- }, [
2302
- __props.canFullscreen ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
2303
- __props.fullScreen ? (openBlock(), createBlock(_component_ATooltip, {
2304
- key: 0,
2305
- title: unref(t)("EXIT_FULLSCREEN"),
2306
- placement: "bottom"
2307
- }, {
2308
- default: withCtx(() => [
2309
- createElementVNode("i", {
2310
- class: "i ic:baseline-fullscreen-exit hover:font-bold inline-block w-10 h-14 pr-4",
2311
- onClick: handleFullScreen
2312
- })
2313
- ]),
2314
- _: 1
2315
- }, 8, ["title"])) : (openBlock(), createBlock(_component_ATooltip, {
2316
- key: 1,
2317
- title: unref(t)("FULLSCREEN"),
2318
- placement: "bottom"
2319
- }, {
2320
- default: withCtx(() => [
2321
- createElementVNode("i", {
2322
- class: "i ic:baseline-fullscreen hover:font-bold inline-block h-14 w-10 pr-4",
2323
- onClick: handleFullScreen
2324
- })
2325
- ]),
2326
- _: 1
2327
- }, 8, ["title"]))
2328
- ], 64)) : createCommentVNode("", true),
2329
- createElementVNode("i", {
2330
- class: "i mdi:close h-14 w-10 pr-4",
2331
- onClick: handleCancel
2332
- })
2333
- ], 2);
2334
- };
2335
- }
2336
- });
2337
- const isServer = typeof window === "undefined";
2338
- const BAR_MAP = {
2339
- vertical: {
2340
- offset: "offsetHeight",
2341
- scroll: "scrollTop",
2342
- scrollSize: "scrollHeight",
2343
- size: "height",
2344
- key: "vertical",
2345
- axis: "Y",
2346
- client: "clientY",
2347
- direction: "top"
2348
- },
2349
- horizontal: {
2350
- offset: "offsetWidth",
2351
- scroll: "scrollLeft",
2352
- scrollSize: "scrollWidth",
2353
- size: "width",
2354
- key: "horizontal",
2355
- axis: "X",
2356
- client: "clientX",
2357
- direction: "left"
2358
- }
2359
- };
2360
- function renderThumbStyle({ move, size, bar }) {
2361
- const style = {};
2362
- const translate = `translate${bar.axis}(${move}%)`;
2363
- style[bar.size] = size;
2364
- style.transform = translate;
2365
- style.msTransform = translate;
2366
- style.webkitTransform = translate;
2367
- return style;
2368
- }
2369
- function resizeHandler(entries) {
2370
- for (const entry of entries) {
2371
- const listeners = entry.target.__resizeListeners__ || [];
2372
- if (listeners.length) {
2373
- listeners.forEach((fn) => {
2374
- fn();
2375
- });
2376
- }
2377
- }
2378
- }
2379
- function addResizeListener(element, fn) {
2380
- if (isServer)
2381
- return;
2382
- if (!element.__resizeListeners__) {
2383
- element.__resizeListeners__ = [];
2384
- element.__ro__ = new ResizeObserver(resizeHandler);
2385
- element.__ro__.observe(element);
2386
- }
2387
- element.__resizeListeners__.push(fn);
2388
- }
2389
- function removeResizeListener(element, fn) {
2390
- if (!element || !element.__resizeListeners__)
2391
- return;
2392
- element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);
2393
- if (!element.__resizeListeners__.length) {
2394
- element.__ro__.disconnect();
2395
- }
2396
- }
2397
- const Bar = defineComponent({
2398
- name: "Bar",
2399
- props: {
2400
- vertical: Boolean,
2401
- size: String,
2402
- move: Number
2403
- },
2404
- setup(props) {
2405
- const instance = getCurrentInstance();
2406
- const thumb = ref();
2407
- const wrap = inject("scroll-bar-wrap", {});
2408
- const bar = computed(() => {
2409
- return BAR_MAP[props.vertical ? "vertical" : "horizontal"];
2410
- });
2411
- const barStore = ref({});
2412
- const cursorDown = ref();
2413
- const clickThumbHandler = (e) => {
2414
- if (e.ctrlKey || e.button === 2) {
2415
- return;
2416
- }
2417
- window.getSelection()?.removeAllRanges();
2418
- startDrag(e);
2419
- barStore.value[bar.value.axis] = e.currentTarget[bar.value.offset] - (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
2420
- };
2421
- const clickTrackHandler = (e) => {
2422
- const offset = Math.abs(
2423
- e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]
2424
- );
2425
- const thumbHalf = thumb.value[bar.value.offset] / 2;
2426
- const thumbPositionPercentage = (offset - thumbHalf) * 100 / instance?.vnode.el?.[bar.value.offset];
2427
- wrap.value[bar.value.scroll] = thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
2428
- };
2429
- const startDrag = (e) => {
2430
- e.stopImmediatePropagation();
2431
- cursorDown.value = true;
2432
- on(document, "mousemove", mouseMoveDocumentHandler);
2433
- on(document, "mouseup", mouseUpDocumentHandler);
2434
- document.onselectstart = () => false;
2435
- };
2436
- const mouseMoveDocumentHandler = (e) => {
2437
- if (cursorDown.value === false)
2438
- return;
2439
- const prevPage = barStore.value[bar.value.axis];
2440
- if (!prevPage)
2441
- return;
2442
- const offset = (instance?.vnode.el?.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1;
2443
- const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
2444
- const thumbPositionPercentage = (offset - thumbClickPosition) * 100 / instance?.vnode.el?.[bar.value.offset];
2445
- wrap.value[bar.value.scroll] = thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
2446
- };
2447
- function mouseUpDocumentHandler() {
2448
- cursorDown.value = false;
2449
- barStore.value[bar.value.axis] = 0;
2450
- off(document, "mousemove", mouseMoveDocumentHandler);
2451
- document.onselectstart = null;
2452
- }
2453
- onUnmounted(() => {
2454
- off(document, "mouseup", mouseUpDocumentHandler);
2455
- });
2456
- return () => h(
2457
- "div",
2458
- {
2459
- class: ["scrollbar__bar", "is-" + bar.value.key],
2460
- onMousedown: clickTrackHandler
2461
- },
2462
- h("div", {
2463
- ref: thumb,
2464
- class: "scrollbar__thumb",
2465
- onMousedown: clickThumbHandler,
2466
- style: renderThumbStyle({
2467
- size: props.size,
2468
- move: props.move,
2469
- bar: bar.value
2470
- })
2471
- })
2472
- );
2473
- }
2474
- });
2475
- const _hoisted_1 = { class: "scrollbar relative h-full overflow-hidden" };
2476
- const _sfc_main$6 = /* @__PURE__ */ defineComponent({
2477
- __name: "scroll-bar",
2478
- props: {
2479
- wrapClass: {
2480
- type: [String, Array],
2481
- default: ""
2482
- },
2483
- wrapStyle: Array,
2484
- viewClass: {
2485
- type: [String, Array],
2486
- default: ""
2487
- },
2488
- viewStyle: {
2489
- type: [String, Array],
2490
- default: ""
2491
- },
2492
- noresize: Boolean,
2493
- tag: {
2494
- type: String,
2495
- default: "div"
2496
- }
2497
- },
2498
- setup(__props) {
2499
- const props = __props;
2500
- const sizeWidth = ref("0");
2501
- const sizeHeight = ref("0");
2502
- const moveX = ref(0);
2503
- const moveY = ref(0);
2504
- const wrap = ref();
2505
- const resize = ref();
2506
- provide("scroll-bar-wrap", wrap);
2507
- const style = computed(() => {
2508
- let rsStyle = {};
2509
- if (Array.isArray(props.wrapStyle)) {
2510
- props.wrapStyle.forEach((it) => {
2511
- if (it)
2512
- rsStyle = Object.assign({}, rsStyle, it);
2513
- });
2514
- }
2515
- return rsStyle;
2516
- });
2517
- const handleScroll = () => {
2518
- moveY.value = unref(wrap).scrollTop * 100 / unref(wrap).clientHeight;
2519
- moveX.value = unref(wrap).scrollLeft * 100 / unref(wrap).clientWidth;
2520
- };
2521
- const update = () => {
2522
- if (!unref(wrap))
2523
- return;
2524
- const heightPercentage = unref(wrap).clientHeight * 100 / unref(wrap).scrollHeight;
2525
- const widthPercentage = unref(wrap).clientWidth * 100 / unref(wrap).scrollWidth;
2526
- sizeHeight.value = heightPercentage < 100 ? heightPercentage + "%" : "";
2527
- sizeWidth.value = widthPercentage < 100 ? widthPercentage + "%" : "";
2528
- };
2529
- onMounted(() => {
2530
- nextTick(update);
2531
- if (!props.noresize) {
2532
- addResizeListener(unref(resize), update);
2533
- addResizeListener(unref(wrap), update);
2534
- addEventListener("resize", update);
2535
- }
2536
- });
2537
- onBeforeUnmount(() => {
2538
- if (!props.noresize) {
2539
- removeResizeListener(unref(resize), update);
2540
- removeResizeListener(unref(wrap), update);
2541
- removeEventListener("resize", update);
2542
- }
2543
- });
2544
- return (_ctx, _cache) => {
2545
- return openBlock(), createElementBlock("div", _hoisted_1, [
2546
- createElementVNode("div", {
2547
- ref_key: "wrap",
2548
- ref: wrap,
2549
- class: normalizeClass([[__props.wrapClass, "scrollbar__wrap--hidden-default"], "h-full overflow-auto"]),
2550
- style: normalizeStyle(unref(style)),
2551
- onScroll: handleScroll
2552
- }, [
2553
- (openBlock(), createBlock(resolveDynamicComponent(__props.tag), {
2554
- class: normalizeClass(["box-border", __props.viewClass]),
2555
- ref_key: "resize",
2556
- ref: resize,
2557
- style: normalizeStyle(__props.viewStyle)
2558
- }, {
2559
- default: withCtx(() => [
2560
- renderSlot(_ctx.$slots, "default")
2561
- ]),
2562
- _: 3
2563
- }, 8, ["class", "style"]))
2564
- ], 38),
2565
- createVNode(unref(Bar), {
2566
- move: moveX.value,
2567
- size: sizeWidth.value
2568
- }, null, 8, ["move", "size"]),
2569
- createVNode(unref(Bar), {
2570
- vertical: "",
2571
- move: moveY.value,
2572
- size: sizeHeight.value
2573
- }, null, 8, ["move", "size"])
2574
- ]);
2575
- };
2576
- }
2577
- });
2578
- const _sfc_main$5 = /* @__PURE__ */ defineComponent({
2579
- __name: "scroll-container",
2580
- setup(__props) {
2581
- const scrollbarRef = ref(null);
2582
- return (_ctx, _cache) => {
2583
- return openBlock(), createBlock(_sfc_main$6, mergeProps({
2584
- ref_key: "scrollbarRef",
2585
- ref: scrollbarRef
2586
- }, _ctx.$attrs, { class: "w-full h-full" }), {
2587
- default: withCtx(() => [
2588
- renderSlot(_ctx.$slots, "default")
2589
- ]),
2590
- _: 3
2591
- }, 16);
2592
- };
2593
- }
2594
- });
2595
- const _sfc_main$4 = /* @__PURE__ */ defineComponent({
2596
- __name: "slot-container",
2597
- props: {
2598
- template: {
2599
- type: Function
2600
- },
2601
- data: {
2602
- type: Object
2603
- }
2604
- },
2605
- setup(__props) {
2606
- const props = __props;
2607
- const Container = h("div", [props.template(props.data)]);
2608
- return (_ctx, _cache) => {
2609
- return openBlock(), createBlock(unref(Container));
2610
- };
2611
- }
2612
- });
2613
- const DtScrollContainer = withInstall(_sfc_main$5);
2614
- withInstall(_sfc_main$4);
2615
- const _sfc_main$3 = /* @__PURE__ */ defineComponent({
2616
- __name: "ModalWrap",
2617
- props: {
2618
- useWrapper: { type: Boolean, default: true },
2619
- modalHeaderHeight: { type: Number, default: 55 },
2620
- modalFooterHeight: { type: Number, default: 58 },
2621
- minHeight: { type: Number, default: 200 },
2622
- height: { type: Number },
2623
- visible: { type: Boolean },
2624
- fullScreen: { type: Boolean }
2625
- },
2626
- emits: ["ext-height", "height-change"],
2627
- setup(__props, { emit: emits }) {
2628
- const props = __props;
2629
- const wrapperRef = ref(null);
2630
- const wrapRef = ref(null);
2631
- const realHeightRef = ref(0);
2632
- const minRealHeightRef = ref(0);
2633
- let realHeight = 0;
2634
- const wrapStyle = computed(() => {
2635
- return {
2636
- minHeight: `${props.minHeight}px`,
2637
- [props.fullScreen ? "height" : "maxHeight"]: `${unref(realHeightRef)}px`
2638
- };
2639
- });
2640
- onMounted(() => {
2641
- const { modalHeaderHeight, modalFooterHeight } = props;
2642
- emits("ext-height", modalHeaderHeight + modalFooterHeight);
2643
- });
2644
- async function getModalDom() {
2645
- const wrapperRefDom = unref(wrapperRef);
2646
- if (!wrapperRefDom)
2647
- return;
2648
- const bodyDom = wrapperRefDom.$el.parentElement.parentElement.parentElement;
2649
- if (!bodyDom)
2650
- return;
2651
- bodyDom.style.padding = props.useWrapper ? "24px" : "0";
2652
- await nextTick();
2653
- const modalDom = bodyDom.parentElement && bodyDom.parentElement.parentElement;
2654
- return modalDom;
2655
- }
2656
- async function setModalHeight() {
2657
- if (!props.visible)
2658
- return;
2659
- try {
2660
- const modalDom = await getModalDom();
2661
- if (!modalDom)
2662
- return;
2663
- const modalRect = getComputedStyle(modalDom).top;
2664
- const modalTop = Number.parseInt(modalRect);
2665
- let maxHeight = window.innerHeight - props.modalFooterHeight - props.modalHeaderHeight - 100;
2666
- if (modalTop < 40) {
2667
- maxHeight -= 26;
2668
- }
2669
- await nextTick();
2670
- const warpEl = unref(wrapRef);
2671
- if (!warpEl)
2672
- return;
2673
- await nextTick();
2674
- realHeight = warpEl.scrollHeight;
2675
- if (props.fullScreen) {
2676
- realHeightRef.value = window.innerHeight - props.modalFooterHeight - props.modalHeaderHeight;
2677
- } else {
2678
- realHeightRef.value = props.height ? props.height : realHeight > maxHeight ? maxHeight : realHeight;
2679
- }
2680
- emits("height-change", unref(realHeightRef));
2681
- const _modalDom = await getModalDom();
2682
- _modalDom.style.top = (window.innerHeight - _modalDom.offsetHeight) / 2 + "px";
2683
- } catch (error2) {
2684
- console.log(error2);
2685
- }
2686
- }
2687
- windowResizeFn(setModalHeight.bind(null, false));
2688
- watchEffect(() => {
2689
- props.useWrapper && setModalHeight();
2690
- });
2691
- watch(
2692
- () => props.fullScreen,
2693
- (v) => {
2694
- setModalHeight();
2695
- if (!v) {
2696
- realHeightRef.value = minRealHeightRef.value;
2697
- } else {
2698
- minRealHeightRef.value = realHeightRef.value;
2699
- }
2700
- }
2701
- );
2702
- return (_ctx, _cache) => {
2703
- return openBlock(), createBlock(unref(DtScrollContainer), {
2704
- ref_key: "wrapperRef",
2705
- ref: wrapperRef
2706
- }, {
2707
- default: withCtx(() => [
2708
- createElementVNode("div", {
2709
- ref_key: "wrapRef",
2710
- ref: wrapRef,
2711
- style: normalizeStyle(unref(wrapStyle))
2712
- }, [
2713
- renderSlot(_ctx.$slots, "default")
2714
- ], 4)
2715
- ]),
2716
- _: 3
2717
- }, 512);
2718
- };
2719
- }
2720
- });
2721
- const _sfc_main$2 = /* @__PURE__ */ defineComponent({
2722
- __name: "ModalFooter",
2723
- props: {
2724
- buttons: Object,
2725
- showSave: { type: Boolean, default: true },
2726
- showCancel: { type: Boolean, default: true },
2727
- okText: { type: String },
2728
- cancelText: { type: String }
2729
- },
2730
- emits: [
2731
- "handleSave",
2732
- "handleCancel"
2733
- ],
2734
- setup(__props, { emit: emits }) {
2735
- const props = __props;
2736
- const { t } = useI18n("UI");
2737
- const buttonList = computed(() => {
2738
- if (props.buttons && props.buttons.length)
2739
- return props.buttons;
2740
- let buttonActions = [
2741
- { t: "\u5173\u95ED", label: props.cancelText || t("CLOSE"), preIcon: "mdi:close", flag: "CANCEL" },
2742
- { t: "\u4FDD\u5B58", label: props.okText || t("SAVE"), preIcon: "mdi:content-save", type: "primary", flag: "OK" }
2743
- ];
2744
- if (!props.showSave)
2745
- buttonActions = buttonActions.filter((btn) => btn.flag !== "OK");
2746
- if (!props.showCancel)
2747
- buttonActions = buttonActions.filter((btn) => btn.flag !== "CANCEL");
2748
- return buttonActions;
2749
- });
2750
- function handleMethod(item) {
2751
- switch (item.flag) {
2752
- case "OK":
2753
- emits("handleSave");
2754
- break;
2755
- case "CANCEL":
2756
- emits("handleCancel");
2757
- break;
2758
- }
2759
- }
2760
- return (_ctx, _cache) => {
2761
- return openBlock(), createElementBlock(Fragment, null, [
2762
- renderSlot(_ctx.$slots, "appendFooter"),
2763
- createVNode(_sfc_main$a, {
2764
- mode: "dialog",
2765
- buttonList: unref(buttonList),
2766
- onHandleMethod: _cache[0] || (_cache[0] = ($event) => handleMethod($event))
2767
- }, null, 8, ["buttonList"])
2768
- ], 64);
2769
- };
2770
- }
2771
- });
2772
- function useFullScreen(wrapClassName) {
2773
- const fullScreenRef = ref(false);
2774
- const getWrapClassName = computed(() => {
2775
- const clsName = unref(wrapClassName) || "";
2776
- const cls = unref(fullScreenRef) ? `fullscreen-modal ${clsName} ` : unref(clsName);
2777
- return `dt-modal ${cls}`;
2778
- });
2779
- function toggleFullScreen(e) {
2780
- e && e.stopPropagation();
2781
- fullScreenRef.value = !unref(fullScreenRef);
2782
- dispatchResize();
2783
- }
2784
- return {
2785
- fullScreenRef,
2786
- getWrapClassName,
2787
- toggleFullScreen
2788
- };
2789
- }
2790
- const _sfc_main$1 = /* @__PURE__ */ defineComponent({
2791
- __name: "index",
2792
- props: basicProps$1,
2793
- emits: ["visible-change", "height-change", "cancel", "save", "register", "update:visible"],
2794
- setup(__props, { emit: emits }) {
2795
- const props = __props;
2796
- const visibleRef = ref(false);
2797
- const propsRef = ref();
2798
- const modalWrapperRef = ref(null);
2799
- const { getWrapClassName, toggleFullScreen, fullScreenRef } = useFullScreen(computed(() => unref(propsRef)?.wrapClassName));
2800
- const getMergeProps = computed(() => {
2801
- return {
2802
- ...props,
2803
- ...unref(propsRef)
2804
- };
2805
- });
2806
- const getBindValue = computed(() => {
2807
- const bindValue = {
2808
- ...unref(getMergeProps),
2809
- ...unref(propsRef),
2810
- visible: unref(visibleRef),
2811
- wrapClassName: unref(getWrapClassName)
2812
- };
2813
- let omitArr = unref(fullScreenRef) ? ["height", "title"] : ["title"];
2814
- if (isArray(unref(propsRef)?.footer)) {
2815
- omitArr.push("footer");
2816
- }
2817
- return omit(bindValue, omitArr);
2818
- });
2819
- const getWrapperHeight = computed(() => {
2820
- if (unref(fullScreenRef))
2821
- return void 0;
2822
- return unref(getBindValue).height;
2823
- });
2824
- const modalFooterHeight = computed(() => {
2825
- if (isArray(props.footer)) {
2826
- return (unref(propsRef)?.footer).length ? 0 : void 0;
2827
- }
2828
- return props?.footer !== void 0 && !props.footer ? 0 : void 0;
2829
- });
2830
- const modalMethods = {
2831
- setModalProps,
2832
- redoModalHeight: () => {
2833
- nextTick(() => {
2834
- if (unref(modalWrapperRef)) {
2835
- unref(modalWrapperRef).setModalHeight();
2836
- }
2837
- });
2838
- }
2839
- };
2840
- const instance = getCurrentInstance();
2841
- if (instance) {
2842
- emits("register", modalMethods, instance.uid);
2843
- }
2844
- function handleHeightChange(height) {
2845
- emits("height-change", height);
2846
- }
2847
- function setModalProps(props2) {
2848
- propsRef.value = deepMerge(unref(propsRef) || {}, props2);
2849
- if (Reflect.has(props2, "visible")) {
2850
- visibleRef.value = !!props2.visible;
2851
- }
2852
- if (Reflect.has(props2, "defaultFullscreen")) {
2853
- fullScreenRef.value = !!props2.defaultFullscreen;
2854
- }
2855
- }
2856
- function handleSave() {
2857
- emits("save");
2858
- }
2859
- async function handleCancel(e = null) {
2860
- if (e) {
2861
- e?.stopPropagation();
2862
- if (e.target?.classList?.contains("dt-basic-modal-close--custom"))
2863
- return;
2864
- if (props.closeFunc && isFunction(props.closeFunc)) {
2865
- const isClose = await props.closeFunc();
2866
- visibleRef.value = !isClose;
2867
- return;
2868
- }
2869
- }
2870
- const { afterClose } = unref(getBindValue);
2871
- if (afterClose && isFunction(afterClose)) {
2872
- afterClose();
2873
- }
2874
- visibleRef.value = false;
2875
- emits("cancel", e);
2876
- }
2877
- watch(() => unref(visibleRef), (v) => {
2878
- emits("visible-change", v);
2879
- emits("update:visible", v);
2880
- nextTick(() => {
2881
- if (props.scrollTop && v && unref(modalWrapperRef)) {
2882
- unref(modalWrapperRef).$el.scrollTop = 0;
2883
- }
2884
- });
2885
- }, {
2886
- immediate: false
2887
- });
2888
- return (_ctx, _cache) => {
2889
- const _component_ASpin = Spin;
2890
- return openBlock(), createBlock(_sfc_main$8, mergeProps(unref(getBindValue), { onCancel: handleCancel }), createSlots({
2891
- default: withCtx(() => [
2892
- createVNode(_component_ASpin, {
2893
- spinning: unref(getBindValue).loading,
2894
- tip: unref(getBindValue).loadingTip
2895
- }, {
2896
- default: withCtx(() => [
2897
- createVNode(_sfc_main$3, mergeProps({
2898
- useWrapper: unref(getBindValue).useWrapper,
2899
- fullScreen: unref(fullScreenRef),
2900
- ref_key: "modalWrapperRef",
2901
- ref: modalWrapperRef,
2902
- minHeight: unref(getBindValue).minHeight,
2903
- height: unref(getWrapperHeight),
2904
- visible: visibleRef.value,
2905
- modalFooterHeight: unref(modalFooterHeight)
2906
- }, unref(omit)(unref(getBindValue).wrapperProps, "visible", "height", "modalFooterHeight"), { onHeightChange: handleHeightChange }), {
2907
- default: withCtx(() => [
2908
- renderSlot(_ctx.$slots, "default")
2909
- ]),
2910
- _: 3
2911
- }, 16, ["useWrapper", "fullScreen", "minHeight", "height", "visible", "modalFooterHeight"])
2912
- ]),
2913
- _: 3
2914
- }, 8, ["spinning", "tip"])
2915
- ]),
2916
- _: 2
2917
- }, [
2918
- !_ctx.$slots.closeIcon ? {
2919
- name: "closeIcon",
2920
- fn: withCtx(() => [
2921
- createVNode(_sfc_main$7, {
2922
- canFullscreen: unref(getBindValue).canFullscreen,
2923
- fullScreen: unref(fullScreenRef),
2924
- onCancel: handleCancel,
2925
- onFullscreen: unref(toggleFullScreen)
2926
- }, null, 8, ["canFullscreen", "fullScreen", "onFullscreen"])
2927
- ]),
2928
- key: "0"
2929
- } : void 0,
2930
- !_ctx.$slots.title ? {
2931
- name: "title",
2932
- fn: withCtx(() => [
2933
- createTextVNode(toDisplayString(unref(getMergeProps).title), 1)
2934
- ]),
2935
- key: "1"
2936
- } : void 0,
2937
- !_ctx.$slots.footer ? {
2938
- name: "footer",
2939
- fn: withCtx(() => [
2940
- createVNode(_sfc_main$2, {
2941
- buttons: propsRef.value?.footer,
2942
- showSave: unref(getBindValue).showOkBtn,
2943
- showCancel: unref(getBindValue).showCancelBtn,
2944
- okText: unref(getBindValue).okText,
2945
- cancelText: unref(getBindValue).cancelText,
2946
- onHandleSave: handleSave,
2947
- onHandleCancel: handleCancel
2948
- }, createSlots({ _: 2 }, [
2949
- renderList(Object.keys(_ctx.$slots), (item) => {
2950
- return {
2951
- name: item,
2952
- fn: withCtx((data) => [
2953
- renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))
2954
- ])
2955
- };
2956
- })
2957
- ]), 1032, ["buttons", "showSave", "showCancel", "okText", "cancelText"])
2958
- ]),
2959
- key: "2"
2960
- } : void 0,
2961
- renderList(Object.keys(unref(omit)(_ctx.$slots, "default")), (item) => {
2962
- return {
2963
- name: item,
2964
- fn: withCtx((data) => [
2965
- renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))
2966
- ])
2967
- };
2968
- })
2969
- ]), 1040);
2970
- };
2971
- }
2972
- });
1
+ import { defineComponent, toRaw, openBlock, createBlock, unref, withCtx, renderSlot, ref, h, createVNode, mergeProps, nextTick } from "vue";
2
+ import { useForm, DtForm } from "../form";
3
+ import { useModal, DtModal, useModalOut } from "../modal";
4
+ import { omit } from "lodash-es";
5
+ import { useMessage, useI18n, isFunction, dispatchResize, error } from "@dt-frames/core";
2973
6
  const basicProps = {
2974
7
  title: {
2975
8
  type: Object
@@ -3042,7 +75,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
3042
75
  props?.onSave();
3043
76
  }
3044
77
  return (_ctx, _cache) => {
3045
- return openBlock(), createBlock(unref(_sfc_main$1), {
78
+ return openBlock(), createBlock(unref(DtModal), {
3046
79
  onRegister: unref(registerDialog),
3047
80
  onSave: _cache[0] || (_cache[0] = ($event) => handleSave())
3048
81
  }, {