Prevent selecting disabled dates

This commit is contained in:
Sergio Crisostomo 2018-05-21 08:24:56 +02:00
parent e9d7ff50f5
commit 939a162ad7
4 changed files with 13 additions and 4 deletions

View file

@ -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

View file

@ -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,

View file

@ -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');
} }
} }

View file

@ -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;
} }
} }