vxe-pc-ui 4.19.7 → 4.20.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/all.esm.js +2206 -1851
- package/dist/style.css +1 -1
- package/dist/style.min.css +1 -1
- package/es/card/src/card.js +35 -12
- package/es/card/style.css +42 -44
- package/es/card/style.min.css +1 -1
- package/es/icon/style.css +1 -1
- package/es/list/src/list.js +323 -19
- package/es/list/style.css +26 -0
- package/es/list/style.min.css +1 -1
- package/es/scrollbar/src/scrollbar.js +9 -1
- package/es/scrollbar/style.css +6 -5
- package/es/scrollbar/style.min.css +1 -1
- package/es/style.css +1 -1
- package/es/style.min.css +1 -1
- package/es/tabs/src/tabs.js +27 -8
- package/es/tabs/style.css +4 -2
- package/es/tabs/style.min.css +1 -1
- package/es/tree/src/tree.js +6 -2
- package/es/ui/index.js +1 -1
- package/es/ui/src/log.js +1 -1
- package/es/ui/src/utils.js +9 -0
- package/es/vxe-card/style.css +42 -44
- package/es/vxe-card/style.min.css +1 -1
- package/es/vxe-list/style.css +26 -0
- package/es/vxe-list/style.min.css +1 -1
- package/es/vxe-scrollbar/style.css +6 -5
- package/es/vxe-scrollbar/style.min.css +1 -1
- package/es/vxe-tabs/style.css +4 -2
- package/es/vxe-tabs/style.min.css +1 -1
- package/lib/card/src/card.js +42 -6
- package/lib/card/src/card.min.js +1 -1
- package/lib/card/style/style.css +42 -44
- package/lib/card/style/style.min.css +1 -1
- package/lib/icon/style/style.css +1 -1
- package/lib/icon/style/style.min.css +1 -1
- package/lib/index.umd.js +2785 -2383
- package/lib/index.umd.min.js +1 -1
- package/lib/list/src/list.js +333 -20
- package/lib/list/src/list.min.js +1 -1
- package/lib/list/style/style.css +26 -0
- package/lib/list/style/style.min.css +1 -1
- package/lib/scrollbar/src/scrollbar.js +9 -1
- package/lib/scrollbar/src/scrollbar.min.js +1 -1
- package/lib/scrollbar/style/style.css +6 -5
- package/lib/scrollbar/style/style.min.css +1 -1
- package/lib/style.css +1 -1
- package/lib/style.min.css +1 -1
- package/lib/tabs/src/tabs.js +40 -8
- package/lib/tabs/src/tabs.min.js +1 -1
- package/lib/tabs/style/style.css +4 -2
- package/lib/tabs/style/style.min.css +1 -1
- package/lib/tree/src/tree.js +5 -1
- package/lib/tree/src/tree.min.js +1 -1
- package/lib/ui/index.js +1 -1
- package/lib/ui/index.min.js +1 -1
- package/lib/ui/src/log.js +1 -1
- package/lib/ui/src/log.min.js +1 -1
- package/lib/ui/src/utils.js +10 -0
- package/lib/ui/src/utils.min.js +1 -1
- package/lib/vxe-card/style/style.css +42 -44
- package/lib/vxe-card/style/style.min.css +1 -1
- package/lib/vxe-list/style/style.css +26 -0
- package/lib/vxe-list/style/style.min.css +1 -1
- package/lib/vxe-scrollbar/style/style.css +6 -5
- package/lib/vxe-scrollbar/style/style.min.css +1 -1
- package/lib/vxe-tabs/style/style.css +4 -2
- package/lib/vxe-tabs/style/style.min.css +1 -1
- package/package.json +1 -1
- package/packages/card/src/card.ts +55 -12
- package/packages/list/src/list.ts +351 -19
- package/packages/scrollbar/src/scrollbar.ts +10 -1
- package/packages/tabs/src/tabs.ts +34 -8
- package/packages/tree/src/tree.ts +6 -2
- package/packages/ui/src/utils.ts +10 -0
- package/styles/components/card.scss +44 -58
- package/styles/components/list.scss +51 -0
- package/styles/components/scrollbar.scss +18 -11
- package/styles/components/tabs.scss +2 -1
- package/types/components/card.d.ts +11 -0
- package/types/components/grid.d.ts +37 -0
- package/types/components/layout-aside.d.ts +7 -1
- package/types/components/layout-body.d.ts +7 -1
- package/types/components/list.d.ts +24 -2
- package/types/components/menu.d.ts +6 -0
- package/types/components/table-plugins/extend-cell-area.d.ts +1 -1
- package/types/components/table.d.ts +25 -2
- package/types/components/tabs.d.ts +11 -0
- /package/es/icon/{iconfont.1791794447472.ttf → iconfont.1791880413927.ttf} +0 -0
- /package/es/icon/{iconfont.1791794447472.woff → iconfont.1791880413927.woff} +0 -0
- /package/es/icon/{iconfont.1791794447472.woff2 → iconfont.1791880413927.woff2} +0 -0
- /package/es/{iconfont.1791794447472.ttf → iconfont.1791880413927.ttf} +0 -0
- /package/es/{iconfont.1791794447472.woff → iconfont.1791880413927.woff} +0 -0
- /package/es/{iconfont.1791794447472.woff2 → iconfont.1791880413927.woff2} +0 -0
- /package/lib/icon/style/{iconfont.1791794447472.ttf → iconfont.1791880413927.ttf} +0 -0
- /package/lib/icon/style/{iconfont.1791794447472.woff → iconfont.1791880413927.woff} +0 -0
- /package/lib/icon/style/{iconfont.1791794447472.woff2 → iconfont.1791880413927.woff2} +0 -0
- /package/lib/{iconfont.1791794447472.ttf → iconfont.1791880413927.ttf} +0 -0
- /package/lib/{iconfont.1791794447472.woff → iconfont.1791880413927.woff} +0 -0
- /package/lib/{iconfont.1791794447472.woff2 → iconfont.1791880413927.woff2} +0 -0
|
@@ -7,6 +7,7 @@ import { isEnableConf } from '../../ui/src/utils'
|
|
|
7
7
|
import { createComponentLog } from '../../ui/src/log'
|
|
8
8
|
import XEUtils from 'xe-utils'
|
|
9
9
|
import VxeLoadingComponent from '../../loading'
|
|
10
|
+
import VxeScrollbarComponent from '../../scrollbar'
|
|
10
11
|
|
|
11
12
|
import type { VxeTabsPropTypes, VxeTabPaneProps, VxeTabsEmits, TabsInternalData, TabsReactData, TabsPrivateRef, VxeTabsPrivateComputed, VxeTabsConstructor, VxeTabsPrivateMethods, VxeTabPaneDefines, ValueOf, TabsMethods, TabsPrivateMethods, VxeComponentStyleType } from '../../../types'
|
|
12
13
|
|
|
@@ -52,6 +53,11 @@ export default defineVxeComponent({
|
|
|
52
53
|
type: String as PropType<VxeTabsPropTypes.Size>,
|
|
53
54
|
default: () => getConfig().tabs.size || getConfig().size
|
|
54
55
|
},
|
|
56
|
+
useScrollbar: {
|
|
57
|
+
type: Boolean as PropType<VxeTabsPropTypes.UseScrollbar>,
|
|
58
|
+
default: () => getConfig().tabs.useScrollbar
|
|
59
|
+
},
|
|
60
|
+
scrollbarConfig: Object as PropType<VxeTabsPropTypes.ScrollbarConfig>,
|
|
55
61
|
// 已废弃
|
|
56
62
|
beforeCloseMethod: Function as PropType<VxeTabsPropTypes.BeforeCloseMethod>
|
|
57
63
|
},
|
|
@@ -165,6 +171,10 @@ export default defineVxeComponent({
|
|
|
165
171
|
return $xeParentTabs ? $xeParentTabs.reactData.resizeFlag : null
|
|
166
172
|
})
|
|
167
173
|
|
|
174
|
+
const computeScrollbarOpts = computed(() => {
|
|
175
|
+
return Object.assign({}, getConfig().tabs.scrollbarConfig, props.scrollbarConfig)
|
|
176
|
+
})
|
|
177
|
+
|
|
168
178
|
const computeMaps: VxeTabsPrivateComputed = {
|
|
169
179
|
}
|
|
170
180
|
|
|
@@ -761,17 +771,33 @@ export default defineVxeComponent({
|
|
|
761
771
|
}
|
|
762
772
|
|
|
763
773
|
const renderTabPane = (item: VxeTabPaneProps | VxeTabPaneDefines.TabConfig) => {
|
|
774
|
+
const { useScrollbar } = props
|
|
764
775
|
const { initNames, activeName } = reactData
|
|
765
776
|
const { name, slots } = item
|
|
766
777
|
const defaultSlot = slots ? slots.default : null
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
778
|
+
const scrollbarOpts = computeScrollbarOpts.value
|
|
779
|
+
const { viewClassName, viewInnerClassName } = scrollbarOpts
|
|
780
|
+
if (name && initNames.includes(name)) {
|
|
781
|
+
return useScrollbar
|
|
782
|
+
? h(VxeScrollbarComponent, {
|
|
783
|
+
key: `${name}`,
|
|
784
|
+
class: ['vxe-tabs-pane--scrollbar-item', {
|
|
785
|
+
'is--visible': activeName === name
|
|
786
|
+
}],
|
|
787
|
+
...scrollbarOpts,
|
|
788
|
+
viewClassName: 'vxe-tabs-pane--scrollbar-item-view' + (viewClassName ? (' ' + viewClassName) : ''),
|
|
789
|
+
viewInnerClassName: 'vxe-tabs-pane--scrollbar-item-inner' + (viewClassName ? (' ' + viewInnerClassName) : '')
|
|
790
|
+
}, {
|
|
791
|
+
default: () => defaultSlot ? callSlot(defaultSlot, { name }) : []
|
|
792
|
+
})
|
|
793
|
+
: h('div', {
|
|
794
|
+
key: `${name}`,
|
|
795
|
+
class: ['vxe-tabs-pane--item', {
|
|
796
|
+
'is--visible': activeName === name
|
|
797
|
+
}]
|
|
798
|
+
}, defaultSlot ? callSlot(defaultSlot, { name }) : [])
|
|
799
|
+
}
|
|
800
|
+
return renderEmptyElement($xeTabs)
|
|
775
801
|
}
|
|
776
802
|
|
|
777
803
|
const renderTabContent = (tabList: VxeTabsPropTypes.Options | VxeTabPaneDefines.TabConfig[]) => {
|
|
@@ -6,7 +6,7 @@ import { createComponentLog } from '../../ui/src/log'
|
|
|
6
6
|
import { getCrossTreeDragNodeInfo } from './store'
|
|
7
7
|
import XEUtils from 'xe-utils'
|
|
8
8
|
import { getSlotVNs } from '../../ui/src/vn'
|
|
9
|
-
import { toCssUnit, isScale, getPaddingTopBottomSize, addClass, removeClass, getTpImg, hasControlKey, getEventTargetNode } from '../../ui/src/dom'
|
|
9
|
+
import { toCssUnit, isScale, getPaddingTopBottomSize, addClass, removeClass, getTpImg, hasControlKey, getEventTargetNode, hasClass } from '../../ui/src/dom'
|
|
10
10
|
import { isEnableConf, enModelValue, deModelValue, getText } from '../../ui/src/utils'
|
|
11
11
|
import { moveRowAnimateToTb, clearRowAnimate } from '../../ui/src/anime'
|
|
12
12
|
import VxeLoadingComponent from '../../loading'
|
|
@@ -936,11 +936,15 @@ export default defineVxeComponent({
|
|
|
936
936
|
const { rowHeight } = scrollYStore
|
|
937
937
|
const el = refElem.value
|
|
938
938
|
if (el && el.clientWidth && el.clientHeight) {
|
|
939
|
-
|
|
939
|
+
let parentEl = getParentElem()
|
|
940
940
|
const headerWrapperEl = refHeaderWrapperElem.value
|
|
941
941
|
const footerWrapperEl = refFooterWrapperElem.value
|
|
942
942
|
const headHeight = headerWrapperEl ? headerWrapperEl.clientHeight : 0
|
|
943
943
|
const footHeight = footerWrapperEl ? footerWrapperEl.clientHeight : 0
|
|
944
|
+
// 如果是虚拟滚动条
|
|
945
|
+
if (parentEl && hasClass(parentEl, 'vxe-scrollbar--view-inner')) {
|
|
946
|
+
parentEl = parentEl.parentElement
|
|
947
|
+
}
|
|
944
948
|
if (parentEl) {
|
|
945
949
|
const parentPaddingSize = getPaddingTopBottomSize(parentEl)
|
|
946
950
|
reactData.parentHeight = Math.max(headHeight + footHeight + rowHeight, parentEl.clientHeight - parentPaddingSize - headHeight - footHeight)
|
package/packages/ui/src/utils.ts
CHANGED
|
@@ -6,6 +6,16 @@ export function isEnableConf (conf: any): boolean {
|
|
|
6
6
|
return conf && conf.enabled !== false
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
+
/**
|
|
10
|
+
* 用于开关类型的配置项
|
|
11
|
+
* 局部启用规则:conf={}
|
|
12
|
+
* 局部禁用规则:conf={enabled:false}
|
|
13
|
+
* 全局默认启用规则:conf.enabled=true
|
|
14
|
+
*/
|
|
15
|
+
export function hasEnableConf (conf: any, opts: any): boolean {
|
|
16
|
+
return opts && (conf ? opts.enabled !== false : opts.enabled)
|
|
17
|
+
}
|
|
18
|
+
|
|
9
19
|
export function nextZIndex () {
|
|
10
20
|
return DomZIndex.getNext()
|
|
11
21
|
}
|
|
@@ -1,8 +1,34 @@
|
|
|
1
|
+
// 局部变量
|
|
2
|
+
.vxe-card {
|
|
3
|
+
--vxe-ui-card-current-font-size: var(--vxe-ui-font-size-default);
|
|
4
|
+
--vxe-ui-card-current-padding: var(--vxe-ui-card-padding-default);
|
|
5
|
+
&.size--xlarge {
|
|
6
|
+
--vxe-ui-card-current-font-size: var(--vxe-ui-font-size-xlarge);
|
|
7
|
+
--vxe-ui-card-current-padding: var(--vxe-ui-card-padding-xlarge);
|
|
8
|
+
}
|
|
9
|
+
&.size--large {
|
|
10
|
+
--vxe-ui-card-current-font-size: var(--vxe-ui-font-size-large);
|
|
11
|
+
--vxe-ui-card-current-padding: var(--vxe-ui-card-padding-large);
|
|
12
|
+
}
|
|
13
|
+
&.size--medium {
|
|
14
|
+
--vxe-ui-card-current-font-size: var(--vxe-ui-font-size-medium);
|
|
15
|
+
--vxe-ui-card-current-padding: var(--vxe-ui-card-padding-medium);
|
|
16
|
+
}
|
|
17
|
+
&.size--small {
|
|
18
|
+
--vxe-ui-card-current-font-size: var(--vxe-ui-font-size-small);
|
|
19
|
+
--vxe-ui-card-current-padding: var(--vxe-ui-card-padding-small);
|
|
20
|
+
}
|
|
21
|
+
&.size--mini {
|
|
22
|
+
--vxe-ui-card-current-font-size: var(--vxe-ui-font-size-mini);
|
|
23
|
+
--vxe-ui-card-current-padding: var(--vxe-ui-card-padding-mini);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
|
|
1
27
|
.vxe-card {
|
|
2
28
|
position: relative;
|
|
3
29
|
display: inline-flex;
|
|
4
30
|
flex-direction: column;
|
|
5
|
-
font-size: var(--vxe-ui-font-size
|
|
31
|
+
font-size: var(--vxe-ui-card-current-font-size);
|
|
6
32
|
color: var(--vxe-ui-font-color);
|
|
7
33
|
font-family: var(--vxe-ui-font-family);
|
|
8
34
|
background-color: var(--vxe-ui-layout-background-color);
|
|
@@ -33,19 +59,25 @@
|
|
|
33
59
|
flex-grow: 1;
|
|
34
60
|
}
|
|
35
61
|
.vxe-card--body-left,
|
|
62
|
+
.vxe-card--body-scrollbar-left,
|
|
36
63
|
.vxe-card--body-right,
|
|
37
|
-
.vxe-card--body-
|
|
64
|
+
.vxe-card--body-scrollbar-right,
|
|
65
|
+
.vxe-card--body-content,
|
|
66
|
+
.vxe-card--body-scrollbar-content {
|
|
38
67
|
overflow: auto;
|
|
39
68
|
}
|
|
40
69
|
.vxe-card--header,
|
|
41
70
|
.vxe-card--header-extra,
|
|
42
71
|
.vxe-card--footer,
|
|
43
72
|
.vxe-card--body-left,
|
|
44
|
-
.vxe-card--body-
|
|
73
|
+
.vxe-card--body-scrollbar-left,
|
|
74
|
+
.vxe-card--body-right,
|
|
75
|
+
.vxe-card--body-scrollbar-right {
|
|
45
76
|
flex-shrink: 0;
|
|
46
77
|
}
|
|
47
78
|
.vxe-card--header-title,
|
|
48
|
-
.vxe-card--body-content
|
|
79
|
+
.vxe-card--body-content,
|
|
80
|
+
.vxe-card--body-scrollbar-content {
|
|
49
81
|
flex-grow: 1;
|
|
50
82
|
}
|
|
51
83
|
.vxe-card--header-title {
|
|
@@ -57,66 +89,20 @@
|
|
|
57
89
|
}
|
|
58
90
|
|
|
59
91
|
.vxe-card {
|
|
60
|
-
font-size: var(--vxe-ui-font-size-default);
|
|
61
92
|
& > .vxe-card--header,
|
|
62
93
|
& > .vxe-card--footer {
|
|
63
|
-
padding: var(--vxe-ui-card-padding
|
|
94
|
+
padding: var(--vxe-ui-card-current-padding);
|
|
64
95
|
}
|
|
65
96
|
&.is--padding {
|
|
66
97
|
& > .vxe-card--body {
|
|
67
|
-
.vxe-card--body-content,
|
|
68
98
|
.vxe-card--body-left,
|
|
69
|
-
.vxe-card--body-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
font-size: var(--vxe-ui-font-size-medium);
|
|
76
|
-
& > .vxe-card--header,
|
|
77
|
-
& > .vxe-card--footer {
|
|
78
|
-
padding: var(--vxe-ui-card-padding-medium);
|
|
79
|
-
}
|
|
80
|
-
&.is--padding {
|
|
81
|
-
& > .vxe-card--body {
|
|
82
|
-
.vxe-card--body-content,
|
|
83
|
-
.vxe-card--body-left,
|
|
84
|
-
.vxe-card--body-right {
|
|
85
|
-
padding: var(--vxe-ui-card-padding-medium);
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
&.size--small {
|
|
91
|
-
font-size: var(--vxe-ui-font-size-small);
|
|
92
|
-
& > .vxe-card--header,
|
|
93
|
-
& > .vxe-card--footer {
|
|
94
|
-
padding: var(--vxe-ui-card-padding-small);
|
|
95
|
-
}
|
|
96
|
-
&.is--padding {
|
|
97
|
-
& > .vxe-card--body {
|
|
98
|
-
.vxe-card--body-content,
|
|
99
|
-
.vxe-card--body-left,
|
|
100
|
-
.vxe-card--body-right {
|
|
101
|
-
padding: var(--vxe-ui-card-padding-small);
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
&.size--mini {
|
|
107
|
-
font-size: var(--vxe-ui-font-size-mini);
|
|
108
|
-
& > .vxe-card--header,
|
|
109
|
-
& > .vxe-card--footer {
|
|
110
|
-
padding: var(--vxe-ui-card-padding-mini);
|
|
111
|
-
}
|
|
112
|
-
&.is--padding {
|
|
113
|
-
& > .vxe-card--body {
|
|
114
|
-
.vxe-card--body-content,
|
|
115
|
-
.vxe-card--body-left,
|
|
116
|
-
.vxe-card--body-right {
|
|
117
|
-
padding: var(--vxe-ui-card-padding-mini);
|
|
118
|
-
}
|
|
99
|
+
.vxe-card--body-scrollbar-left-view,
|
|
100
|
+
.vxe-card--body-right,
|
|
101
|
+
.vxe-card--body-scrollbar-right-view,
|
|
102
|
+
.vxe-card--body-content,
|
|
103
|
+
.vxe-card--body-scrollbar-content-view {
|
|
104
|
+
padding: var(--vxe-ui-card-current-padding);
|
|
119
105
|
}
|
|
120
106
|
}
|
|
121
107
|
}
|
|
122
|
-
}
|
|
108
|
+
}
|
|
@@ -287,3 +287,54 @@
|
|
|
287
287
|
padding-right: var(--vxe-ui-list-current-padding);
|
|
288
288
|
@include baseMixin.createRadioIcon();
|
|
289
289
|
}
|
|
290
|
+
|
|
291
|
+
// 滚动条
|
|
292
|
+
.vxe-list {
|
|
293
|
+
& > .vxe-scrollbar {
|
|
294
|
+
position: unset;
|
|
295
|
+
}
|
|
296
|
+
&.is--virtual-scrollbar {
|
|
297
|
+
& > .vxe-list--virtual-wrapper {
|
|
298
|
+
scrollbar-width: none;
|
|
299
|
+
-ms-overflow-style: none;
|
|
300
|
+
}
|
|
301
|
+
& > .vxe-list--virtual-wrapper::-webkit-scrollbar {
|
|
302
|
+
display: none;
|
|
303
|
+
}
|
|
304
|
+
}
|
|
305
|
+
}
|
|
306
|
+
|
|
307
|
+
.vxe-list {
|
|
308
|
+
&.is--virtual-scrollbar {
|
|
309
|
+
&.ov-x--auto-hide {
|
|
310
|
+
&:hover {
|
|
311
|
+
& > .vxe-scrollbar {
|
|
312
|
+
& > .vxe-scrollbar--track-x {
|
|
313
|
+
opacity: 1;
|
|
314
|
+
}
|
|
315
|
+
}
|
|
316
|
+
}
|
|
317
|
+
& > .vxe-scrollbar {
|
|
318
|
+
& > .vxe-scrollbar--track-x {
|
|
319
|
+
opacity: 0;
|
|
320
|
+
@include baseMixin.createAnimationTransition(opacity, 0.8s);
|
|
321
|
+
}
|
|
322
|
+
}
|
|
323
|
+
}
|
|
324
|
+
&.ov-y--auto-hide {
|
|
325
|
+
&:hover {
|
|
326
|
+
& > .vxe-scrollbar {
|
|
327
|
+
& > .vxe-scrollbar--track-y {
|
|
328
|
+
opacity: 1;
|
|
329
|
+
}
|
|
330
|
+
}
|
|
331
|
+
}
|
|
332
|
+
& > .vxe-scrollbar {
|
|
333
|
+
& > .vxe-scrollbar--track-y {
|
|
334
|
+
opacity: 0;
|
|
335
|
+
@include baseMixin.createAnimationTransition(opacity, 0.8s);
|
|
336
|
+
}
|
|
337
|
+
}
|
|
338
|
+
}
|
|
339
|
+
}
|
|
340
|
+
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
@use '../helpers/baseMixin.scss';
|
|
2
2
|
|
|
3
3
|
.vxe-scrollbar {
|
|
4
|
-
width: 100%;
|
|
5
4
|
position: relative;
|
|
6
5
|
&.is--virtual {
|
|
7
6
|
& > .vxe-scrollbar--view {
|
|
@@ -50,6 +49,9 @@
|
|
|
50
49
|
background-color: var(--vxe-ui-scrollbar-thumb-active-background-color);
|
|
51
50
|
}
|
|
52
51
|
}
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.vxe-scrollbar {
|
|
53
55
|
&.ov-x--hidden {
|
|
54
56
|
& > .vxe-scrollbar--view {
|
|
55
57
|
overflow-x: hidden;
|
|
@@ -74,6 +76,7 @@
|
|
|
74
76
|
display: none;
|
|
75
77
|
position: absolute;
|
|
76
78
|
background-color: var(--vxe-ui-scrollbar-track-background-color);
|
|
79
|
+
overflow: hidden;
|
|
77
80
|
user-select: none;
|
|
78
81
|
}
|
|
79
82
|
.vxe-scrollbar {
|
|
@@ -152,17 +155,21 @@
|
|
|
152
155
|
|
|
153
156
|
.vxe-scrollbar {
|
|
154
157
|
&.is--padding {
|
|
155
|
-
&.
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
padding-left: var(--vxe-ui-scrollbar-y-width);
|
|
158
|
+
&.overflow-x {
|
|
159
|
+
&.sx-pos--top {
|
|
160
|
+
padding-top: var(--vxe-ui-scrollbar-x-height);
|
|
161
|
+
}
|
|
162
|
+
&.sx-pos--bottom {
|
|
163
|
+
padding-bottom: var(--vxe-ui-scrollbar-x-height);
|
|
164
|
+
}
|
|
163
165
|
}
|
|
164
|
-
&.
|
|
165
|
-
|
|
166
|
+
&.overflow-y {
|
|
167
|
+
&.sy-pos--left {
|
|
168
|
+
padding-left: var(--vxe-ui-scrollbar-y-width);
|
|
169
|
+
}
|
|
170
|
+
&.sy-pos--right {
|
|
171
|
+
padding-right: var(--vxe-ui-scrollbar-y-width);
|
|
172
|
+
}
|
|
166
173
|
}
|
|
167
174
|
}
|
|
168
175
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { RenderFunction, SetupContext, Ref } from 'vue'
|
|
2
2
|
import { DefineVxeComponentApp, DefineVxeComponentOptions, DefineVxeComponentInstance, VxeComponentBaseOptions, VxeComponentEventParams, ValueOf, VxeComponentSizeType } from '@vxe-ui/core'
|
|
3
|
+
import { VxeScrollbarProps } from './scrollbar'
|
|
3
4
|
|
|
4
5
|
/* eslint-disable no-use-before-define,@typescript-eslint/ban-types */
|
|
5
6
|
|
|
@@ -32,6 +33,8 @@ export namespace VxeCardPropTypes {
|
|
|
32
33
|
export type Shadow = boolean
|
|
33
34
|
export type Padding = boolean
|
|
34
35
|
export type Size = VxeComponentSizeType
|
|
36
|
+
export type UseScrollbar = boolean
|
|
37
|
+
export interface ScrollbarConfig extends Pick<VxeScrollbarProps, 'native' | 'xConfig' | 'yConfig' | 'padding' | 'className' | 'viewAttrs' | 'viewClassName' | 'viewInnerClassName'> {}
|
|
35
38
|
}
|
|
36
39
|
|
|
37
40
|
export type VxeCardProps = {
|
|
@@ -44,6 +47,14 @@ export type VxeCardProps = {
|
|
|
44
47
|
shadow?: VxeCardPropTypes.Shadow
|
|
45
48
|
padding?: VxeCardPropTypes.Padding
|
|
46
49
|
size?: VxeCardPropTypes.Size
|
|
50
|
+
/**
|
|
51
|
+
* 使用虚拟滚动条
|
|
52
|
+
*/
|
|
53
|
+
useScrollbar?: VxeCardPropTypes.UseScrollbar
|
|
54
|
+
/**
|
|
55
|
+
* 滚动条配置项
|
|
56
|
+
*/
|
|
57
|
+
scrollbarConfig?: VxeCardPropTypes.ScrollbarConfig
|
|
47
58
|
}
|
|
48
59
|
|
|
49
60
|
export interface CardPrivateComputed {
|
|
@@ -661,13 +661,50 @@ export interface GridMethods<D = any> {
|
|
|
661
661
|
export interface VxeGridMethods<D = any> extends GridMethods<D>, Omit<TableMethods<D>, 'dispatchEvent'> { }
|
|
662
662
|
|
|
663
663
|
export interface GridPrivateMethods<D = any> {
|
|
664
|
+
/**
|
|
665
|
+
* 内部方法
|
|
666
|
+
* @private
|
|
667
|
+
*/
|
|
664
668
|
callSlot<T = any>(slotFunc: ((params: T) => VxeComponentSlotType | VxeComponentSlotType[]) | string | null, params: T): VxeComponentSlotType[]
|
|
669
|
+
/**
|
|
670
|
+
* 内部方法
|
|
671
|
+
* @private
|
|
672
|
+
*/
|
|
665
673
|
extendTableMethods<T>(methodKeys: T[]): any
|
|
674
|
+
/**
|
|
675
|
+
* 内部方法
|
|
676
|
+
* @private
|
|
677
|
+
*/
|
|
666
678
|
triggerToolbarCommitEvent(params: VxeToolbarPropTypes.ButtonConfig | VxeToolbarPropTypes.ToolConfig, evnt: Event): Promise<any>
|
|
679
|
+
/**
|
|
680
|
+
* 内部方法
|
|
681
|
+
* @private
|
|
682
|
+
*/
|
|
667
683
|
triggerToolbarBtnEvent(button: VxeToolbarPropTypes.ButtonConfig, evnt: Event): void
|
|
684
|
+
/**
|
|
685
|
+
* 内部方法
|
|
686
|
+
* @private
|
|
687
|
+
*/
|
|
668
688
|
triggerToolbarTolEvent(button: VxeToolbarPropTypes.ToolConfig, evnt: Event): void
|
|
689
|
+
/**
|
|
690
|
+
* 内部方法
|
|
691
|
+
* @private
|
|
692
|
+
*/
|
|
669
693
|
triggerZoomEvent(evnt: Event): void
|
|
694
|
+
/**
|
|
695
|
+
* 内部方法
|
|
696
|
+
* @private
|
|
697
|
+
*/
|
|
698
|
+
getParentElem(): HTMLElement | null
|
|
699
|
+
/**
|
|
700
|
+
* 内部方法
|
|
701
|
+
* @private
|
|
702
|
+
*/
|
|
670
703
|
getParentHeight(): number
|
|
704
|
+
/**
|
|
705
|
+
* 内部方法
|
|
706
|
+
* @private
|
|
707
|
+
*/
|
|
671
708
|
getExcludeHeight(): number
|
|
672
709
|
}
|
|
673
710
|
export interface VxeGridPrivateMethods<D = any> extends GridPrivateMethods<D> { }
|
|
@@ -37,7 +37,7 @@ export namespace VxeLayoutAsidePropTypes {
|
|
|
37
37
|
animation?: boolean
|
|
38
38
|
}
|
|
39
39
|
export type UseScrollbar = boolean
|
|
40
|
-
export interface ScrollbarConfig extends Pick<VxeScrollbarProps, 'native' | 'yConfig' | 'className' | 'viewAttrs' | 'viewClassName' | 'viewInnerClassName'> {}
|
|
40
|
+
export interface ScrollbarConfig extends Pick<VxeScrollbarProps, 'native' | 'yConfig' | 'padding' | 'className' | 'viewAttrs' | 'viewClassName' | 'viewInnerClassName'> {}
|
|
41
41
|
}
|
|
42
42
|
|
|
43
43
|
export interface VxeLayoutAsideProps {
|
|
@@ -48,7 +48,13 @@ export interface VxeLayoutAsideProps {
|
|
|
48
48
|
padding?: VxeLayoutAsidePropTypes.Padding
|
|
49
49
|
size?: VxeLayoutAsidePropTypes.Size
|
|
50
50
|
collapseConfig?: VxeLayoutAsidePropTypes.CollapseConfig
|
|
51
|
+
/**
|
|
52
|
+
* 使用虚拟滚动条
|
|
53
|
+
*/
|
|
51
54
|
useScrollbar?: VxeLayoutAsidePropTypes.UseScrollbar
|
|
55
|
+
/**
|
|
56
|
+
* 滚动条配置项
|
|
57
|
+
*/
|
|
52
58
|
scrollbarConfig?: VxeLayoutAsidePropTypes.ScrollbarConfig
|
|
53
59
|
}
|
|
54
60
|
export interface LayoutAsidePrivateComputed {
|
|
@@ -32,7 +32,7 @@ export namespace VxeLayoutBodyPropTypes {
|
|
|
32
32
|
export type ShowBacktop = boolean
|
|
33
33
|
export interface BacktopConfig extends Omit<VxeBacktopProps, 'target'> {}
|
|
34
34
|
export type UseScrollbar = boolean
|
|
35
|
-
export interface ScrollbarConfig extends Pick<VxeScrollbarProps, 'native' | 'xConfig' | 'yConfig' | 'className' | 'viewAttrs' | 'viewClassName' | 'viewInnerClassName'> {}
|
|
35
|
+
export interface ScrollbarConfig extends Pick<VxeScrollbarProps, 'native' | 'xConfig' | 'yConfig' | 'padding' | 'className' | 'viewAttrs' | 'viewClassName' | 'viewInnerClassName'> {}
|
|
36
36
|
}
|
|
37
37
|
export interface VxeLayoutBodyProps {
|
|
38
38
|
size?: VxeLayoutBodyPropTypes.Size
|
|
@@ -40,7 +40,13 @@ export interface VxeLayoutBodyProps {
|
|
|
40
40
|
padding?: VxeLayoutBodyPropTypes.Padding
|
|
41
41
|
showBacktop?: VxeLayoutBodyPropTypes.ShowBacktop
|
|
42
42
|
backtopConfig?: VxeLayoutBodyPropTypes.BacktopConfig
|
|
43
|
+
/**
|
|
44
|
+
* 使用虚拟滚动条
|
|
45
|
+
*/
|
|
43
46
|
useScrollbar?: VxeLayoutBodyPropTypes.UseScrollbar
|
|
47
|
+
/**
|
|
48
|
+
* 滚动条配置项
|
|
49
|
+
*/
|
|
44
50
|
scrollbarConfig?: VxeLayoutBodyPropTypes.ScrollbarConfig
|
|
45
51
|
}
|
|
46
52
|
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { RenderFunction, SetupContext, Ref } from 'vue'
|
|
2
2
|
import { DefineVxeComponentApp, DefineVxeComponentOptions, DefineVxeComponentInstance, VxeComponentBaseOptions, VxeComponentEventParams, VxeComponentSizeType, ValueOf } from '@vxe-ui/core'
|
|
3
3
|
import { VxeContextMenuPropTypes, VxeContextMenuDefines } from './context-menu'
|
|
4
|
+
import { VxeScrollbarProps } from './scrollbar'
|
|
4
5
|
|
|
5
6
|
/* eslint-disable no-use-before-define,@typescript-eslint/ban-types */
|
|
6
7
|
|
|
@@ -226,6 +227,8 @@ export namespace VxeListPropTypes {
|
|
|
226
227
|
*/
|
|
227
228
|
enabled?: boolean
|
|
228
229
|
}
|
|
230
|
+
export type UseScrollbar = boolean
|
|
231
|
+
export interface ScrollbarConfig extends Pick<VxeScrollbarProps, 'xConfig' | 'yConfig' | 'padding'> {}
|
|
229
232
|
}
|
|
230
233
|
|
|
231
234
|
export interface VxeListProps<D = any> {
|
|
@@ -248,6 +251,14 @@ export interface VxeListProps<D = any> {
|
|
|
248
251
|
dragConfig?: VxeListPropTypes.DragConfig
|
|
249
252
|
menuConfig?: VxeListPropTypes.MenuConfig
|
|
250
253
|
virtualYConfig?: VxeListPropTypes.VirtualYConfig
|
|
254
|
+
/**
|
|
255
|
+
* 使用虚拟滚动条
|
|
256
|
+
*/
|
|
257
|
+
useScrollbar?: VxeListPropTypes.UseScrollbar
|
|
258
|
+
/**
|
|
259
|
+
* 滚动条配置项
|
|
260
|
+
*/
|
|
261
|
+
scrollbarConfig?: VxeListPropTypes.ScrollbarConfig
|
|
251
262
|
|
|
252
263
|
/**
|
|
253
264
|
* 已废弃,被 virtual-y-config 替换
|
|
@@ -276,6 +287,10 @@ export interface ListReactData {
|
|
|
276
287
|
isAllChecked: boolean
|
|
277
288
|
isAllIndeterminate: boolean
|
|
278
289
|
|
|
290
|
+
// 滚动条
|
|
291
|
+
yThumbHeight: number
|
|
292
|
+
xThumbWidth: number
|
|
293
|
+
|
|
279
294
|
insertRowFlag: number
|
|
280
295
|
removeRowFlag: number
|
|
281
296
|
|
|
@@ -285,13 +300,20 @@ export interface ListReactData {
|
|
|
285
300
|
}
|
|
286
301
|
|
|
287
302
|
export interface ListInternalData {
|
|
288
|
-
resizeObserver: ResizeObserver | undefined
|
|
289
303
|
fullData: any[]
|
|
290
304
|
afterList: any[]
|
|
291
305
|
fullKeyMaps: Record<string, any>
|
|
292
306
|
rowMaps: Record<string, VxeListDefines.RowCacheItem>
|
|
293
|
-
|
|
307
|
+
|
|
308
|
+
// 滚动条
|
|
309
|
+
resizeObserver?: ResizeObserver
|
|
310
|
+
isThumbDrag?: boolean
|
|
311
|
+
thumbDragOffset: number
|
|
312
|
+
yThumbTop: number
|
|
313
|
+
xThumbLeft: number
|
|
294
314
|
lastScrollTop: number
|
|
315
|
+
lastScrollLeft: number
|
|
316
|
+
|
|
295
317
|
scrollYStore: {
|
|
296
318
|
startIndex: number
|
|
297
319
|
endIndex: number
|
|
@@ -109,7 +109,13 @@ export interface VxeMenuProps {
|
|
|
109
109
|
expandKeys?: VxeMenuPropTypes.ExpandKeys
|
|
110
110
|
options?: VxeMenuPropTypes.Options
|
|
111
111
|
menuConfig?: VxeMenuPropTypes.MenuConfig
|
|
112
|
+
/**
|
|
113
|
+
* 使用虚拟滚动条
|
|
114
|
+
*/
|
|
112
115
|
useScrollbar?: VxeMenuPropTypes.UseScrollbar
|
|
116
|
+
/**
|
|
117
|
+
* 滚动条配置项
|
|
118
|
+
*/
|
|
113
119
|
scrollbarConfig?: VxeMenuPropTypes.ScrollbarConfig
|
|
114
120
|
/**
|
|
115
121
|
* 挂载到指定元素下
|
|
@@ -93,7 +93,7 @@ export interface VxeTableExtendCellAreaPrivateMethods<D = any> {
|
|
|
93
93
|
* 内部方法
|
|
94
94
|
* @private
|
|
95
95
|
*/
|
|
96
|
-
|
|
96
|
+
triggerClAaMnEvent(evnt: MouseEvent, params: VxeTableDefines.CellClickEventParams<D>): void
|
|
97
97
|
/**
|
|
98
98
|
* 内部方法
|
|
99
99
|
* @private
|
|
@@ -1907,6 +1907,10 @@ export namespace VxeTablePropTypes {
|
|
|
1907
1907
|
* 鼠标配置项
|
|
1908
1908
|
*/
|
|
1909
1909
|
export interface MouseConfig {
|
|
1910
|
+
/**
|
|
1911
|
+
* 是否启用,支持局部/全局启用
|
|
1912
|
+
*/
|
|
1913
|
+
enabled?: boolean
|
|
1910
1914
|
/**
|
|
1911
1915
|
* 开启单元格选中功能(只对 edit-config.mode=cell 有效)
|
|
1912
1916
|
*/
|
|
@@ -1926,6 +1930,10 @@ export namespace VxeTablePropTypes {
|
|
|
1926
1930
|
* 区域配置项
|
|
1927
1931
|
*/
|
|
1928
1932
|
export interface AreaConfig<D = any> {
|
|
1933
|
+
/**
|
|
1934
|
+
* 是否启用,支持局部/全局启用
|
|
1935
|
+
*/
|
|
1936
|
+
enabled?: boolean
|
|
1929
1937
|
/**
|
|
1930
1938
|
* 是否显示操作提示消息
|
|
1931
1939
|
*/
|
|
@@ -2062,6 +2070,10 @@ export namespace VxeTablePropTypes {
|
|
|
2062
2070
|
* 按键配置项
|
|
2063
2071
|
*/
|
|
2064
2072
|
export interface KeyboardConfig<D = any> {
|
|
2073
|
+
/**
|
|
2074
|
+
* 是否启用,支持局部/全局启用
|
|
2075
|
+
*/
|
|
2076
|
+
enabled?: boolean
|
|
2065
2077
|
/**
|
|
2066
2078
|
* 是否启用全选
|
|
2067
2079
|
* Window/Linux对应按键: Ctrl+A
|
|
@@ -3024,6 +3036,10 @@ export namespace VxeTablePropTypes {
|
|
|
3024
3036
|
* 导入参数
|
|
3025
3037
|
*/
|
|
3026
3038
|
export interface ImportConfig<D = any> {
|
|
3039
|
+
/**
|
|
3040
|
+
* 是否启用,支持局部/全局启用
|
|
3041
|
+
*/
|
|
3042
|
+
enabled?: boolean
|
|
3027
3043
|
/**
|
|
3028
3044
|
* 内置属性
|
|
3029
3045
|
* @private
|
|
@@ -3332,6 +3348,10 @@ export namespace VxeTablePropTypes {
|
|
|
3332
3348
|
* 导出参数
|
|
3333
3349
|
*/
|
|
3334
3350
|
export interface ExportConfig<D = any> extends ExportAndPrintConfig<D> {
|
|
3351
|
+
/**
|
|
3352
|
+
* 是否启用,支持局部/全局启用
|
|
3353
|
+
*/
|
|
3354
|
+
enabled?: boolean
|
|
3335
3355
|
// 内置属性
|
|
3336
3356
|
_typeMaps?: Record<string, number>
|
|
3337
3357
|
/**
|
|
@@ -3412,6 +3432,10 @@ export namespace VxeTablePropTypes {
|
|
|
3412
3432
|
* 打印参数
|
|
3413
3433
|
*/
|
|
3414
3434
|
export interface PrintConfig<D = any> extends ExportAndPrintConfig<D> {
|
|
3435
|
+
/**
|
|
3436
|
+
* 是否启用,支持局部/全局启用
|
|
3437
|
+
*/
|
|
3438
|
+
enabled?: boolean
|
|
3415
3439
|
/**
|
|
3416
3440
|
* 列宽计算模式,支持默认default,等比例scale,自适应auto
|
|
3417
3441
|
*/
|
|
@@ -5514,12 +5538,11 @@ export interface TablePrivateMethods<D = any> {
|
|
|
5514
5538
|
* @private
|
|
5515
5539
|
*/
|
|
5516
5540
|
callSlot<T>(slotFunc: ((params: T) => VxeComponentSlotType | VxeComponentSlotType[]) | string | null, params: T): VxeComponentSlotType[]
|
|
5517
|
-
|
|
5518
5541
|
/**
|
|
5519
5542
|
* 内部方法
|
|
5520
5543
|
* @private
|
|
5521
5544
|
*/
|
|
5522
|
-
getParentElem():
|
|
5545
|
+
getParentElem(): HTMLElement | null
|
|
5523
5546
|
/**
|
|
5524
5547
|
* 内部方法
|
|
5525
5548
|
* @private
|