@vue-ui-kit/ant 2.0.8 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +5 -4
- package/dist/declarations/antProxy.d.ts +2 -0
- package/dist/es/index.js +4811 -4031
- package/dist/packages/components/PCanvasTable.vue.d.ts +46 -12
- package/dist/style.css +1 -1
- package/dist/style.scss +22 -0
- package/package.json +2 -2
- package/src/declarations/antProxy.ts +3 -1
- package/src/packages/components/CollapseCard.vue +26 -54
- package/src/packages/components/PCanvasGrid.vue +1 -1
- package/src/packages/components/PFormGroup.vue +8 -2
- package/src/packages/store/renderStore.tsx +31 -14
- package/src/packages/styles/index.scss +21 -0
- package/src/packages/styles/variables.scss +1 -0
|
@@ -43,6 +43,7 @@ declare const _default: <T extends Recordable = Recordable, B extends Recordable
|
|
|
43
43
|
render: import('e-virt-table').Render;
|
|
44
44
|
renderFooter: import('e-virt-table').Render;
|
|
45
45
|
style: any;
|
|
46
|
+
domDataset: any;
|
|
46
47
|
rules: import('e-virt-table/dist/lib/Validator').Rules | import('e-virt-table/dist/lib/Validator').Rule;
|
|
47
48
|
message: string;
|
|
48
49
|
text: string;
|
|
@@ -57,12 +58,28 @@ declare const _default: <T extends Recordable = Recordable, B extends Recordable
|
|
|
57
58
|
drawTextColor: string;
|
|
58
59
|
drawTextX: number;
|
|
59
60
|
drawTextY: number;
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
61
|
+
drawTextWidth: number;
|
|
62
|
+
drawTextHeight: number;
|
|
63
|
+
drawTreeImageX: number;
|
|
64
|
+
drawTreeImageY: number;
|
|
65
|
+
drawTreeImageWidth: number;
|
|
66
|
+
drawTreeImageHeight: number;
|
|
67
|
+
drawTreeImageName: string;
|
|
68
|
+
drawTreeImageSource?: HTMLImageElement;
|
|
69
|
+
drawSelectionImageX: number;
|
|
70
|
+
drawSelectionImageY: number;
|
|
71
|
+
drawSelectionImageWidth: number;
|
|
72
|
+
drawSelectionImageHeight: number;
|
|
73
|
+
drawSelectionImageName: string;
|
|
74
|
+
drawSelectionImageSource?: HTMLImageElement;
|
|
75
|
+
drawHoverImageX: number;
|
|
76
|
+
drawHoverImageY: number;
|
|
77
|
+
drawHoverImageWidth: number;
|
|
78
|
+
drawHoverImageHeight: number;
|
|
79
|
+
drawHoverImageName: string;
|
|
80
|
+
drawHoverImageSource?: HTMLImageElement;
|
|
81
|
+
autoRowHeight: boolean;
|
|
82
|
+
calculatedHeight: number;
|
|
66
83
|
ellipsis: boolean;
|
|
67
84
|
rowExpand: boolean;
|
|
68
85
|
rowHasChildren: boolean;
|
|
@@ -70,6 +87,7 @@ declare const _default: <T extends Recordable = Recordable, B extends Recordable
|
|
|
70
87
|
selectorCellValueType: import('e-virt-table').SelectorCellValueType;
|
|
71
88
|
overflowTooltipMaxWidth: number;
|
|
72
89
|
overflowTooltipPlacement: import('e-virt-table').OverflowTooltipPlacement;
|
|
90
|
+
maxLineClamp: import('e-virt-table').LineClampType;
|
|
73
91
|
ctx: import('e-virt-table/dist/lib/Context').default;
|
|
74
92
|
x: number;
|
|
75
93
|
y: number;
|
|
@@ -78,6 +96,7 @@ declare const _default: <T extends Recordable = Recordable, B extends Recordable
|
|
|
78
96
|
} | {
|
|
79
97
|
cell: Cell | import('e-virt-table/dist/lib/CellHeader').default;
|
|
80
98
|
align: import('e-virt-table').Align;
|
|
99
|
+
hideHeaderSelection: boolean;
|
|
81
100
|
verticalAlign: import('e-virt-table').VerticalAlign;
|
|
82
101
|
fixed?: import('e-virt-table').Fixed;
|
|
83
102
|
minWidth?: number;
|
|
@@ -107,16 +126,31 @@ declare const _default: <T extends Recordable = Recordable, B extends Recordable
|
|
|
107
126
|
style: Partial<CSSStyleDeclaration>;
|
|
108
127
|
drawX: number;
|
|
109
128
|
drawY: number;
|
|
129
|
+
sortIconName: string;
|
|
130
|
+
sortAscIconName: string;
|
|
131
|
+
sortDescIconName: string;
|
|
110
132
|
visibleWidth: number;
|
|
111
133
|
visibleHeight: number;
|
|
134
|
+
maxLineClampHeader: import('e-virt-table').LineClampType;
|
|
135
|
+
domDataset: any;
|
|
136
|
+
drawTextX: number;
|
|
137
|
+
drawTextY: number;
|
|
138
|
+
drawTextWidth: number;
|
|
139
|
+
drawTextHeight: number;
|
|
112
140
|
drawCellBgColor: string;
|
|
113
141
|
drawTextColor: string;
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
142
|
+
drawSelectionImageX: number;
|
|
143
|
+
drawSelectionImageY: number;
|
|
144
|
+
drawSelectionImageWidth: number;
|
|
145
|
+
drawSelectionImageHeight: number;
|
|
146
|
+
drawSelectionImageName: string;
|
|
147
|
+
drawSelectionImageSource?: HTMLImageElement;
|
|
148
|
+
drawSortImageX: number;
|
|
149
|
+
drawSortImageY: number;
|
|
150
|
+
drawSortImageWidth: number;
|
|
151
|
+
drawSortImageHeight: number;
|
|
152
|
+
drawSortImageName: string;
|
|
153
|
+
drawSortImageSource?: HTMLImageElement;
|
|
120
154
|
ctx: import('e-virt-table/dist/lib/Context').default;
|
|
121
155
|
x: number;
|
|
122
156
|
y: number;
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8"
|
|
1
|
+
@charset "UTF-8";:root{--p-theme-bg: #fff;--collapsible-card-body-padding: 12px}.p-pane{background-color:var(--p-theme-bg);padding:16px;border-radius:4px}.text-slate-5{color:#64748b}.w-full{width:100%}.cursor-pointer{cursor:pointer}.py-4x{padding-top:4px;padding-bottom:4px}.px-2x{padding-left:2px;padding-right:2px}.pl-4x{padding-left:1em}.pl-8{padding-left:2em}.h-0{height:0}.h-full{height:100%}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-4px{gap:4px}.gap-8px{gap:8px}.pt-8px{padding-top:8px}.px-16px{padding-left:16px;padding-right:16px}.mt-4px{margin-top:4px}.text-right{text-align:right}.overflow-y-auto{overflow-y:auto}.p-theme-bg{background-color:var(--p-theme-bg)}.p-wrapper .p-form-wrapper{z-index:4}.p-wrapper .p-canvas-pagination.ant-pagination{padding:16px 0}.p-wrapper .p-error-hang-out .ant-input-affix-wrapper-status-error:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper{border-color:#d9d9d9!important}.p-wrapper .p-error-hang-out .ant-input-affix-wrapper-status-error:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper:focus{border-color:#4096ff!important}.p-wrapper .p-error-hang-out .ant-form-item-explain-error{opacity:0!important;transform:translateY(-10px)!important;max-height:0!important;overflow:hidden!important;transition:none!important}.p-wrapper .ant-form-item-explain-error{opacity:0;transform:translateY(-10px);max-height:0;overflow:hidden;transition:opacity .3s ease-out .3s,transform .3s ease-out .3s,max-height .3s ease-out .3s}.p-wrapper .ant-form-item-has-error .ant-form-item-explain-error{opacity:1;transform:translateY(0);max-height:100px}.p-wrapper .p-toolbar-wrapper{box-shadow:0 8px #fff;border-radius:.5em .5em 0 0;margin-bottom:-.5em}.p-wrapper .p-canvas-toolbar-wrapper{box-shadow:0 8px #fff;border-radius:.5em .5em 0 0}.p-wrapper .ant-form .ant-form-item{margin-bottom:0}.p-wrapper .ant-form .ant-form-item.p-required .ant-form-item-label>label:before{display:inline-block;margin-inline-end:4px;color:#ff4d4f;font-size:14px;font-family:SimSun,sans-serif;line-height:1;content:"*"}.p-wrapper .ant-form .ant-form-item .ant-form-item-label{display:flex;align-items:start;justify-content:flex-end}.p-wrapper .ant-form .ant-form-item .ant-form-item-label>label{white-space:break-spaces;align-items:flex-start;height:fit-content;padding-top:.36em}.p-wrapper .ant-form .ant-form-item .ant-form-item-label>label:after{padding-left:4px;margin-inline-start:unset}.p-wrapper .ant-form.ant-form-vertical .ant-form-item .ant-form-item-label{justify-content:flex-start;font-weight:600}.p-wrapper .ant-table-sticky-scroll{visibility:hidden}.p-wrapper .ant-table-header.ant-table-sticky-holder:before{content:"";width:100%;position:absolute;height:22px;display:block;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);top:-16px}.p-wrapper .ant-table-wrapper .ant-table-pagination.ant-pagination{margin:unset;padding:16px 0}.p-wrapper .h-lack .ant-table-wrapper .ant-table-pagination.ant-pagination{padding:unset;margin-top:8px}.p-wrapper .p-inner-scroll>.ant-table-wrapper{height:100%}.p-wrapper .p-inner-scroll>.ant-table-wrapper>.ant-spin-nested-loading{height:100%}.p-wrapper .p-inner-scroll>.ant-table-wrapper>.ant-spin-nested-loading>.ant-spin-container{height:100%;display:flex;flex-direction:column}.p-wrapper .p-inner-scroll>.ant-table-wrapper>.ant-spin-nested-loading>.ant-spin-container>.ant-table{flex:1;height:0;overflow-y:hidden;border-radius:unset}.p-wrapper .p-inner-scroll>.ant-table-wrapper>.ant-spin-nested-loading>.ant-spin-container>.ant-table>.ant-table-container>.ant-table-body{position:relative}.p-wrapper .ant-pagination-options .ant-select{width:100px}.p-wrapper .ant-table-cell:not(.normal-break){word-break:break-all}.p-error-group-tab{position:relative;overflow:visible;color:#f5222d!important}.p-error-group-tab:after{content:"🏷️";position:absolute;top:-1em;right:0;width:1em;height:1em;font-size:.8em;animation:heartbeat 2s infinite}.ant-picker-dropdown .ant-picker-footer{padding-left:4px}.p-error-hang-out .ant-input-affix-wrapper-status-error:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper{border-color:#d9d9d9!important}.p-error-hang-out .ant-input-affix-wrapper-status-error:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper:focus{border-color:#4096ff!important}.p-error-hang-out .ant-form-item-explain-error{display:none}.no-error-border{border-color:#d9d9d9!important}.no-error-border:focus{border-color:#4096ff!important}@media (max-width: 575px){.p-wrapper .ant-form .ant-form-item .ant-form-item-label{justify-content:flex-start}}.collapsible-card{background-color:#fff;border-color:#f0f0f0}.collapsible-card .ant-collapse-header{padding:0 12px;min-height:38px;display:flex;align-items:center;font-weight:600}.collapsible-card .ant-collapse-content{border-color:#f0f0f0}.collapsible-card .ant-collapse-content .ant-collapse-content-box{padding:var(--collapsible-card-body-padding, 12px)}.collapsible-card .ant-collapse-item{border-color:#f0f0f0}.p-content-align-right.ant-form-item .ant-form-item-control-input-content{display:flex;justify-content:flex-end;align-items:center;text-align:right}.p-content-align-center.ant-form-item .ant-form-item-control-input-content{display:flex;justify-content:center;align-items:center;text-align:center}@keyframes heartbeat{0%{transform:scale(1)}6%{transform:scale(1.22)}12%{transform:scale(1)}18%{transform:scale(1.18)}24%{transform:scale(1)}48%{transform:scale(1)}54%{transform:scale(1.22)}60%{transform:scale(1)}66%{transform:scale(1.18)}72%{transform:scale(1)}to{transform:scale(1)}}
|
package/dist/style.scss
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
// Variables inlined for npm distribution
|
|
2
2
|
:root {
|
|
3
3
|
--p-theme-bg: #fff;
|
|
4
|
+
--collapsible-card-body-padding: 12px;
|
|
4
5
|
}
|
|
5
6
|
|
|
6
7
|
|
|
@@ -308,6 +309,27 @@
|
|
|
308
309
|
justify-content: flex-start;
|
|
309
310
|
}
|
|
310
311
|
}
|
|
312
|
+
|
|
313
|
+
.collapsible-card {
|
|
314
|
+
background-color: #fff;
|
|
315
|
+
border-color: #f0f0f0;
|
|
316
|
+
.ant-collapse-header {
|
|
317
|
+
padding: 0 12px;
|
|
318
|
+
min-height: 38px;
|
|
319
|
+
display: flex;
|
|
320
|
+
align-items: center;
|
|
321
|
+
font-weight: 600;
|
|
322
|
+
}
|
|
323
|
+
.ant-collapse-content {
|
|
324
|
+
border-color: #f0f0f0;
|
|
325
|
+
.ant-collapse-content-box {
|
|
326
|
+
padding: var(--collapsible-card-body-padding, 12px);
|
|
327
|
+
}
|
|
328
|
+
}
|
|
329
|
+
.ant-collapse-item {
|
|
330
|
+
border-color: #f0f0f0;
|
|
331
|
+
}
|
|
332
|
+
}
|
|
311
333
|
/* #endregion */
|
|
312
334
|
|
|
313
335
|
/* #region EVirtTable */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vue-ui-kit/ant",
|
|
3
|
-
"version": "2.0
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"description": "Vue3 UI Kit based on Ant Design",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/cjs/index.js",
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"email": "adoin@qq.com"
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
|
-
"e-virt-table": "^1.2.
|
|
49
|
+
"e-virt-table": "^1.2.33",
|
|
50
50
|
"uuid": "^10.0.0",
|
|
51
51
|
"xe-utils": "^3.7.6"
|
|
52
52
|
},
|
|
@@ -123,7 +123,7 @@ export interface PFormGroupProps<F extends Recordable = Recordable> {
|
|
|
123
123
|
/* 是否启用折叠 */
|
|
124
124
|
collapsible?: boolean;
|
|
125
125
|
/** 是否默认折叠 */
|
|
126
|
-
defaultCollapsed?: boolean
|
|
126
|
+
defaultCollapsed?: boolean;
|
|
127
127
|
lazyErrorMark?: boolean;
|
|
128
128
|
forceRender?: boolean;
|
|
129
129
|
/* 是否保持连续编号 */
|
|
@@ -403,6 +403,8 @@ export interface PFormGroupInstance {
|
|
|
403
403
|
validateAll: () => Promise<void>;
|
|
404
404
|
validate: (index: number, ignoreTabError?: boolean) => Promise<void>;
|
|
405
405
|
validateFields: (index: number, fields: string[], ignoreTabError?: boolean) => Promise<void>;
|
|
406
|
+
collapse: () => void;
|
|
407
|
+
expand: () => void;
|
|
406
408
|
}
|
|
407
409
|
export interface PCanvasTableInstance<T extends Recordable = Recordable> {
|
|
408
410
|
$table: InstanceType<typeof EVirtTable>;
|
|
@@ -1,39 +1,35 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
import { ref } from 'vue'
|
|
2
|
+
import { ref } from 'vue';
|
|
3
3
|
|
|
4
|
-
interface Props {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}
|
|
4
|
+
interface Props {
|
|
5
|
+
/** 是否默认折叠 */
|
|
6
|
+
defaultCollapsed?: boolean;
|
|
7
|
+
title?: string;
|
|
8
|
+
/** 是否可以折叠 */
|
|
9
|
+
collapsible?: boolean;
|
|
10
|
+
}
|
|
11
11
|
|
|
12
|
-
const props = withDefaults(defineProps<Props>(), {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
})
|
|
17
|
-
const slots = defineSlots<{
|
|
18
|
-
|
|
19
|
-
}>()
|
|
20
|
-
const activeKey = ref(props.defaultCollapsed ? [] : ['content'])
|
|
21
|
-
defineExpose({
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
})
|
|
12
|
+
const props = withDefaults(defineProps<Props>(), {
|
|
13
|
+
title: undefined,
|
|
14
|
+
defaultCollapsed: false,
|
|
15
|
+
collapsible: false,
|
|
16
|
+
});
|
|
17
|
+
const slots = defineSlots<{
|
|
18
|
+
title: () => any;
|
|
19
|
+
}>();
|
|
20
|
+
const activeKey = ref(props.defaultCollapsed ? [] : ['content']);
|
|
21
|
+
defineExpose({
|
|
22
|
+
collapse: () => {
|
|
23
|
+
activeKey.value = [];
|
|
24
|
+
},
|
|
25
|
+
expand: () => {
|
|
26
|
+
activeKey.value = ['content'];
|
|
27
|
+
},
|
|
28
|
+
});
|
|
29
29
|
</script>
|
|
30
30
|
|
|
31
31
|
<template>
|
|
32
|
-
<a-collapse
|
|
33
|
-
v-if="collapsible"
|
|
34
|
-
v-model:active-key="activeKey"
|
|
35
|
-
class="collapsible-card"
|
|
36
|
-
>
|
|
32
|
+
<a-collapse v-if="collapsible" v-model:active-key="activeKey" class="collapsible-card">
|
|
37
33
|
<a-collapse-panel key="content" force-render :header="title">
|
|
38
34
|
<template v-if="slots.title" #header>
|
|
39
35
|
<slot name="title" />
|
|
@@ -48,27 +44,3 @@ defineExpose({
|
|
|
48
44
|
<slot />
|
|
49
45
|
</a-card>
|
|
50
46
|
</template>
|
|
51
|
-
|
|
52
|
-
<style scoped lang="scss">
|
|
53
|
-
//样式改成card样式
|
|
54
|
-
.collapsible-card {
|
|
55
|
-
background-color: #fff;
|
|
56
|
-
border-color: #f0f0f0;
|
|
57
|
-
:deep(.ant-collapse-header) {
|
|
58
|
-
padding: 0 12px;
|
|
59
|
-
min-height: 38px;
|
|
60
|
-
display: flex;
|
|
61
|
-
align-items: center;
|
|
62
|
-
font-weight: 600;
|
|
63
|
-
}
|
|
64
|
-
:deep(.ant-collapse-content) {
|
|
65
|
-
border-color: #f0f0f0;
|
|
66
|
-
.ant-collapse-content-box {
|
|
67
|
-
padding: var(--collapsible-card-body-padding, 12px);
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
:deep(.ant-collapse-item) {
|
|
71
|
-
border-color: #f0f0f0;
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
</style>
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
import { valued } from '@/utils/is';
|
|
20
20
|
import { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
|
|
21
21
|
import { $warning } from '@/hooks/useMessage';
|
|
22
|
-
import CollapseCard from './CollapseCard.vue';
|
|
22
|
+
import CollapseCard from './CollapseCard.vue';
|
|
23
23
|
|
|
24
24
|
const useForm = Form.useForm;
|
|
25
25
|
const tabsRef = ref<InstanceType<typeof Tabs>>();
|
|
@@ -234,7 +234,13 @@ import CollapseCard from './CollapseCard.vue';
|
|
|
234
234
|
});
|
|
235
235
|
</script>
|
|
236
236
|
<template>
|
|
237
|
-
<collapse-card
|
|
237
|
+
<collapse-card
|
|
238
|
+
ref="rootRef"
|
|
239
|
+
:title="title"
|
|
240
|
+
size="small"
|
|
241
|
+
:collapsible="collapsible"
|
|
242
|
+
:default-collapsed="defaultCollapsed"
|
|
243
|
+
>
|
|
238
244
|
<a-spin v-if="loading" class="w-full" />
|
|
239
245
|
<a-tabs
|
|
240
246
|
v-else
|
|
@@ -26,7 +26,7 @@ import { ButtonProps } from 'ant-design-vue/lib/button';
|
|
|
26
26
|
import { isBadValue, isGoodValue, valued } from '@/utils/is';
|
|
27
27
|
import TableInput from '@/renders/TableInput.vue';
|
|
28
28
|
import Icon from '@/renders/Icon';
|
|
29
|
-
import { computed, Ref } from 'vue';
|
|
29
|
+
import { computed, ref, Ref } from 'vue';
|
|
30
30
|
|
|
31
31
|
interface BtnOptions extends ButtonProps {
|
|
32
32
|
content?: string;
|
|
@@ -210,12 +210,12 @@ const renderBasic = (name: string) => {
|
|
|
210
210
|
},
|
|
211
211
|
};
|
|
212
212
|
};
|
|
213
|
-
|
|
214
|
-
const renderBtn = (btnOpt: BtnOptions, params: RenderTableParams) =>
|
|
213
|
+
type GetPopupContainer = () => HTMLElement
|
|
214
|
+
const renderBtn = (btnOpt: BtnOptions, params: RenderTableParams, getPopupContainer?: GetPopupContainer,) =>
|
|
215
215
|
btnOpt.dropdowns &&
|
|
216
216
|
btnOpt.dropdowns.length > 0 &&
|
|
217
217
|
btnOpt.dropdowns.filter((f) => !f.hiddenIf?.(params)).length > 0 ? (
|
|
218
|
-
<Dropdown>
|
|
218
|
+
<Dropdown getPopupContainer={getPopupContainer ?? (() => document.querySelector('.p-wrapper') as HTMLElement)}>
|
|
219
219
|
{{
|
|
220
220
|
default: () => (
|
|
221
221
|
<Button
|
|
@@ -236,7 +236,7 @@ const renderBtn = (btnOpt: BtnOptions, params: RenderTableParams) =>
|
|
|
236
236
|
<div class={`dropdown-wrapper ${btnOpt?.dynamicClassName?.(params) ?? ''}`}>
|
|
237
237
|
{btnOpt
|
|
238
238
|
.dropdowns!.filter((f) => !f.hiddenIf?.(params))
|
|
239
|
-
.map((b) => renderBtn(b, params))}
|
|
239
|
+
.map((b) => renderBtn(b, params, getPopupContainer))}
|
|
240
240
|
</div>
|
|
241
241
|
),
|
|
242
242
|
}}
|
|
@@ -456,20 +456,28 @@ const renders: RenderFactory = {
|
|
|
456
456
|
},
|
|
457
457
|
ButtonTree: {
|
|
458
458
|
renderDefault({ children = [], props = {} as Recordable }, params: RenderTableParams) {
|
|
459
|
+
const spanRef = ref<HTMLElement | null>(null)
|
|
459
460
|
return (
|
|
460
|
-
<span class={props.noGap ? 'align-no-gap-box' : 'align-gap-box'}>
|
|
461
|
-
{
|
|
462
|
-
.filter(
|
|
463
|
-
|
|
461
|
+
<span ref={spanRef} class={props.noGap ? 'align-no-gap-box' : 'align-gap-box'}>
|
|
462
|
+
{
|
|
463
|
+
(children as BtnOptions[]).filter(f => !f.hiddenIf?.(params)).map(item =>
|
|
464
|
+
renderBtn(item, params, () => {
|
|
465
|
+
return spanRef.value?.parentElement?.parentElement?.parentElement?.parentElement || document.body
|
|
466
|
+
}),
|
|
467
|
+
) ?? []
|
|
468
|
+
}
|
|
464
469
|
</span>
|
|
465
|
-
)
|
|
470
|
+
)
|
|
466
471
|
},
|
|
467
472
|
},
|
|
468
473
|
$radio: {
|
|
469
474
|
renderItemContent(
|
|
470
|
-
{ props = {}, events = {}, options }: RenderOptions,
|
|
475
|
+
{ props = {}, events = {}, options, defaultValue }: RenderOptions,
|
|
471
476
|
{ data, field }: RenderFormParams,
|
|
472
477
|
) {
|
|
478
|
+
if (isGoodValue(defaultValue) && valued(field) && isBadValue(data[field!])) {
|
|
479
|
+
data[field!] = defaultValue;
|
|
480
|
+
}
|
|
473
481
|
return valued(field) ? (
|
|
474
482
|
<RadioGroup
|
|
475
483
|
v-model:value={data[field!]}
|
|
@@ -518,9 +526,12 @@ const renders: RenderFactory = {
|
|
|
518
526
|
},
|
|
519
527
|
$switch: {
|
|
520
528
|
renderItemContent(
|
|
521
|
-
{ props = {}, events = {} }: RenderOptions,
|
|
529
|
+
{ props = {}, events = {}, defaultValue }: RenderOptions,
|
|
522
530
|
{ data, field }: RenderFormParams,
|
|
523
531
|
) {
|
|
532
|
+
if (isGoodValue(defaultValue) && valued(field) && isBadValue(data[field!])) {
|
|
533
|
+
data[field!] = defaultValue;
|
|
534
|
+
}
|
|
524
535
|
return valued(field) ? (
|
|
525
536
|
<Switch
|
|
526
537
|
v-model:checked={data[field!]}
|
|
@@ -534,9 +545,12 @@ const renders: RenderFactory = {
|
|
|
534
545
|
},
|
|
535
546
|
$checkbox: {
|
|
536
547
|
renderItemContent(
|
|
537
|
-
{ props = {}, options, events = {} }: RenderOptions,
|
|
548
|
+
{ props = {}, options, events = {}, defaultValue }: RenderOptions,
|
|
538
549
|
{ data, field }: RenderFormParams,
|
|
539
550
|
) {
|
|
551
|
+
if (isGoodValue(defaultValue) && valued(field) && isBadValue(data[field!])) {
|
|
552
|
+
data[field!] = defaultValue;
|
|
553
|
+
}
|
|
540
554
|
return valued(field) ? (
|
|
541
555
|
<CheckboxGroup
|
|
542
556
|
v-model:value={data[field!]}
|
|
@@ -596,11 +610,14 @@ const renders: RenderFactory = {
|
|
|
596
610
|
},
|
|
597
611
|
PercentInput: {
|
|
598
612
|
renderItemContent(
|
|
599
|
-
{ props = {}, attrs = {} }: RenderOptions,
|
|
613
|
+
{ props = {}, attrs = {}, defaultValue }: RenderOptions,
|
|
600
614
|
{ data, field }: RenderFormParams,
|
|
601
615
|
) {
|
|
602
616
|
const rate = props.parse ? 100 : 1;
|
|
603
617
|
if (valued(field)) {
|
|
618
|
+
if (isGoodValue(defaultValue) && isBadValue(data[field!])) {
|
|
619
|
+
data[field!] = defaultValue;
|
|
620
|
+
}
|
|
604
621
|
const percentage = computed({
|
|
605
622
|
get: () => (data[field!] ?? 0) * rate,
|
|
606
623
|
set: (val) => {
|
|
@@ -304,6 +304,27 @@
|
|
|
304
304
|
justify-content: flex-start;
|
|
305
305
|
}
|
|
306
306
|
}
|
|
307
|
+
|
|
308
|
+
.collapsible-card {
|
|
309
|
+
background-color: #fff;
|
|
310
|
+
border-color: #f0f0f0;
|
|
311
|
+
.ant-collapse-header {
|
|
312
|
+
padding: 0 12px;
|
|
313
|
+
min-height: 38px;
|
|
314
|
+
display: flex;
|
|
315
|
+
align-items: center;
|
|
316
|
+
font-weight: 600;
|
|
317
|
+
}
|
|
318
|
+
.ant-collapse-content {
|
|
319
|
+
border-color: #f0f0f0;
|
|
320
|
+
.ant-collapse-content-box {
|
|
321
|
+
padding: var(--collapsible-card-body-padding, 12px);
|
|
322
|
+
}
|
|
323
|
+
}
|
|
324
|
+
.ant-collapse-item {
|
|
325
|
+
border-color: #f0f0f0;
|
|
326
|
+
}
|
|
327
|
+
}
|
|
307
328
|
/* #endregion */
|
|
308
329
|
|
|
309
330
|
/* #region EVirtTable */
|