vxe-pc-ui 4.6.4 → 4.6.6
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/es/button/src/button.js +83 -90
- package/es/button/style.css +24 -2
- package/es/button/style.min.css +1 -1
- package/es/color-picker/src/color-picker.js +19 -72
- package/es/color-picker/style.css +15 -0
- package/es/color-picker/style.min.css +1 -1
- package/es/date-picker/src/date-picker.js +19 -74
- package/es/date-picker/style.css +3 -2
- package/es/date-picker/style.min.css +1 -1
- package/es/date-range-picker/src/date-range-picker.js +24 -79
- package/es/date-range-picker/style.css +3 -2
- package/es/date-range-picker/style.min.css +1 -1
- package/es/icon/style.css +1 -1
- package/es/pulldown/src/pulldown.js +19 -74
- package/es/pulldown/style.css +0 -4
- package/es/pulldown/style.min.css +1 -1
- package/es/select/src/select.js +19 -72
- package/es/style.css +1 -1
- package/es/style.min.css +1 -1
- package/es/table-select/src/table-select.js +19 -72
- package/es/table-select/style.css +0 -1
- package/es/table-select/style.min.css +1 -1
- package/es/tree-select/src/tree-select.js +19 -72
- package/es/tree-select/style.css +0 -1
- package/es/tree-select/style.min.css +1 -1
- package/es/ui/index.js +1 -1
- package/es/ui/src/dom.js +92 -0
- package/es/ui/src/log.js +1 -1
- package/es/vxe-button/style.css +24 -2
- package/es/vxe-button/style.min.css +1 -1
- package/es/vxe-color-picker/style.css +15 -0
- package/es/vxe-color-picker/style.min.css +1 -1
- package/es/vxe-date-picker/style.css +3 -2
- package/es/vxe-date-picker/style.min.css +1 -1
- package/es/vxe-date-range-picker/style.css +3 -2
- package/es/vxe-date-range-picker/style.min.css +1 -1
- package/es/vxe-pulldown/style.css +0 -4
- package/es/vxe-pulldown/style.min.css +1 -1
- package/es/vxe-table-select/style.css +0 -1
- package/es/vxe-table-select/style.min.css +1 -1
- package/es/vxe-tree-select/style.css +0 -1
- package/es/vxe-tree-select/style.min.css +1 -1
- package/lib/button/src/button.js +88 -93
- package/lib/button/src/button.min.js +1 -1
- package/lib/button/style/style.css +24 -2
- package/lib/button/style/style.min.css +1 -1
- package/lib/color-picker/src/color-picker.js +22 -77
- package/lib/color-picker/src/color-picker.min.js +1 -1
- package/lib/color-picker/style/style.css +15 -0
- package/lib/color-picker/style/style.min.css +1 -1
- package/lib/date-picker/src/date-picker.js +22 -79
- package/lib/date-picker/src/date-picker.min.js +1 -1
- package/lib/date-picker/style/style.css +3 -2
- package/lib/date-picker/style/style.min.css +1 -1
- package/lib/date-range-picker/src/date-range-picker.js +26 -83
- package/lib/date-range-picker/src/date-range-picker.min.js +1 -1
- package/lib/date-range-picker/style/style.css +3 -2
- package/lib/date-range-picker/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 +344 -645
- package/lib/index.umd.min.js +1 -1
- package/lib/pulldown/src/pulldown.js +22 -80
- package/lib/pulldown/src/pulldown.min.js +1 -1
- package/lib/pulldown/style/style.css +0 -4
- package/lib/pulldown/style/style.min.css +1 -1
- package/lib/select/src/select.js +22 -77
- package/lib/select/src/select.min.js +1 -1
- package/lib/style.css +1 -1
- package/lib/style.min.css +1 -1
- package/lib/table-select/src/table-select.js +22 -77
- package/lib/table-select/src/table-select.min.js +1 -1
- package/lib/table-select/style/style.css +0 -1
- package/lib/table-select/style/style.min.css +1 -1
- package/lib/tree-select/src/tree-select.js +22 -77
- package/lib/tree-select/src/tree-select.min.js +1 -1
- package/lib/tree-select/style/style.css +0 -1
- package/lib/tree-select/style/style.min.css +1 -1
- package/lib/ui/index.js +1 -1
- package/lib/ui/index.min.js +1 -1
- package/lib/ui/src/dom.js +97 -0
- package/lib/ui/src/dom.min.js +1 -1
- package/lib/ui/src/log.js +1 -1
- package/lib/ui/src/log.min.js +1 -1
- package/lib/vxe-button/style/style.css +24 -2
- package/lib/vxe-button/style/style.min.css +1 -1
- package/lib/vxe-color-picker/style/style.css +15 -0
- package/lib/vxe-color-picker/style/style.min.css +1 -1
- package/lib/vxe-date-picker/style/style.css +3 -2
- package/lib/vxe-date-picker/style/style.min.css +1 -1
- package/lib/vxe-date-range-picker/style/style.css +3 -2
- package/lib/vxe-date-range-picker/style/style.min.css +1 -1
- package/lib/vxe-pulldown/style/style.css +0 -4
- package/lib/vxe-pulldown/style/style.min.css +1 -1
- package/lib/vxe-table-select/style/style.css +0 -1
- package/lib/vxe-table-select/style/style.min.css +1 -1
- package/lib/vxe-tree-select/style/style.css +0 -1
- package/lib/vxe-tree-select/style/style.min.css +1 -1
- package/package.json +1 -1
- package/packages/button/src/button.ts +87 -88
- package/packages/color-picker/src/color-picker.ts +19 -69
- package/packages/date-picker/src/date-picker.ts +20 -72
- package/packages/date-range-picker/src/date-range-picker.ts +24 -76
- package/packages/pulldown/src/pulldown.ts +20 -72
- package/packages/select/src/select.ts +19 -69
- package/packages/table-select/src/table-select.ts +19 -69
- package/packages/tree-select/src/tree-select.ts +19 -69
- package/packages/ui/src/dom.ts +95 -0
- package/styles/components/button.scss +3 -20
- package/styles/components/color-picker.scss +2 -27
- package/styles/components/date-picker.scss +2 -34
- package/styles/components/date-range-picker.scss +2 -34
- package/styles/components/pulldown.scss +2 -41
- package/styles/components/select.scss +2 -35
- package/styles/components/table-select.scss +2 -36
- package/styles/components/tree-select.scss +2 -36
- package/styles/helpers/placement.scss +39 -0
- package/types/components/button.d.ts +12 -1
- package/types/components/table.d.ts +56 -3
- /package/es/icon/{iconfont.1747024965925.ttf → iconfont.1747109497236.ttf} +0 -0
- /package/es/icon/{iconfont.1747024965925.woff → iconfont.1747109497236.woff} +0 -0
- /package/es/icon/{iconfont.1747024965925.woff2 → iconfont.1747109497236.woff2} +0 -0
- /package/es/{iconfont.1747024965925.ttf → iconfont.1747109497236.ttf} +0 -0
- /package/es/{iconfont.1747024965925.woff → iconfont.1747109497236.woff} +0 -0
- /package/es/{iconfont.1747024965925.woff2 → iconfont.1747109497236.woff2} +0 -0
- /package/lib/icon/style/{iconfont.1747024965925.ttf → iconfont.1747109497236.ttf} +0 -0
- /package/lib/icon/style/{iconfont.1747024965925.woff → iconfont.1747109497236.woff} +0 -0
- /package/lib/icon/style/{iconfont.1747024965925.woff2 → iconfont.1747109497236.woff2} +0 -0
- /package/lib/{iconfont.1747024965925.ttf → iconfont.1747109497236.ttf} +0 -0
- /package/lib/{iconfont.1747024965925.woff → iconfont.1747109497236.woff} +0 -0
- /package/lib/{iconfont.1747024965925.woff2 → iconfont.1747109497236.woff2} +0 -0
|
@@ -110,9 +110,11 @@
|
|
|
110
110
|
left: 0;
|
|
111
111
|
padding: 4px 0;
|
|
112
112
|
color: var(--vxe-ui-font-color);
|
|
113
|
-
font-size: var(--vxe-ui-font-size-default);
|
|
114
113
|
text-align: left;
|
|
115
114
|
}
|
|
115
|
+
.vxe-date-range-picker--panel:not(.is--transfer) {
|
|
116
|
+
min-width: 100%;
|
|
117
|
+
}
|
|
116
118
|
.vxe-date-range-picker--panel.is--transfer {
|
|
117
119
|
position: fixed;
|
|
118
120
|
}
|
|
@@ -123,7 +125,6 @@
|
|
|
123
125
|
transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1);
|
|
124
126
|
transform-origin: center top;
|
|
125
127
|
backface-visibility: hidden;
|
|
126
|
-
transform-style: preserve-3d;
|
|
127
128
|
}
|
|
128
129
|
.vxe-date-range-picker--panel.ani--leave[placement=top] {
|
|
129
130
|
transform-origin: center bottom;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.vxe-date-range-picker--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-date-range-picker--wrapper{flex-grow:1;overflow:hidden}.vxe-date-range-picker--inner{display:block;width:100%;height:100%;outline:0;margin:0;font-size:inherit;font-family:inherit;line-height:inherit;padding:0 .5em;color:var(--vxe-ui-font-color);border:0;border-radius:var(--vxe-ui-base-border-radius);background-color:var(--vxe-ui-layout-background-color);box-shadow:none}.vxe-date-range-picker--inner::-moz-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-date-range-picker--inner::placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-date-range-picker--inner::-webkit-autofill{background-color:var(--vxe-ui-layout-background-color)}.vxe-date-range-picker--inner[disabled]{cursor:not-allowed;color:var(--vxe-ui-font-disabled-color);background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-date-range-picker.is--disabled{background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-date-range-picker.is--disabled .vxe-date-range-picker--clear-icon,.vxe-date-range-picker.is--disabled .vxe-date-range-picker--control-icon,.vxe-date-range-picker.is--disabled .vxe-date-range-picker--prefix,.vxe-date-range-picker.is--disabled .vxe-date-range-picker--suffix{cursor:not-allowed}.vxe-date-range-picker.is--disabled .vxe-date-range-picker--prefix,.vxe-date-range-picker.is--disabled .vxe-date-range-picker--suffix{background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-date-range-picker{display:inline-flex;flex-direction:row;position:relative;border-radius:var(--vxe-ui-base-border-radius);width:330px;border:1px solid var(--vxe-ui-input-border-color)}.vxe-date-range-picker.is--active{border:1px solid var(--vxe-ui-font-primary-color)}.vxe-date-range-picker.show--clear:hover .vxe-date-range-picker--clear-icon{display:block}.vxe-date-range-picker--prefix,.vxe-date-range-picker--suffix{display:flex;flex-direction:row;align-items:center;flex-shrink:0;background-color:var(--vxe-ui-layout-background-color)}.vxe-date-range-picker--prefix-icon{padding-left:.5em}.vxe-date-range-picker--clear-icon,.vxe-date-range-picker--control-icon,.vxe-date-range-picker--suffix-icon{padding-right:.5em}.vxe-date-range-picker--clear-icon,.vxe-date-range-picker--control-icon{height:100%;color:var(--vxe-ui-input-placeholder-color);cursor:pointer}.vxe-date-range-picker--clear-icon{display:none}.vxe-date-range-picker--clear-icon:hover{color:var(--vxe-ui-font-color)}.vxe-date-range-picker--clear-icon:active{color:var(--vxe-ui-font-primary-color)}.vxe-date-range-picker--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);
|
|
1
|
+
.vxe-date-range-picker--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-date-range-picker--wrapper{flex-grow:1;overflow:hidden}.vxe-date-range-picker--inner{display:block;width:100%;height:100%;outline:0;margin:0;font-size:inherit;font-family:inherit;line-height:inherit;padding:0 .5em;color:var(--vxe-ui-font-color);border:0;border-radius:var(--vxe-ui-base-border-radius);background-color:var(--vxe-ui-layout-background-color);box-shadow:none}.vxe-date-range-picker--inner::-moz-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-date-range-picker--inner::placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-date-range-picker--inner::-webkit-autofill{background-color:var(--vxe-ui-layout-background-color)}.vxe-date-range-picker--inner[disabled]{cursor:not-allowed;color:var(--vxe-ui-font-disabled-color);background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-date-range-picker.is--disabled{background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-date-range-picker.is--disabled .vxe-date-range-picker--clear-icon,.vxe-date-range-picker.is--disabled .vxe-date-range-picker--control-icon,.vxe-date-range-picker.is--disabled .vxe-date-range-picker--prefix,.vxe-date-range-picker.is--disabled .vxe-date-range-picker--suffix{cursor:not-allowed}.vxe-date-range-picker.is--disabled .vxe-date-range-picker--prefix,.vxe-date-range-picker.is--disabled .vxe-date-range-picker--suffix{background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-date-range-picker{display:inline-flex;flex-direction:row;position:relative;border-radius:var(--vxe-ui-base-border-radius);width:330px;border:1px solid var(--vxe-ui-input-border-color)}.vxe-date-range-picker.is--active{border:1px solid var(--vxe-ui-font-primary-color)}.vxe-date-range-picker.show--clear:hover .vxe-date-range-picker--clear-icon{display:block}.vxe-date-range-picker--prefix,.vxe-date-range-picker--suffix{display:flex;flex-direction:row;align-items:center;flex-shrink:0;background-color:var(--vxe-ui-layout-background-color)}.vxe-date-range-picker--prefix-icon{padding-left:.5em}.vxe-date-range-picker--clear-icon,.vxe-date-range-picker--control-icon,.vxe-date-range-picker--suffix-icon{padding-right:.5em}.vxe-date-range-picker--clear-icon,.vxe-date-range-picker--control-icon{height:100%;color:var(--vxe-ui-input-placeholder-color);cursor:pointer}.vxe-date-range-picker--clear-icon{display:none}.vxe-date-range-picker--clear-icon:hover{color:var(--vxe-ui-font-color)}.vxe-date-range-picker--clear-icon:active{color:var(--vxe-ui-font-primary-color)}.vxe-date-range-picker--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left}.vxe-date-range-picker--panel:not(.is--transfer){min-width:100%}.vxe-date-range-picker--panel.is--transfer{position:fixed}.vxe-date-range-picker--panel.ani--leave{display:block;opacity:0;transform:scaleY(.5);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top;backface-visibility:hidden}.vxe-date-range-picker--panel.ani--leave[placement=top]{transform-origin:center bottom}.vxe-date-range-picker--panel.ani--enter{opacity:1;transform:scaleY(1)}.vxe-date-range-picker--panel.ani--enter>div::after{display:none}.vxe-date-range-picker--panel>div::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-date-range-picker--panel{pointer-events:none}.vxe-date-range-picker--panel.show--right .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--right .vxe-date-range-picker--layout-wrapper,.vxe-date-range-picker--panel.show--top .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--top .vxe-date-range-picker--layout-wrapper{border-top-right-radius:0}.vxe-date-range-picker--panel.show--bottom .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--bottom .vxe-date-range-picker--layout-wrapper,.vxe-date-range-picker--panel.show--right .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--right .vxe-date-range-picker--layout-wrapper{border-bottom-right-radius:0}.vxe-date-range-picker--panel.show--bottom .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--bottom .vxe-date-range-picker--layout-wrapper,.vxe-date-range-picker--panel.show--left .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--left .vxe-date-range-picker--layout-wrapper{border-bottom-left-radius:0}.vxe-date-range-picker--panel.show--left .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--left .vxe-date-range-picker--layout-wrapper,.vxe-date-range-picker--panel.show--top .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--top .vxe-date-range-picker--layout-wrapper{border-top-left-radius:0}.vxe-date-range-picker--panel.show--top .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--top .vxe-date-range-picker--layout-wrapper{border-top-width:1px}.vxe-date-range-picker--panel.show--bottom .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--bottom .vxe-date-range-picker--layout-wrapper{border-bottom-width:1px}.vxe-date-range-picker--panel.show--left .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--left .vxe-date-range-picker--layout-wrapper{border-left-width:1px}.vxe-date-range-picker--panel.show--right .vxe-date-range-picker--layout-datetime-layout-wrapper,.vxe-date-range-picker--panel.show--right .vxe-date-range-picker--layout-wrapper{border-right-width:1px}.vxe-date-range-picker--layout-all-wrapper{display:inline-flex;flex-direction:column;pointer-events:auto;background-color:var(--vxe-ui-layout-background-color);border:1px solid var(--vxe-ui-base-popup-border-color);box-shadow:0 0 6px 2px rgba(0,0,0,.1);border-radius:var(--vxe-ui-base-border-radius);line-height:1.5}.vxe-date-range-picker--layout-body-layout-wrapper{display:flex;flex-direction:row;white-space:nowrap}.vxe-date-range-picker--layout-body-content-wrapper,.vxe-date-range-picker--layout-body-layout-wrapper,.vxe-date-range-picker--layout-body-wrapper{flex-grow:1}.vxe-date-range-picker--layout-body-wrapper{display:flex;flex-direction:row}.vxe-date-range-picker--layout-bottom-wrapper,.vxe-date-range-picker--layout-footer-wrapper,.vxe-date-range-picker--layout-header-wrapper,.vxe-date-range-picker--layout-left-wrapper,.vxe-date-range-picker--layout-right-wrapper,.vxe-date-range-picker--layout-top-wrapper{flex-shrink:0}.vxe-date-range-picker--layout-top-wrapper{border-bottom:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-range-picker--layout-bottom-wrapper{border-top:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-range-picker--layout-left-wrapper{border-right:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-range-picker--layout-right-wrapper{border-left:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-range-picker--layout-footer-wrapper{display:flex;flex-direction:row;padding:0 .8em .8em .8em}.vxe-date-range-picker--layout-footer-label{padding-right:.8em;flex-shrink:0}.vxe-date-range-picker--layout-footer-custom{flex-grow:1;text-align:right}.vxe-date-range-picker--layout-footer-btns{flex-shrink:0;padding-left:.8em}.vxe-date-range-picker{font-size:var(--vxe-ui-font-size-default);height:var(--vxe-ui-input-height-default);line-height:var(--vxe-ui-input-height-default)}.vxe-date-range-picker.size--medium{font-size:var(--vxe-ui-font-size-medium);height:var(--vxe-ui-input-height-medium);line-height:var(--vxe-ui-input-height-medium)}.vxe-date-range-picker.size--small{font-size:var(--vxe-ui-font-size-small);height:var(--vxe-ui-input-height-small);line-height:var(--vxe-ui-input-height-small)}.vxe-date-range-picker.size--mini{font-size:var(--vxe-ui-font-size-mini);height:var(--vxe-ui-input-height-mini);line-height:var(--vxe-ui-input-height-mini)}
|
|
@@ -13,14 +13,10 @@
|
|
|
13
13
|
padding: 4px 0;
|
|
14
14
|
color: var(--vxe-ui-font-color);
|
|
15
15
|
text-align: left;
|
|
16
|
-
outline: 0;
|
|
17
16
|
}
|
|
18
17
|
.vxe-pulldown--panel:not(.is--transfer) {
|
|
19
18
|
min-width: 100%;
|
|
20
19
|
}
|
|
21
|
-
.vxe-pulldown--panel.is--shadow .vxe-pulldown--panel-wrapper {
|
|
22
|
-
box-shadow: var(--vxe-ui-base-popup-box-shadow);
|
|
23
|
-
}
|
|
24
20
|
.vxe-pulldown--panel.is--transfer {
|
|
25
21
|
position: fixed;
|
|
26
22
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.vxe-pulldown{position:relative;display:inline-block;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family);text-align:left}.vxe-pulldown--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left
|
|
1
|
+
.vxe-pulldown{position:relative;display:inline-block;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family);text-align:left}.vxe-pulldown--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left}.vxe-pulldown--panel:not(.is--transfer){min-width:100%}.vxe-pulldown--panel.is--transfer{position:fixed}.vxe-pulldown--panel.ani--leave{display:block;opacity:0;transform:scaleY(.5);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top;backface-visibility:hidden}.vxe-pulldown--panel.ani--leave[placement=top]{transform-origin:center bottom}.vxe-pulldown--panel.ani--enter{opacity:1;transform:scaleY(1)}.vxe-pulldown--panel.ani--enter>div::after{display:none}.vxe-pulldown--panel>div::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-pulldown--panel-wrapper{background-color:var(--vxe-ui-layout-background-color)}.vxe-pulldown--panel-list .vxe-pulldown--panel-item{line-height:30px;max-width:50vw;padding:0 var(--vxe-ui-layout-padding-default);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-pulldown--panel-list .vxe-pulldown--panel-item:not(.is--disabled){cursor:pointer}.vxe-pulldown--panel-list .vxe-pulldown--panel-item:not(.is--disabled):hover{background-color:var(--vxe-ui-base-hover-background-color)}.vxe-pulldown--panel-list .vxe-pulldown--panel-item.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:no-drop}.vxe-pulldown,.vxe-pulldown--panel{font-size:var(--vxe-ui-font-size-default)}.vxe-pulldown--panel.size--medium,.vxe-pulldown.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-pulldown--panel.size--small,.vxe-pulldown.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-pulldown--panel.size--mini,.vxe-pulldown.size--mini{font-size:var(--vxe-ui-font-size-mini)}.vxe-pulldown--panel .vxe-pulldown--panel-item{height:var(--vxe-ui-pulldown-option-height-default)}.vxe-pulldown--panel.size--medium .vxe-pulldown--panel-item{height:var(--vxe-ui-pulldown-option-height-medium)}.vxe-pulldown--panel.size--small .vxe-pulldown--panel-item{height:var(--vxe-ui-pulldown-option-height-medium)}.vxe-pulldown--panel.size--mini .vxe-pulldown--panel-item{height:var(--vxe-ui-pulldown-option-height-medium)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.vxe-table-select{position:relative;display:inline-block;width:180px;color:var(--vxe-ui-font-color);text-align:left}.vxe-table-select>.vxe-input .vxe-input--inner{cursor:pointer}.vxe-table-select.is--disabled>.vxe-input .vxe-input--inner{cursor:no-drop}.vxe-table-select.is--loading>.vxe-input .vxe-input--inner{cursor:progress}.vxe-table-select>.vxe-input{width:100%}.vxe-table-select>.vxe-input .vxe-input--suffix-icon>i{display:inline-block;transition:transform .2s ease-in-out}.vxe-table-select.is--active:not(.is--filter)>.vxe-input{border-color:var(--vxe-ui-font-primary-color)}.vxe-table-select--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-table-select--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left
|
|
1
|
+
.vxe-table-select{position:relative;display:inline-block;width:180px;color:var(--vxe-ui-font-color);text-align:left}.vxe-table-select>.vxe-input .vxe-input--inner{cursor:pointer}.vxe-table-select.is--disabled>.vxe-input .vxe-input--inner{cursor:no-drop}.vxe-table-select.is--loading>.vxe-input .vxe-input--inner{cursor:progress}.vxe-table-select>.vxe-input{width:100%}.vxe-table-select>.vxe-input .vxe-input--suffix-icon>i{display:inline-block;transition:transform .2s ease-in-out}.vxe-table-select.is--active:not(.is--filter)>.vxe-input{border-color:var(--vxe-ui-font-primary-color)}.vxe-table-select--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-table-select--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left}.vxe-table-select--panel:not(.is--transfer){min-width:100%}.vxe-table-select--panel.is--transfer{position:fixed}.vxe-table-select--panel.ani--leave{display:block;opacity:0;transform:scaleY(.5);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top;backface-visibility:hidden}.vxe-table-select--panel.ani--leave[placement=top]{transform-origin:center bottom}.vxe-table-select--panel.ani--enter{opacity:1;transform:scaleY(1)}.vxe-table-select--panel.ani--enter>div::after{display:none}.vxe-table-select--panel>div::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-table-select--panel-search{display:block}.vxe-table-select--panel-search .vxe-table-select-search--input{width:100%}.vxe-table-select--panel-wrapper{display:inline-flex;position:relative;border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-base-popup-border-color);box-shadow:var(--vxe-ui-base-popup-box-shadow);background-color:var(--vxe-ui-layout-background-color);pointer-events:auto}.vxe-table-select--panel-header{border-bottom:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-table-select--panel-footer{border-top:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-table-select--panel-footer,.vxe-table-select--panel-header{padding:4px 0}.vxe-table-select-grid--wrapper{position:relative;overflow:auto;padding:var(--vxe-ui-layout-padding-default);height:21em;width:36em;outline:0}.vxe-table-select,.vxe-table-select--panel{font-size:var(--vxe-ui-font-size-default)}.vxe-table-select--panel.size--medium,.vxe-table-select.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-table-select--panel.size--small,.vxe-table-select.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-table-select--panel.size--mini,.vxe-table-select.size--mini{font-size:var(--vxe-ui-font-size-mini)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.vxe-tree-select{position:relative;display:inline-block;width:180px;color:var(--vxe-ui-font-color);text-align:left}.vxe-tree-select>.vxe-input .vxe-input--inner{cursor:pointer}.vxe-tree-select.is--disabled>.vxe-input .vxe-input--inner{cursor:no-drop}.vxe-tree-select.is--loading>.vxe-input .vxe-input--inner{cursor:progress}.vxe-tree-select>.vxe-input{width:100%}.vxe-tree-select>.vxe-input .vxe-input--suffix-icon>i{display:inline-block;transition:transform .2s ease-in-out}.vxe-tree-select.is--active:not(.is--filter)>.vxe-input{border-color:var(--vxe-ui-font-primary-color)}.vxe-tree-select--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-tree-select--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left
|
|
1
|
+
.vxe-tree-select{position:relative;display:inline-block;width:180px;color:var(--vxe-ui-font-color);text-align:left}.vxe-tree-select>.vxe-input .vxe-input--inner{cursor:pointer}.vxe-tree-select.is--disabled>.vxe-input .vxe-input--inner{cursor:no-drop}.vxe-tree-select.is--loading>.vxe-input .vxe-input--inner{cursor:progress}.vxe-tree-select>.vxe-input{width:100%}.vxe-tree-select>.vxe-input .vxe-input--suffix-icon>i{display:inline-block;transition:transform .2s ease-in-out}.vxe-tree-select.is--active:not(.is--filter)>.vxe-input{border-color:var(--vxe-ui-font-primary-color)}.vxe-tree-select--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-tree-select--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left}.vxe-tree-select--panel:not(.is--transfer){min-width:100%}.vxe-tree-select--panel.is--transfer{position:fixed}.vxe-tree-select--panel.ani--leave{display:block;opacity:0;transform:scaleY(.5);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top;backface-visibility:hidden}.vxe-tree-select--panel.ani--leave[placement=top]{transform-origin:center bottom}.vxe-tree-select--panel.ani--enter{opacity:1;transform:scaleY(1)}.vxe-tree-select--panel.ani--enter>div::after{display:none}.vxe-tree-select--panel>div::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-tree-select--panel-search{display:block}.vxe-tree-select--panel-search .vxe-tree-select-search--input{width:100%}.vxe-tree-select--panel-wrapper{display:inline-flex;position:relative;border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-base-popup-border-color);box-shadow:var(--vxe-ui-base-popup-box-shadow);background-color:var(--vxe-ui-layout-background-color);pointer-events:auto}.vxe-tree-select--panel-header{border-bottom:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-tree-select--panel-footer{border-top:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-tree-select--panel-footer,.vxe-tree-select--panel-header{padding:4px 0}.vxe-tree-select-tree--wrapper{position:relative;overflow:auto;padding:var(--vxe-ui-layout-padding-default);max-height:21em;width:30em;outline:0}.vxe-tree-select--tree{width:100%}.vxe-tree-select--tree .vxe-tree--node-item.is-checkbox--checked>.vxe-tree--node-item-inner,.vxe-tree-select--tree .vxe-tree--node-item.is-radio--checked>.vxe-tree--node-item-inner{color:var(--vxe-ui-font-primary-color)}.vxe-tree-select--tree .vxe-tree--node-item-inner{cursor:pointer}.vxe-tree-select,.vxe-tree-select--panel{font-size:var(--vxe-ui-font-size-default)}.vxe-tree-select--panel.size--medium,.vxe-tree-select.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-tree-select--panel.size--small,.vxe-tree-select.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-tree-select--panel.size--mini,.vxe-tree-select.size--mini{font-size:var(--vxe-ui-font-size-mini)}
|
package/lib/button/src/button.js
CHANGED
|
@@ -12,7 +12,7 @@ var _utils = require("../../ui/src/utils");
|
|
|
12
12
|
var _log = require("../../ui/src/log");
|
|
13
13
|
var _tooltip = _interopRequireDefault(require("../../tooltip/src/tooltip"));
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
15
|
+
const VxeButtonComponent = (0, _vue.defineComponent)({
|
|
16
16
|
name: 'VxeButton',
|
|
17
17
|
props: {
|
|
18
18
|
/**
|
|
@@ -81,6 +81,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
81
81
|
align: String,
|
|
82
82
|
prefixTooltip: Object,
|
|
83
83
|
suffixTooltip: Object,
|
|
84
|
+
options: Array,
|
|
84
85
|
/**
|
|
85
86
|
* 在下拉面板关闭时销毁内容
|
|
86
87
|
*/
|
|
@@ -231,6 +232,20 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
231
232
|
}
|
|
232
233
|
return false;
|
|
233
234
|
});
|
|
235
|
+
const computeDownBtnList = (0, _vue.computed)(() => {
|
|
236
|
+
const {
|
|
237
|
+
options
|
|
238
|
+
} = props;
|
|
239
|
+
if (options) {
|
|
240
|
+
return options.filter(item => {
|
|
241
|
+
const {
|
|
242
|
+
permissionCode
|
|
243
|
+
} = item;
|
|
244
|
+
return !permissionCode || _ui.permission.checkVisible(permissionCode);
|
|
245
|
+
});
|
|
246
|
+
}
|
|
247
|
+
return [];
|
|
248
|
+
});
|
|
234
249
|
const computePrefixTipOpts = (0, _vue.computed)(() => {
|
|
235
250
|
return Object.assign({}, props.prefixTooltip);
|
|
236
251
|
});
|
|
@@ -243,85 +258,28 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
243
258
|
}
|
|
244
259
|
};
|
|
245
260
|
const updatePlacement = () => {
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
boundingTop,
|
|
269
|
-
visibleHeight,
|
|
270
|
-
visibleWidth
|
|
271
|
-
} = (0, _dom.getAbsolutePos)(targetElem);
|
|
272
|
-
let panelPlacement = 'bottom';
|
|
273
|
-
if (btnTransfer) {
|
|
274
|
-
let btnLeft = left + targetWidth - panelWidth;
|
|
275
|
-
let btnTop = top + targetHeight;
|
|
276
|
-
if (placement === 'top') {
|
|
277
|
-
panelPlacement = 'top';
|
|
278
|
-
btnTop = top - panelHeight;
|
|
279
|
-
} else if (!placement) {
|
|
280
|
-
// 如果下面不够放,则向上
|
|
281
|
-
if (boundingTop + targetHeight + panelHeight + marginSize > visibleHeight) {
|
|
282
|
-
panelPlacement = 'top';
|
|
283
|
-
btnTop = top - panelHeight;
|
|
284
|
-
}
|
|
285
|
-
// 如果上面不够放,则向下(优先)
|
|
286
|
-
if (btnTop < marginSize) {
|
|
287
|
-
panelPlacement = 'bottom';
|
|
288
|
-
btnTop = top + targetHeight;
|
|
289
|
-
}
|
|
290
|
-
}
|
|
291
|
-
// 如果溢出右边
|
|
292
|
-
if (btnLeft + panelWidth + marginSize > visibleWidth) {
|
|
293
|
-
btnLeft -= btnLeft + panelWidth + marginSize - visibleWidth;
|
|
294
|
-
}
|
|
295
|
-
// 如果溢出左边
|
|
296
|
-
if (btnLeft < marginSize) {
|
|
297
|
-
btnLeft = marginSize;
|
|
298
|
-
}
|
|
299
|
-
Object.assign(panelStyle, {
|
|
300
|
-
left: `${btnLeft}px`,
|
|
301
|
-
right: 'auto',
|
|
302
|
-
top: `${btnTop}px`,
|
|
303
|
-
minWidth: `${targetWidth}px`
|
|
304
|
-
});
|
|
305
|
-
} else {
|
|
306
|
-
if (placement === 'top') {
|
|
307
|
-
panelPlacement = 'top';
|
|
308
|
-
panelStyle.bottom = `${targetHeight}px`;
|
|
309
|
-
} else if (!placement) {
|
|
310
|
-
// 如果下面不够放,则向上
|
|
311
|
-
if (boundingTop + targetHeight + panelHeight > visibleHeight) {
|
|
312
|
-
// 如果上面不够放,则向下(优先)
|
|
313
|
-
if (boundingTop - targetHeight - panelHeight > marginSize) {
|
|
314
|
-
panelPlacement = 'top';
|
|
315
|
-
panelStyle.bottom = `${targetHeight}px`;
|
|
316
|
-
}
|
|
317
|
-
}
|
|
318
|
-
}
|
|
319
|
-
}
|
|
320
|
-
reactData.panelStyle = panelStyle;
|
|
321
|
-
reactData.panelPlacement = panelPlacement;
|
|
322
|
-
return (0, _vue.nextTick)();
|
|
323
|
-
}
|
|
324
|
-
});
|
|
261
|
+
const {
|
|
262
|
+
placement
|
|
263
|
+
} = props;
|
|
264
|
+
const {
|
|
265
|
+
panelIndex
|
|
266
|
+
} = reactData;
|
|
267
|
+
const targetElem = refButton.value;
|
|
268
|
+
const panelElem = refBtnPanel.value;
|
|
269
|
+
const btnTransfer = computeBtnTransfer.value;
|
|
270
|
+
const handleStyle = () => {
|
|
271
|
+
const ppObj = (0, _dom.updatePanelPlacement)(targetElem, panelElem, {
|
|
272
|
+
placement,
|
|
273
|
+
teleportTo: btnTransfer
|
|
274
|
+
});
|
|
275
|
+
const panelStyle = Object.assign(ppObj.style, {
|
|
276
|
+
zIndex: panelIndex
|
|
277
|
+
});
|
|
278
|
+
reactData.panelStyle = panelStyle;
|
|
279
|
+
reactData.panelPlacement = ppObj.placement;
|
|
280
|
+
};
|
|
281
|
+
handleStyle();
|
|
282
|
+
return (0, _vue.nextTick)().then(handleStyle);
|
|
325
283
|
};
|
|
326
284
|
const clickEvent = evnt => {
|
|
327
285
|
if ($xeButtonGroup) {
|
|
@@ -333,6 +291,16 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
333
291
|
$event: evnt
|
|
334
292
|
}, evnt);
|
|
335
293
|
};
|
|
294
|
+
const downBtnClickEvent = (params, option) => {
|
|
295
|
+
const {
|
|
296
|
+
$event
|
|
297
|
+
} = params;
|
|
298
|
+
hidePanel();
|
|
299
|
+
dispatchEvent('dropdown-click', {
|
|
300
|
+
name: option.name,
|
|
301
|
+
option
|
|
302
|
+
}, $event);
|
|
303
|
+
};
|
|
336
304
|
const mousedownDropdownEvent = evnt => {
|
|
337
305
|
const isLeftBtn = evnt.button === 0;
|
|
338
306
|
if (isLeftBtn) {
|
|
@@ -358,7 +326,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
358
326
|
}, 350);
|
|
359
327
|
dispatchEvent('dropdown-click', {
|
|
360
328
|
name: targetElem.getAttribute('name'),
|
|
361
|
-
|
|
329
|
+
option: null
|
|
362
330
|
}, evnt);
|
|
363
331
|
}
|
|
364
332
|
};
|
|
@@ -392,7 +360,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
392
360
|
}
|
|
393
361
|
};
|
|
394
362
|
const mouseleaveTargetEvent = evnt => {
|
|
395
|
-
|
|
363
|
+
hidePanel();
|
|
396
364
|
mouseleaveEvent(evnt);
|
|
397
365
|
};
|
|
398
366
|
const mouseenterEvent = evnt => {
|
|
@@ -410,7 +378,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
410
378
|
if (!(btnDisabled || loading)) {
|
|
411
379
|
if (trigger === 'click') {
|
|
412
380
|
if (reactData.visiblePanel) {
|
|
413
|
-
|
|
381
|
+
hidePanel();
|
|
414
382
|
} else {
|
|
415
383
|
openPanel();
|
|
416
384
|
}
|
|
@@ -438,7 +406,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
438
406
|
}
|
|
439
407
|
return (0, _vue.nextTick)();
|
|
440
408
|
};
|
|
441
|
-
const
|
|
409
|
+
const hidePanel = () => {
|
|
442
410
|
const panelElem = refBtnPanel.value;
|
|
443
411
|
clearTimeout(internalData.showTime);
|
|
444
412
|
if (panelElem) {
|
|
@@ -460,7 +428,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
460
428
|
return (0, _vue.nextTick)();
|
|
461
429
|
};
|
|
462
430
|
const mouseleaveDropdownEvent = () => {
|
|
463
|
-
|
|
431
|
+
hidePanel();
|
|
464
432
|
};
|
|
465
433
|
const renderTooltipIcon = (tipOpts, type) => {
|
|
466
434
|
return (0, _vue.h)(_tooltip.default, {
|
|
@@ -527,7 +495,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
527
495
|
buttonMethods = {
|
|
528
496
|
dispatchEvent,
|
|
529
497
|
openPanel,
|
|
530
|
-
closePanel,
|
|
498
|
+
closePanel: hidePanel,
|
|
531
499
|
focus() {
|
|
532
500
|
const btnElem = refButton.value;
|
|
533
501
|
if (btnElem) {
|
|
@@ -546,7 +514,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
546
514
|
const handleGlobalMousewheelEvent = evnt => {
|
|
547
515
|
const panelElem = refBtnPanel.value;
|
|
548
516
|
if (reactData.visiblePanel && !(0, _dom.getEventTargetNode)(evnt, panelElem).flag) {
|
|
549
|
-
|
|
517
|
+
hidePanel();
|
|
550
518
|
}
|
|
551
519
|
};
|
|
552
520
|
const handleGlobalMousedownEvent = evnt => {
|
|
@@ -559,7 +527,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
559
527
|
const panelElem = refBtnPanel.value;
|
|
560
528
|
reactData.isActivated = (0, _dom.getEventTargetNode)(evnt, el).flag || (0, _dom.getEventTargetNode)(evnt, panelElem).flag;
|
|
561
529
|
if (visiblePanel && !reactData.isActivated) {
|
|
562
|
-
|
|
530
|
+
hidePanel();
|
|
563
531
|
}
|
|
564
532
|
}
|
|
565
533
|
};
|
|
@@ -590,12 +558,13 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
590
558
|
const btnTransfer = computeBtnTransfer.value;
|
|
591
559
|
const btnDisabled = computeBtnDisabled.value;
|
|
592
560
|
const permissionInfo = computePermissionInfo.value;
|
|
561
|
+
const downBtnList = computeDownBtnList.value;
|
|
593
562
|
const vSize = computeSize.value;
|
|
594
|
-
const
|
|
563
|
+
const dropdownsSlot = slots.dropdowns;
|
|
595
564
|
if (!permissionInfo.visible) {
|
|
596
565
|
return (0, _vue.createCommentVNode)();
|
|
597
566
|
}
|
|
598
|
-
if (
|
|
567
|
+
if (dropdownsSlot || downBtnList.length) {
|
|
599
568
|
const btnOns = {};
|
|
600
569
|
const panelOns = {};
|
|
601
570
|
if (trigger === 'hover') {
|
|
@@ -665,16 +634,41 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
665
634
|
$button: $xeButton
|
|
666
635
|
}) : popupClassName : '', {
|
|
667
636
|
[`size--${vSize}`]: vSize,
|
|
637
|
+
'is--transfer': btnTransfer,
|
|
668
638
|
'ani--leave': isAniVisible,
|
|
669
639
|
'ani--enter': visiblePanel
|
|
670
640
|
}],
|
|
671
641
|
placement: reactData.panelPlacement,
|
|
672
642
|
style: reactData.panelStyle
|
|
673
|
-
}, panelOns), initialized && (visiblePanel || isAniVisible) ? [(0, _vue.h)('div', {
|
|
643
|
+
}, panelOns), initialized && (visiblePanel || isAniVisible) ? [dropdownsSlot ? (0, _vue.h)('div', {
|
|
674
644
|
class: 'vxe-button--dropdown-wrapper',
|
|
675
645
|
onMousedown: mousedownDropdownEvent,
|
|
676
646
|
onClick: clickDropdownEvent
|
|
677
|
-
},
|
|
647
|
+
}, initialized && (destroyOnClose ? visiblePanel || isAniVisible : true) ? dropdownsSlot({}) : []) : (0, _vue.h)('div', {
|
|
648
|
+
class: 'vxe-button--dropdown-wrapper'
|
|
649
|
+
}, initialized && (destroyOnClose ? visiblePanel || isAniVisible : true) ? downBtnList.map((option, i) => {
|
|
650
|
+
return (0, _vue.h)(VxeButtonComponent, {
|
|
651
|
+
key: i,
|
|
652
|
+
type: option.type,
|
|
653
|
+
mode: option.mode || btnMode,
|
|
654
|
+
className: option.className,
|
|
655
|
+
name: option.name,
|
|
656
|
+
routerLink: option.routerLink,
|
|
657
|
+
permissionCode: option.permissionCode,
|
|
658
|
+
title: option.title,
|
|
659
|
+
content: option.content,
|
|
660
|
+
status: option.status,
|
|
661
|
+
icon: option.icon,
|
|
662
|
+
round: _xeUtils.default.isBoolean(option.round) ? option.round : btnMode === 'text' ? false : btnRound,
|
|
663
|
+
circle: _xeUtils.default.isBoolean(option.circle) ? option.circle : btnMode === 'text' ? false : btnCircle,
|
|
664
|
+
disabled: option.disabled,
|
|
665
|
+
loading: option.loading,
|
|
666
|
+
align: option.align,
|
|
667
|
+
onClick(params) {
|
|
668
|
+
downBtnClickEvent(params, option);
|
|
669
|
+
}
|
|
670
|
+
});
|
|
671
|
+
}) : [])] : [])])]);
|
|
678
672
|
}
|
|
679
673
|
if (routerLink) {
|
|
680
674
|
return (0, _vue.h)((0, _vue.resolveComponent)('router-link'), {
|
|
@@ -743,4 +737,5 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
743
737
|
render() {
|
|
744
738
|
return this.renderVN();
|
|
745
739
|
}
|
|
746
|
-
});
|
|
740
|
+
});
|
|
741
|
+
var _default = exports.default = VxeButtonComponent;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_dom=require("../../ui/src/dom"),_utils=require("../../ui/src/utils"),_log=require("../../ui/src/log"),_tooltip=_interopRequireDefault(require("../../tooltip/src/tooltip"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_dom=require("../../ui/src/dom"),_utils=require("../../ui/src/utils"),_log=require("../../ui/src/log"),_tooltip=_interopRequireDefault(require("../../tooltip/src/tooltip"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const VxeButtonComponent=(0,_vue.defineComponent)({name:"VxeButton",props:{type:String,mode:String,className:[String,Function],popupClassName:[String,Function],size:{type:String,default:()=>(0,_ui.getConfig)().button.size||(0,_ui.getConfig)().size},name:[String,Number],routerLink:Object,permissionCode:[String,Number],content:String,placement:String,status:String,title:String,icon:String,round:Boolean,circle:Boolean,disabled:Boolean,loading:Boolean,trigger:{type:String,default:()=>(0,_ui.getConfig)().button.trigger},align:String,prefixTooltip:Object,suffixTooltip:Object,options:Array,destroyOnClose:{type:Boolean,default:()=>(0,_ui.getConfig)().button.destroyOnClose},transfer:{type:Boolean,default:null}},emits:["click","mouseenter","mouseleave","dropdown-click"],setup(O,e){const{slots:N,emit:i}=e,n=(0,_vue.inject)("$xeModal",null),o=(0,_vue.inject)("$xeDrawer",null),u=(0,_vue.inject)("$xeTable",null),a=(0,_vue.inject)("$xeForm",null),l=(0,_vue.inject)("$xeButtonGroup",null);var t=_xeUtils.default.uniqueId();const P=(0,_ui.useSize)(O)["computeSize"],w=(0,_ui.usePermission)(O)["computePermissionInfo"],S=(0,_vue.reactive)({initialized:!1,visiblePanel:!1,isAniVisible:!1,isActivated:!1,panelIndex:0,panelStyle:{},panelPlacement:""}),s={showTime:void 0,tooltipTimeout:void 0},B=(0,_vue.ref)(),I=(0,_vue.ref)(),j=(0,_vue.ref)(),r={refElem:B},z={xID:t,props:O,context:e,reactData:S,internalData:s,getRefMaps:()=>r};const M=(0,_vue.computed)(()=>{var e=O["transfer"];if(null===e){var t=(0,_ui.getConfig)().button.transfer;if(_xeUtils.default.isBoolean(t))return t;if(u||n||o||a)return!0}return e}),U=(0,_vue.computed)(()=>{var e=O["disabled"],t=w.value;return e||t.disabled}),V=(0,_vue.computed)(()=>{var e=O["type"];return!!e&&-1<["submit","reset","button"].indexOf(e)}),$=(0,_vue.computed)(()=>{var{type:e,mode:t}=O;return"text"===t||"text"===e||l&&"text"===l.props.mode?"text":"button"}),E=(0,_vue.computed)(()=>{var e=O["status"];return e||(l?l.props.status:"")}),A=(0,_vue.computed)(()=>{var e=O["align"];return e||!!l&&l.props.align}),W=(0,_vue.computed)(()=>{var e=O["round"];return e||!!l&&l.props.round}),Z=(0,_vue.computed)(()=>{var e=O["circle"];return e||!!l&&l.props.circle}),J=(0,_vue.computed)(()=>{var e=O["options"];return e?e.filter(e=>{e=e.permissionCode;return!e||_ui.permission.checkVisible(e)}):[]}),p=(0,_vue.computed)(()=>Object.assign({},O.prefixTooltip)),_=(0,_vue.computed)(()=>Object.assign({},O.suffixTooltip)),m=()=>{S.panelIndex<(0,_utils.getLastZIndex)()&&(S.panelIndex=(0,_utils.nextZIndex)())},v=()=>{const n=O["placement"],i=S["panelIndex"],o=I.value,u=j.value,a=M.value;var e=()=>{var e=(0,_dom.updatePanelPlacement)(o,u,{placement:n,teleportTo:a}),t=Object.assign(e.style,{zIndex:i});S.panelStyle=t,S.panelPlacement=e.placement};return e(),(0,_vue.nextTick)().then(e)},D=e=>{l&&l.handleClick({name:O.name},e),H("click",{$event:e},e)},K=e=>{0===e.button&&e.stopPropagation()},Q=e=>{var t=e.currentTarget;const n=j.value;var{flag:t,targetElem:i}=(0,_dom.getEventTargetNode)(e,t,"vxe-button");t&&(n&&(n.dataset.active="N"),S.visiblePanel=!1,setTimeout(()=>{n&&"Y"===n.dataset.active||(S.isAniVisible=!1)},350),H("dropdown-click",{name:i.getAttribute("name"),option:null},e))},q=()=>{const e=j.value;e&&(e.dataset.active="Y",S.isAniVisible=!0,setTimeout(()=>{"Y"===e.dataset.active&&(S.visiblePanel=!0,m(),v(),setTimeout(()=>{S.visiblePanel&&v()},50))},20))},X=e=>{var t=O["loading"];U.value||t||(c(),F(e))},ee=e=>{R(),L(e)},F=e=>{H("mouseenter",{},e)},L=e=>{H("mouseleave",{},e)},Y=e=>{var{loading:t,trigger:n}=O;U.value||t||("click"===n&&(S.visiblePanel?R:c)(),D(e))},c=()=>{var e=O["trigger"];const t=j.value;return t&&(t.dataset.active="Y",S.initialized||(S.initialized=!0),s.showTime=setTimeout(()=>{"Y"===t.dataset.active?q():S.isAniVisible=!1},"click"===e?50:250)),(0,_vue.nextTick)()},R=()=>{const e=j.value;return clearTimeout(s.showTime),e?(e.dataset.active="N",setTimeout(()=>{"Y"!==e.dataset.active&&(S.visiblePanel=!1,setTimeout(()=>{"Y"!==e.dataset.active&&(S.isAniVisible=!1)},350))},100)):(S.isAniVisible=!1,S.visiblePanel=!1),(0,_vue.nextTick)()},te=()=>{R()},d=(e,t)=>(0,_vue.h)(_tooltip.default,{useHTML:e.useHTML,content:e.content,enterable:e.enterable,theme:e.theme},{default(){return(0,_vue.h)("i",{class:[`vxe-button--tooltip-${t}-icon`,e.icon||(0,_ui.getIcon)().BUTTON_TOOLTIP_ICON]})}}),G=()=>{var{content:e,icon:t,loading:n,prefixTooltip:i,suffixTooltip:o}=O,u=p.value,a=_.value,l=N.icon,s=N.default,r=[];return i&&r.push(d(u,"prefix")),n?r.push((0,_vue.h)("i",{class:["vxe-button--loading-icon",(0,_ui.getIcon)().BUTTON_LOADING]})):l?r.push((0,_vue.h)("span",{class:"vxe-button--custom-icon"},l({}))):t&&r.push((0,_vue.h)("i",{class:["vxe-button--icon",t]})),s?r.push((0,_vue.h)("span",{class:"vxe-button--content"},s({}))):e&&r.push((0,_vue.h)("span",{class:"vxe-button--content"},(0,_utils.getFuncText)(e))),o&&r.push(d(a,"suffix")),r},H=(e,t,n)=>{i(e,(0,_ui.createEvent)(n,{$button:z},t))},b=(t={dispatchEvent:H,openPanel:c,closePanel:R,focus(){var e=I.value;return e&&e.focus(),(0,_vue.nextTick)()},blur(){var e=I.value;return e&&e.blur(),(0,_vue.nextTick)()}},e=>{var t=j.value;S.visiblePanel&&!(0,_dom.getEventTargetNode)(e,t).flag&&R()}),g=e=>{var t,n=U.value,i=S["visiblePanel"];n||(n=B.value,t=j.value,S.isActivated=(0,_dom.getEventTargetNode)(e,n).flag||(0,_dom.getEventTargetNode)(e,t).flag,i&&!S.isActivated&&R())};Object.assign(z,t);return z.renderVN=()=>{var{className:e,popupClassName:t,trigger:n,title:i,routerLink:o,type:u,destroyOnClose:a,name:l,loading:s}=O,{initialized:r,isAniVisible:v,visiblePanel:c}=S,d=V.value;const p=$.value;var _=E.value;const m=W.value;var b=A.value;const g=Z.value;var x,f=M.value,h=U.value,T=w.value,y=J.value,k=P.value,C=N.dropdowns;return T.visible?C||y.length?(T={},x={},"hover"===n&&(T.onMouseenter=X,T.onMouseleave=ee,x.onMouseenter=q,x.onMouseleave=te),(0,_vue.h)("div",{ref:B,class:["vxe-button--dropdown",e?_xeUtils.default.isFunction(e)?e({$button:z}):e:"",{["size--"+k]:k,"is--active":c}]},[o?(0,_vue.h)((0,_vue.resolveComponent)("router-link"),Object.assign({ref:I,class:["vxe-button","vxe-button--link","type--"+p,b?"align--"+b:"",e?_xeUtils.default.isFunction(e)?e({$button:z}):e:"",{["size--"+k]:k,["theme--"+_]:_,"is--round":m,"is--circle":g,"is--disabled":h||s,"is--loading":s}],title:i,name:l,type:d?u:"button",disabled:h||s,to:o,onClick:Y},T),{default(){return G().concat([(0,_vue.h)("i",{class:"vxe-button--dropdown-arrow "+(0,_ui.getIcon)().BUTTON_DROPDOWN})])}}):(0,_vue.h)("button",Object.assign({ref:I,class:["vxe-button","type--"+p,b?"align--"+b:"",e?_xeUtils.default.isFunction(e)?e({$button:z}):e:"",{["size--"+k]:k,["theme--"+_]:_,"is--round":m,"is--circle":g,"is--disabled":h||s,"is--loading":s}],title:i,name:l,type:d?u:"button",disabled:h||s,onClick:Y},T),G().concat([(0,_vue.h)("i",{class:"vxe-button--dropdown-arrow "+(0,_ui.getIcon)().BUTTON_DROPDOWN})])),(0,_vue.h)(_vue.Teleport,{to:"body",disabled:!f||!r},[(0,_vue.h)("div",Object.assign({ref:j,class:["vxe-button--dropdown-panel",t?_xeUtils.default.isFunction(t)?t({$button:z}):t:"",{["size--"+k]:k,"is--transfer":f,"ani--leave":v,"ani--enter":c}],placement:S.panelPlacement,style:S.panelStyle},x),r&&(c||v)?[C?(0,_vue.h)("div",{class:"vxe-button--dropdown-wrapper",onMousedown:K,onClick:Q},r&&(!a||c||v)?C({}):[]):(0,_vue.h)("div",{class:"vxe-button--dropdown-wrapper"},r&&(!a||c||v)?y.map((i,e)=>(0,_vue.h)(VxeButtonComponent,{key:e,type:i.type,mode:i.mode||p,className:i.className,name:i.name,routerLink:i.routerLink,permissionCode:i.permissionCode,title:i.title,content:i.content,status:i.status,icon:i.icon,round:_xeUtils.default.isBoolean(i.round)?i.round:"text"!==p&&m,circle:_xeUtils.default.isBoolean(i.circle)?i.circle:"text"!==p&&g,disabled:i.disabled,loading:i.loading,align:i.align,onClick(e){var t=e,n=i;t=e.$event,R(),H("dropdown-click",{name:n.name,option:n},t)}})):[])]:[])])])):o?(0,_vue.h)((0,_vue.resolveComponent)("router-link"),{ref:I,class:["vxe-button","vxe-button--link","type--"+p,b?"align--"+b:"",e?_xeUtils.default.isFunction(e)?e({$button:z}):e:"",{["size--"+k]:k,["theme--"+_]:_,"is--round":m,"is--circle":g,"is--disabled":h||s,"is--loading":s}],title:i,name:l,type:d?u:"button",disabled:h||s,to:o,onClick:D,onMouseenter:F,onMouseleave:L},{default(){return G()}}):(0,_vue.h)("button",{ref:I,class:["vxe-button","type--"+p,b?"align--"+b:"",e?_xeUtils.default.isFunction(e)?e({$button:z}):e:"",{["size--"+k]:k,["theme--"+_]:_,"is--round":m,"is--circle":g,"is--disabled":h||s,"is--loading":s}],title:i,name:l,type:d?u:"button",disabled:h||s,onClick:D,onMouseenter:F,onMouseleave:L},G()):(0,_vue.createCommentVNode)()},(0,_vue.onMounted)(()=>{"development"===process.env.NODE_ENV&&"text"===O.type&&(0,_log.warnLog)("vxe.error.delProp",["type=text","mode=text"]),_ui.globalEvents.on(z,"mousewheel",b),_ui.globalEvents.on(z,"mousedown",g)}),(0,_vue.onUnmounted)(()=>{_ui.globalEvents.off(z,"mousewheel"),_ui.globalEvents.off(z,"mousedown")}),z},render(){return this.renderVN()}});var _default=exports.default=VxeButtonComponent;
|
|
@@ -567,8 +567,16 @@
|
|
|
567
567
|
.vxe-button--dropdown-panel {
|
|
568
568
|
display: none;
|
|
569
569
|
position: absolute;
|
|
570
|
-
|
|
570
|
+
left: 0;
|
|
571
571
|
padding: 4px 0;
|
|
572
|
+
color: var(--vxe-ui-font-color);
|
|
573
|
+
text-align: left;
|
|
574
|
+
}
|
|
575
|
+
.vxe-button--dropdown-panel:not(.is--transfer) {
|
|
576
|
+
min-width: 100%;
|
|
577
|
+
}
|
|
578
|
+
.vxe-button--dropdown-panel.is--transfer {
|
|
579
|
+
position: fixed;
|
|
572
580
|
}
|
|
573
581
|
.vxe-button--dropdown-panel.ani--leave {
|
|
574
582
|
display: block;
|
|
@@ -577,7 +585,6 @@
|
|
|
577
585
|
transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1);
|
|
578
586
|
transform-origin: center top;
|
|
579
587
|
backface-visibility: hidden;
|
|
580
|
-
transform-style: preserve-3d;
|
|
581
588
|
}
|
|
582
589
|
.vxe-button--dropdown-panel.ani--leave[placement=top] {
|
|
583
590
|
transform-origin: center bottom;
|
|
@@ -586,6 +593,21 @@
|
|
|
586
593
|
opacity: 1;
|
|
587
594
|
transform: scaleY(1);
|
|
588
595
|
}
|
|
596
|
+
.vxe-button--dropdown-panel.ani--enter > div::after {
|
|
597
|
+
display: none;
|
|
598
|
+
}
|
|
599
|
+
.vxe-button--dropdown-panel > div::after {
|
|
600
|
+
content: "";
|
|
601
|
+
position: absolute;
|
|
602
|
+
top: 0;
|
|
603
|
+
left: 0;
|
|
604
|
+
width: 100%;
|
|
605
|
+
height: 100%;
|
|
606
|
+
z-index: 1;
|
|
607
|
+
-webkit-user-select: none;
|
|
608
|
+
-moz-user-select: none;
|
|
609
|
+
user-select: none;
|
|
610
|
+
}
|
|
589
611
|
|
|
590
612
|
.vxe-button--dropdown-wrapper {
|
|
591
613
|
padding: 5px;
|