fix:修 时间区间选择显示单日历
This commit is contained in:
@@ -308,3 +308,9 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.el-date-range-picker.el-picker-panel__body__only {
|
||||||
|
width: 324px;
|
||||||
|
}
|
||||||
|
.el-date-range-picker__content.el-date-range-picker__content__only{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|||||||
@@ -5,7 +5,8 @@
|
|||||||
class="el-picker-panel el-date-range-picker el-popper time-picker-popover__select-top"
|
class="el-picker-panel el-date-range-picker el-popper time-picker-popover__select-top"
|
||||||
:class="[{
|
:class="[{
|
||||||
'has-sidebar': $slots.sidebar || shortcuts,
|
'has-sidebar': $slots.sidebar || shortcuts,
|
||||||
'has-time': showTime
|
'has-time': showTime,
|
||||||
|
'el-picker-panel__body__only': isOnly
|
||||||
}, popperClass]">
|
}, popperClass]">
|
||||||
<div class="el-picker-panel__body-wrapper">
|
<div class="el-picker-panel__body-wrapper">
|
||||||
<slot name="sidebar" class="el-picker-panel__sidebar"></slot>
|
<slot name="sidebar" class="el-picker-panel__sidebar"></slot>
|
||||||
@@ -17,7 +18,7 @@
|
|||||||
:key="key"
|
:key="key"
|
||||||
@click="handleShortcutClick(shortcut)">{{shortcut.text}}</button>
|
@click="handleShortcutClick(shortcut)">{{shortcut.text}}</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="el-picker-panel__body">
|
<div class="el-picker-panel__body" style="min-width: auto">
|
||||||
<div class="el-date-range-picker__time-header" v-if="showTime">
|
<div class="el-date-range-picker__time-header" v-if="showTime">
|
||||||
<span class="el-date-range-picker__editors-wrap">
|
<span class="el-date-range-picker__editors-wrap">
|
||||||
<span class="el-date-range-picker__time-picker-wrap">
|
<span class="el-date-range-picker__time-picker-wrap">
|
||||||
@@ -84,7 +85,9 @@
|
|||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="el-picker-panel__content el-date-range-picker__content is-left">
|
<div class="el-picker-panel__content el-date-range-picker__content is-left" :class="{
|
||||||
|
'el-date-range-picker__content__only': isOnly
|
||||||
|
}">
|
||||||
<div class="el-date-range-picker__header">
|
<div class="el-date-range-picker__header">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -108,7 +111,32 @@
|
|||||||
:disabled="!enableMonthArrow"
|
:disabled="!enableMonthArrow"
|
||||||
:class="{ 'is-disabled': !enableMonthArrow }"
|
:class="{ 'is-disabled': !enableMonthArrow }"
|
||||||
class="el-picker-panel__icon-btn el-icon-arrow-right"></button>
|
class="el-picker-panel__icon-btn el-icon-arrow-right"></button>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
@click="rightPrevYear"
|
||||||
|
v-if="unlinkPanels&&isOnly"
|
||||||
|
:disabled="!enableYearArrow"
|
||||||
|
:class="{ 'is-disabled': !enableYearArrow }"
|
||||||
|
class="el-picker-panel__icon-btn el-icon-d-arrow-left"></button>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
@click="rightPrevMonth"
|
||||||
|
v-if="unlinkPanels&&isOnly"
|
||||||
|
:disabled="!enableMonthArrow"
|
||||||
|
:class="{ 'is-disabled': !enableMonthArrow }"
|
||||||
|
class="el-picker-panel__icon-btn el-icon-arrow-left"></button>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
v-if="isOnly"
|
||||||
|
@click="rightNextYear"
|
||||||
|
class="el-picker-panel__icon-btn el-icon-d-arrow-right"></button>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
v-if="isOnly"
|
||||||
|
@click="rightNextMonth"
|
||||||
|
class="el-picker-panel__icon-btn el-icon-arrow-right"></button>
|
||||||
<div>{{ leftLabel }}</div>
|
<div>{{ leftLabel }}</div>
|
||||||
|
<!-- <div>{{ rightLabel }}</div>-->
|
||||||
</div>
|
</div>
|
||||||
<date-table
|
<date-table
|
||||||
:timezone="timezone"
|
:timezone="timezone"
|
||||||
@@ -125,7 +153,7 @@
|
|||||||
@pick="handleRangePick">
|
@pick="handleRangePick">
|
||||||
</date-table>
|
</date-table>
|
||||||
</div>
|
</div>
|
||||||
<div class="el-picker-panel__content el-date-range-picker__content is-right">
|
<div class="el-picker-panel__content el-date-range-picker__content is-right" v-if="!isOnly">
|
||||||
<div class="el-date-range-picker__header">
|
<div class="el-date-range-picker__header">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -321,6 +349,7 @@ export default {
|
|||||||
return {
|
return {
|
||||||
popperClass: '',
|
popperClass: '',
|
||||||
value: [],
|
value: [],
|
||||||
|
isOnly: false,
|
||||||
defaultValue: null,
|
defaultValue: null,
|
||||||
defaultTime: null,
|
defaultTime: null,
|
||||||
minDate: '',
|
minDate: '',
|
||||||
@@ -440,6 +469,12 @@ export default {
|
|||||||
? right
|
? right
|
||||||
: nextMonth(this.leftDate)
|
: nextMonth(this.leftDate)
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
isOnly: {
|
||||||
|
immediate: true,
|
||||||
|
handler (n) {
|
||||||
|
console.log(n,'isOnly')
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -392,6 +392,10 @@ export default {
|
|||||||
validateEvent: {
|
validateEvent: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true
|
default: true
|
||||||
|
},
|
||||||
|
isOnly: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -444,6 +448,9 @@ export default {
|
|||||||
if (!valueEquals(val, oldVal) && !this.pickerVisible && this.validateEvent) {
|
if (!valueEquals(val, oldVal) && !this.pickerVisible && this.validateEvent) {
|
||||||
this.dispatch('ElFormItem', 'el.form.change', val)
|
this.dispatch('ElFormItem', 'el.form.change', val)
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
isOnly:{
|
||||||
|
immediate: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -840,6 +847,7 @@ export default {
|
|||||||
this.popperElm = this.picker.$el
|
this.popperElm = this.picker.$el
|
||||||
this.picker.width = this.reference.getBoundingClientRect().width
|
this.picker.width = this.reference.getBoundingClientRect().width
|
||||||
this.picker.showTime = this.type === 'datetime' || this.type === 'datetimerange'
|
this.picker.showTime = this.type === 'datetime' || this.type === 'datetimerange'
|
||||||
|
this.picker.isOnly = this.isOnly
|
||||||
this.picker.selectionMode = this.selectionMode
|
this.picker.selectionMode = this.selectionMode
|
||||||
this.picker.unlinkPanels = this.unlinkPanels
|
this.picker.unlinkPanels = this.unlinkPanels
|
||||||
this.picker.arrowControl = this.arrowControl || this.timeArrowControl || false
|
this.picker.arrowControl = this.arrowControl || this.timeArrowControl || false
|
||||||
|
|||||||
@@ -50,6 +50,7 @@
|
|||||||
@change="dateChange"
|
@change="dateChange"
|
||||||
:default-time="['00:00:00', '23:59:59']"
|
:default-time="['00:00:00', '23:59:59']"
|
||||||
v-model="oldSearchTime"
|
v-model="oldSearchTime"
|
||||||
|
:isOnly="true"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
popper-class="panel-time-picker-popper time-picker-popover__select-top"
|
popper-class="panel-time-picker-popper time-picker-popover__select-top"
|
||||||
align="right"
|
align="right"
|
||||||
|
|||||||
Reference in New Issue
Block a user