vxe-pc-ui 3.14.27 → 3.14.28

package/es/date-panel/src/date-panel.js

@@ -18,6 +18,7 @@ export default {
             default: 'date'
         },
         className: String,
+        cellClassName: [String, Function],
         size: {
             type: String,
             default: () => getConfig().datePanel.size || getConfig().size
@@ -1381,7 +1382,7 @@ export default {
             const $xeDatePanel = this;
             const props = $xeDatePanel;
             const reactData = $xeDatePanel.reactData;
-            const { multiple } = props;
+            const { type, multiple, cellClassName } = props;
             const { datePanelType, datePanelValue } = reactData;
             const dateValue = $xeDatePanel.computeDateValue;
             const dateHeaders = $xeDatePanel.computeDateHeaders;
@@ -1426,7 +1427,7 @@ export default {
                         }, rows.map((item) => {
                             const isSelected = multiple ? dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat)) : XEUtils.isDateSame(dateValue, item.date, matchFormat);
                             return h('div', {
-                                class: ['vxe-date-panel--view-item', {
+                                class: ['vxe-date-panel--view-item', cellClassName ? (XEUtils.isFunction(cellClassName) ? `${cellClassName({ $datePanel: $xeDatePanel, type, viewType: datePanelType, date: item.date }) || ''}` : `${cellClassName || ''}`) : '', {
                                         'is--prev': item.isPrev,
                                         'is--current': item.isCurrent,
                                         'is--now': item.isNow,
@@ -1459,7 +1460,7 @@ export default {
             const $xeDatePanel = this;
             const props = $xeDatePanel;
             const reactData = $xeDatePanel.reactData;
-            const { multiple } = props;
+            const { type, multiple, cellClassName } = props;
             const { datePanelType, datePanelValue } = reactData;
             const dateValue = $xeDatePanel.computeDateValue;
             const weekHeaders = $xeDatePanel.computeWeekHeaders;
@@ -1506,7 +1507,7 @@ export default {
                             }
                         }, rows.map((item, rIndex) => {
                             return h('div', {
-                                class: ['vxe-date-panel--view-item', {
+                                class: ['vxe-date-panel--view-item', cellClassName ? (XEUtils.isFunction(cellClassName) ? `${cellClassName({ $datePanel: $xeDatePanel, type, viewType: datePanelType, date: item.date }) || ''}` : `${cellClassName || ''}`) : '', {
                                         'is--prev': item.isPrev,
                                         'is--current': item.isCurrent,
                                         'is--now': rIndex ? item.isNow : isNowWeek,
@@ -1539,7 +1540,7 @@ export default {
             const $xeDatePanel = this;
             const props = $xeDatePanel;
             const reactData = $xeDatePanel.reactData;
-            const { multiple } = props;
+            const { type, multiple, cellClassName } = props;
             const { datePanelType, datePanelValue } = reactData;
             const dateValue = $xeDatePanel.computeDateValue;
             const monthDatas = $xeDatePanel.computeMonthDatas;
@@ -1561,7 +1562,7 @@ export default {
                         }, rows.map((item) => {
                             const isSelected = multiple ? dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat)) : XEUtils.isDateSame(dateValue, item.date, matchFormat);
                             return h('div', {
-                                class: ['vxe-date-panel--view-item', {
+                                class: ['vxe-date-panel--view-item', cellClassName ? (XEUtils.isFunction(cellClassName) ? `${cellClassName({ $datePanel: $xeDatePanel, type, viewType: datePanelType, date: item.date }) || ''}` : `${cellClassName || ''}`) : '', {
                                         'is--prev': item.isPrev,
                                         'is--current': item.isCurrent,
                                         'is--now': item.isNow,
@@ -1594,7 +1595,7 @@ export default {
             const $xeDatePanel = this;
             const props = $xeDatePanel;
             const reactData = $xeDatePanel.reactData;
-            const { multiple } = props;
+            const { type, multiple, cellClassName } = props;
             const { datePanelType, datePanelValue } = reactData;
             const dateValue = $xeDatePanel.computeDateValue;
             const quarterDatas = $xeDatePanel.computeQuarterDatas;
@@ -1616,7 +1617,7 @@ export default {
                         }, rows.map((item) => {
                             const isSelected = multiple ? dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat)) : XEUtils.isDateSame(dateValue, item.date, matchFormat);
                             return h('div', {
-                                class: ['vxe-date-panel--view-item', {
+                                class: ['vxe-date-panel--view-item', cellClassName ? (XEUtils.isFunction(cellClassName) ? `${cellClassName({ $datePanel: $xeDatePanel, type, viewType: datePanelType, date: item.date }) || ''}` : `${cellClassName || ''}`) : '', {
                                         'is--prev': item.isPrev,
                                         'is--current': item.isCurrent,
                                         'is--now': item.isNow,
@@ -1649,7 +1650,7 @@ export default {
             const $xeDatePanel = this;
             const props = $xeDatePanel;
             const reactData = $xeDatePanel.reactData;
-            const { multiple } = props;
+            const { type, multiple, cellClassName } = props;
             const { datePanelType, datePanelValue } = reactData;
             const dateValue = $xeDatePanel.computeDateValue;
             const yearDatas = $xeDatePanel.computeYearDatas;
@@ -1671,7 +1672,7 @@ export default {
                         }, rows.map((item) => {
                             const isSelected = multiple ? dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat)) : XEUtils.isDateSame(dateValue, item.date, matchFormat);
                             return h('div', {
-                                class: ['vxe-date-panel--view-item', {
+                                class: ['vxe-date-panel--view-item', cellClassName ? (XEUtils.isFunction(cellClassName) ? `${cellClassName({ $datePanel: $xeDatePanel, type, viewType: datePanelType, date: item.date }) || ''}` : `${cellClassName || ''}`) : '', {
                                         'is--prev': item.isPrev,
                                         'is--current': item.isCurrent,
                                         'is--now': item.isNow,

package/es/date-panel/style.css

@@ -186,6 +186,7 @@
 }
 
 .vxe-date-panel--view-item {
+  position: relative;
   padding: 0.2em;
 }
 .vxe-date-panel--view-item.is--prev .vxe-date-panel--view-item-inner, .vxe-date-panel--view-item.is--next .vxe-date-panel--view-item-inner {
@@ -228,6 +229,9 @@
 .vxe-date-panel--view-item.is--selected .vxe-date-panel--label.is-notice:before {
   background-color: var(--vxe-ui-input-date-picker-notice-selected-background-color);
 }
+.vxe-date-panel--view-item.is--range-selected {
+  background-color: var(--vxe-ui-font-primary-tinge-color);
+}
 .vxe-date-panel--view-item.is--range-disabled .vxe-date-panel--view-item-inner {
   color: var(--vxe-ui-input-disabled-color);
   background-color: inherit;

package/es/date-panel/style.min.css

@@ -1 +1 @@
-.vxe-date-panel{color:var(--vxe-ui-font-color);flex-shrink:0}.vxe-date-panel--time-layout-wrapper,.vxe-date-panel--wrapper{border:0 solid var(--vxe-ui-base-popup-border-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-date-panel--time-left-wrapper,.vxe-date-panel--wrapper{display:inline-flex;flex-direction:column;padding:.8em}.vxe-date-panel--time-right-wrapper{padding:.8em .8em .8em 0}.vxe-date-panel--time-layout-wrapper{display:inline-flex;flex-direction:row}.vxe-date-panel--time-title{display:flex;align-items:center;justify-content:center;flex-grow:1;text-align:center;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);height:2em;font-weight:700}.vxe-date-panel--time-header{position:relative;flex-shrink:0}.vxe-date-panel--picker-header,.vxe-date-panel--time-header{display:flex;flex-direction:row;align-items:center;height:3em;padding-bottom:.5em}.vxe-date-panel--picker-header{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-date-panel--picker-header .vxe-date-panel--picker-type-wrapper{flex-grow:1;font-size:1.1em}.vxe-date-panel--picker-header .vxe-date-panel--picker-btn-wrapper{flex-shrink:0;text-align:center}.vxe-date-panel--picker-type-wrapper{display:flex;align-items:center}.vxe-date-panel--picker-type-wrapper .vxe-date-panel--picker-btn,.vxe-date-panel--picker-type-wrapper .vxe-date-panel--picker-label{display:inline-block}.vxe-date-panel--picker-btn-wrapper{display:flex;flex-direction:row}.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-current-btn,.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-next-btn,.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-prev-btn{height:2.2em;padding:0 .5em;border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-input-border-color);margin-left:.5em}.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-current-btn i,.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-next-btn i,.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-prev-btn i{font-size:1.2em}.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-btn:not(.is--disabled):active{transform:scale(.9)}.vxe-date-panel--picker-btn,.vxe-date-panel--picker-label{display:flex;align-items:center;justify-content:center;background-color:var(--vxe-ui-layout-background-color)}.vxe-date-panel--picker-btn.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:no-drop}.vxe-date-panel--picker-btn:not(.is--disabled){cursor:pointer}.vxe-date-panel--picker-btn:not(.is--disabled):hover{color:var(--vxe-ui-font-primary-color);background-color:#fff}.vxe-date-panel--picker-btn:not(.is--disabled):active{background-color:#fff}.vxe-date-panel--picker-btns .vxe-date-panel--picker-btn{margin-left:.6em}.vxe-date-panel--picker-btns .vxe-date-panel--picker-btn:first-child{margin-left:0}.vxe-date-panel--view-wrapper{display:flex;flex-direction:column;line-height:1.5}.vxe-date-panel--picker-body{border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-base-popup-border-color);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-date-panel--view-header{box-shadow:inset 0 -1px 0 0 var(--vxe-ui-base-popup-border-color);text-align:center}.vxe-date-panel--view-body{display:inline-flex;flex-direction:column;width:24em}.vxe-date-panel--view-wrapper.type--day .vxe-date-panel--view-body,.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-body{height:18em}.vxe-date-panel--view-header .vxe-date-panel--view-row{height:2em}.vxe-date-panel--time-body,.vxe-date-panel--view-body{height:20em}.vxe-date-panel.type--time .vxe-date-panel--time-body{height:15em}.vxe-date-panel--view-body .vxe-date-panel--view-item{cursor:pointer}.vxe-date-panel--view-body .vxe-date-panel--view-item.is--disabled,.vxe-date-panel--view-body .vxe-date-panel--view-item.is--range-disabled{cursor:no-drop}.vxe-date-panel--view-body .vxe-date-panel--view-item.is--over{cursor:no-drop}.vxe-date-panel--view-row{display:flex;flex-direction:row}.vxe-date-panel--view-item{padding:.2em}.vxe-date-panel--view-item.is--next .vxe-date-panel--view-item-inner,.vxe-date-panel--view-item.is--prev .vxe-date-panel--view-item-inner{color:var(--vxe-ui-font-disabled-color)}.vxe-date-panel--view-item.is--next .vxe-date-panel--festival,.vxe-date-panel--view-item.is--next .vxe-date-panel--label,.vxe-date-panel--view-item.is--prev .vxe-date-panel--festival,.vxe-date-panel--view-item.is--prev .vxe-date-panel--label{color:var(--vxe-ui-font-disabled-color)}.vxe-date-panel--view-item.is--now .vxe-date-panel--view-item-inner{color:var(--vxe-ui-base-popup-border-color)}.vxe-date-panel--view-item.is--now:not(.is--selected).is--current{color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item.is--now:not(.is--selected).is--current .vxe-date-panel--festival,.vxe-date-panel--view-item.is--now:not(.is--selected).is--current .vxe-date-panel--label{color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item.is--hover .vxe-date-panel--view-item-inner{background-color:var(--vxe-ui-font-primary-tinge-color)}.vxe-date-panel--view-item.is--selected .vxe-date-panel--view-item-inner{color:var(--vxe-ui-input-date-picker-selected-color);background-color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item.is--selected.is--hover .vxe-date-panel--view-item-inner{box-shadow:0 0 6px 1px var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item.is--selected.is--next .vxe-date-panel--festival,.vxe-date-panel--view-item.is--selected.is--next .vxe-date-panel--label,.vxe-date-panel--view-item.is--selected.is--prev .vxe-date-panel--festival,.vxe-date-panel--view-item.is--selected.is--prev .vxe-date-panel--label{color:var(--vxe-ui-base-popup-border-color)}.vxe-date-panel--view-item.is--selected .vxe-date-panel--festival,.vxe-date-panel--view-item.is--selected .vxe-date-panel--label{color:var(--vxe-ui-input-date-picker-festival-selected-color)}.vxe-date-panel--view-item.is--selected .vxe-date-panel--label.is-notice:before{background-color:var(--vxe-ui-input-date-picker-notice-selected-background-color)}.vxe-date-panel--view-item.is--range-disabled .vxe-date-panel--view-item-inner{color:var(--vxe-ui-input-disabled-color);background-color:inherit}.vxe-date-panel--view-item.is--disabled .vxe-date-panel--view-item-inner{color:var(--vxe-ui-input-disabled-color);background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-date-panel--view-item.is--disabled .vxe-date-panel--festival,.vxe-date-panel--view-item.is--disabled .vxe-date-panel--label{color:var(--vxe-ui-input-disabled-color)}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item{padding:.2em 0}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item .vxe-date-panel--view-item-inner{border-radius:0}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item:first-child{padding:.2em 0 .2em .2em;border-right:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item:first-child .vxe-date-panel--view-item-inner{color:var(--vxe-ui-input-date-festival-color)}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item:last-child{padding:.2em .2em .2em 0}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--hover:first-child .vxe-date-panel--view-item-inner,.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--selected:first-child .vxe-date-panel--view-item-inner{border-radius:var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius)}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--hover:last-child .vxe-date-panel--view-item-inner,.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--selected:last-child .vxe-date-panel--view-item-inner{border-radius:0 var(--vxe-ui-base-border-radius) var(--vxe-ui-base-border-radius) 0}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--now:not(.is--selected):first-child .vxe-date-panel--view-item-inner{color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;border:1px solid transparent;border-radius:var(--vxe-ui-base-border-radius);overflow:hidden}.vxe-date-panel--view-item-label{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-date-panel--festival,.vxe-date-panel--label{width:100%;display:block;overflow:hidden;text-align:center}.vxe-date-panel--label{position:relative;height:1.4em;line-height:1.4em}.vxe-date-panel--label.is-notice:before{content:"";position:absolute;width:.25em;height:.25em;left:50%;top:0;transform:translateX(-50%);border-radius:100%;background-color:var(--vxe-ui-input-date-notice-background-color)}.vxe-date-panel--label--extra{position:absolute;right:-.1em;top:-.4em;font-size:12px;transform:scale(.9);color:var(--vxe-ui-input-date-extra-color)}.vxe-date-panel--label--extra.is-important{color:var(--vxe-ui-input-date-extra-important-color)}.vxe-date-panel--festival{color:var(--vxe-ui-input-date-festival-color);height:1em;line-height:1em;overflow:hidden}.vxe-date-panel--festival.is-important{color:var(--vxe-ui-input-date-festival-important-color)}.vxe-date-panel--festival--label{display:block;font-size:1em;transform:scale(.8)}@keyframes festivalOverlap2{0%,100%,45%{transform:translateY(0)}50%,95%{transform:translateY(-14px)}}@keyframes festivalOverlap3{0%,100%,20%{transform:translateY(0)}25%,45%,75%,95%{transform:translateY(-14px)}50%,70%{transform:translateY(-28px)}}.vxe-date-panel--festival--overlap{display:block;font-size:.86em}.vxe-date-panel--festival--overlap.overlap--2{animation:festivalOverlap2 6s infinite ease-in-out}.vxe-date-panel--festival--overlap.overlap--3{animation:festivalOverlap3 9s infinite ease-in-out}.vxe-date-panel--festival--overlap>span{height:14px;display:block;transform:scale(.8)}.vxe-date-panel--time-body{position:relative;display:flex;flex-direction:row;border:1px solid var(--vxe-ui-base-popup-border-color);flex-grow:1;border-radius:var(--vxe-ui-base-border-radius);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-date-panel--time-body>ul{height:100%;overflow:hidden;margin:0;padding:0;width:3.2em}.vxe-date-panel--time-body>ul:after,.vxe-date-panel--time-body>ul:before{content:" ";display:block;height:6em}.vxe-date-panel--time-body>ul:hover{overflow-y:auto}.vxe-date-panel--time-body>ul>li{display:block;height:2em;line-height:2em;padding-left:.4em}.vxe-date-panel--time-body>ul>li:not(.is--disabled):hover{background-color:var(--vxe-ui-input-date-picker-hover-background-color);cursor:pointer}.vxe-date-panel--time-body>ul>li.is--selected{font-weight:700;color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--time-body>ul>li.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:no-drop}.vxe-date-panel--time-body .vxe-date-panel--time-minute-list{border-left:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-panel--time-body .vxe-date-panel--time-second-list{border-left:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-panel.type--time .vxe-date-panel--time-body>ul{width:4em}.vxe-date-panel.type--time .vxe-date-panel--time-body>ul>li{height:2.2em;line-height:2.2em;padding-left:.8em}.vxe-date-panel{font-size:var(--vxe-ui-font-size-default)}.vxe-date-panel.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-date-panel.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-date-panel.size--mini{font-size:var(--vxe-ui-font-size-mini)}
+.vxe-date-panel{color:var(--vxe-ui-font-color);flex-shrink:0}.vxe-date-panel--time-layout-wrapper,.vxe-date-panel--wrapper{border:0 solid var(--vxe-ui-base-popup-border-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-date-panel--time-left-wrapper,.vxe-date-panel--wrapper{display:inline-flex;flex-direction:column;padding:.8em}.vxe-date-panel--time-right-wrapper{padding:.8em .8em .8em 0}.vxe-date-panel--time-layout-wrapper{display:inline-flex;flex-direction:row}.vxe-date-panel--time-title{display:flex;align-items:center;justify-content:center;flex-grow:1;text-align:center;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);height:2em;font-weight:700}.vxe-date-panel--time-header{position:relative;flex-shrink:0}.vxe-date-panel--picker-header,.vxe-date-panel--time-header{display:flex;flex-direction:row;align-items:center;height:3em;padding-bottom:.5em}.vxe-date-panel--picker-header{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-date-panel--picker-header .vxe-date-panel--picker-type-wrapper{flex-grow:1;font-size:1.1em}.vxe-date-panel--picker-header .vxe-date-panel--picker-btn-wrapper{flex-shrink:0;text-align:center}.vxe-date-panel--picker-type-wrapper{display:flex;align-items:center}.vxe-date-panel--picker-type-wrapper .vxe-date-panel--picker-btn,.vxe-date-panel--picker-type-wrapper .vxe-date-panel--picker-label{display:inline-block}.vxe-date-panel--picker-btn-wrapper{display:flex;flex-direction:row}.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-current-btn,.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-next-btn,.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-prev-btn{height:2.2em;padding:0 .5em;border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-input-border-color);margin-left:.5em}.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-current-btn i,.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-next-btn i,.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-prev-btn i{font-size:1.2em}.vxe-date-panel--picker-btn-wrapper .vxe-date-panel--picker-btn:not(.is--disabled):active{transform:scale(.9)}.vxe-date-panel--picker-btn,.vxe-date-panel--picker-label{display:flex;align-items:center;justify-content:center;background-color:var(--vxe-ui-layout-background-color)}.vxe-date-panel--picker-btn.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:no-drop}.vxe-date-panel--picker-btn:not(.is--disabled){cursor:pointer}.vxe-date-panel--picker-btn:not(.is--disabled):hover{color:var(--vxe-ui-font-primary-color);background-color:#fff}.vxe-date-panel--picker-btn:not(.is--disabled):active{background-color:#fff}.vxe-date-panel--picker-btns .vxe-date-panel--picker-btn{margin-left:.6em}.vxe-date-panel--picker-btns .vxe-date-panel--picker-btn:first-child{margin-left:0}.vxe-date-panel--view-wrapper{display:flex;flex-direction:column;line-height:1.5}.vxe-date-panel--picker-body{border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-base-popup-border-color);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-date-panel--view-header{box-shadow:inset 0 -1px 0 0 var(--vxe-ui-base-popup-border-color);text-align:center}.vxe-date-panel--view-body{display:inline-flex;flex-direction:column;width:24em}.vxe-date-panel--view-wrapper.type--day .vxe-date-panel--view-body,.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-body{height:18em}.vxe-date-panel--view-header .vxe-date-panel--view-row{height:2em}.vxe-date-panel--time-body,.vxe-date-panel--view-body{height:20em}.vxe-date-panel.type--time .vxe-date-panel--time-body{height:15em}.vxe-date-panel--view-body .vxe-date-panel--view-item{cursor:pointer}.vxe-date-panel--view-body .vxe-date-panel--view-item.is--disabled,.vxe-date-panel--view-body .vxe-date-panel--view-item.is--range-disabled{cursor:no-drop}.vxe-date-panel--view-body .vxe-date-panel--view-item.is--over{cursor:no-drop}.vxe-date-panel--view-row{display:flex;flex-direction:row}.vxe-date-panel--view-item{position:relative;padding:.2em}.vxe-date-panel--view-item.is--next .vxe-date-panel--view-item-inner,.vxe-date-panel--view-item.is--prev .vxe-date-panel--view-item-inner{color:var(--vxe-ui-font-disabled-color)}.vxe-date-panel--view-item.is--next .vxe-date-panel--festival,.vxe-date-panel--view-item.is--next .vxe-date-panel--label,.vxe-date-panel--view-item.is--prev .vxe-date-panel--festival,.vxe-date-panel--view-item.is--prev .vxe-date-panel--label{color:var(--vxe-ui-font-disabled-color)}.vxe-date-panel--view-item.is--now .vxe-date-panel--view-item-inner{color:var(--vxe-ui-base-popup-border-color)}.vxe-date-panel--view-item.is--now:not(.is--selected).is--current{color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item.is--now:not(.is--selected).is--current .vxe-date-panel--festival,.vxe-date-panel--view-item.is--now:not(.is--selected).is--current .vxe-date-panel--label{color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item.is--hover .vxe-date-panel--view-item-inner{background-color:var(--vxe-ui-font-primary-tinge-color)}.vxe-date-panel--view-item.is--selected .vxe-date-panel--view-item-inner{color:var(--vxe-ui-input-date-picker-selected-color);background-color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item.is--selected.is--hover .vxe-date-panel--view-item-inner{box-shadow:0 0 6px 1px var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item.is--selected.is--next .vxe-date-panel--festival,.vxe-date-panel--view-item.is--selected.is--next .vxe-date-panel--label,.vxe-date-panel--view-item.is--selected.is--prev .vxe-date-panel--festival,.vxe-date-panel--view-item.is--selected.is--prev .vxe-date-panel--label{color:var(--vxe-ui-base-popup-border-color)}.vxe-date-panel--view-item.is--selected .vxe-date-panel--festival,.vxe-date-panel--view-item.is--selected .vxe-date-panel--label{color:var(--vxe-ui-input-date-picker-festival-selected-color)}.vxe-date-panel--view-item.is--selected .vxe-date-panel--label.is-notice:before{background-color:var(--vxe-ui-input-date-picker-notice-selected-background-color)}.vxe-date-panel--view-item.is--range-selected{background-color:var(--vxe-ui-font-primary-tinge-color)}.vxe-date-panel--view-item.is--range-disabled .vxe-date-panel--view-item-inner{color:var(--vxe-ui-input-disabled-color);background-color:inherit}.vxe-date-panel--view-item.is--disabled .vxe-date-panel--view-item-inner{color:var(--vxe-ui-input-disabled-color);background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-date-panel--view-item.is--disabled .vxe-date-panel--festival,.vxe-date-panel--view-item.is--disabled .vxe-date-panel--label{color:var(--vxe-ui-input-disabled-color)}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item{padding:.2em 0}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item .vxe-date-panel--view-item-inner{border-radius:0}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item:first-child{padding:.2em 0 .2em .2em;border-right:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item:first-child .vxe-date-panel--view-item-inner{color:var(--vxe-ui-input-date-festival-color)}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item:last-child{padding:.2em .2em .2em 0}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--hover:first-child .vxe-date-panel--view-item-inner,.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--selected:first-child .vxe-date-panel--view-item-inner{border-radius:var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius)}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--hover:last-child .vxe-date-panel--view-item-inner,.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--selected:last-child .vxe-date-panel--view-item-inner{border-radius:0 var(--vxe-ui-base-border-radius) var(--vxe-ui-base-border-radius) 0}.vxe-date-panel--view-wrapper.type--week .vxe-date-panel--view-item.is--now:not(.is--selected):first-child .vxe-date-panel--view-item-inner{color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--view-item-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;border:1px solid transparent;border-radius:var(--vxe-ui-base-border-radius);overflow:hidden}.vxe-date-panel--view-item-label{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-date-panel--festival,.vxe-date-panel--label{width:100%;display:block;overflow:hidden;text-align:center}.vxe-date-panel--label{position:relative;height:1.4em;line-height:1.4em}.vxe-date-panel--label.is-notice:before{content:"";position:absolute;width:.25em;height:.25em;left:50%;top:0;transform:translateX(-50%);border-radius:100%;background-color:var(--vxe-ui-input-date-notice-background-color)}.vxe-date-panel--label--extra{position:absolute;right:-.1em;top:-.4em;font-size:12px;transform:scale(.9);color:var(--vxe-ui-input-date-extra-color)}.vxe-date-panel--label--extra.is-important{color:var(--vxe-ui-input-date-extra-important-color)}.vxe-date-panel--festival{color:var(--vxe-ui-input-date-festival-color);height:1em;line-height:1em;overflow:hidden}.vxe-date-panel--festival.is-important{color:var(--vxe-ui-input-date-festival-important-color)}.vxe-date-panel--festival--label{display:block;font-size:1em;transform:scale(.8)}@keyframes festivalOverlap2{0%,100%,45%{transform:translateY(0)}50%,95%{transform:translateY(-14px)}}@keyframes festivalOverlap3{0%,100%,20%{transform:translateY(0)}25%,45%,75%,95%{transform:translateY(-14px)}50%,70%{transform:translateY(-28px)}}.vxe-date-panel--festival--overlap{display:block;font-size:.86em}.vxe-date-panel--festival--overlap.overlap--2{animation:festivalOverlap2 6s infinite ease-in-out}.vxe-date-panel--festival--overlap.overlap--3{animation:festivalOverlap3 9s infinite ease-in-out}.vxe-date-panel--festival--overlap>span{height:14px;display:block;transform:scale(.8)}.vxe-date-panel--time-body{position:relative;display:flex;flex-direction:row;border:1px solid var(--vxe-ui-base-popup-border-color);flex-grow:1;border-radius:var(--vxe-ui-base-border-radius);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vxe-date-panel--time-body>ul{height:100%;overflow:hidden;margin:0;padding:0;width:3.2em}.vxe-date-panel--time-body>ul:after,.vxe-date-panel--time-body>ul:before{content:" ";display:block;height:6em}.vxe-date-panel--time-body>ul:hover{overflow-y:auto}.vxe-date-panel--time-body>ul>li{display:block;height:2em;line-height:2em;padding-left:.4em}.vxe-date-panel--time-body>ul>li:not(.is--disabled):hover{background-color:var(--vxe-ui-input-date-picker-hover-background-color);cursor:pointer}.vxe-date-panel--time-body>ul>li.is--selected{font-weight:700;color:var(--vxe-ui-font-primary-color)}.vxe-date-panel--time-body>ul>li.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:no-drop}.vxe-date-panel--time-body .vxe-date-panel--time-minute-list{border-left:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-panel--time-body .vxe-date-panel--time-second-list{border-left:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-date-panel.type--time .vxe-date-panel--time-body>ul{width:4em}.vxe-date-panel.type--time .vxe-date-panel--time-body>ul>li{height:2.2em;line-height:2.2em;padding-left:.8em}.vxe-date-panel{font-size:var(--vxe-ui-font-size-default)}.vxe-date-panel.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-date-panel.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-date-panel.size--mini{font-size:var(--vxe-ui-font-size-mini)}

package/es/date-range-picker/src/date-range-picker.js

@@ -576,6 +576,21 @@ export default {
                 }
             }
         },
+        panelCellClassName({ date }) {
+            const $xeDateRangePicker = this;
+            const reactData = $xeDateRangePicker.reactData;
+            const startValue = reactData.startValue;
+            const endValue = reactData.endValue;
+            if (startValue && endValue) {
+                const currTime = date.getTime();
+                const startTime = XEUtils.toStringDate(startValue).getTime();
+                const endTime = XEUtils.toStringDate(endValue).getTime();
+                if (currTime >= startTime && currTime <= endTime) {
+                    return 'is--range-selected';
+                }
+            }
+            return '';
+        },
         handleSelectClose() {
             const $xeDateRangePicker = this;
             const props = $xeDateRangePicker;
@@ -1101,6 +1116,7 @@ export default {
                                             timeConfig: timeOpts,
                                             festivalMethod: props.festivalMethod,
                                             disabledMethod: props.disabledMethod,
+                                            cellClassName: $xeDateRangePicker.panelCellClassName,
                                             selectDay: props.selectDay
                                         },
                                         on: {
@@ -1125,6 +1141,7 @@ export default {
                                             timeConfig: timeOpts,
                                             festivalMethod: props.festivalMethod,
                                             disabledMethod: props.disabledMethod,
+                                            cellClassName: $xeDateRangePicker.panelCellClassName,
                                             selectDay: props.selectDay
                                         },
                                         on: {

package/es/select/src/select.js

@@ -48,7 +48,10 @@ export default {
     props: {
         value: [String, Number, Boolean, Array],
         defaultConfig: Object,
-        clearable: Boolean,
+        clearable: {
+            type: Boolean,
+            default: () => getConfig().select.clearable
+        },
         placeholder: String,
         readonly: {
             type: Boolean,