vuetify eingebunden + erster Versuch Combobox

This commit is contained in:
2019-04-17 15:58:15 +02:00
parent 24642ca1a8
commit 56f4a3f940
1846 changed files with 219701 additions and 53848 deletions
+461
View File
@@ -0,0 +1,461 @@
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
// Components
import VDatePickerTitle from './VDatePickerTitle';
import VDatePickerHeader from './VDatePickerHeader';
import VDatePickerDateTable from './VDatePickerDateTable';
import VDatePickerMonthTable from './VDatePickerMonthTable';
import VDatePickerYears from './VDatePickerYears';
// Mixins
import Picker from '../../mixins/picker';
// Utils
import { pad, createNativeLocaleFormatter } from './util';
import _isDateAllowed from './util/isDateAllowed';
import { consoleWarn } from '../../util/console';
import { daysInMonth } from '../VCalendar/util/timestamp';
import mixins from '../../util/mixins';
// Adds leading zero to month/day if necessary, returns 'YYYY' if type = 'year',
// 'YYYY-MM' if 'month' and 'YYYY-MM-DD' if 'date'
function sanitizeDateString(dateString, type) {
var _dateString$split = dateString.split('-'),
_dateString$split2 = _slicedToArray(_dateString$split, 3),
year = _dateString$split2[0],
_dateString$split2$ = _dateString$split2[1],
month = _dateString$split2$ === undefined ? 1 : _dateString$split2$,
_dateString$split2$2 = _dateString$split2[2],
date = _dateString$split2$2 === undefined ? 1 : _dateString$split2$2;
return (year + '-' + pad(month) + '-' + pad(date)).substr(0, { date: 10, month: 7, year: 4 }[type]);
}
export default mixins(Picker
/* @vue/component */
).extend({
name: 'v-date-picker',
props: {
allowedDates: Function,
// Function formatting the day in date picker table
dayFormat: Function,
disabled: Boolean,
events: {
type: [Array, Function, Object],
default: function _default() {
return null;
}
},
eventColor: {
type: [Array, Function, Object, String],
default: function _default() {
return 'warning';
}
},
firstDayOfWeek: {
type: [String, Number],
default: 0
},
// Function formatting the tableDate in the day/month table header
headerDateFormat: Function,
locale: {
type: String,
default: 'en-us'
},
max: String,
min: String,
// Function formatting month in the months table
monthFormat: Function,
multiple: Boolean,
nextIcon: {
type: String,
default: '$vuetify.icons.next'
},
pickerDate: String,
prevIcon: {
type: String,
default: '$vuetify.icons.prev'
},
reactive: Boolean,
readonly: Boolean,
scrollable: Boolean,
showCurrent: {
type: [Boolean, String],
default: true
},
showWeek: Boolean,
// Function formatting currently selected date in the picker title
titleDateFormat: Function,
type: {
type: String,
default: 'date',
validator: function validator(type) {
return ['date', 'month'].includes(type);
} // TODO: year
},
value: [Array, String],
weekdayFormat: Function,
// Function formatting the year in table header and pickup title
yearFormat: Function,
yearIcon: String
},
data: function data() {
var _this = this;
var now = new Date();
return {
activePicker: this.type.toUpperCase(),
inputDay: null,
inputMonth: null,
inputYear: null,
isReversing: false,
now: now,
// tableDate is a string in 'YYYY' / 'YYYY-M' format (leading zero for month is not required)
tableDate: function () {
if (_this.pickerDate) {
return _this.pickerDate;
}
var date = (_this.multiple ? _this.value[_this.value.length - 1] : _this.value) || now.getFullYear() + '-' + (now.getMonth() + 1);
return sanitizeDateString(date, _this.type === 'date' ? 'month' : 'year');
}()
};
},
computed: {
lastValue: function lastValue() {
return this.multiple ? this.value[this.value.length - 1] : this.value;
},
selectedMonths: function selectedMonths() {
if (!this.value || !this.value.length || this.type === 'month') {
return this.value;
} else if (this.multiple) {
return this.value.map(function (val) {
return val.substr(0, 7);
});
} else {
return this.value.substr(0, 7);
}
},
current: function current() {
if (this.showCurrent === true) {
return sanitizeDateString(this.now.getFullYear() + '-' + (this.now.getMonth() + 1) + '-' + this.now.getDate(), this.type);
}
return this.showCurrent || null;
},
inputDate: function inputDate() {
return this.type === 'date' ? this.inputYear + '-' + pad(this.inputMonth + 1) + '-' + pad(this.inputDay) : this.inputYear + '-' + pad(this.inputMonth + 1);
},
tableMonth: function tableMonth() {
return Number((this.pickerDate || this.tableDate).split('-')[1]) - 1;
},
tableYear: function tableYear() {
return Number((this.pickerDate || this.tableDate).split('-')[0]);
},
minMonth: function minMonth() {
return this.min ? sanitizeDateString(this.min, 'month') : null;
},
maxMonth: function maxMonth() {
return this.max ? sanitizeDateString(this.max, 'month') : null;
},
minYear: function minYear() {
return this.min ? sanitizeDateString(this.min, 'year') : null;
},
maxYear: function maxYear() {
return this.max ? sanitizeDateString(this.max, 'year') : null;
},
formatters: function formatters() {
return {
year: this.yearFormat || createNativeLocaleFormatter(this.locale, { year: 'numeric', timeZone: 'UTC' }, { length: 4 }),
titleDate: this.titleDateFormat || (this.multiple ? this.defaultTitleMultipleDateFormatter : this.defaultTitleDateFormatter)
};
},
defaultTitleMultipleDateFormatter: function defaultTitleMultipleDateFormatter() {
var _this2 = this;
if (this.value.length < 2) {
return function (dates) {
return dates.length ? _this2.defaultTitleDateFormatter(dates[0]) : '0 selected';
};
}
return function (dates) {
return dates.length + ' selected';
};
},
defaultTitleDateFormatter: function defaultTitleDateFormatter() {
var titleFormats = {
year: { year: 'numeric', timeZone: 'UTC' },
month: { month: 'long', timeZone: 'UTC' },
date: { weekday: 'short', month: 'short', day: 'numeric', timeZone: 'UTC' }
};
var titleDateFormatter = createNativeLocaleFormatter(this.locale, titleFormats[this.type], {
start: 0,
length: { date: 10, month: 7, year: 4 }[this.type]
});
var landscapeFormatter = function landscapeFormatter(date) {
return titleDateFormatter(date).replace(/([^\d\s])([\d])/g, function (match, nonDigit, digit) {
return nonDigit + ' ' + digit;
}).replace(', ', ',<br>');
};
return this.landscape ? landscapeFormatter : titleDateFormatter;
}
},
watch: {
tableDate: function tableDate(val, prev) {
// Make a ISO 8601 strings from val and prev for comparision, otherwise it will incorrectly
// compare for example '2000-9' and '2000-10'
var sanitizeType = this.type === 'month' ? 'year' : 'month';
this.isReversing = sanitizeDateString(val, sanitizeType) < sanitizeDateString(prev, sanitizeType);
this.$emit('update:pickerDate', val);
},
pickerDate: function pickerDate(val) {
if (val) {
this.tableDate = val;
} else if (this.lastValue && this.type === 'date') {
this.tableDate = sanitizeDateString(this.lastValue, 'month');
} else if (this.lastValue && this.type === 'month') {
this.tableDate = sanitizeDateString(this.lastValue, 'year');
}
},
value: function value(newValue, oldValue) {
this.checkMultipleProp();
this.setInputDate();
if (!this.multiple && this.value && !this.pickerDate) {
this.tableDate = sanitizeDateString(this.inputDate, this.type === 'month' ? 'year' : 'month');
} else if (this.multiple && this.value.length && !oldValue.length && !this.pickerDate) {
this.tableDate = sanitizeDateString(this.inputDate, this.type === 'month' ? 'year' : 'month');
}
},
type: function type(_type) {
this.activePicker = _type.toUpperCase();
if (this.value && this.value.length) {
var output = (this.multiple ? this.value : [this.value]).map(function (val) {
return sanitizeDateString(val, _type);
}).filter(this.isDateAllowed);
this.$emit('input', this.multiple ? output : output[0]);
}
}
},
created: function created() {
this.checkMultipleProp();
if (this.pickerDate !== this.tableDate) {
this.$emit('update:pickerDate', this.tableDate);
}
this.setInputDate();
},
methods: {
emitInput: function emitInput(newInput) {
var output = this.multiple ? this.value.indexOf(newInput) === -1 ? this.value.concat([newInput]) : this.value.filter(function (x) {
return x !== newInput;
}) : newInput;
this.$emit('input', output);
this.multiple || this.$emit('change', newInput);
},
checkMultipleProp: function checkMultipleProp() {
if (this.value == null) return;
var valueType = this.value.constructor.name;
var expected = this.multiple ? 'Array' : 'String';
if (valueType !== expected) {
consoleWarn('Value must be ' + (this.multiple ? 'an' : 'a') + ' ' + expected + ', got ' + valueType, this);
}
},
isDateAllowed: function isDateAllowed(value) {
return _isDateAllowed(value, this.min, this.max, this.allowedDates);
},
yearClick: function yearClick(value) {
this.inputYear = value;
if (this.type === 'month') {
this.tableDate = '' + value;
} else {
this.tableDate = value + '-' + pad((this.tableMonth || 0) + 1);
}
this.activePicker = 'MONTH';
if (this.reactive && !this.readonly && !this.multiple && this.isDateAllowed(this.inputDate)) {
this.$emit('input', this.inputDate);
}
},
monthClick: function monthClick(value) {
this.inputYear = parseInt(value.split('-')[0], 10);
this.inputMonth = parseInt(value.split('-')[1], 10) - 1;
if (this.type === 'date') {
if (this.inputDay) {
this.inputDay = Math.min(this.inputDay, daysInMonth(this.inputYear, this.inputMonth + 1));
}
this.tableDate = value;
this.activePicker = 'DATE';
if (this.reactive && !this.readonly && !this.multiple && this.isDateAllowed(this.inputDate)) {
this.$emit('input', this.inputDate);
}
} else {
this.emitInput(this.inputDate);
}
},
dateClick: function dateClick(value) {
this.inputYear = parseInt(value.split('-')[0], 10);
this.inputMonth = parseInt(value.split('-')[1], 10) - 1;
this.inputDay = parseInt(value.split('-')[2], 10);
this.emitInput(this.inputDate);
},
genPickerTitle: function genPickerTitle() {
var _this3 = this;
return this.$createElement(VDatePickerTitle, {
props: {
date: this.value ? this.formatters.titleDate(this.value) : '',
disabled: this.disabled,
readonly: this.readonly,
selectingYear: this.activePicker === 'YEAR',
year: this.formatters.year(this.value ? '' + this.inputYear : this.tableDate),
yearIcon: this.yearIcon,
value: this.multiple ? this.value[0] : this.value
},
slot: 'title',
on: {
'update:selectingYear': function updateSelectingYear(value) {
return _this3.activePicker = value ? 'YEAR' : _this3.type.toUpperCase();
}
}
});
},
genTableHeader: function genTableHeader() {
var _this4 = this;
return this.$createElement(VDatePickerHeader, {
props: {
nextIcon: this.nextIcon,
color: this.color,
dark: this.dark,
disabled: this.disabled,
format: this.headerDateFormat,
light: this.light,
locale: this.locale,
min: this.activePicker === 'DATE' ? this.minMonth : this.minYear,
max: this.activePicker === 'DATE' ? this.maxMonth : this.maxYear,
prevIcon: this.prevIcon,
readonly: this.readonly,
value: this.activePicker === 'DATE' ? pad(this.tableYear, 4) + '-' + pad(this.tableMonth + 1) : '' + pad(this.tableYear, 4)
},
on: {
toggle: function toggle() {
return _this4.activePicker = _this4.activePicker === 'DATE' ? 'MONTH' : 'YEAR';
},
input: function input(value) {
return _this4.tableDate = value;
}
}
});
},
genDateTable: function genDateTable() {
var _this5 = this;
return this.$createElement(VDatePickerDateTable, {
props: {
allowedDates: this.allowedDates,
color: this.color,
current: this.current,
dark: this.dark,
disabled: this.disabled,
events: this.events,
eventColor: this.eventColor,
firstDayOfWeek: this.firstDayOfWeek,
format: this.dayFormat,
light: this.light,
locale: this.locale,
min: this.min,
max: this.max,
readonly: this.readonly,
scrollable: this.scrollable,
showWeek: this.showWeek,
tableDate: pad(this.tableYear, 4) + '-' + pad(this.tableMonth + 1),
value: this.value,
weekdayFormat: this.weekdayFormat
},
ref: 'table',
on: {
input: this.dateClick,
tableDate: function tableDate(value) {
return _this5.tableDate = value;
},
'click:date': function clickDate(value) {
return _this5.$emit('click:date', value);
},
'dblclick:date': function dblclickDate(value) {
return _this5.$emit('dblclick:date', value);
}
}
});
},
genMonthTable: function genMonthTable() {
var _this6 = this;
return this.$createElement(VDatePickerMonthTable, {
props: {
allowedDates: this.type === 'month' ? this.allowedDates : null,
color: this.color,
current: this.current ? sanitizeDateString(this.current, 'month') : null,
dark: this.dark,
disabled: this.disabled,
events: this.type === 'month' ? this.events : null,
eventColor: this.type === 'month' ? this.eventColor : null,
format: this.monthFormat,
light: this.light,
locale: this.locale,
min: this.minMonth,
max: this.maxMonth,
readonly: this.readonly && this.type === 'month',
scrollable: this.scrollable,
value: this.selectedMonths,
tableDate: '' + pad(this.tableYear, 4)
},
ref: 'table',
on: {
input: this.monthClick,
tableDate: function tableDate(value) {
return _this6.tableDate = value;
},
'click:month': function clickMonth(value) {
return _this6.$emit('click:month', value);
},
'dblclick:month': function dblclickMonth(value) {
return _this6.$emit('dblclick:month', value);
}
}
});
},
genYears: function genYears() {
return this.$createElement(VDatePickerYears, {
props: {
color: this.color,
format: this.yearFormat,
locale: this.locale,
min: this.minYear,
max: this.maxYear,
value: this.tableYear
},
on: {
input: this.yearClick
}
});
},
genPickerBody: function genPickerBody() {
var children = this.activePicker === 'YEAR' ? [this.genYears()] : [this.genTableHeader(), this.activePicker === 'DATE' ? this.genDateTable() : this.genMonthTable()];
return this.$createElement('div', {
key: this.activePicker
}, children);
},
setInputDate: function setInputDate() {
if (this.lastValue) {
var array = this.lastValue.split('-');
this.inputYear = parseInt(array[0], 10);
this.inputMonth = parseInt(array[1], 10) - 1;
if (this.type === 'date') {
this.inputDay = parseInt(array[2], 10);
}
} else {
this.inputYear = this.inputYear || this.now.getFullYear();
this.inputMonth = this.inputMonth == null ? this.inputMonth : this.now.getMonth();
this.inputDay = this.inputDay || this.now.getDate();
}
}
},
render: function render() {
return this.genPicker('v-picker--date');
}
});
//# sourceMappingURL=VDatePicker.js.map
File diff suppressed because one or more lines are too long
+102
View File
@@ -0,0 +1,102 @@
// Mixins
import DatePickerTable from './mixins/date-picker-table';
// Utils
import { pad, createNativeLocaleFormatter, monthChange } from './util';
import { createRange } from '../../util/helpers';
import mixins from '../../util/mixins';
export default mixins(DatePickerTable
/* @vue/component */
).extend({
name: 'v-date-picker-date-table',
props: {
firstDayOfWeek: {
type: [String, Number],
default: 0
},
showWeek: Boolean,
weekdayFormat: Function
},
computed: {
formatter: function formatter() {
return this.format || createNativeLocaleFormatter(this.locale, { day: 'numeric', timeZone: 'UTC' }, { start: 8, length: 2 });
},
weekdayFormatter: function weekdayFormatter() {
return this.weekdayFormat || createNativeLocaleFormatter(this.locale, { weekday: 'narrow', timeZone: 'UTC' });
},
weekDays: function weekDays() {
var _this = this;
var first = parseInt(this.firstDayOfWeek, 10);
return this.weekdayFormatter ? createRange(7).map(function (i) {
return _this.weekdayFormatter('2017-01-' + (first + i + 15));
}) // 2017-01-15 is Sunday
: createRange(7).map(function (i) {
return ['S', 'M', 'T', 'W', 'T', 'F', 'S'][(i + first) % 7];
});
}
},
methods: {
calculateTableDate: function calculateTableDate(delta) {
return monthChange(this.tableDate, Math.sign(delta || 1));
},
genTHead: function genTHead() {
var _this2 = this;
var days = this.weekDays.map(function (day) {
return _this2.$createElement('th', day);
});
this.showWeek && days.unshift(this.$createElement('th'));
return this.$createElement('thead', this.genTR(days));
},
// Returns number of the days from the firstDayOfWeek to the first day of the current month
weekDaysBeforeFirstDayOfTheMonth: function weekDaysBeforeFirstDayOfTheMonth() {
var firstDayOfTheMonth = new Date(this.displayedYear + '-' + pad(this.displayedMonth + 1) + '-01T00:00:00+00:00');
var weekDay = firstDayOfTheMonth.getUTCDay();
return (weekDay - parseInt(this.firstDayOfWeek) + 7) % 7;
},
getWeekNumber: function getWeekNumber() {
var dayOfYear = [0, 31, 59, 90, 120, 151, 181, 212, 243, 273, 304, 334][this.displayedMonth];
if (this.displayedMonth > 1 && (this.displayedYear % 4 === 0 && this.displayedYear % 100 !== 0 || this.displayedYear % 400 === 0)) {
dayOfYear++;
}
var offset = (this.displayedYear + (this.displayedYear - 1 >> 2) - Math.floor((this.displayedYear - 1) / 100) + Math.floor((this.displayedYear - 1) / 400) - Number(this.firstDayOfWeek)) % 7; // https://en.wikipedia.org/wiki/Zeller%27s_congruence
return Math.floor((dayOfYear + offset) / 7) + 1;
},
genWeekNumber: function genWeekNumber(weekNumber) {
return this.$createElement('td', [this.$createElement('small', {
staticClass: 'v-date-picker-table--date__week'
}, String(weekNumber).padStart(2, '0'))]);
},
genTBody: function genTBody() {
var children = [];
var daysInMonth = new Date(this.displayedYear, this.displayedMonth + 1, 0).getDate();
var rows = [];
var day = this.weekDaysBeforeFirstDayOfTheMonth();
var weekNumber = this.getWeekNumber();
this.showWeek && rows.push(this.genWeekNumber(weekNumber++));
while (day--) {
rows.push(this.$createElement('td'));
}for (day = 1; day <= daysInMonth; day++) {
var date = this.displayedYear + '-' + pad(this.displayedMonth + 1) + '-' + pad(day);
rows.push(this.$createElement('td', [this.genButton(date, true, 'date', this.formatter)]));
if (rows.length % (this.showWeek ? 8 : 7) === 0) {
children.push(this.genTR(rows));
rows = [];
day < daysInMonth && this.showWeek && rows.push(this.genWeekNumber(weekNumber++));
}
}
if (rows.length) {
children.push(this.genTR(rows));
}
return this.$createElement('tbody', children);
},
genTR: function genTR(children) {
return [this.$createElement('tr', children)];
}
},
render: function render() {
return this.genTable('v-date-picker-table v-date-picker-table--date', [this.genTHead(), this.genTBody()], this.calculateTableDate);
}
});
//# sourceMappingURL=VDatePickerDateTable.js.map
File diff suppressed because one or more lines are too long
+134
View File
@@ -0,0 +1,134 @@
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
import '../../../src/stylus/components/_date-picker-header.styl';
// Components
import VBtn from '../VBtn';
import VIcon from '../VIcon';
// Mixins
import Colorable from '../../mixins/colorable';
import Themeable from '../../mixins/themeable';
// Utils
import { createNativeLocaleFormatter, monthChange } from './util';
import mixins from '../../util/mixins';
export default mixins(Colorable, Themeable
/* @vue/component */
).extend({
name: 'v-date-picker-header',
props: {
disabled: Boolean,
format: Function,
locale: {
type: String,
default: 'en-us'
},
min: String,
max: String,
nextIcon: {
type: String,
default: '$vuetify.icons.next'
},
prevIcon: {
type: String,
default: '$vuetify.icons.prev'
},
readonly: Boolean,
value: {
type: [Number, String],
required: true
}
},
data: function data() {
return {
isReversing: false
};
},
computed: {
formatter: function formatter() {
if (this.format) {
return this.format;
} else if (String(this.value).split('-')[1]) {
return createNativeLocaleFormatter(this.locale, { month: 'long', year: 'numeric', timeZone: 'UTC' }, { length: 7 });
} else {
return createNativeLocaleFormatter(this.locale, { year: 'numeric', timeZone: 'UTC' }, { length: 4 });
}
}
},
watch: {
value: function value(newVal, oldVal) {
this.isReversing = newVal < oldVal;
}
},
methods: {
genBtn: function genBtn(change) {
var _this = this;
var disabled = this.disabled || change < 0 && this.min && this.calculateChange(change) < this.min || change > 0 && this.max && this.calculateChange(change) > this.max;
return this.$createElement(VBtn, {
props: {
dark: this.dark,
disabled: disabled,
icon: true,
light: this.light
},
nativeOn: {
click: function click(e) {
e.stopPropagation();
_this.$emit('input', _this.calculateChange(change));
}
}
}, [this.$createElement(VIcon, change < 0 === !this.$vuetify.rtl ? this.prevIcon : this.nextIcon)]);
},
calculateChange: function calculateChange(sign) {
var _String$split$map = String(this.value).split('-').map(Number),
_String$split$map2 = _slicedToArray(_String$split$map, 2),
year = _String$split$map2[0],
month = _String$split$map2[1];
if (month == null) {
return '' + (year + sign);
} else {
return monthChange(String(this.value), sign);
}
},
genHeader: function genHeader() {
var _this2 = this;
var color = !this.disabled && (this.color || 'accent');
var header = this.$createElement('div', this.setTextColor(color, {
key: String(this.value)
}), [this.$createElement('button', {
attrs: {
type: 'button'
},
on: {
click: function click() {
return _this2.$emit('toggle');
}
}
}, [this.$slots.default || this.formatter(String(this.value))])]);
var transition = this.$createElement('transition', {
props: {
name: this.isReversing === !this.$vuetify.rtl ? 'tab-reverse-transition' : 'tab-transition'
}
}, [header]);
return this.$createElement('div', {
staticClass: 'v-date-picker-header__value',
class: {
'v-date-picker-header__value--disabled': this.disabled
}
}, [transition]);
}
},
render: function render() {
return this.$createElement('div', {
staticClass: 'v-date-picker-header',
class: _extends({
'v-date-picker-header--disabled': this.disabled
}, this.themeClasses)
}, [this.genBtn(-1), this.genHeader(), this.genBtn(+1)]);
}
});
//# sourceMappingURL=VDatePickerHeader.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,49 @@
// Mixins
import DatePickerTable from './mixins/date-picker-table';
// Utils
import { pad, createNativeLocaleFormatter } from './util';
import mixins from '../../util/mixins';
export default mixins(DatePickerTable
/* @vue/component */
).extend({
name: 'v-date-picker-month-table',
computed: {
formatter: function formatter() {
return this.format || createNativeLocaleFormatter(this.locale, { month: 'short', timeZone: 'UTC' }, { start: 5, length: 2 });
}
},
methods: {
calculateTableDate: function calculateTableDate(delta) {
return '' + (parseInt(this.tableDate, 10) + Math.sign(delta || 1));
},
genTBody: function genTBody() {
var _this = this;
var children = [];
var cols = Array(3).fill(null);
var rows = 12 / cols.length;
var _loop = function _loop(row) {
var tds = cols.map(function (_, col) {
var month = row * cols.length + col;
var date = _this.displayedYear + '-' + pad(month + 1);
return _this.$createElement('td', {
key: month
}, [_this.genButton(date, false, 'month', _this.formatter)]);
});
children.push(_this.$createElement('tr', {
key: row
}, tds));
};
for (var row = 0; row < rows; row++) {
_loop(row);
}
return this.$createElement('tbody', children);
}
},
render: function render() {
return this.genTable('v-date-picker-table v-date-picker-table--month', [this.genTBody()], this.calculateTableDate);
}
});
//# sourceMappingURL=VDatePickerMonthTable.js.map
@@ -0,0 +1 @@
{"version":3,"sources":["../../../src/components/VDatePicker/VDatePickerMonthTable.ts"],"names":[],"mappings":";AACA,OAAO,eAAP,MAA4B,4BAA5B;AAEA;AACA,SAAS,GAAT,EAAc,2BAAd,QAAiD,QAAjD;AACA,OAAO,MAAP,MAAmB,mBAAnB;AAMA,eAAe,OACb;AACF;AAFe,EAGb,MAHa,CAGN;AACP,UAAM,2BADC;AAGP,cAAU;AACR,iBADQ,uBACC;AACP,mBAAO,KAAK,MAAL,IAAe,4BAA4B,KAAK,MAAjC,EAAyC,EAAE,OAAO,OAAT,EAAkB,UAAU,KAA5B,EAAzC,EAA8E,EAAE,OAAO,CAAT,EAAY,QAAQ,CAApB,EAA9E,CAAtB;AACD;AAHO,KAHH;AASP,aAAS;AACP,0BADO,8BACa,KADb,EAC0B;AAC/B,yBAAU,SAAS,KAAK,SAAd,EAAyB,EAAzB,IAA+B,KAAK,IAAL,CAAU,SAAS,CAAnB,CAAzC;AACD,SAHM;AAIP,gBAJO,sBAIC;AAAA;;AACN,gBAAM,WAAW,EAAjB;AACA,gBAAM,OAAO,MAAM,CAAN,EAAS,IAAT,CAAc,IAAd,CAAb;AACA,gBAAM,OAAO,KAAK,KAAK,MAAvB;;AAHM,uCAKG,GALH;AAMJ,oBAAM,MAAM,KAAK,GAAL,CAAS,UAAC,CAAD,EAAI,GAAJ,EAAW;AAC9B,wBAAM,QAAQ,MAAM,KAAK,MAAX,GAAoB,GAAlC;AACA,wBAAM,OAAU,MAAK,aAAf,SAAgC,IAAI,QAAQ,CAAZ,CAAtC;AACA,2BAAO,MAAK,cAAL,CAAoB,IAApB,EAA0B;AAC/B,6BAAK;AAD0B,qBAA1B,EAEJ,CACD,MAAK,SAAL,CAAe,IAAf,EAAqB,KAArB,EAA4B,OAA5B,EAAqC,MAAK,SAA1C,CADC,CAFI,CAAP;AAKD,iBARW,CAAZ;AAUA,yBAAS,IAAT,CAAc,MAAK,cAAL,CAAoB,IAApB,EAA0B;AACtC,yBAAK;AADiC,iBAA1B,EAEX,GAFW,CAAd;AAhBI;;AAKN,iBAAK,IAAI,MAAM,CAAf,EAAkB,MAAM,IAAxB,EAA8B,KAA9B,EAAqC;AAAA,sBAA5B,GAA4B;AAcpC;AAED,mBAAO,KAAK,cAAL,CAAoB,OAApB,EAA6B,QAA7B,CAAP;AACD;AA1BM,KATF;AAsCP,UAtCO,oBAsCD;AACJ,eAAO,KAAK,QAAL,CAAc,gDAAd,EAAgE,CACrE,KAAK,QAAL,EADqE,CAAhE,EAEJ,KAAK,kBAFD,CAAP;AAGD;AA1CM,CAHM,CAAf","sourcesContent":["// Mixins\nimport DatePickerTable from './mixins/date-picker-table'\n\n// Utils\nimport { pad, createNativeLocaleFormatter } from './util'\nimport mixins from '../../util/mixins'\n\n// Types\nimport { VNode } from 'vue'\nimport { DatePickerFormatter } from './util/createNativeLocaleFormatter'\n\nexport default mixins(\n DatePickerTable\n/* @vue/component */\n).extend({\n name: 'v-date-picker-month-table',\n\n computed: {\n formatter (): DatePickerFormatter {\n return this.format || createNativeLocaleFormatter(this.locale, { month: 'short', timeZone: 'UTC' }, { start: 5, length: 2 })\n }\n },\n\n methods: {\n calculateTableDate (delta: number) {\n return `${parseInt(this.tableDate, 10) + Math.sign(delta || 1)}`\n },\n genTBody () {\n const children = []\n const cols = Array(3).fill(null)\n const rows = 12 / cols.length\n\n for (let row = 0; row < rows; row++) {\n const tds = cols.map((_, col) => {\n const month = row * cols.length + col\n const date = `${this.displayedYear}-${pad(month + 1)}`\n return this.$createElement('td', {\n key: month\n }, [\n this.genButton(date, false, 'month', this.formatter)\n ])\n })\n\n children.push(this.$createElement('tr', {\n key: row\n }, tds))\n }\n\n return this.$createElement('tbody', children)\n }\n },\n\n render (): VNode {\n return this.genTable('v-date-picker-table v-date-picker-table--month', [\n this.genTBody()\n ], this.calculateTableDate)\n }\n})\n"],"sourceRoot":""}
+80
View File
@@ -0,0 +1,80 @@
import '../../../src/stylus/components/_date-picker-title.styl';
// Components
import VIcon from '../VIcon';
// Mixins
import PickerButton from '../../mixins/picker-button';
// Utils
import mixins from '../../util/mixins';
export default mixins(PickerButton
/* @vue/component */
).extend({
name: 'v-date-picker-title',
props: {
date: {
type: String,
default: ''
},
disabled: Boolean,
readonly: Boolean,
selectingYear: Boolean,
value: {
type: String
},
year: {
type: [Number, String],
default: ''
},
yearIcon: {
type: String
}
},
data: function data() {
return {
isReversing: false
};
},
computed: {
computedTransition: function computedTransition() {
return this.isReversing ? 'picker-reverse-transition' : 'picker-transition';
}
},
watch: {
value: function value(val, prev) {
this.isReversing = val < prev;
}
},
methods: {
genYearIcon: function genYearIcon() {
return this.$createElement(VIcon, {
props: {
dark: true
}
}, this.yearIcon);
},
getYearBtn: function getYearBtn() {
return this.genPickerButton('selectingYear', true, [String(this.year), this.yearIcon ? this.genYearIcon() : null], false, 'v-date-picker-title__year');
},
genTitleText: function genTitleText() {
return this.$createElement('transition', {
props: {
name: this.computedTransition
}
}, [this.$createElement('div', {
domProps: { innerHTML: this.date || '&nbsp;' },
key: this.value
})]);
},
genTitleDate: function genTitleDate() {
return this.genPickerButton('selectingYear', false, [this.genTitleText()], false, 'v-date-picker-title__date');
}
},
render: function render(h) {
return h('div', {
staticClass: 'v-date-picker-title',
'class': {
'v-date-picker-title--disabled': this.disabled
}
}, [this.getYearBtn(), this.genTitleDate()]);
}
});
//# sourceMappingURL=VDatePickerTitle.js.map
@@ -0,0 +1 @@
{"version":3,"sources":["../../../src/components/VDatePicker/VDatePickerTitle.ts"],"names":[],"mappings":"AAAA,OAAO,wDAAP;AAEA;AACA,OAAO,KAAP,MAAkB,UAAlB;AAEA;AACA,OAAO,YAAP,MAAyB,4BAAzB;AAEA;AACA,OAAO,MAAP,MAAmB,mBAAnB;AAKA,eAAe,OACb;AACF;AAFe,EAGb,MAHa,CAGN;AACP,UAAM,qBADC;AAGP,WAAO;AACL,cAAM;AACJ,kBAAM,MADF;AAEJ,qBAAS;AAFL,SADD;AAKL,kBAAU,OALL;AAML,kBAAU,OANL;AAOL,uBAAe,OAPV;AAQL,eAAO;AACL,kBAAM;AADD,SARF;AAWL,cAAM;AACJ,kBAAM,CAAC,MAAD,EAAS,MAAT,CADF;AAEJ,qBAAS;AAFL,SAXD;AAeL,kBAAU;AACR,kBAAM;AADE;AAfL,KAHA;AAuBP,UAAM;AAAA,eAAO;AACX,yBAAa;AADF,SAAP;AAAA,KAvBC;AA2BP,cAAU;AACR,0BADQ,gCACU;AAChB,mBAAO,KAAK,WAAL,GAAmB,2BAAnB,GAAiD,mBAAxD;AACD;AAHO,KA3BH;AAiCP,WAAO;AACL,aADK,iBACE,GADF,EACe,IADf,EAC2B;AAC9B,iBAAK,WAAL,GAAmB,MAAM,IAAzB;AACD;AAHI,KAjCA;AAuCP,aAAS;AACP,mBADO,yBACI;AACT,mBAAO,KAAK,cAAL,CAAoB,KAApB,EAA2B;AAChC,uBAAO;AACL,0BAAM;AADD;AADyB,aAA3B,EAIJ,KAAK,QAJD,CAAP;AAKD,SAPM;AAQP,kBARO,wBAQG;AACR,mBAAO,KAAK,eAAL,CAAqB,eAArB,EAAsC,IAAtC,EAA4C,CACjD,OAAO,KAAK,IAAZ,CADiD,EAEjD,KAAK,QAAL,GAAgB,KAAK,WAAL,EAAhB,GAAqC,IAFY,CAA5C,EAGJ,KAHI,EAGG,2BAHH,CAAP;AAID,SAbM;AAcP,oBAdO,0BAcK;AACV,mBAAO,KAAK,cAAL,CAAoB,YAApB,EAAkC;AACvC,uBAAO;AACL,0BAAM,KAAK;AADN;AADgC,aAAlC,EAIJ,CACD,KAAK,cAAL,CAAoB,KAApB,EAA2B;AACzB,0BAAU,EAAE,WAAW,KAAK,IAAL,IAAa,QAA1B,EADe;AAEzB,qBAAK,KAAK;AAFe,aAA3B,CADC,CAJI,CAAP;AAUD,SAzBM;AA0BP,oBA1BO,0BA0BK;AACV,mBAAO,KAAK,eAAL,CAAqB,eAArB,EAAsC,KAAtC,EAA6C,CAAC,KAAK,YAAL,EAAD,CAA7C,EAAoE,KAApE,EAA2E,2BAA3E,CAAP;AACD;AA5BM,KAvCF;AAsEP,UAtEO,kBAsEC,CAtED,EAsEE;AACP,eAAO,EAAE,KAAF,EAAS;AACd,yBAAa,qBADC;AAEd,qBAAS;AACP,iDAAiC,KAAK;AAD/B;AAFK,SAAT,EAKJ,CACD,KAAK,UAAL,EADC,EAED,KAAK,YAAL,EAFC,CALI,CAAP;AASD;AAhFM,CAHM,CAAf","sourcesContent":["import '../../stylus/components/_date-picker-title.styl'\n\n// Components\nimport VIcon from '../VIcon'\n\n// Mixins\nimport PickerButton from '../../mixins/picker-button'\n\n// Utils\nimport mixins from '../../util/mixins'\n\n// Types\nimport { VNode } from 'vue'\n\nexport default mixins(\n PickerButton\n/* @vue/component */\n).extend({\n name: 'v-date-picker-title',\n\n props: {\n date: {\n type: String,\n default: ''\n },\n disabled: Boolean,\n readonly: Boolean,\n selectingYear: Boolean,\n value: {\n type: String\n },\n year: {\n type: [Number, String],\n default: ''\n },\n yearIcon: {\n type: String\n }\n },\n\n data: () => ({\n isReversing: false\n }),\n\n computed: {\n computedTransition (): string {\n return this.isReversing ? 'picker-reverse-transition' : 'picker-transition'\n }\n },\n\n watch: {\n value (val: string, prev: string) {\n this.isReversing = val < prev\n }\n },\n\n methods: {\n genYearIcon (): VNode {\n return this.$createElement(VIcon, {\n props: {\n dark: true\n }\n }, this.yearIcon)\n },\n getYearBtn (): VNode {\n return this.genPickerButton('selectingYear', true, [\n String(this.year),\n this.yearIcon ? this.genYearIcon() : null\n ], false, 'v-date-picker-title__year')\n },\n genTitleText (): VNode {\n return this.$createElement('transition', {\n props: {\n name: this.computedTransition\n }\n }, [\n this.$createElement('div', {\n domProps: { innerHTML: this.date || '&nbsp;' },\n key: this.value\n })\n ])\n },\n genTitleDate (): VNode {\n return this.genPickerButton('selectingYear', false, [this.genTitleText()], false, 'v-date-picker-title__date')\n }\n },\n\n render (h): VNode {\n return h('div', {\n staticClass: 'v-date-picker-title',\n 'class': {\n 'v-date-picker-title--disabled': this.disabled\n }\n }, [\n this.getYearBtn(),\n this.genTitleDate()\n ])\n }\n})\n"],"sourceRoot":""}
+81
View File
@@ -0,0 +1,81 @@
import '../../../src/stylus/components/_date-picker-years.styl';
// Mixins
import Colorable from '../../mixins/colorable';
// Utils
import { createNativeLocaleFormatter } from './util';
import mixins from '../../util/mixins';
export default mixins(Colorable
/* @vue/component */
).extend({
name: 'v-date-picker-years',
props: {
format: Function,
locale: {
type: String,
default: 'en-us'
},
min: [Number, String],
max: [Number, String],
readonly: Boolean,
value: [Number, String]
},
data: function data() {
return {
defaultColor: 'primary'
};
},
computed: {
formatter: function formatter() {
return this.format || createNativeLocaleFormatter(this.locale, { year: 'numeric', timeZone: 'UTC' }, { length: 4 });
}
},
mounted: function mounted() {
var _this = this;
setTimeout(function () {
var activeItem = _this.$el.getElementsByClassName('active')[0];
if (activeItem) {
_this.$el.scrollTop = activeItem.offsetTop - _this.$el.offsetHeight / 2 + activeItem.offsetHeight / 2;
} else {
_this.$el.scrollTop = _this.$el.scrollHeight / 2 - _this.$el.offsetHeight / 2;
}
});
},
methods: {
genYearItem: function genYearItem(year) {
var _this2 = this;
var formatted = this.formatter('' + year);
var active = parseInt(this.value, 10) === year;
var color = active && (this.color || 'primary');
return this.$createElement('li', this.setTextColor(color, {
key: year,
'class': { active: active },
on: {
click: function click() {
return _this2.$emit('input', year);
}
}
}), formatted);
},
genYearItems: function genYearItems() {
var children = [];
var selectedYear = this.value ? parseInt(this.value, 10) : new Date().getFullYear();
var maxYear = this.max ? parseInt(this.max, 10) : selectedYear + 100;
var minYear = Math.min(maxYear, this.min ? parseInt(this.min, 10) : selectedYear - 100);
for (var year = maxYear; year >= minYear; year--) {
children.push(this.genYearItem(year));
}
return children;
}
},
render: function render() {
return this.$createElement('ul', {
staticClass: 'v-date-picker-years',
ref: 'years'
}, this.genYearItems());
}
});
//# sourceMappingURL=VDatePickerYears.js.map
@@ -0,0 +1 @@
{"version":3,"sources":["../../../src/components/VDatePicker/VDatePickerYears.ts"],"names":[],"mappings":"AAAA,OAAO,wDAAP;AAEA;AACA,OAAO,SAAP,MAAsB,wBAAtB;AAEA;AACA,SAAS,2BAAT,QAA4C,QAA5C;AACA,OAAO,MAAP,MAAmC,mBAAnC;AAWA,eAAe,OAOb;AACF;AARe,EASb,MATa,CASN;AACP,UAAM,qBADC;AAGP,WAAO;AACL,gBAAQ,QADH;AAEL,gBAAQ;AACN,kBAAM,MADA;AAEN,qBAAS;AAFH,SAFH;AAML,aAAK,CAAC,MAAD,EAAS,MAAT,CANA;AAOL,aAAK,CAAC,MAAD,EAAS,MAAT,CAPA;AAQL,kBAAU,OARL;AASL,eAAO,CAAC,MAAD,EAAS,MAAT;AATF,KAHA;AAeP,QAfO,kBAeH;AACF,eAAO;AACL,0BAAc;AADT,SAAP;AAGD,KAnBM;;AAqBP,cAAU;AACR,iBADQ,uBACC;AACP,mBAAO,KAAK,MAAL,IAAe,4BAA4B,KAAK,MAAjC,EAAyC,EAAE,MAAM,SAAR,EAAmB,UAAU,KAA7B,EAAzC,EAA+E,EAAE,QAAQ,CAAV,EAA/E,CAAtB;AACD;AAHO,KArBH;AA2BP,WA3BO,qBA2BA;AAAA;;AACL,mBAAW,YAAK;AACd,gBAAM,aAAa,MAAK,GAAL,CAAS,sBAAT,CAAgC,QAAhC,EAA0C,CAA1C,CAAnB;AACA,gBAAI,UAAJ,EAAgB;AACd,sBAAK,GAAL,CAAS,SAAT,GAAqB,WAAW,SAAX,GAAuB,MAAK,GAAL,CAAS,YAAT,GAAwB,CAA/C,GAAmD,WAAW,YAAX,GAA0B,CAAlG;AACD,aAFD,MAEO;AACL,sBAAK,GAAL,CAAS,SAAT,GAAqB,MAAK,GAAL,CAAS,YAAT,GAAwB,CAAxB,GAA4B,MAAK,GAAL,CAAS,YAAT,GAAwB,CAAzE;AACD;AACF,SAPD;AAQD,KApCM;;AAsCP,aAAS;AACP,mBADO,uBACM,IADN,EACkB;AAAA;;AACvB,gBAAM,YAAY,KAAK,SAAL,MAAkB,IAAlB,CAAlB;AACA,gBAAM,SAAS,SAAS,KAAK,KAAd,EAAqB,EAArB,MAA6B,IAA5C;AACA,gBAAM,QAAQ,WAAW,KAAK,KAAL,IAAc,SAAzB,CAAd;AAEA,mBAAO,KAAK,cAAL,CAAoB,IAApB,EAA0B,KAAK,YAAL,CAAkB,KAAlB,EAAyB;AACxD,qBAAK,IADmD;AAExD,yBAAS,EAAE,cAAF,EAF+C;AAGxD,oBAAI;AACF,2BAAO;AAAA,+BAAM,OAAK,KAAL,CAAW,OAAX,EAAoB,IAApB,CAAN;AAAA;AADL;AAHoD,aAAzB,CAA1B,EAMH,SANG,CAAP;AAOD,SAbM;AAeP,oBAfO,0BAeK;AACV,gBAAM,WAAW,EAAjB;AACA,gBAAM,eAAe,KAAK,KAAL,GAAa,SAAS,KAAK,KAAd,EAAqB,EAArB,CAAb,GAAwC,IAAI,IAAJ,GAAW,WAAX,EAA7D;AACA,gBAAM,UAAU,KAAK,GAAL,GAAW,SAAS,KAAK,GAAd,EAAmB,EAAnB,CAAX,GAAqC,eAAe,GAApE;AACA,gBAAM,UAAU,KAAK,GAAL,CAAS,OAAT,EAAkB,KAAK,GAAL,GAAW,SAAS,KAAK,GAAd,EAAmB,EAAnB,CAAX,GAAqC,eAAe,GAAtE,CAAhB;AAEA,iBAAK,IAAI,OAAO,OAAhB,EAAyB,QAAQ,OAAjC,EAA0C,MAA1C,EAAkD;AAChD,yBAAS,IAAT,CAAc,KAAK,WAAL,CAAiB,IAAjB,CAAd;AACD;AAED,mBAAO,QAAP;AACD;AA1BM,KAtCF;AAmEP,UAnEO,oBAmED;AACJ,eAAO,KAAK,cAAL,CAAoB,IAApB,EAA0B;AAC/B,yBAAa,qBADkB;AAE/B,iBAAK;AAF0B,SAA1B,EAGJ,KAAK,YAAL,EAHI,CAAP;AAID;AAxEM,CATM,CAAf","sourcesContent":["import '../../stylus/components/_date-picker-years.styl'\n\n// Mixins\nimport Colorable from '../../mixins/colorable'\n\n// Utils\nimport { createNativeLocaleFormatter } from './util'\nimport mixins, { ExtractVue } from '../../util/mixins'\n\n// Types\nimport Vue, { VNode } from 'vue'\nimport { DatePickerFormatter } from './util/createNativeLocaleFormatter'\nimport { PropValidator } from 'vue/types/options'\n\ninterface options extends Vue {\n $el: HTMLElement\n}\n\nexport default mixins<options &\n/* eslint-disable indent */\n ExtractVue<[\n typeof Colorable\n ]>\n/* eslint-enable indent */\n>(\n Colorable\n/* @vue/component */\n).extend({\n name: 'v-date-picker-years',\n\n props: {\n format: Function as PropValidator<DatePickerFormatter | undefined>,\n locale: {\n type: String,\n default: 'en-us'\n },\n min: [Number, String],\n max: [Number, String],\n readonly: Boolean,\n value: [Number, String]\n },\n\n data () {\n return {\n defaultColor: 'primary'\n }\n },\n\n computed: {\n formatter (): DatePickerFormatter {\n return this.format || createNativeLocaleFormatter(this.locale, { year: 'numeric', timeZone: 'UTC' }, { length: 4 })\n }\n },\n\n mounted () {\n setTimeout(() => {\n const activeItem = this.$el.getElementsByClassName('active')[0]\n if (activeItem) {\n this.$el.scrollTop = activeItem.offsetTop - this.$el.offsetHeight / 2 + activeItem.offsetHeight / 2\n } else {\n this.$el.scrollTop = this.$el.scrollHeight / 2 - this.$el.offsetHeight / 2\n }\n })\n },\n\n methods: {\n genYearItem (year: number): VNode {\n const formatted = this.formatter(`${year}`)\n const active = parseInt(this.value, 10) === year\n const color = active && (this.color || 'primary')\n\n return this.$createElement('li', this.setTextColor(color, {\n key: year,\n 'class': { active },\n on: {\n click: () => this.$emit('input', year)\n }\n }), formatted)\n },\n\n genYearItems (): VNode[] {\n const children = []\n const selectedYear = this.value ? parseInt(this.value, 10) : new Date().getFullYear()\n const maxYear = this.max ? parseInt(this.max, 10) : (selectedYear + 100)\n const minYear = Math.min(maxYear, this.min ? parseInt(this.min, 10) : (selectedYear - 100))\n\n for (let year = maxYear; year >= minYear; year--) {\n children.push(this.genYearItem(year))\n }\n\n return children\n }\n },\n\n render (): VNode {\n return this.$createElement('ul', {\n staticClass: 'v-date-picker-years',\n ref: 'years'\n }, this.genYearItems())\n }\n})\n"],"sourceRoot":""}
+18
View File
@@ -0,0 +1,18 @@
import VDatePicker from './VDatePicker';
import VDatePickerTitle from './VDatePickerTitle';
import VDatePickerHeader from './VDatePickerHeader';
import VDatePickerDateTable from './VDatePickerDateTable';
import VDatePickerMonthTable from './VDatePickerMonthTable';
import VDatePickerYears from './VDatePickerYears';
export { VDatePicker, VDatePickerTitle, VDatePickerHeader, VDatePickerDateTable, VDatePickerMonthTable, VDatePickerYears };
export default {
$_vuetify_subcomponents: {
VDatePicker: VDatePicker,
VDatePickerTitle: VDatePickerTitle,
VDatePickerHeader: VDatePickerHeader,
VDatePickerDateTable: VDatePickerDateTable,
VDatePickerMonthTable: VDatePickerMonthTable,
VDatePickerYears: VDatePickerYears
}
};
//# sourceMappingURL=index.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../../../src/components/VDatePicker/index.js"],"names":[],"mappings":"AAAA,OAAO,WAAP,MAAwB,eAAxB;AACA,OAAO,gBAAP,MAA6B,oBAA7B;AACA,OAAO,iBAAP,MAA8B,qBAA9B;AACA,OAAO,oBAAP,MAAiC,wBAAjC;AACA,OAAO,qBAAP,MAAkC,yBAAlC;AACA,OAAO,gBAAP,MAA6B,oBAA7B;AAEA,SACE,WADF,EAEE,gBAFF,EAGE,iBAHF,EAIE,oBAJF,EAKE,qBALF,EAME,gBANF;AASA,eAAe;AACb,6BAAyB;AACvB,gCADuB;AAEvB,0CAFuB;AAGvB,4CAHuB;AAIvB,kDAJuB;AAKvB,oDALuB;AAMvB;AANuB;AADZ,CAAf","sourcesContent":["import VDatePicker from './VDatePicker'\nimport VDatePickerTitle from './VDatePickerTitle'\nimport VDatePickerHeader from './VDatePickerHeader'\nimport VDatePickerDateTable from './VDatePickerDateTable'\nimport VDatePickerMonthTable from './VDatePickerMonthTable'\nimport VDatePickerYears from './VDatePickerYears'\n\nexport {\n VDatePicker,\n VDatePickerTitle,\n VDatePickerHeader,\n VDatePickerDateTable,\n VDatePickerMonthTable,\n VDatePickerYears\n}\n\nexport default {\n $_vuetify_subcomponents: {\n VDatePicker,\n VDatePickerTitle,\n VDatePickerHeader,\n VDatePickerDateTable,\n VDatePickerMonthTable,\n VDatePickerYears\n }\n}\n"],"sourceRoot":""}
@@ -0,0 +1,195 @@
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
import '../../../../src/stylus/components/_date-picker-table.styl';
// Directives
import Touch from '../../../directives/touch';
// Mixins
import Colorable from '../../../mixins/colorable';
import Themeable from '../../../mixins/themeable';
// Utils
import isDateAllowed from '../util/isDateAllowed';
import mixins from '../../../util/mixins';
export default mixins(Colorable, Themeable
/* @vue/component */
).extend({
directives: { Touch: Touch },
props: {
allowedDates: Function,
current: String,
disabled: Boolean,
format: Function,
events: {
type: [Array, Function, Object],
default: function _default() {
return null;
}
},
eventColor: {
type: [Array, Function, Object, String],
default: function _default() {
return 'warning';
}
},
locale: {
type: String,
default: 'en-us'
},
min: String,
max: String,
readonly: Boolean,
scrollable: Boolean,
tableDate: {
type: String,
required: true
},
value: [String, Array]
},
data: function data() {
return {
isReversing: false
};
},
computed: {
computedTransition: function computedTransition() {
return this.isReversing === !this.$vuetify.rtl ? 'tab-reverse-transition' : 'tab-transition';
},
displayedMonth: function displayedMonth() {
return Number(this.tableDate.split('-')[1]) - 1;
},
displayedYear: function displayedYear() {
return Number(this.tableDate.split('-')[0]);
}
},
watch: {
tableDate: function tableDate(newVal, oldVal) {
this.isReversing = newVal < oldVal;
}
},
methods: {
genButtonClasses: function genButtonClasses(isAllowed, isFloating, isSelected, isCurrent) {
return _extends({
'v-btn--active': isSelected,
'v-btn--flat': !isSelected,
'v-btn--icon': isSelected && isAllowed && isFloating,
'v-btn--floating': isFloating,
'v-btn--depressed': !isFloating && isSelected,
'v-btn--disabled': !isAllowed || this.disabled && isSelected,
'v-btn--outline': isCurrent && !isSelected
}, this.themeClasses);
},
genButtonEvents: function genButtonEvents(value, isAllowed, mouseEventType) {
var _this = this;
if (this.disabled) return undefined;
return {
click: function click() {
isAllowed && !_this.readonly && _this.$emit('input', value);
_this.$emit('click:' + mouseEventType, value);
},
dblclick: function dblclick() {
return _this.$emit('dblclick:' + mouseEventType, value);
}
};
},
genButton: function genButton(value, isFloating, mouseEventType, formatter) {
var isAllowed = isDateAllowed(value, this.min, this.max, this.allowedDates);
var isSelected = value === this.value || Array.isArray(this.value) && this.value.indexOf(value) !== -1;
var isCurrent = value === this.current;
var setColor = isSelected ? this.setBackgroundColor : this.setTextColor;
var color = (isSelected || isCurrent) && (this.color || 'accent');
return this.$createElement('button', setColor(color, {
staticClass: 'v-btn',
'class': this.genButtonClasses(isAllowed, isFloating, isSelected, isCurrent),
attrs: {
type: 'button'
},
domProps: {
disabled: this.disabled || !isAllowed
},
on: this.genButtonEvents(value, isAllowed, mouseEventType)
}), [this.$createElement('div', {
staticClass: 'v-btn__content'
}, [formatter(value)]), this.genEvents(value)]);
},
getEventColors: function getEventColors(date) {
var arrayize = function arrayize(v) {
return Array.isArray(v) ? v : [v];
};
var eventData = void 0;
var eventColors = [];
if (Array.isArray(this.events)) {
eventData = this.events.includes(date);
} else if (this.events instanceof Function) {
eventData = this.events(date) || false;
} else if (this.events) {
eventData = this.events[date] || false;
} else {
eventData = false;
}
if (!eventData) {
return [];
} else if (eventData !== true) {
eventColors = arrayize(eventData);
} else if (typeof this.eventColor === 'string') {
eventColors = [this.eventColor];
} else if (typeof this.eventColor === 'function') {
eventColors = arrayize(this.eventColor(date));
} else if (Array.isArray(this.eventColor)) {
eventColors = this.eventColor;
} else {
eventColors = arrayize(this.eventColor[date]);
}
return eventColors.filter(function (v) {
return v;
});
},
genEvents: function genEvents(date) {
var _this2 = this;
var eventColors = this.getEventColors(date);
return eventColors.length ? this.$createElement('div', {
staticClass: 'v-date-picker-table__events'
}, eventColors.map(function (color) {
return _this2.$createElement('div', _this2.setBackgroundColor(color));
})) : null;
},
wheel: function wheel(e, calculateTableDate) {
e.preventDefault();
this.$emit('tableDate', calculateTableDate(e.deltaY));
},
touch: function touch(value, calculateTableDate) {
this.$emit('tableDate', calculateTableDate(value));
},
genTable: function genTable(staticClass, children, calculateTableDate) {
var _this3 = this;
var transition = this.$createElement('transition', {
props: { name: this.computedTransition }
}, [this.$createElement('table', { key: this.tableDate }, children)]);
var touchDirective = {
name: 'touch',
value: {
left: function left(e) {
return e.offsetX < -15 && _this3.touch(1, calculateTableDate);
},
right: function right(e) {
return e.offsetX > 15 && _this3.touch(-1, calculateTableDate);
}
}
};
return this.$createElement('div', {
staticClass: staticClass,
class: _extends({
'v-date-picker-table--disabled': this.disabled
}, this.themeClasses),
on: !this.disabled && this.scrollable ? {
wheel: function wheel(e) {
return _this3.wheel(e, calculateTableDate);
}
} : undefined,
directives: [touchDirective]
}, [transition]);
}
}
});
//# sourceMappingURL=date-picker-table.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,28 @@
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
import pad from './pad';
function createNativeLocaleFormatter(locale, options) {
var substrOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : { start: 0, length: 0 };
var makeIsoString = function makeIsoString(dateString) {
var _dateString$trim$spli = dateString.trim().split(' ')[0].split('-'),
_dateString$trim$spli2 = _slicedToArray(_dateString$trim$spli, 3),
year = _dateString$trim$spli2[0],
month = _dateString$trim$spli2[1],
date = _dateString$trim$spli2[2];
return [pad(year, 4), pad(month || 1), pad(date || 1)].join('-');
};
try {
var intlFormatter = new Intl.DateTimeFormat(locale || undefined, options);
return function (dateString) {
return intlFormatter.format(new Date(makeIsoString(dateString) + 'T00:00:00+00:00'));
};
} catch (e) {
return substrOptions.start || substrOptions.length ? function (dateString) {
return makeIsoString(dateString).substr(substrOptions.start || 0, substrOptions.length);
} : undefined;
}
}
export default createNativeLocaleFormatter;
//# sourceMappingURL=createNativeLocaleFormatter.js.map
@@ -0,0 +1 @@
{"version":3,"sources":["../../../../src/components/VDatePicker/util/createNativeLocaleFormatter.ts"],"names":[],"mappings":";;AAAA,OAAO,GAAP,MAAgB,OAAhB;AAoBA,SAAS,2BAAT,CACE,MADF,EAEE,OAFF,EAGwD;AAAA,QAAtD,aAAsD,uEAAvB,EAAE,OAAO,CAAT,EAAY,QAAQ,CAApB,EAAuB;;AAEtD,QAAM,gBAAgB,SAAhB,aAAgB,CAAC,UAAD,EAAuB;AAAA,oCACf,WAAW,IAAX,GAAkB,KAAlB,CAAwB,GAAxB,EAA6B,CAA7B,EAAgC,KAAhC,CAAsC,GAAtC,CADe;AAAA;AAAA,YACpC,IADoC;AAAA,YAC9B,KAD8B;AAAA,YACvB,IADuB;;AAE3C,eAAO,CAAC,IAAI,IAAJ,EAAU,CAAV,CAAD,EAAe,IAAI,SAAS,CAAb,CAAf,EAAgC,IAAI,QAAQ,CAAZ,CAAhC,EAAgD,IAAhD,CAAqD,GAArD,CAAP;AACD,KAHD;AAKA,QAAI;AACF,YAAM,gBAAgB,IAAI,KAAK,cAAT,CAAwB,UAAU,SAAlC,EAA6C,OAA7C,CAAtB;AACA,eAAO,UAAC,UAAD;AAAA,mBAAwB,cAAc,MAAd,CAAqB,IAAI,IAAJ,CAAY,cAAc,UAAd,CAAZ,qBAArB,CAAxB;AAAA,SAAP;AACD,KAHD,CAGE,OAAO,CAAP,EAAU;AACV,eAAQ,cAAc,KAAd,IAAuB,cAAc,MAAtC,GACH,UAAC,UAAD;AAAA,mBAAwB,cAAc,UAAd,EAA0B,MAA1B,CAAiC,cAAc,KAAd,IAAuB,CAAxD,EAA2D,cAAc,MAAzE,CAAxB;AAAA,SADG,GAEH,SAFJ;AAGD;AACF;AAED,eAAe,2BAAf","sourcesContent":["import pad from './pad'\n\ninterface SubstrOptions {\n start?: number\n length: number\n}\n\nexport type DatePickerFormatter = (date: string) => string\n\nfunction createNativeLocaleFormatter (\n local: string | undefined,\n options: Intl.DateTimeFormatOptions\n): DatePickerFormatter | undefined\n\nfunction createNativeLocaleFormatter (\n local: string | undefined,\n options: Intl.DateTimeFormatOptions,\n substrOptions: SubstrOptions\n): DatePickerFormatter\n\nfunction createNativeLocaleFormatter (\n locale: string | undefined,\n options: Intl.DateTimeFormatOptions,\n substrOptions: SubstrOptions = { start: 0, length: 0 }\n): DatePickerFormatter | undefined {\n const makeIsoString = (dateString: string) => {\n const [year, month, date] = dateString.trim().split(' ')[0].split('-')\n return [pad(year, 4), pad(month || 1), pad(date || 1)].join('-')\n }\n\n try {\n const intlFormatter = new Intl.DateTimeFormat(locale || undefined, options)\n return (dateString: string) => intlFormatter.format(new Date(`${makeIsoString(dateString)}T00:00:00+00:00`))\n } catch (e) {\n return (substrOptions.start || substrOptions.length)\n ? (dateString: string) => makeIsoString(dateString).substr(substrOptions.start || 0, substrOptions.length)\n : undefined\n }\n}\n\nexport default createNativeLocaleFormatter\n"],"sourceRoot":""}
+5
View File
@@ -0,0 +1,5 @@
import createNativeLocaleFormatter from './createNativeLocaleFormatter';
import monthChange from './monthChange';
import pad from './pad';
export { createNativeLocaleFormatter, monthChange, pad };
//# sourceMappingURL=index.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../../../../src/components/VDatePicker/util/index.ts"],"names":[],"mappings":"AAAA,OAAO,2BAAP,MAAwC,+BAAxC;AACA,OAAO,WAAP,MAAwB,eAAxB;AACA,OAAO,GAAP,MAAgB,OAAhB;AAEA,SACE,2BADF,EAEE,WAFF,EAGE,GAHF","sourcesContent":["import createNativeLocaleFormatter from './createNativeLocaleFormatter'\nimport monthChange from './monthChange'\nimport pad from './pad'\n\nexport {\n createNativeLocaleFormatter,\n monthChange,\n pad\n}\n"],"sourceRoot":""}
@@ -0,0 +1,4 @@
export default function isDateAllowed(date, min, max, allowedFn) {
return (!allowedFn || allowedFn(date)) && (!min || date >= min) && (!max || date <= max);
}
//# sourceMappingURL=isDateAllowed.js.map
@@ -0,0 +1 @@
{"version":3,"sources":["../../../../src/components/VDatePicker/util/isDateAllowed.ts"],"names":[],"mappings":"eAEc,SAAU,aAAV,CAAyB,IAAzB,EAAuC,GAAvC,EAAoD,GAApD,EAAiE,SAAjE,EAA2G;AACvH,WAAO,CAAC,CAAC,SAAD,IAAc,UAAU,IAAV,CAAf,MACJ,CAAC,GAAD,IAAQ,QAAQ,GADZ,MAEJ,CAAC,GAAD,IAAQ,QAAQ,GAFZ,CAAP;AAGD","sourcesContent":["export type AllowedDateFunction = (date: string) => boolean\n\nexport default function isDateAllowed (date: string, min: string, max: string, allowedFn: AllowedDateFunction | undefined) {\n return (!allowedFn || allowedFn(date)) &&\n (!min || date >= min) &&\n (!max || date <= max)\n}\n"],"sourceRoot":""}
+22
View File
@@ -0,0 +1,22 @@
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
import pad from './pad';
/**
* @param {String} value YYYY-MM format
* @param {Number} sign -1 or +1
*/
export default (function (value, sign) {
var _value$split$map = value.split('-').map(Number),
_value$split$map2 = _slicedToArray(_value$split$map, 2),
year = _value$split$map2[0],
month = _value$split$map2[1];
if (month + sign === 0) {
return year - 1 + '-12';
} else if (month + sign === 13) {
return year + 1 + '-01';
} else {
return year + '-' + pad(month + sign);
}
});
//# sourceMappingURL=monthChange.js.map
@@ -0,0 +1 @@
{"version":3,"sources":["../../../../src/components/VDatePicker/util/monthChange.ts"],"names":[],"mappings":";;AAAA,OAAO,GAAP,MAAgB,OAAhB;AAEA;;;;AAIA,gBAAe,UAAC,KAAD,EAAgB,IAAhB,EAAgC;AAAA,2BACvB,MAAM,KAAN,CAAY,GAAZ,EAAiB,GAAjB,CAAqB,MAArB,CADuB;AAAA;AAAA,QACtC,IADsC;AAAA,QAChC,KADgC;;AAG7C,QAAI,QAAQ,IAAR,KAAiB,CAArB,EAAwB;AACtB,eAAU,OAAO,CAAjB;AACD,KAFD,MAEO,IAAI,QAAQ,IAAR,KAAiB,EAArB,EAAyB;AAC9B,eAAU,OAAO,CAAjB;AACD,KAFM,MAEA;AACL,eAAU,IAAV,SAAkB,IAAI,QAAQ,IAAZ,CAAlB;AACD;AACF,CAVD","sourcesContent":["import pad from './pad'\n\n/**\n * @param {String} value YYYY-MM format\n * @param {Number} sign -1 or +1\n */\nexport default (value: string, sign: number) => {\n const [year, month] = value.split('-').map(Number)\n\n if (month + sign === 0) {\n return `${year - 1}-12`\n } else if (month + sign === 13) {\n return `${year + 1}-01`\n } else {\n return `${year}-${pad(month + sign)}`\n }\n}\n"],"sourceRoot":""}
+18
View File
@@ -0,0 +1,18 @@
var padStart = function padStart(string, targetLength, padString) {
targetLength = targetLength >> 0;
string = String(string);
padString = String(padString);
if (string.length > targetLength) {
return String(string);
}
targetLength = targetLength - string.length;
if (targetLength > padString.length) {
padString += padString.repeat(targetLength / padString.length);
}
return padString.slice(0, targetLength) + String(string);
};
export default (function (n) {
var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
return padStart(n, length, '0');
});
//# sourceMappingURL=pad.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../../../../src/components/VDatePicker/util/pad.ts"],"names":[],"mappings":"AAAA,IAAM,WAAW,SAAX,QAAW,CAAC,MAAD,EAA0B,YAA1B,EAAgD,SAAhD,EAAqE;AACpF,mBAAe,gBAAgB,CAA/B;AACA,aAAS,OAAO,MAAP,CAAT;AACA,gBAAY,OAAO,SAAP,CAAZ;AACA,QAAI,OAAO,MAAP,GAAgB,YAApB,EAAkC;AAChC,eAAO,OAAO,MAAP,CAAP;AACD;AAED,mBAAe,eAAe,OAAO,MAArC;AACA,QAAI,eAAe,UAAU,MAA7B,EAAqC;AACnC,qBAAa,UAAU,MAAV,CAAiB,eAAe,UAAU,MAA1C,CAAb;AACD;AACD,WAAO,UAAU,KAAV,CAAgB,CAAhB,EAAmB,YAAnB,IAAmC,OAAO,MAAP,CAA1C;AACD,CAbD;AAeA,gBAAe,UAAC,CAAD;AAAA,QAAqB,MAArB,uEAA8B,CAA9B;AAAA,WAAoC,SAAS,CAAT,EAAY,MAAZ,EAAoB,GAApB,CAApC;AAAA,CAAf","sourcesContent":["const padStart = (string: number | string, targetLength: number, padString: string) => {\n targetLength = targetLength >> 0\n string = String(string)\n padString = String(padString)\n if (string.length > targetLength) {\n return String(string)\n }\n\n targetLength = targetLength - string.length\n if (targetLength > padString.length) {\n padString += padString.repeat(targetLength / padString.length)\n }\n return padString.slice(0, targetLength) + String(string)\n}\n\nexport default (n: string | number, length = 2) => padStart(n, length, '0')\n"],"sourceRoot":""}