parent
309912df0c
commit
3cd62242a8
2 changed files with 57 additions and 6 deletions
|
@ -50,6 +50,7 @@
|
|||
:value="dates"
|
||||
:format="format"
|
||||
:time-disabled="timeDisabled"
|
||||
:disabled-date="disabledDate"
|
||||
v-bind="timePickerOptions"
|
||||
@on-pick="handlePick"
|
||||
@on-pick-click="handlePickClick"
|
||||
|
@ -150,6 +151,13 @@
|
|||
currentView (currentView) {
|
||||
this.$emit('on-selection-mode-change', currentView);
|
||||
this.pickertable = this.getTableType(currentView);
|
||||
|
||||
if (this.currentView === 'time') {
|
||||
this.$nextTick(() => {
|
||||
const spinner = this.$refs.timePicker.$refs.timeSpinner;
|
||||
spinner.updateScroll();
|
||||
});
|
||||
}
|
||||
},
|
||||
selectionMode(type){
|
||||
this.currentView = type;
|
||||
|
@ -186,6 +194,7 @@
|
|||
else if (selectionMode === 'month') value = new Date(panelDate.getFullYear(), value.getMonth(), 1);
|
||||
else value = new Date(value);
|
||||
|
||||
this.dates = [value];
|
||||
this.$emit('on-pick', value);
|
||||
},
|
||||
},
|
||||
|
|
|
@ -7,12 +7,12 @@
|
|||
ref="timeSpinner"
|
||||
:show-seconds="showSeconds"
|
||||
:steps="steps"
|
||||
:hours="value[0] && date.getHours()"
|
||||
:minutes="value[0] && date.getMinutes()"
|
||||
:seconds="value[0] && date.getSeconds()"
|
||||
:disabled-hours="disabledHours"
|
||||
:disabled-minutes="disabledMinutes"
|
||||
:disabled-seconds="disabledSeconds"
|
||||
:hours="timeSlots[0]"
|
||||
:minutes="timeSlots[1]"
|
||||
:seconds="timeSlots[2]"
|
||||
:disabled-hours="disabledHMS.disabledHours"
|
||||
:disabled-minutes="disabledHMS.disabledMinutes"
|
||||
:disabled-seconds="disabledHMS.disabledSeconds"
|
||||
:hide-disabled-options="hideDisabledOptions"
|
||||
@on-change="handleChange"
|
||||
@on-pick-click="handlePickClick"></time-spinner>
|
||||
|
@ -39,12 +39,25 @@
|
|||
const timePrefixCls = 'ivu-time-picker';
|
||||
|
||||
const capitalize = (str) => str[0].toUpperCase() + str.slice(1);
|
||||
const mergeDateHMS = (date, hours, minutes, seconds) => {
|
||||
const newDate = new Date(date.getTime());
|
||||
newDate.setHours(hours);
|
||||
newDate.setMinutes(minutes);
|
||||
newDate.setSeconds(seconds);
|
||||
return newDate;
|
||||
};
|
||||
const unique = (el, i, arr) => arr.indexOf(el) === i;
|
||||
const returnFalse = () => false;
|
||||
|
||||
export default {
|
||||
name: 'TimePickerPanel',
|
||||
mixins: [ Mixin, Locale, Options ],
|
||||
components: { TimeSpinner, Confirm },
|
||||
props: {
|
||||
disabledDate: {
|
||||
type: Function,
|
||||
default: returnFalse
|
||||
},
|
||||
steps: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
|
@ -76,6 +89,35 @@
|
|||
const tYear = this.t('i.datepicker.year');
|
||||
const tMonth = this.t(`i.datepicker.month${month}`);
|
||||
return `${date.getFullYear()}${tYear} ${tMonth}`;
|
||||
},
|
||||
timeSlots(){
|
||||
if (!this.value[0]) return [];
|
||||
return ['getHours', 'getMinutes', 'getSeconds'].map(slot => this.date[slot]());
|
||||
},
|
||||
disabledHMS(){
|
||||
const disabledTypes = ['disabledHours', 'disabledMinutes', 'disabledSeconds'];
|
||||
if (this.disabledDate === returnFalse || !this.value[0]) {
|
||||
const disabled = disabledTypes.reduce(
|
||||
(obj, type) => (obj[type] = this[type], obj), {}
|
||||
);
|
||||
return disabled;
|
||||
} else {
|
||||
const slots = [24, 60, 60];
|
||||
const disabled = ['Hours', 'Minutes', 'Seconds'].map(type => this[`disabled${type}`]);
|
||||
const disabledHMS = disabled.map((preDisabled, j) => {
|
||||
const slot = slots[j];
|
||||
const toDisable = preDisabled;
|
||||
for (let i = 0; i < slot; i+= (this.steps[j] || 1)){
|
||||
const hms = this.timeSlots.map((slot, x) => x === j ? i : slot);
|
||||
const testDateTime = mergeDateHMS(this.date, ...hms);
|
||||
if (this.disabledDate(testDateTime, true)) toDisable.push(i);
|
||||
}
|
||||
return toDisable.filter(unique);
|
||||
});
|
||||
return disabledTypes.reduce(
|
||||
(obj, type, i) => (obj[type] = disabledHMS[i], obj), {}
|
||||
);
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
Loading…
Add table
Reference in a new issue