@opentinyvue/vue-date-range 2.21.0 → 3.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.js +1 -1
- package/lib/mobile-first.js +471 -411
- package/lib/pc.js +369 -362
- package/package.json +7 -7
- package/src/index.d.ts +73 -1
- package/src/mobile-first.vue.d.ts +49 -1
- package/src/pc.vue.d.ts +52 -1
package/lib/pc.js
CHANGED
|
@@ -6,38 +6,42 @@ import DateTable from '@opentinyvue/vue-date-table';
|
|
|
6
6
|
import Input from '@opentinyvue/vue-input';
|
|
7
7
|
import Button from '@opentinyvue/vue-button';
|
|
8
8
|
import { iconDoubleRight, iconDoubleLeft, iconChevronLeft, iconChevronRight } from '@opentinyvue/vue-icon';
|
|
9
|
+
import { resolveComponent, resolveDirective, openBlock, createBlock, Transition, withCtx, withDirectives, createElementVNode, normalizeClass, renderSlot, createElementBlock, Fragment, renderList, toDisplayString, createCommentVNode, createVNode, createTextVNode, vShow } from 'vue';
|
|
9
10
|
|
|
10
|
-
function
|
|
11
|
-
var
|
|
12
|
-
if (
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
11
|
+
function _createForOfIteratorHelperLoose(r, e) {
|
|
12
|
+
var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
|
|
13
|
+
if (t) return (t = t.call(r)).next.bind(t);
|
|
14
|
+
if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
|
|
15
|
+
t && (r = t);
|
|
16
|
+
var o = 0;
|
|
17
|
+
return function() {
|
|
18
|
+
return o >= r.length ? { done: true } : { done: false, value: r[o++] };
|
|
19
|
+
};
|
|
16
20
|
}
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
var originalRender = options.render;
|
|
25
|
-
options.render = function renderWithStyleInjection(h, context) {
|
|
26
|
-
hook.call(context);
|
|
27
|
-
return originalRender(h, context);
|
|
28
|
-
};
|
|
29
|
-
} else {
|
|
30
|
-
var existing = options.beforeCreate;
|
|
31
|
-
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
|
|
32
|
-
}
|
|
21
|
+
throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
22
|
+
}
|
|
23
|
+
function _unsupportedIterableToArray(r, a) {
|
|
24
|
+
if (r) {
|
|
25
|
+
if ("string" == typeof r) return _arrayLikeToArray(r, a);
|
|
26
|
+
var t = {}.toString.call(r).slice(8, -1);
|
|
27
|
+
return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
|
|
33
28
|
}
|
|
34
|
-
return {
|
|
35
|
-
exports: scriptExports,
|
|
36
|
-
options
|
|
37
|
-
};
|
|
38
29
|
}
|
|
30
|
+
function _arrayLikeToArray(r, a) {
|
|
31
|
+
(null == a || a > r.length) && (a = r.length);
|
|
32
|
+
for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
|
|
33
|
+
return n;
|
|
34
|
+
}
|
|
35
|
+
var _export_sfc = function _export_sfc2(sfc, props) {
|
|
36
|
+
var target = sfc.__vccOpts || sfc;
|
|
37
|
+
for (var _iterator = _createForOfIteratorHelperLoose(props), _step; !(_step = _iterator()).done; ) {
|
|
38
|
+
var _step$value = _step.value, key = _step$value[0], val = _step$value[1];
|
|
39
|
+
target[key] = val;
|
|
40
|
+
}
|
|
41
|
+
return target;
|
|
42
|
+
};
|
|
39
43
|
|
|
40
|
-
var
|
|
44
|
+
var _sfc_main = defineComponent({
|
|
41
45
|
directives: directive({
|
|
42
46
|
Clickoutside
|
|
43
47
|
}),
|
|
@@ -62,342 +66,345 @@ var __vue2_script = defineComponent({
|
|
|
62
66
|
});
|
|
63
67
|
}
|
|
64
68
|
});
|
|
65
|
-
var
|
|
66
|
-
|
|
67
|
-
var _h = _vm.$createElement;
|
|
68
|
-
var _c = _vm._self._c || _h;
|
|
69
|
-
return _c("transition", {
|
|
70
|
-
attrs: {
|
|
71
|
-
"name": "tiny-zoom-in-top"
|
|
72
|
-
},
|
|
73
|
-
on: {
|
|
74
|
-
"after-leave": function afterLeave($event) {
|
|
75
|
-
return _vm.$emit("dodestroy");
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
}, [_c("div", {
|
|
79
|
-
directives: [{
|
|
80
|
-
name: "show",
|
|
81
|
-
rawName: "v-show",
|
|
82
|
-
value: _vm.state.visible,
|
|
83
|
-
expression: "state.visible"
|
|
84
|
-
}],
|
|
85
|
-
ref: "refDateRange",
|
|
86
|
-
staticClass: "tiny-picker-panel tiny-date-range-picker tiny-popper",
|
|
87
|
-
class: [{
|
|
88
|
-
"has-sidebar": _vm.slots.sidebar || _vm.state.shortcuts,
|
|
89
|
-
"has-time": _vm.state.showTime
|
|
90
|
-
}, _vm.state.popperClass]
|
|
91
|
-
}, [_c("div", {
|
|
92
|
-
staticClass: "tiny-picker-panel__body-wrapper"
|
|
93
|
-
}, [_vm._t("sidebar"), _vm.state.shortcuts ? _c("div", {
|
|
94
|
-
ref: "shortcut",
|
|
95
|
-
staticClass: "tiny-picker-panel__sidebar"
|
|
96
|
-
}, _vm._l(_vm.state.shortcuts, function(shortcut, key) {
|
|
97
|
-
return _c("button", {
|
|
98
|
-
key,
|
|
99
|
-
staticClass: "tiny-picker-panel__shortcut",
|
|
100
|
-
class: {
|
|
101
|
-
"tiny-picker-panel__shortcut-selected": _vm.state.singleSelect && shortcut.type === _vm.state.shortcutType && shortcut.text === _vm.state.shortcutText
|
|
102
|
-
},
|
|
103
|
-
attrs: {
|
|
104
|
-
"type": "button",
|
|
105
|
-
"title": shortcut.text
|
|
106
|
-
},
|
|
107
|
-
on: {
|
|
108
|
-
"click": function click($event) {
|
|
109
|
-
return _vm.handleShortcutClick(shortcut);
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
}, [_vm._v(" " + _vm._s(shortcut.text) + " ")]);
|
|
113
|
-
}), 0) : _vm._e(), _c("div", {
|
|
114
|
-
staticClass: "tiny-picker-panel__body"
|
|
115
|
-
}, [_vm.state.showTime ? _c("div", {
|
|
116
|
-
staticClass: "tiny-date-range-picker__time-header"
|
|
117
|
-
}, [_c("span", {
|
|
118
|
-
staticClass: "tiny-date-range-picker__editors-wrap"
|
|
119
|
-
}, [_c("span", {
|
|
120
|
-
staticClass: "tiny-date-range-picker__time-picker-wrap"
|
|
121
|
-
}, [_c("tiny-input", {
|
|
122
|
-
ref: "minInput",
|
|
123
|
-
staticClass: "tiny-date-range-picker__editor",
|
|
124
|
-
attrs: {
|
|
125
|
-
"size": "small",
|
|
126
|
-
"disabled": _vm.state.rangeState.selecting,
|
|
127
|
-
"placeholder": _vm.t("ui.datepicker.startDate"),
|
|
128
|
-
"modelValue": _vm.state.minVisibleDate
|
|
129
|
-
},
|
|
130
|
-
on: {
|
|
131
|
-
"update:modelValue": function updateModelValue(val) {
|
|
132
|
-
return _vm.handleDateInput(val, "min");
|
|
133
|
-
},
|
|
134
|
-
"change": function change(val) {
|
|
135
|
-
return _vm.handleDateChange(val, "min");
|
|
136
|
-
}
|
|
137
|
-
}
|
|
138
|
-
})], 1), _c("span", {
|
|
139
|
-
directives: [{
|
|
140
|
-
name: "clickoutside",
|
|
141
|
-
rawName: "v-clickoutside",
|
|
142
|
-
value: _vm.handleMinTimeClose,
|
|
143
|
-
expression: "handleMinTimeClose"
|
|
144
|
-
}],
|
|
145
|
-
staticClass: "tiny-date-range-picker__time-picker-wrap"
|
|
146
|
-
}, [_c("tiny-input", {
|
|
147
|
-
staticClass: "tiny-date-range-picker__editor",
|
|
148
|
-
attrs: {
|
|
149
|
-
"size": "small",
|
|
150
|
-
"disabled": _vm.state.rangeState.selecting,
|
|
151
|
-
"placeholder": _vm.t("ui.datepicker.startTime"),
|
|
152
|
-
"modelValue": _vm.state.minVisibleTime,
|
|
153
|
-
"readonly": !_vm.timeEditable
|
|
154
|
-
},
|
|
155
|
-
on: {
|
|
156
|
-
"focus": function focus($event) {
|
|
157
|
-
_vm.state.minTimePickerVisible = true;
|
|
158
|
-
},
|
|
159
|
-
"update:modelValue": function updateModelValue(val) {
|
|
160
|
-
return _vm.handleTimeInput(val, "min");
|
|
161
|
-
},
|
|
162
|
-
"change": function change(val) {
|
|
163
|
-
return _vm.handleTimeChange(val, "min");
|
|
164
|
-
}
|
|
165
|
-
}
|
|
166
|
-
}), _c("time-picker", {
|
|
167
|
-
ref: "minTimePicker",
|
|
168
|
-
attrs: {
|
|
169
|
-
"step": _vm.step,
|
|
170
|
-
"time-arrow-control": _vm.state.arrowControl,
|
|
171
|
-
"show": _vm.state.minTimePickerVisible,
|
|
172
|
-
"value": _vm.state.minDate
|
|
173
|
-
},
|
|
174
|
-
on: {
|
|
175
|
-
"pick": _vm.handleMinTimePick
|
|
176
|
-
}
|
|
177
|
-
})], 1)]), _c("span", {
|
|
178
|
-
staticClass: "tiny-icon-arrow-right"
|
|
179
|
-
}), _c("span", {
|
|
180
|
-
staticClass: "tiny-date-range-picker__editors-wrap is-right"
|
|
181
|
-
}, [_c("span", {
|
|
182
|
-
staticClass: "tiny-date-range-picker__time-picker-wrap"
|
|
183
|
-
}, [_c("tiny-input", {
|
|
184
|
-
staticClass: "tiny-date-range-picker__editor",
|
|
185
|
-
attrs: {
|
|
186
|
-
"size": "small",
|
|
187
|
-
"disabled": _vm.state.rangeState.selecting,
|
|
188
|
-
"placeholder": _vm.t("ui.datepicker.endDate"),
|
|
189
|
-
"modelValue": _vm.state.maxVisibleDate,
|
|
190
|
-
"readonly": !_vm.state.minDate
|
|
191
|
-
},
|
|
192
|
-
on: {
|
|
193
|
-
"update:modelValue": function updateModelValue(val) {
|
|
194
|
-
return _vm.handleDateInput(val, "max");
|
|
195
|
-
},
|
|
196
|
-
"change": function change(val) {
|
|
197
|
-
return _vm.handleDateChange(val, "max");
|
|
198
|
-
}
|
|
199
|
-
}
|
|
200
|
-
})], 1), _c("span", {
|
|
201
|
-
directives: [{
|
|
202
|
-
name: "clickoutside",
|
|
203
|
-
rawName: "v-clickoutside",
|
|
204
|
-
value: _vm.handleMaxTimeClose,
|
|
205
|
-
expression: "handleMaxTimeClose"
|
|
206
|
-
}],
|
|
207
|
-
staticClass: "tiny-date-range-picker__time-picker-wrap"
|
|
208
|
-
}, [_c("tiny-input", {
|
|
209
|
-
staticClass: "tiny-date-range-picker__editor",
|
|
210
|
-
attrs: {
|
|
211
|
-
"size": "small",
|
|
212
|
-
"disabled": _vm.state.rangeState.selecting,
|
|
213
|
-
"placeholder": _vm.t("ui.datepicker.endTime"),
|
|
214
|
-
"modelValue": _vm.state.maxVisibleTime,
|
|
215
|
-
"readonly": !_vm.state.minDate || !_vm.timeEditable
|
|
216
|
-
},
|
|
217
|
-
on: {
|
|
218
|
-
"focus": function focus($event) {
|
|
219
|
-
_vm.state.minDate && (_vm.state.maxTimePickerVisible = true);
|
|
220
|
-
},
|
|
221
|
-
"update:modelValue": function updateModelValue(val) {
|
|
222
|
-
return _vm.handleTimeInput(val, "max");
|
|
223
|
-
},
|
|
224
|
-
"change": function change(val) {
|
|
225
|
-
return _vm.handleTimeChange(val, "max");
|
|
226
|
-
}
|
|
227
|
-
}
|
|
228
|
-
}), _c("time-picker", {
|
|
229
|
-
ref: "maxTimePicker",
|
|
230
|
-
attrs: {
|
|
231
|
-
"step": _vm.step,
|
|
232
|
-
"time-arrow-control": _vm.state.arrowControl,
|
|
233
|
-
"show": _vm.state.maxTimePickerVisible,
|
|
234
|
-
"value": _vm.state.maxDate
|
|
235
|
-
},
|
|
236
|
-
on: {
|
|
237
|
-
"pick": _vm.handleMaxTimePick
|
|
238
|
-
}
|
|
239
|
-
})], 1)])]) : _vm._e(), _c("div", {
|
|
240
|
-
staticClass: "tiny-picker-panel__content tiny-date-range-picker__content is-left"
|
|
241
|
-
}, [_c("div", {
|
|
242
|
-
staticClass: "tiny-date-range-picker__header"
|
|
243
|
-
}, [_c("button", {
|
|
244
|
-
staticClass: "tiny-picker-panel__icon-btn tiny-icon-d-arrow-left",
|
|
245
|
-
attrs: {
|
|
246
|
-
"type": "button"
|
|
247
|
-
},
|
|
248
|
-
on: {
|
|
249
|
-
"click": _vm.leftPrevYear
|
|
250
|
-
}
|
|
251
|
-
}, [_c("icon-double-left")], 1), _c("button", {
|
|
252
|
-
staticClass: "tiny-picker-panel__icon-btn tiny-icon-arrow-left",
|
|
253
|
-
attrs: {
|
|
254
|
-
"type": "button"
|
|
255
|
-
},
|
|
256
|
-
on: {
|
|
257
|
-
"click": _vm.leftPrevMonth
|
|
258
|
-
}
|
|
259
|
-
}, [_c("icon-chevron-left")], 1), _vm.state.unlinkPanels ? _c("button", {
|
|
260
|
-
staticClass: "tiny-picker-panel__icon-btn tiny-icon-d-arrow-right",
|
|
261
|
-
class: {
|
|
262
|
-
"is-disabled": !_vm.state.enableYearArrow
|
|
263
|
-
},
|
|
264
|
-
attrs: {
|
|
265
|
-
"type": "button",
|
|
266
|
-
"disabled": !_vm.state.enableYearArrow
|
|
267
|
-
},
|
|
268
|
-
on: {
|
|
269
|
-
"click": _vm.leftNextYear
|
|
270
|
-
}
|
|
271
|
-
}, [_c("icon-double-right")], 1) : _vm._e(), _vm.state.unlinkPanels ? _c("button", {
|
|
272
|
-
staticClass: "tiny-picker-panel__icon-btn tiny-icon-arrow-right",
|
|
273
|
-
class: {
|
|
274
|
-
"is-disabled": !_vm.state.enableMonthArrow
|
|
275
|
-
},
|
|
276
|
-
attrs: {
|
|
277
|
-
"type": "button",
|
|
278
|
-
"disabled": !_vm.state.enableMonthArrow
|
|
279
|
-
},
|
|
280
|
-
on: {
|
|
281
|
-
"click": _vm.leftNextMonth
|
|
282
|
-
}
|
|
283
|
-
}, [_c("icon-chevron-right")], 1) : _vm._e(), _c("div", [_vm._v(_vm._s(_vm.state.leftLabel))])]), _c("div", {
|
|
284
|
-
staticClass: "tiny-date-range-picker__table"
|
|
285
|
-
}, [_c("date-table", {
|
|
286
|
-
attrs: {
|
|
287
|
-
"selection-mode": "range",
|
|
288
|
-
"date": _vm.state.leftDate,
|
|
289
|
-
"default-value": _vm.state.defaultValue,
|
|
290
|
-
"min-date": _vm.state.minDate,
|
|
291
|
-
"max-date": _vm.state.maxDate,
|
|
292
|
-
"range-state": _vm.state.rangeState,
|
|
293
|
-
"disabled-date": _vm.state.disabledDate,
|
|
294
|
-
"cell-class-name": _vm.state.cellClassName,
|
|
295
|
-
"first-day-of-week": _vm.state.firstDayOfWeek,
|
|
296
|
-
"show-week-number": _vm.showWeekNumber,
|
|
297
|
-
"format-weeks": _vm.formatWeeks
|
|
298
|
-
},
|
|
299
|
-
on: {
|
|
300
|
-
"changerange": _vm.handleChangeRange,
|
|
301
|
-
"pick": _vm.handleRangePick
|
|
302
|
-
}
|
|
303
|
-
})], 1)]), _c("div", {
|
|
304
|
-
staticClass: "tiny-picker-panel__content tiny-date-range-picker__content is-right"
|
|
305
|
-
}, [_c("div", {
|
|
306
|
-
staticClass: "tiny-date-range-picker__header"
|
|
307
|
-
}, [_vm.state.unlinkPanels ? _c("button", {
|
|
308
|
-
staticClass: "tiny-picker-panel__icon-btn tiny-icon-d-arrow-left",
|
|
309
|
-
class: {
|
|
310
|
-
"is-disabled": !_vm.state.enableYearArrow
|
|
311
|
-
},
|
|
312
|
-
attrs: {
|
|
313
|
-
"type": "button",
|
|
314
|
-
"disabled": !_vm.state.enableYearArrow
|
|
315
|
-
},
|
|
316
|
-
on: {
|
|
317
|
-
"click": _vm.rightPrevYear
|
|
318
|
-
}
|
|
319
|
-
}, [_c("icon-double-left")], 1) : _vm._e(), _vm.state.unlinkPanels ? _c("button", {
|
|
320
|
-
staticClass: "tiny-picker-panel__icon-btn tiny-icon-arrow-left",
|
|
321
|
-
class: {
|
|
322
|
-
"is-disabled": !_vm.state.enableMonthArrow
|
|
323
|
-
},
|
|
324
|
-
attrs: {
|
|
325
|
-
"type": "button",
|
|
326
|
-
"disabled": !_vm.state.enableMonthArrow
|
|
327
|
-
},
|
|
328
|
-
on: {
|
|
329
|
-
"click": _vm.rightPrevMonth
|
|
330
|
-
}
|
|
331
|
-
}, [_c("icon-chevron-left")], 1) : _vm._e(), _c("button", {
|
|
332
|
-
staticClass: "tiny-picker-panel__icon-btn tiny-icon-d-arrow-right",
|
|
333
|
-
attrs: {
|
|
334
|
-
"type": "button"
|
|
335
|
-
},
|
|
336
|
-
on: {
|
|
337
|
-
"click": _vm.rightNextYear
|
|
338
|
-
}
|
|
339
|
-
}, [_c("icon-double-right")], 1), _c("button", {
|
|
340
|
-
staticClass: "tiny-picker-panel__icon-btn tiny-icon-arrow-right",
|
|
341
|
-
attrs: {
|
|
342
|
-
"type": "button"
|
|
343
|
-
},
|
|
344
|
-
on: {
|
|
345
|
-
"click": _vm.rightNextMonth
|
|
346
|
-
}
|
|
347
|
-
}, [_c("icon-chevron-right")], 1), _c("div", [_vm._v(_vm._s(_vm.state.rightLabel))])]), _c("div", {
|
|
348
|
-
staticClass: "tiny-date-range-picker__table"
|
|
349
|
-
}, [_c("date-table", {
|
|
350
|
-
attrs: {
|
|
351
|
-
"selection-mode": "range",
|
|
352
|
-
"date": _vm.state.rightDate,
|
|
353
|
-
"default-value": _vm.state.defaultValue,
|
|
354
|
-
"min-date": _vm.state.minDate,
|
|
355
|
-
"max-date": _vm.state.maxDate,
|
|
356
|
-
"range-state": _vm.state.rangeState,
|
|
357
|
-
"disabled-date": _vm.state.disabledDate,
|
|
358
|
-
"cell-class-name": _vm.state.cellClassName,
|
|
359
|
-
"first-day-of-week": _vm.state.firstDayOfWeek,
|
|
360
|
-
"show-week-number": _vm.showWeekNumber,
|
|
361
|
-
"format-weeks": _vm.formatWeeks
|
|
362
|
-
},
|
|
363
|
-
on: {
|
|
364
|
-
"changerange": _vm.handleChangeRange,
|
|
365
|
-
"pick": _vm.handleRangePick
|
|
366
|
-
}
|
|
367
|
-
})], 1)])])], 2), _vm.state.showTime ? _c("div", {
|
|
368
|
-
staticClass: "tiny-picker-panel__footer"
|
|
369
|
-
}, [_c("tiny-button", {
|
|
370
|
-
staticClass: "tiny-picker-panel__link-btn",
|
|
371
|
-
attrs: {
|
|
372
|
-
"type": "text"
|
|
373
|
-
},
|
|
374
|
-
on: {
|
|
375
|
-
"click": _vm.handleClear
|
|
376
|
-
}
|
|
377
|
-
}, [_vm._v(" " + _vm._s(_vm.t("ui.datepicker.clear")) + " ")]), _c("tiny-button", {
|
|
378
|
-
staticClass: "tiny-picker-panel__link-btn",
|
|
379
|
-
attrs: {
|
|
380
|
-
"plain": _vm.state.confirmButtonProps.plain,
|
|
381
|
-
"type": _vm.state.confirmButtonProps.type,
|
|
382
|
-
"disabled": _vm.state.btnDisabled
|
|
383
|
-
},
|
|
384
|
-
on: {
|
|
385
|
-
"click": function click($event) {
|
|
386
|
-
return _vm.handleConfirm(false);
|
|
387
|
-
}
|
|
388
|
-
}
|
|
389
|
-
}, [_vm._v(" " + _vm._s(_vm.t("ui.datepicker.confirm")) + " ")])], 1) : _vm._e()])]);
|
|
69
|
+
var _hoisted_1 = {
|
|
70
|
+
class: "tiny-picker-panel__body-wrapper"
|
|
390
71
|
};
|
|
391
|
-
var
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
72
|
+
var _hoisted_2 = {
|
|
73
|
+
key: 0,
|
|
74
|
+
ref: "shortcut",
|
|
75
|
+
class: "tiny-picker-panel__sidebar"
|
|
76
|
+
};
|
|
77
|
+
var _hoisted_3 = ["onClick", "title"];
|
|
78
|
+
var _hoisted_4 = {
|
|
79
|
+
class: "tiny-picker-panel__body"
|
|
80
|
+
};
|
|
81
|
+
var _hoisted_5 = {
|
|
82
|
+
key: 0,
|
|
83
|
+
class: "tiny-date-range-picker__time-header"
|
|
84
|
+
};
|
|
85
|
+
var _hoisted_6 = {
|
|
86
|
+
class: "tiny-date-range-picker__editors-wrap"
|
|
87
|
+
};
|
|
88
|
+
var _hoisted_7 = {
|
|
89
|
+
class: "tiny-date-range-picker__time-picker-wrap"
|
|
90
|
+
};
|
|
91
|
+
var _hoisted_8 = {
|
|
92
|
+
class: "tiny-date-range-picker__time-picker-wrap"
|
|
93
|
+
};
|
|
94
|
+
var _hoisted_9 = /* @__PURE__ */ createElementVNode(
|
|
95
|
+
"span",
|
|
96
|
+
{
|
|
97
|
+
class: "tiny-icon-arrow-right"
|
|
98
|
+
},
|
|
99
|
+
null,
|
|
100
|
+
-1
|
|
101
|
+
/* HOISTED */
|
|
102
|
+
);
|
|
103
|
+
var _hoisted_10 = {
|
|
104
|
+
class: "tiny-date-range-picker__editors-wrap is-right"
|
|
105
|
+
};
|
|
106
|
+
var _hoisted_11 = {
|
|
107
|
+
class: "tiny-date-range-picker__time-picker-wrap"
|
|
108
|
+
};
|
|
109
|
+
var _hoisted_12 = {
|
|
110
|
+
class: "tiny-date-range-picker__time-picker-wrap"
|
|
111
|
+
};
|
|
112
|
+
var _hoisted_13 = {
|
|
113
|
+
class: "tiny-picker-panel__content tiny-date-range-picker__content is-left"
|
|
114
|
+
};
|
|
115
|
+
var _hoisted_14 = {
|
|
116
|
+
class: "tiny-date-range-picker__header"
|
|
117
|
+
};
|
|
118
|
+
var _hoisted_15 = ["disabled"];
|
|
119
|
+
var _hoisted_16 = ["disabled"];
|
|
120
|
+
var _hoisted_17 = {
|
|
121
|
+
class: "tiny-date-range-picker__table"
|
|
122
|
+
};
|
|
123
|
+
var _hoisted_18 = {
|
|
124
|
+
class: "tiny-picker-panel__content tiny-date-range-picker__content is-right"
|
|
125
|
+
};
|
|
126
|
+
var _hoisted_19 = {
|
|
127
|
+
class: "tiny-date-range-picker__header"
|
|
128
|
+
};
|
|
129
|
+
var _hoisted_20 = ["disabled"];
|
|
130
|
+
var _hoisted_21 = ["disabled"];
|
|
131
|
+
var _hoisted_22 = {
|
|
132
|
+
class: "tiny-date-range-picker__table"
|
|
133
|
+
};
|
|
134
|
+
var _hoisted_23 = {
|
|
135
|
+
key: 0,
|
|
136
|
+
class: "tiny-picker-panel__footer"
|
|
137
|
+
};
|
|
138
|
+
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
139
|
+
var _component_tiny_input = resolveComponent("tiny-input");
|
|
140
|
+
var _component_time_picker = resolveComponent("time-picker");
|
|
141
|
+
var _component_icon_double_left = resolveComponent("icon-double-left");
|
|
142
|
+
var _component_icon_chevron_left = resolveComponent("icon-chevron-left");
|
|
143
|
+
var _component_icon_double_right = resolveComponent("icon-double-right");
|
|
144
|
+
var _component_icon_chevron_right = resolveComponent("icon-chevron-right");
|
|
145
|
+
var _component_date_table = resolveComponent("date-table");
|
|
146
|
+
var _component_tiny_button = resolveComponent("tiny-button");
|
|
147
|
+
var _directive_clickoutside = resolveDirective("clickoutside");
|
|
148
|
+
return openBlock(), createBlock(Transition, {
|
|
149
|
+
name: "tiny-zoom-in-top",
|
|
150
|
+
onAfterLeave: _cache[19] || (_cache[19] = function($event) {
|
|
151
|
+
return _ctx.$emit("dodestroy");
|
|
152
|
+
}),
|
|
153
|
+
persisted: ""
|
|
154
|
+
}, {
|
|
155
|
+
default: withCtx(function() {
|
|
156
|
+
return [withDirectives(createElementVNode(
|
|
157
|
+
"div",
|
|
158
|
+
{
|
|
159
|
+
class: normalizeClass(["tiny-picker-panel tiny-date-range-picker tiny-popper", [{
|
|
160
|
+
"has-sidebar": _ctx.slots.sidebar || _ctx.state.shortcuts,
|
|
161
|
+
"has-time": _ctx.state.showTime
|
|
162
|
+
}, _ctx.state.popperClass]]),
|
|
163
|
+
ref: "refDateRange"
|
|
164
|
+
},
|
|
165
|
+
[createElementVNode("div", _hoisted_1, [renderSlot(_ctx.$slots, "sidebar", {
|
|
166
|
+
class: "tiny-picker-panel__sidebar"
|
|
167
|
+
}), _ctx.state.shortcuts ? (openBlock(), createElementBlock(
|
|
168
|
+
"div",
|
|
169
|
+
_hoisted_2,
|
|
170
|
+
[(openBlock(true), createElementBlock(
|
|
171
|
+
Fragment,
|
|
172
|
+
null,
|
|
173
|
+
renderList(_ctx.state.shortcuts, function(shortcut, key) {
|
|
174
|
+
return openBlock(), createElementBlock("button", {
|
|
175
|
+
type: "button",
|
|
176
|
+
class: normalizeClass(["tiny-picker-panel__shortcut", {
|
|
177
|
+
"tiny-picker-panel__shortcut-selected": _ctx.state.singleSelect && shortcut.type === _ctx.state.shortcutType && shortcut.text === _ctx.state.shortcutText
|
|
178
|
+
}]),
|
|
179
|
+
key,
|
|
180
|
+
onClick: function onClick($event) {
|
|
181
|
+
return _ctx.handleShortcutClick(shortcut);
|
|
182
|
+
},
|
|
183
|
+
title: shortcut.text
|
|
184
|
+
}, toDisplayString(shortcut.text), 11, _hoisted_3);
|
|
185
|
+
}),
|
|
186
|
+
128
|
|
187
|
+
/* KEYED_FRAGMENT */
|
|
188
|
+
))],
|
|
189
|
+
512
|
|
190
|
+
/* NEED_PATCH */
|
|
191
|
+
)) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_4, [_ctx.state.showTime ? (openBlock(), createElementBlock("div", _hoisted_5, [createElementVNode("span", _hoisted_6, [createElementVNode("span", _hoisted_7, [createVNode(_component_tiny_input, {
|
|
192
|
+
size: "small",
|
|
193
|
+
disabled: _ctx.state.rangeState.selecting,
|
|
194
|
+
ref: "minInput",
|
|
195
|
+
placeholder: _ctx.t("ui.datepicker.startDate"),
|
|
196
|
+
class: "tiny-date-range-picker__editor",
|
|
197
|
+
modelValue: _ctx.state.minVisibleDate,
|
|
198
|
+
"onUpdate:modelValue": _cache[0] || (_cache[0] = function(val) {
|
|
199
|
+
return _ctx.handleDateInput(val, "min");
|
|
200
|
+
}),
|
|
201
|
+
onChange: _cache[1] || (_cache[1] = function(val) {
|
|
202
|
+
return _ctx.handleDateChange(val, "min");
|
|
203
|
+
})
|
|
204
|
+
}, null, 8, ["disabled", "placeholder", "modelValue"])]), withDirectives((openBlock(), createElementBlock("span", _hoisted_8, [createVNode(_component_tiny_input, {
|
|
205
|
+
size: "small",
|
|
206
|
+
class: "tiny-date-range-picker__editor",
|
|
207
|
+
disabled: _ctx.state.rangeState.selecting,
|
|
208
|
+
placeholder: _ctx.t("ui.datepicker.startTime"),
|
|
209
|
+
modelValue: _ctx.state.minVisibleTime,
|
|
210
|
+
onFocus: _cache[2] || (_cache[2] = function($event) {
|
|
211
|
+
return _ctx.state.minTimePickerVisible = true;
|
|
212
|
+
}),
|
|
213
|
+
"onUpdate:modelValue": _cache[3] || (_cache[3] = function(val) {
|
|
214
|
+
return _ctx.handleTimeInput(val, "min");
|
|
215
|
+
}),
|
|
216
|
+
onChange: _cache[4] || (_cache[4] = function(val) {
|
|
217
|
+
return _ctx.handleTimeChange(val, "min");
|
|
218
|
+
}),
|
|
219
|
+
readonly: !_ctx.timeEditable
|
|
220
|
+
}, null, 8, ["disabled", "placeholder", "modelValue", "readonly"]), createVNode(_component_time_picker, {
|
|
221
|
+
ref: "minTimePicker",
|
|
222
|
+
step: _ctx.step,
|
|
223
|
+
"time-arrow-control": _ctx.state.arrowControl,
|
|
224
|
+
show: _ctx.state.minTimePickerVisible,
|
|
225
|
+
value: _ctx.state.minDate,
|
|
226
|
+
onPick: _ctx.handleMinTimePick
|
|
227
|
+
}, null, 8, ["step", "time-arrow-control", "show", "value", "onPick"])])), [[_directive_clickoutside, _ctx.handleMinTimeClose]])]), _hoisted_9, createElementVNode("span", _hoisted_10, [createElementVNode("span", _hoisted_11, [createVNode(_component_tiny_input, {
|
|
228
|
+
size: "small",
|
|
229
|
+
class: "tiny-date-range-picker__editor",
|
|
230
|
+
disabled: _ctx.state.rangeState.selecting,
|
|
231
|
+
placeholder: _ctx.t("ui.datepicker.endDate"),
|
|
232
|
+
modelValue: _ctx.state.maxVisibleDate,
|
|
233
|
+
readonly: !_ctx.state.minDate,
|
|
234
|
+
"onUpdate:modelValue": _cache[5] || (_cache[5] = function(val) {
|
|
235
|
+
return _ctx.handleDateInput(val, "max");
|
|
236
|
+
}),
|
|
237
|
+
onChange: _cache[6] || (_cache[6] = function(val) {
|
|
238
|
+
return _ctx.handleDateChange(val, "max");
|
|
239
|
+
})
|
|
240
|
+
}, null, 8, ["disabled", "placeholder", "modelValue", "readonly"])]), withDirectives((openBlock(), createElementBlock("span", _hoisted_12, [createVNode(_component_tiny_input, {
|
|
241
|
+
size: "small",
|
|
242
|
+
class: "tiny-date-range-picker__editor",
|
|
243
|
+
disabled: _ctx.state.rangeState.selecting,
|
|
244
|
+
placeholder: _ctx.t("ui.datepicker.endTime"),
|
|
245
|
+
modelValue: _ctx.state.maxVisibleTime,
|
|
246
|
+
readonly: !_ctx.state.minDate || !_ctx.timeEditable,
|
|
247
|
+
onFocus: _cache[7] || (_cache[7] = function($event) {
|
|
248
|
+
return _ctx.state.minDate && (_ctx.state.maxTimePickerVisible = true);
|
|
249
|
+
}),
|
|
250
|
+
"onUpdate:modelValue": _cache[8] || (_cache[8] = function(val) {
|
|
251
|
+
return _ctx.handleTimeInput(val, "max");
|
|
252
|
+
}),
|
|
253
|
+
onChange: _cache[9] || (_cache[9] = function(val) {
|
|
254
|
+
return _ctx.handleTimeChange(val, "max");
|
|
255
|
+
})
|
|
256
|
+
}, null, 8, ["disabled", "placeholder", "modelValue", "readonly"]), createVNode(_component_time_picker, {
|
|
257
|
+
ref: "maxTimePicker",
|
|
258
|
+
step: _ctx.step,
|
|
259
|
+
"time-arrow-control": _ctx.state.arrowControl,
|
|
260
|
+
show: _ctx.state.maxTimePickerVisible,
|
|
261
|
+
value: _ctx.state.maxDate,
|
|
262
|
+
onPick: _ctx.handleMaxTimePick
|
|
263
|
+
}, null, 8, ["step", "time-arrow-control", "show", "value", "onPick"])])), [[_directive_clickoutside, _ctx.handleMaxTimeClose]])])])) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_13, [createElementVNode("div", _hoisted_14, [createElementVNode("button", {
|
|
264
|
+
type: "button",
|
|
265
|
+
onClick: _cache[10] || (_cache[10] = function() {
|
|
266
|
+
return _ctx.leftPrevYear && _ctx.leftPrevYear.apply(_ctx, arguments);
|
|
267
|
+
}),
|
|
268
|
+
class: "tiny-picker-panel__icon-btn tiny-icon-d-arrow-left"
|
|
269
|
+
}, [createVNode(_component_icon_double_left)]), createElementVNode("button", {
|
|
270
|
+
type: "button",
|
|
271
|
+
onClick: _cache[11] || (_cache[11] = function() {
|
|
272
|
+
return _ctx.leftPrevMonth && _ctx.leftPrevMonth.apply(_ctx, arguments);
|
|
273
|
+
}),
|
|
274
|
+
class: "tiny-picker-panel__icon-btn tiny-icon-arrow-left"
|
|
275
|
+
}, [createVNode(_component_icon_chevron_left)]), _ctx.state.unlinkPanels ? (openBlock(), createElementBlock("button", {
|
|
276
|
+
key: 0,
|
|
277
|
+
type: "button",
|
|
278
|
+
onClick: _cache[12] || (_cache[12] = function() {
|
|
279
|
+
return _ctx.leftNextYear && _ctx.leftNextYear.apply(_ctx, arguments);
|
|
280
|
+
}),
|
|
281
|
+
disabled: !_ctx.state.enableYearArrow,
|
|
282
|
+
class: normalizeClass([{
|
|
283
|
+
"is-disabled": !_ctx.state.enableYearArrow
|
|
284
|
+
}, "tiny-picker-panel__icon-btn tiny-icon-d-arrow-right"])
|
|
285
|
+
}, [createVNode(_component_icon_double_right)], 10, _hoisted_15)) : createCommentVNode("v-if", true), _ctx.state.unlinkPanels ? (openBlock(), createElementBlock("button", {
|
|
286
|
+
key: 1,
|
|
287
|
+
type: "button",
|
|
288
|
+
onClick: _cache[13] || (_cache[13] = function() {
|
|
289
|
+
return _ctx.leftNextMonth && _ctx.leftNextMonth.apply(_ctx, arguments);
|
|
290
|
+
}),
|
|
291
|
+
disabled: !_ctx.state.enableMonthArrow,
|
|
292
|
+
class: normalizeClass([{
|
|
293
|
+
"is-disabled": !_ctx.state.enableMonthArrow
|
|
294
|
+
}, "tiny-picker-panel__icon-btn tiny-icon-arrow-right"])
|
|
295
|
+
}, [createVNode(_component_icon_chevron_right)], 10, _hoisted_16)) : createCommentVNode("v-if", true), createElementVNode(
|
|
296
|
+
"div",
|
|
297
|
+
null,
|
|
298
|
+
toDisplayString(_ctx.state.leftLabel),
|
|
299
|
+
1
|
|
300
|
+
/* TEXT */
|
|
301
|
+
)]), createElementVNode("div", _hoisted_17, [createVNode(_component_date_table, {
|
|
302
|
+
"selection-mode": "range",
|
|
303
|
+
date: _ctx.state.leftDate,
|
|
304
|
+
"default-value": _ctx.state.defaultValue,
|
|
305
|
+
"min-date": _ctx.state.minDate,
|
|
306
|
+
"max-date": _ctx.state.maxDate,
|
|
307
|
+
"range-state": _ctx.state.rangeState,
|
|
308
|
+
"disabled-date": _ctx.state.disabledDate,
|
|
309
|
+
"cell-class-name": _ctx.state.cellClassName,
|
|
310
|
+
onChangerange: _ctx.handleChangeRange,
|
|
311
|
+
"first-day-of-week": _ctx.state.firstDayOfWeek,
|
|
312
|
+
"show-week-number": _ctx.showWeekNumber,
|
|
313
|
+
"format-weeks": _ctx.formatWeeks,
|
|
314
|
+
onPick: _ctx.handleRangePick
|
|
315
|
+
}, null, 8, ["date", "default-value", "min-date", "max-date", "range-state", "disabled-date", "cell-class-name", "onChangerange", "first-day-of-week", "show-week-number", "format-weeks", "onPick"])])]), createElementVNode("div", _hoisted_18, [createElementVNode("div", _hoisted_19, [_ctx.state.unlinkPanels ? (openBlock(), createElementBlock("button", {
|
|
316
|
+
key: 0,
|
|
317
|
+
type: "button",
|
|
318
|
+
onClick: _cache[14] || (_cache[14] = function() {
|
|
319
|
+
return _ctx.rightPrevYear && _ctx.rightPrevYear.apply(_ctx, arguments);
|
|
320
|
+
}),
|
|
321
|
+
disabled: !_ctx.state.enableYearArrow,
|
|
322
|
+
class: normalizeClass([{
|
|
323
|
+
"is-disabled": !_ctx.state.enableYearArrow
|
|
324
|
+
}, "tiny-picker-panel__icon-btn tiny-icon-d-arrow-left"])
|
|
325
|
+
}, [createVNode(_component_icon_double_left)], 10, _hoisted_20)) : createCommentVNode("v-if", true), _ctx.state.unlinkPanels ? (openBlock(), createElementBlock("button", {
|
|
326
|
+
key: 1,
|
|
327
|
+
type: "button",
|
|
328
|
+
onClick: _cache[15] || (_cache[15] = function() {
|
|
329
|
+
return _ctx.rightPrevMonth && _ctx.rightPrevMonth.apply(_ctx, arguments);
|
|
330
|
+
}),
|
|
331
|
+
disabled: !_ctx.state.enableMonthArrow,
|
|
332
|
+
class: normalizeClass([{
|
|
333
|
+
"is-disabled": !_ctx.state.enableMonthArrow
|
|
334
|
+
}, "tiny-picker-panel__icon-btn tiny-icon-arrow-left"])
|
|
335
|
+
}, [createVNode(_component_icon_chevron_left)], 10, _hoisted_21)) : createCommentVNode("v-if", true), createElementVNode("button", {
|
|
336
|
+
type: "button",
|
|
337
|
+
onClick: _cache[16] || (_cache[16] = function() {
|
|
338
|
+
return _ctx.rightNextYear && _ctx.rightNextYear.apply(_ctx, arguments);
|
|
339
|
+
}),
|
|
340
|
+
class: "tiny-picker-panel__icon-btn tiny-icon-d-arrow-right"
|
|
341
|
+
}, [createVNode(_component_icon_double_right)]), createElementVNode("button", {
|
|
342
|
+
type: "button",
|
|
343
|
+
onClick: _cache[17] || (_cache[17] = function() {
|
|
344
|
+
return _ctx.rightNextMonth && _ctx.rightNextMonth.apply(_ctx, arguments);
|
|
345
|
+
}),
|
|
346
|
+
class: "tiny-picker-panel__icon-btn tiny-icon-arrow-right"
|
|
347
|
+
}, [createVNode(_component_icon_chevron_right)]), createElementVNode(
|
|
348
|
+
"div",
|
|
349
|
+
null,
|
|
350
|
+
toDisplayString(_ctx.state.rightLabel),
|
|
351
|
+
1
|
|
352
|
+
/* TEXT */
|
|
353
|
+
)]), createElementVNode("div", _hoisted_22, [createVNode(_component_date_table, {
|
|
354
|
+
"selection-mode": "range",
|
|
355
|
+
date: _ctx.state.rightDate,
|
|
356
|
+
"default-value": _ctx.state.defaultValue,
|
|
357
|
+
"min-date": _ctx.state.minDate,
|
|
358
|
+
"max-date": _ctx.state.maxDate,
|
|
359
|
+
"range-state": _ctx.state.rangeState,
|
|
360
|
+
"disabled-date": _ctx.state.disabledDate,
|
|
361
|
+
"cell-class-name": _ctx.state.cellClassName,
|
|
362
|
+
onChangerange: _ctx.handleChangeRange,
|
|
363
|
+
"first-day-of-week": _ctx.state.firstDayOfWeek,
|
|
364
|
+
"show-week-number": _ctx.showWeekNumber,
|
|
365
|
+
"format-weeks": _ctx.formatWeeks,
|
|
366
|
+
onPick: _ctx.handleRangePick
|
|
367
|
+
}, null, 8, ["date", "default-value", "min-date", "max-date", "range-state", "disabled-date", "cell-class-name", "onChangerange", "first-day-of-week", "show-week-number", "format-weeks", "onPick"])])])])]), _ctx.state.showTime ? (openBlock(), createElementBlock("div", _hoisted_23, [createVNode(_component_tiny_button, {
|
|
368
|
+
type: "text",
|
|
369
|
+
class: "tiny-picker-panel__link-btn",
|
|
370
|
+
onClick: _ctx.handleClear
|
|
371
|
+
}, {
|
|
372
|
+
default: withCtx(function() {
|
|
373
|
+
return [createTextVNode(
|
|
374
|
+
toDisplayString(_ctx.t("ui.datepicker.clear")),
|
|
375
|
+
1
|
|
376
|
+
/* TEXT */
|
|
377
|
+
)];
|
|
378
|
+
}),
|
|
379
|
+
_: 1
|
|
380
|
+
/* STABLE */
|
|
381
|
+
}, 8, ["onClick"]), createVNode(_component_tiny_button, {
|
|
382
|
+
plain: _ctx.state.confirmButtonProps.plain,
|
|
383
|
+
type: _ctx.state.confirmButtonProps.type,
|
|
384
|
+
class: "tiny-picker-panel__link-btn",
|
|
385
|
+
disabled: _ctx.state.btnDisabled,
|
|
386
|
+
onClick: _cache[18] || (_cache[18] = function($event) {
|
|
387
|
+
return _ctx.handleConfirm(false);
|
|
388
|
+
})
|
|
389
|
+
}, {
|
|
390
|
+
default: withCtx(function() {
|
|
391
|
+
return [createTextVNode(
|
|
392
|
+
toDisplayString(_ctx.t("ui.datepicker.confirm")),
|
|
393
|
+
1
|
|
394
|
+
/* TEXT */
|
|
395
|
+
)];
|
|
396
|
+
}),
|
|
397
|
+
_: 1
|
|
398
|
+
/* STABLE */
|
|
399
|
+
}, 8, ["plain", "type", "disabled"])])) : createCommentVNode("v-if", true)],
|
|
400
|
+
2
|
|
401
|
+
/* CLASS */
|
|
402
|
+
), [[vShow, _ctx.state.visible]])];
|
|
403
|
+
}),
|
|
404
|
+
_: 3
|
|
405
|
+
/* FORWARDED */
|
|
406
|
+
});
|
|
398
407
|
}
|
|
399
|
-
var pc = /* @__PURE__ */
|
|
400
|
-
return __component__.exports;
|
|
401
|
-
}();
|
|
408
|
+
var pc = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
|
|
402
409
|
|
|
403
410
|
export { pc as default };
|