Prevent selecting disabled dates
This commit is contained in:
parent
e9d7ff50f5
commit
939a162ad7
4 changed files with 13 additions and 4 deletions
|
@ -7,7 +7,7 @@
|
||||||
</div>
|
</div>
|
||||||
<span
|
<span
|
||||||
:class="getCellCls(cell)"
|
:class="getCellCls(cell)"
|
||||||
v-for="(cell, i) in readCells"
|
v-for="(cell, i) in cells"
|
||||||
:key="String(cell.date) + i"
|
:key="String(cell.date) + i"
|
||||||
@click="handleClick(cell, $event)"
|
@click="handleClick(cell, $event)"
|
||||||
@mouseenter="handleMouseMove(cell)"
|
@mouseenter="handleMouseMove(cell)"
|
||||||
|
@ -61,7 +61,7 @@
|
||||||
const weekDays = translatedDays.splice(weekStartDay, 7 - weekStartDay).concat(translatedDays.splice(0, weekStartDay));
|
const weekDays = translatedDays.splice(weekStartDay, 7 - weekStartDay).concat(translatedDays.splice(0, weekStartDay));
|
||||||
return this.showWeekNumbers ? [''].concat(weekDays) : weekDays;
|
return this.showWeekNumbers ? [''].concat(weekDays) : weekDays;
|
||||||
},
|
},
|
||||||
readCells () {
|
cells () {
|
||||||
const tableYear = this.tableDate.getFullYear();
|
const tableYear = this.tableDate.getFullYear();
|
||||||
const tableMonth = this.tableDate.getMonth();
|
const tableMonth = this.tableDate.getMonth();
|
||||||
const today = clearHours(new Date()); // timestamp of today
|
const today = clearHours(new Date()); // timestamp of today
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
import {clearHours} from '../util';
|
import {clearHours} from '../util';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
name: 'PanelTable',
|
||||||
props: {
|
props: {
|
||||||
tableDate: {
|
tableDate: {
|
||||||
type: Date,
|
type: Date,
|
||||||
|
|
|
@ -385,7 +385,15 @@
|
||||||
if (this.type.match(/range/)){
|
if (this.type.match(/range/)){
|
||||||
this.$refs.pickerPanel.handleRangePick(this.focusedDate, 'date');
|
this.$refs.pickerPanel.handleRangePick(this.focusedDate, 'date');
|
||||||
} else {
|
} else {
|
||||||
this.onPick(this.focusedDate, false, 'date');
|
const panels = findComponentsDownward(this, 'PanelTable');
|
||||||
|
const compareDate = (d) => {
|
||||||
|
const sliceIndex = ['year', 'month', 'date'].indexOf((this.type)) + 1;
|
||||||
|
return [d.getFullYear(), d.getMonth(), d.getDate()].slice(0, sliceIndex).join('-');
|
||||||
|
};
|
||||||
|
const dateIsValid = panels.find(({cells}) => {
|
||||||
|
return cells.find(({date, disabled}) => compareDate(date) === compareDate(this.focusedDate) && !disabled);
|
||||||
|
});
|
||||||
|
if (dateIsValid) this.onPick(this.focusedDate, false, 'date');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -46,7 +46,7 @@
|
||||||
}
|
}
|
||||||
&-cell:hover, &-focused{
|
&-cell:hover, &-focused{
|
||||||
em{
|
em{
|
||||||
background: @date-picker-cell-hover-bg;
|
background: @date-picker-cell-hover-bg !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue