@zeedhi/zd-calendar-vue 1.7.4 → 1.9.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/dist/calendar-vue.esm.js +1153 -320
- package/dist/calendar-vue.umd.js +1158 -322
- package/package.json +2 -2
- package/types/Calendar.d.ts +11 -3
- package/types/CalendarDayInfo.d.ts +30 -0
- package/types/CalendarEventInfo.d.ts +25 -0
- package/types/CalendarYear.d.ts +43 -0
package/dist/calendar-vue.esm.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { I18n, VersionService } from '@zeedhi/core';
|
|
2
|
-
import { Prop, Component } from 'vue-property-decorator';
|
|
1
|
+
import { dayjs, I18n, VersionService } from '@zeedhi/core';
|
|
2
|
+
import { Prop, Component, Watch } from 'vue-property-decorator';
|
|
3
3
|
import { PropWatch, FillHeightMixin, ZdComponentRender } from '@zeedhi/vuetify';
|
|
4
4
|
import { Calendar } from '@zeedhi/zd-calendar-common';
|
|
5
|
+
import Vue from 'vue';
|
|
5
6
|
|
|
6
7
|
/*! *****************************************************************************
|
|
7
8
|
Copyright (c) Microsoft Corporation.
|
|
@@ -29,6 +30,1073 @@ function __metadata(metadataKey, metadataValue) {
|
|
|
29
30
|
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
|
|
30
31
|
}
|
|
31
32
|
|
|
33
|
+
let CalendarDayInfo = class CalendarDayInfo extends Vue {
|
|
34
|
+
constructor() {
|
|
35
|
+
super(...arguments);
|
|
36
|
+
this.dateFormat = 'YYYY-MM-DD';
|
|
37
|
+
this.dateTimeFormat = 'YYYY-MM-DD HH:mm';
|
|
38
|
+
}
|
|
39
|
+
get showMenu() {
|
|
40
|
+
return this.value;
|
|
41
|
+
}
|
|
42
|
+
set showMenu(val) {
|
|
43
|
+
this.$emit('input', val);
|
|
44
|
+
}
|
|
45
|
+
get dayjsSelectedDate() {
|
|
46
|
+
return this.selectedDate ? dayjs(this.selectedDate, this.dateFormat) : null;
|
|
47
|
+
}
|
|
48
|
+
get shortDayName() {
|
|
49
|
+
var _a;
|
|
50
|
+
return (_a = this.dayjsSelectedDate) === null || _a === void 0 ? void 0 : _a.format('ddd').toUpperCase();
|
|
51
|
+
}
|
|
52
|
+
get dayNumber() {
|
|
53
|
+
var _a;
|
|
54
|
+
return (_a = this.dayjsSelectedDate) === null || _a === void 0 ? void 0 : _a.format('D');
|
|
55
|
+
}
|
|
56
|
+
startsInDay({ start }) {
|
|
57
|
+
const day = this.convertToDayjs(start, this.dateFormat);
|
|
58
|
+
return day.isSame(this.dayjsSelectedDate);
|
|
59
|
+
}
|
|
60
|
+
endsInDay({ end }) {
|
|
61
|
+
const day = this.convertToDayjs(end, this.dateFormat);
|
|
62
|
+
return day.isSame(this.dayjsSelectedDate);
|
|
63
|
+
}
|
|
64
|
+
getStartHour({ start }) {
|
|
65
|
+
const day = this.convertToDayjs(start, this.dateTimeFormat);
|
|
66
|
+
// Convert Dayjs object to a native JavaScript Date
|
|
67
|
+
const date = day.toDate();
|
|
68
|
+
return new Intl.DateTimeFormat(I18n.instance.language, {
|
|
69
|
+
hour: 'numeric',
|
|
70
|
+
minute: '2-digit',
|
|
71
|
+
}).format(date);
|
|
72
|
+
}
|
|
73
|
+
getEventClasses(event) {
|
|
74
|
+
const isStart = this.startsInDay(event);
|
|
75
|
+
const isEnd = this.endsInDay(event);
|
|
76
|
+
return {
|
|
77
|
+
'is-start': isStart,
|
|
78
|
+
'is-continued-from-prev': !isStart,
|
|
79
|
+
'is-end': isEnd,
|
|
80
|
+
'is-continued-to-next': !isEnd,
|
|
81
|
+
};
|
|
82
|
+
}
|
|
83
|
+
convertToDayjs(date, format) {
|
|
84
|
+
if (date instanceof Date) {
|
|
85
|
+
return dayjs(date);
|
|
86
|
+
}
|
|
87
|
+
if (date.length < format.length) {
|
|
88
|
+
throw new Error(`Cannot convert invalid date: ${date}`);
|
|
89
|
+
}
|
|
90
|
+
return dayjs(date.slice(0, format.length), format);
|
|
91
|
+
}
|
|
92
|
+
clickEvent(event, selectedEvent) {
|
|
93
|
+
this.$emit('click:event', { event, selectedEvent });
|
|
94
|
+
}
|
|
95
|
+
emitDayClick(event) {
|
|
96
|
+
this.$emit('click:day', { event, date: this.selectedDate });
|
|
97
|
+
}
|
|
98
|
+
};
|
|
99
|
+
__decorate([
|
|
100
|
+
Prop({ type: Boolean, required: true }),
|
|
101
|
+
__metadata("design:type", Boolean)
|
|
102
|
+
], CalendarDayInfo.prototype, "value", void 0);
|
|
103
|
+
__decorate([
|
|
104
|
+
Prop({ type: Number, required: true }),
|
|
105
|
+
__metadata("design:type", Number)
|
|
106
|
+
], CalendarDayInfo.prototype, "menuX", void 0);
|
|
107
|
+
__decorate([
|
|
108
|
+
Prop({ type: Number, required: true }),
|
|
109
|
+
__metadata("design:type", Number)
|
|
110
|
+
], CalendarDayInfo.prototype, "menuY", void 0);
|
|
111
|
+
__decorate([
|
|
112
|
+
Prop({ type: Number, default: 224 }),
|
|
113
|
+
__metadata("design:type", Number)
|
|
114
|
+
], CalendarDayInfo.prototype, "menuWidth", void 0);
|
|
115
|
+
__decorate([
|
|
116
|
+
Prop({ type: String, default: null }),
|
|
117
|
+
__metadata("design:type", Object)
|
|
118
|
+
], CalendarDayInfo.prototype, "selectedDate", void 0);
|
|
119
|
+
__decorate([
|
|
120
|
+
Prop({ type: Array, default: () => [] }),
|
|
121
|
+
__metadata("design:type", Array)
|
|
122
|
+
], CalendarDayInfo.prototype, "events", void 0);
|
|
123
|
+
CalendarDayInfo = __decorate([
|
|
124
|
+
Component
|
|
125
|
+
], CalendarDayInfo);
|
|
126
|
+
var script$3 = CalendarDayInfo;
|
|
127
|
+
|
|
128
|
+
function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
|
|
129
|
+
if (typeof shadowMode !== 'boolean') {
|
|
130
|
+
createInjectorSSR = createInjector;
|
|
131
|
+
createInjector = shadowMode;
|
|
132
|
+
shadowMode = false;
|
|
133
|
+
}
|
|
134
|
+
// Vue.extend constructor export interop.
|
|
135
|
+
const options = typeof script === 'function' ? script.options : script;
|
|
136
|
+
// render functions
|
|
137
|
+
if (template && template.render) {
|
|
138
|
+
options.render = template.render;
|
|
139
|
+
options.staticRenderFns = template.staticRenderFns;
|
|
140
|
+
options._compiled = true;
|
|
141
|
+
// functional template
|
|
142
|
+
if (isFunctionalTemplate) {
|
|
143
|
+
options.functional = true;
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
|
+
// scopedId
|
|
147
|
+
if (scopeId) {
|
|
148
|
+
options._scopeId = scopeId;
|
|
149
|
+
}
|
|
150
|
+
let hook;
|
|
151
|
+
if (moduleIdentifier) {
|
|
152
|
+
// server build
|
|
153
|
+
hook = function (context) {
|
|
154
|
+
// 2.3 injection
|
|
155
|
+
context =
|
|
156
|
+
context || // cached call
|
|
157
|
+
(this.$vnode && this.$vnode.ssrContext) || // stateful
|
|
158
|
+
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional
|
|
159
|
+
// 2.2 with runInNewContext: true
|
|
160
|
+
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
|
|
161
|
+
context = __VUE_SSR_CONTEXT__;
|
|
162
|
+
}
|
|
163
|
+
// inject component styles
|
|
164
|
+
if (style) {
|
|
165
|
+
style.call(this, createInjectorSSR(context));
|
|
166
|
+
}
|
|
167
|
+
// register component module identifier for async chunk inference
|
|
168
|
+
if (context && context._registeredComponents) {
|
|
169
|
+
context._registeredComponents.add(moduleIdentifier);
|
|
170
|
+
}
|
|
171
|
+
};
|
|
172
|
+
// used by ssr in case component is cached and beforeCreate
|
|
173
|
+
// never gets called
|
|
174
|
+
options._ssrRegister = hook;
|
|
175
|
+
}
|
|
176
|
+
else if (style) {
|
|
177
|
+
hook = shadowMode
|
|
178
|
+
? function (context) {
|
|
179
|
+
style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
|
|
180
|
+
}
|
|
181
|
+
: function (context) {
|
|
182
|
+
style.call(this, createInjector(context));
|
|
183
|
+
};
|
|
184
|
+
}
|
|
185
|
+
if (hook) {
|
|
186
|
+
if (options.functional) {
|
|
187
|
+
// register for functional component in vue file
|
|
188
|
+
const originalRender = options.render;
|
|
189
|
+
options.render = function renderWithStyleInjection(h, context) {
|
|
190
|
+
hook.call(context);
|
|
191
|
+
return originalRender(h, context);
|
|
192
|
+
};
|
|
193
|
+
}
|
|
194
|
+
else {
|
|
195
|
+
// inject component registration as beforeCreate hook
|
|
196
|
+
const existing = options.beforeCreate;
|
|
197
|
+
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
|
|
198
|
+
}
|
|
199
|
+
}
|
|
200
|
+
return script;
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
const isOldIE = typeof navigator !== 'undefined' &&
|
|
204
|
+
/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());
|
|
205
|
+
function createInjector(context) {
|
|
206
|
+
return (id, style) => addStyle(id, style);
|
|
207
|
+
}
|
|
208
|
+
let HEAD;
|
|
209
|
+
const styles = {};
|
|
210
|
+
function addStyle(id, css) {
|
|
211
|
+
const group = isOldIE ? css.media || 'default' : id;
|
|
212
|
+
const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] });
|
|
213
|
+
if (!style.ids.has(id)) {
|
|
214
|
+
style.ids.add(id);
|
|
215
|
+
let code = css.source;
|
|
216
|
+
if (css.map) {
|
|
217
|
+
// https://developer.chrome.com/devtools/docs/javascript-debugging
|
|
218
|
+
// this makes source maps inside style tags work properly in Chrome
|
|
219
|
+
code += '\n/*# sourceURL=' + css.map.sources[0] + ' */';
|
|
220
|
+
// http://stackoverflow.com/a/26603875
|
|
221
|
+
code +=
|
|
222
|
+
'\n/*# sourceMappingURL=data:application/json;base64,' +
|
|
223
|
+
btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) +
|
|
224
|
+
' */';
|
|
225
|
+
}
|
|
226
|
+
if (!style.element) {
|
|
227
|
+
style.element = document.createElement('style');
|
|
228
|
+
style.element.type = 'text/css';
|
|
229
|
+
if (css.media)
|
|
230
|
+
style.element.setAttribute('media', css.media);
|
|
231
|
+
if (HEAD === undefined) {
|
|
232
|
+
HEAD = document.head || document.getElementsByTagName('head')[0];
|
|
233
|
+
}
|
|
234
|
+
HEAD.appendChild(style.element);
|
|
235
|
+
}
|
|
236
|
+
if ('styleSheet' in style.element) {
|
|
237
|
+
style.styles.push(code);
|
|
238
|
+
style.element.styleSheet.cssText = style.styles
|
|
239
|
+
.filter(Boolean)
|
|
240
|
+
.join('\n');
|
|
241
|
+
}
|
|
242
|
+
else {
|
|
243
|
+
const index = style.ids.size - 1;
|
|
244
|
+
const textNode = document.createTextNode(code);
|
|
245
|
+
const nodes = style.element.childNodes;
|
|
246
|
+
if (nodes[index])
|
|
247
|
+
style.element.removeChild(nodes[index]);
|
|
248
|
+
if (nodes.length)
|
|
249
|
+
style.element.insertBefore(textNode, nodes[index]);
|
|
250
|
+
else
|
|
251
|
+
style.element.appendChild(textNode);
|
|
252
|
+
}
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
/* script */
|
|
257
|
+
const __vue_script__$3 = script$3;
|
|
258
|
+
|
|
259
|
+
/* template */
|
|
260
|
+
var __vue_render__$3 = function () {
|
|
261
|
+
var _vm = this;
|
|
262
|
+
var _h = _vm.$createElement;
|
|
263
|
+
var _c = _vm._self._c || _h;
|
|
264
|
+
return _c(
|
|
265
|
+
"v-menu",
|
|
266
|
+
{
|
|
267
|
+
attrs: {
|
|
268
|
+
"position-x": _vm.menuX,
|
|
269
|
+
"position-y": _vm.menuY,
|
|
270
|
+
absolute: "",
|
|
271
|
+
"close-on-content-click": false,
|
|
272
|
+
"content-class": "calendar-day-info",
|
|
273
|
+
},
|
|
274
|
+
model: {
|
|
275
|
+
value: _vm.showMenu,
|
|
276
|
+
callback: function ($$v) {
|
|
277
|
+
_vm.showMenu = $$v;
|
|
278
|
+
},
|
|
279
|
+
expression: "showMenu",
|
|
280
|
+
},
|
|
281
|
+
},
|
|
282
|
+
[
|
|
283
|
+
_c("v-card", { attrs: { width: _vm.menuWidth } }, [
|
|
284
|
+
_c(
|
|
285
|
+
"div",
|
|
286
|
+
{
|
|
287
|
+
staticClass:
|
|
288
|
+
"zd-py-3 zd-display-flex zd-flex-column zd-align-center",
|
|
289
|
+
},
|
|
290
|
+
[
|
|
291
|
+
_c(
|
|
292
|
+
"div",
|
|
293
|
+
{ staticClass: "calendar-day-info__3day zd-text-center" },
|
|
294
|
+
[_vm._v(_vm._s(_vm.shortDayName))]
|
|
295
|
+
),
|
|
296
|
+
_vm._v(" "),
|
|
297
|
+
_c(
|
|
298
|
+
"v-btn",
|
|
299
|
+
{
|
|
300
|
+
class: ["calendar-day-info__day zd-mt-1"],
|
|
301
|
+
attrs: { icon: "" },
|
|
302
|
+
on: {
|
|
303
|
+
click: function ($event) {
|
|
304
|
+
return _vm.emitDayClick($event)
|
|
305
|
+
},
|
|
306
|
+
},
|
|
307
|
+
},
|
|
308
|
+
[_vm._v("\n " + _vm._s(_vm.dayNumber) + "\n ")]
|
|
309
|
+
),
|
|
310
|
+
],
|
|
311
|
+
1
|
|
312
|
+
),
|
|
313
|
+
_vm._v(" "),
|
|
314
|
+
!!_vm.selectedDate
|
|
315
|
+
? _c(
|
|
316
|
+
"div",
|
|
317
|
+
{ staticClass: "zd-display-flex zd-flex-column zd-px-2 zd-pb-4" },
|
|
318
|
+
[
|
|
319
|
+
_vm._l(_vm.events, function (event) {
|
|
320
|
+
return [
|
|
321
|
+
_c(
|
|
322
|
+
"v-sheet",
|
|
323
|
+
{
|
|
324
|
+
key: event.id,
|
|
325
|
+
class: [
|
|
326
|
+
"v-event white--text zd-mb-1 v-event-start v-event-end zd-px-3",
|
|
327
|
+
_vm.getEventClasses(event),
|
|
328
|
+
],
|
|
329
|
+
attrs: { color: event.color || "primary" },
|
|
330
|
+
on: {
|
|
331
|
+
click: function ($event) {
|
|
332
|
+
return _vm.clickEvent($event, event)
|
|
333
|
+
},
|
|
334
|
+
},
|
|
335
|
+
},
|
|
336
|
+
[
|
|
337
|
+
_c("div", { staticClass: "event-container" }, [
|
|
338
|
+
_c("span", { staticClass: "v-event-summary" }, [
|
|
339
|
+
_vm.startsInDay(event)
|
|
340
|
+
? _c("strong", [
|
|
341
|
+
_vm._v(_vm._s(_vm.getStartHour(event))),
|
|
342
|
+
])
|
|
343
|
+
: _vm._e(),
|
|
344
|
+
_vm._v(
|
|
345
|
+
" \n " +
|
|
346
|
+
_vm._s(event.name) +
|
|
347
|
+
"\n "
|
|
348
|
+
),
|
|
349
|
+
]),
|
|
350
|
+
]),
|
|
351
|
+
]
|
|
352
|
+
),
|
|
353
|
+
]
|
|
354
|
+
}),
|
|
355
|
+
],
|
|
356
|
+
2
|
|
357
|
+
)
|
|
358
|
+
: _vm._e(),
|
|
359
|
+
]),
|
|
360
|
+
],
|
|
361
|
+
1
|
|
362
|
+
)
|
|
363
|
+
};
|
|
364
|
+
var __vue_staticRenderFns__$3 = [];
|
|
365
|
+
__vue_render__$3._withStripped = true;
|
|
366
|
+
|
|
367
|
+
/* style */
|
|
368
|
+
const __vue_inject_styles__$3 = function (inject) {
|
|
369
|
+
if (!inject) return
|
|
370
|
+
inject("data-v-927fb13c_0", { source: ".calendar-day-info__3day {\n font-size: 11px;\n}\n.calendar-day-info__day {\n font-size: 26px;\n}\n.calendar-day-info .v-event {\n height: 20px;\n line-height: 20px;\n border-radius: 4px;\n width: 100%;\n position: relative;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n font-size: 12px;\n cursor: pointer;\n z-index: 1;\n}\n.calendar-day-info .v-event.is-continued-from-prev {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n clip-path: polygon(8px 0%, 100% 0%, 100% 100%, 8px 100%, 0% 50%);\n}\n.calendar-day-info .v-event.is-continued-to-next {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n clip-path: polygon(0% 0%, calc(100% - 8px) 0%, 100% 50%, calc(100% - 8px) 100%, 0% 100%);\n}\n.calendar-day-info .v-event.is-continued-from-prev.is-continued-to-next {\n clip-path: polygon(8px 0%, calc(100% - 8px) 0%, 100% 50%, calc(100% - 8px) 100%, 8px 100%, 0% 50%);\n}\n.calendar-day-info .v-event-summary {\n font-size: 12px;\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n width: 100%;\n white-space: nowrap;\n}\n.calendar-day-info .event-container {\n height: 20px;\n}", map: undefined, media: undefined });
|
|
371
|
+
|
|
372
|
+
};
|
|
373
|
+
/* scoped */
|
|
374
|
+
const __vue_scope_id__$3 = undefined;
|
|
375
|
+
/* module identifier */
|
|
376
|
+
const __vue_module_identifier__$3 = undefined;
|
|
377
|
+
/* functional template */
|
|
378
|
+
const __vue_is_functional_template__$3 = false;
|
|
379
|
+
/* style inject SSR */
|
|
380
|
+
|
|
381
|
+
/* style inject shadow dom */
|
|
382
|
+
|
|
383
|
+
|
|
384
|
+
|
|
385
|
+
const __vue_component__$3 = /*#__PURE__*/normalizeComponent(
|
|
386
|
+
{ render: __vue_render__$3, staticRenderFns: __vue_staticRenderFns__$3 },
|
|
387
|
+
__vue_inject_styles__$3,
|
|
388
|
+
__vue_script__$3,
|
|
389
|
+
__vue_scope_id__$3,
|
|
390
|
+
__vue_is_functional_template__$3,
|
|
391
|
+
__vue_module_identifier__$3,
|
|
392
|
+
false,
|
|
393
|
+
createInjector,
|
|
394
|
+
undefined,
|
|
395
|
+
undefined
|
|
396
|
+
);
|
|
397
|
+
|
|
398
|
+
let CalendarEventInfo = class CalendarEventInfo extends Vue {
|
|
399
|
+
constructor() {
|
|
400
|
+
super(...arguments);
|
|
401
|
+
this.dynamicLeft = false;
|
|
402
|
+
this.dynamicRight = false;
|
|
403
|
+
}
|
|
404
|
+
get selectedOpen() {
|
|
405
|
+
return this.value;
|
|
406
|
+
}
|
|
407
|
+
set selectedOpen(val) {
|
|
408
|
+
this.$emit('input', val);
|
|
409
|
+
}
|
|
410
|
+
get computedLeft() {
|
|
411
|
+
return this.left || this.dynamicLeft;
|
|
412
|
+
}
|
|
413
|
+
get computedRight() {
|
|
414
|
+
return this.right || this.dynamicRight;
|
|
415
|
+
}
|
|
416
|
+
onValueChange(newValue) {
|
|
417
|
+
if (newValue && this.activator) {
|
|
418
|
+
this.$nextTick(() => {
|
|
419
|
+
this.calculatePosition();
|
|
420
|
+
});
|
|
421
|
+
}
|
|
422
|
+
}
|
|
423
|
+
calculatePosition() {
|
|
424
|
+
if (!this.activator)
|
|
425
|
+
return;
|
|
426
|
+
const activatorRect = this.activator.getBoundingClientRect();
|
|
427
|
+
const menuWidth = typeof this.width === 'string' ? parseInt(this.width, 10) : this.width;
|
|
428
|
+
const windowWidth = window.innerWidth;
|
|
429
|
+
// Reset dynamic positioning
|
|
430
|
+
this.dynamicLeft = false;
|
|
431
|
+
this.dynamicRight = false;
|
|
432
|
+
// If left or right is explicitly set via props, respect that
|
|
433
|
+
if (this.left || this.right) {
|
|
434
|
+
return;
|
|
435
|
+
}
|
|
436
|
+
// Calculate if the menu would overflow on the right side
|
|
437
|
+
const spaceOnRight = windowWidth - activatorRect.right;
|
|
438
|
+
const spaceOnLeft = activatorRect.left;
|
|
439
|
+
// Check if menu would overflow on the right
|
|
440
|
+
if (spaceOnRight < menuWidth && spaceOnLeft > spaceOnRight) {
|
|
441
|
+
// Not enough space on the right, but more space on the left
|
|
442
|
+
this.dynamicLeft = true;
|
|
443
|
+
}
|
|
444
|
+
else if (spaceOnLeft < menuWidth && spaceOnRight > spaceOnLeft) {
|
|
445
|
+
// Not enough space on the left, but more space on the right
|
|
446
|
+
this.dynamicRight = true;
|
|
447
|
+
}
|
|
448
|
+
else if (spaceOnRight >= menuWidth) {
|
|
449
|
+
// Enough space on the right, default behavior
|
|
450
|
+
this.dynamicRight = false;
|
|
451
|
+
}
|
|
452
|
+
else if (spaceOnLeft >= menuWidth) {
|
|
453
|
+
// Enough space on the left
|
|
454
|
+
this.dynamicLeft = true;
|
|
455
|
+
}
|
|
456
|
+
}
|
|
457
|
+
callCanEditEvent(event) {
|
|
458
|
+
return typeof this.instance.canEditEvent === 'function' && event
|
|
459
|
+
? this.instance.canEditEvent(event)
|
|
460
|
+
: this.instance.canEditEvent;
|
|
461
|
+
}
|
|
462
|
+
callCanDeleteEvent(event) {
|
|
463
|
+
return typeof this.instance.canDeleteEvent === 'function' && event
|
|
464
|
+
? this.instance.canDeleteEvent(event)
|
|
465
|
+
: this.instance.canDeleteEvent;
|
|
466
|
+
}
|
|
467
|
+
clickEditEvent(selectedEvent, nativeEvent) {
|
|
468
|
+
this.$emit('click:edit', selectedEvent, nativeEvent);
|
|
469
|
+
}
|
|
470
|
+
clickDeleteEvent(selectedEvent, nativeEvent) {
|
|
471
|
+
this.$emit('click:delete', selectedEvent, nativeEvent);
|
|
472
|
+
}
|
|
473
|
+
};
|
|
474
|
+
__decorate([
|
|
475
|
+
Prop({ type: Boolean, required: true }),
|
|
476
|
+
__metadata("design:type", Boolean)
|
|
477
|
+
], CalendarEventInfo.prototype, "value", void 0);
|
|
478
|
+
__decorate([
|
|
479
|
+
Prop({ type: Object, default: null }),
|
|
480
|
+
__metadata("design:type", Object)
|
|
481
|
+
], CalendarEventInfo.prototype, "selectedEvent", void 0);
|
|
482
|
+
__decorate([
|
|
483
|
+
Prop({ default: null }),
|
|
484
|
+
__metadata("design:type", Object)
|
|
485
|
+
], CalendarEventInfo.prototype, "activator", void 0);
|
|
486
|
+
__decorate([
|
|
487
|
+
Prop({ type: Object, required: true }),
|
|
488
|
+
__metadata("design:type", Calendar)
|
|
489
|
+
], CalendarEventInfo.prototype, "instance", void 0);
|
|
490
|
+
__decorate([
|
|
491
|
+
Prop({ type: Boolean, default: false }),
|
|
492
|
+
__metadata("design:type", Boolean)
|
|
493
|
+
], CalendarEventInfo.prototype, "left", void 0);
|
|
494
|
+
__decorate([
|
|
495
|
+
Prop({ type: Boolean, default: false }),
|
|
496
|
+
__metadata("design:type", Boolean)
|
|
497
|
+
], CalendarEventInfo.prototype, "right", void 0);
|
|
498
|
+
__decorate([
|
|
499
|
+
Prop({ type: Boolean, default: false }),
|
|
500
|
+
__metadata("design:type", Boolean)
|
|
501
|
+
], CalendarEventInfo.prototype, "offsetX", void 0);
|
|
502
|
+
__decorate([
|
|
503
|
+
Prop({ type: Boolean, default: false }),
|
|
504
|
+
__metadata("design:type", Boolean)
|
|
505
|
+
], CalendarEventInfo.prototype, "offsetY", void 0);
|
|
506
|
+
__decorate([
|
|
507
|
+
Prop({ type: [Number, String], default: '448' }),
|
|
508
|
+
__metadata("design:type", Object)
|
|
509
|
+
], CalendarEventInfo.prototype, "width", void 0);
|
|
510
|
+
__decorate([
|
|
511
|
+
Watch('value'),
|
|
512
|
+
__metadata("design:type", Function),
|
|
513
|
+
__metadata("design:paramtypes", [Boolean]),
|
|
514
|
+
__metadata("design:returntype", void 0)
|
|
515
|
+
], CalendarEventInfo.prototype, "onValueChange", null);
|
|
516
|
+
CalendarEventInfo = __decorate([
|
|
517
|
+
Component
|
|
518
|
+
], CalendarEventInfo);
|
|
519
|
+
var script$2 = CalendarEventInfo;
|
|
520
|
+
|
|
521
|
+
/* script */
|
|
522
|
+
const __vue_script__$2 = script$2;
|
|
523
|
+
|
|
524
|
+
/* template */
|
|
525
|
+
var __vue_render__$2 = function () {
|
|
526
|
+
var _vm = this;
|
|
527
|
+
var _h = _vm.$createElement;
|
|
528
|
+
var _c = _vm._self._c || _h;
|
|
529
|
+
return _c(
|
|
530
|
+
"v-menu",
|
|
531
|
+
{
|
|
532
|
+
attrs: {
|
|
533
|
+
value: _vm.selectedOpen,
|
|
534
|
+
"open-on-click": false,
|
|
535
|
+
"close-on-click": true,
|
|
536
|
+
"close-on-content-click": false,
|
|
537
|
+
activator: _vm.activator,
|
|
538
|
+
"offset-x": _vm.offsetX,
|
|
539
|
+
"offset-y": _vm.offsetY,
|
|
540
|
+
left: _vm.computedLeft,
|
|
541
|
+
right: _vm.computedRight,
|
|
542
|
+
"offset-overflow": "",
|
|
543
|
+
"allow-overflow": "",
|
|
544
|
+
"min-width": _vm.width,
|
|
545
|
+
"max-width": _vm.width,
|
|
546
|
+
"max-height": "40vh",
|
|
547
|
+
},
|
|
548
|
+
},
|
|
549
|
+
[
|
|
550
|
+
_vm.selectedEvent
|
|
551
|
+
? _c(
|
|
552
|
+
"zd-card",
|
|
553
|
+
{
|
|
554
|
+
attrs: {
|
|
555
|
+
name: "card_" + _vm.instance.name,
|
|
556
|
+
cssClass: "event-info zd-pa-0 zd-display-flex zd-flex-column",
|
|
557
|
+
dark: _vm.instance.dark,
|
|
558
|
+
light: _vm.instance.light,
|
|
559
|
+
"max-height": "inherit",
|
|
560
|
+
},
|
|
561
|
+
},
|
|
562
|
+
[
|
|
563
|
+
_c(
|
|
564
|
+
"v-toolbar",
|
|
565
|
+
{
|
|
566
|
+
staticClass:
|
|
567
|
+
"event-info__toolbar zd-display-flex zd-align-start zd-py-4 zd-flex-shrink-0",
|
|
568
|
+
attrs: {
|
|
569
|
+
height: "auto",
|
|
570
|
+
"min-height": "48",
|
|
571
|
+
dense: "",
|
|
572
|
+
elevation: "0",
|
|
573
|
+
color: "transparent",
|
|
574
|
+
},
|
|
575
|
+
},
|
|
576
|
+
[
|
|
577
|
+
_c(
|
|
578
|
+
"div",
|
|
579
|
+
{
|
|
580
|
+
staticClass:
|
|
581
|
+
"event-info__header zd-display-flex zd-align-start zd-flex-grow-1",
|
|
582
|
+
},
|
|
583
|
+
[
|
|
584
|
+
_c("v-sheet", {
|
|
585
|
+
class: ["event-color-sample zd-flex-shrink-0"],
|
|
586
|
+
attrs: { color: _vm.selectedEvent.color || "primary" },
|
|
587
|
+
}),
|
|
588
|
+
_vm._v(" "),
|
|
589
|
+
_c(
|
|
590
|
+
"zd-text",
|
|
591
|
+
_vm._b(
|
|
592
|
+
{
|
|
593
|
+
staticClass:
|
|
594
|
+
"event-info__title mx-2 zd-display-flex zd-align-center zd-flex-grow-1",
|
|
595
|
+
attrs: { name: "title_" + _vm.instance.name },
|
|
596
|
+
},
|
|
597
|
+
"zd-text",
|
|
598
|
+
{
|
|
599
|
+
text: _vm.selectedEvent.name,
|
|
600
|
+
tag: "h5",
|
|
601
|
+
},
|
|
602
|
+
false
|
|
603
|
+
)
|
|
604
|
+
),
|
|
605
|
+
],
|
|
606
|
+
1
|
|
607
|
+
),
|
|
608
|
+
_vm._v(" "),
|
|
609
|
+
_c(
|
|
610
|
+
"span",
|
|
611
|
+
{ staticClass: "zd-flex-shrink-0" },
|
|
612
|
+
[
|
|
613
|
+
_vm.callCanEditEvent(_vm.selectedEvent)
|
|
614
|
+
? _c(
|
|
615
|
+
"v-btn",
|
|
616
|
+
{
|
|
617
|
+
attrs: { icon: "", small: "" },
|
|
618
|
+
on: {
|
|
619
|
+
click: function ($event) {
|
|
620
|
+
return _vm.clickEditEvent(
|
|
621
|
+
_vm.selectedEvent,
|
|
622
|
+
$event
|
|
623
|
+
)
|
|
624
|
+
},
|
|
625
|
+
},
|
|
626
|
+
},
|
|
627
|
+
[
|
|
628
|
+
_c("v-icon", { attrs: { small: "" } }, [
|
|
629
|
+
_vm._v(
|
|
630
|
+
"\n " +
|
|
631
|
+
_vm._s(_vm.$getIcon("pencil")) +
|
|
632
|
+
"\n "
|
|
633
|
+
),
|
|
634
|
+
]),
|
|
635
|
+
],
|
|
636
|
+
1
|
|
637
|
+
)
|
|
638
|
+
: _vm._e(),
|
|
639
|
+
_vm._v(" "),
|
|
640
|
+
_vm.callCanDeleteEvent(_vm.selectedEvent)
|
|
641
|
+
? _c(
|
|
642
|
+
"v-btn",
|
|
643
|
+
{
|
|
644
|
+
attrs: { icon: "", small: "" },
|
|
645
|
+
on: {
|
|
646
|
+
click: function ($event) {
|
|
647
|
+
return _vm.clickDeleteEvent(
|
|
648
|
+
_vm.selectedEvent,
|
|
649
|
+
$event
|
|
650
|
+
)
|
|
651
|
+
},
|
|
652
|
+
},
|
|
653
|
+
},
|
|
654
|
+
[
|
|
655
|
+
_c("v-icon", { attrs: { small: "" } }, [
|
|
656
|
+
_vm._v(
|
|
657
|
+
"\n " +
|
|
658
|
+
_vm._s(_vm.$getIcon("trash")) +
|
|
659
|
+
"\n "
|
|
660
|
+
),
|
|
661
|
+
]),
|
|
662
|
+
],
|
|
663
|
+
1
|
|
664
|
+
)
|
|
665
|
+
: _vm._e(),
|
|
666
|
+
_vm._v(" "),
|
|
667
|
+
_c(
|
|
668
|
+
"v-btn",
|
|
669
|
+
{
|
|
670
|
+
attrs: { icon: "", small: "" },
|
|
671
|
+
on: {
|
|
672
|
+
click: function ($event) {
|
|
673
|
+
_vm.selectedOpen = !_vm.selectedOpen;
|
|
674
|
+
},
|
|
675
|
+
},
|
|
676
|
+
},
|
|
677
|
+
[
|
|
678
|
+
_c("v-icon", { attrs: { small: "" } }, [
|
|
679
|
+
_vm._v(
|
|
680
|
+
"\n " +
|
|
681
|
+
_vm._s(_vm.$getIcon("close")) +
|
|
682
|
+
"\n "
|
|
683
|
+
),
|
|
684
|
+
]),
|
|
685
|
+
],
|
|
686
|
+
1
|
|
687
|
+
),
|
|
688
|
+
],
|
|
689
|
+
1
|
|
690
|
+
),
|
|
691
|
+
]
|
|
692
|
+
),
|
|
693
|
+
_vm._v(" "),
|
|
694
|
+
_vm.selectedEvent.description
|
|
695
|
+
? _c(
|
|
696
|
+
"v-card-text",
|
|
697
|
+
{
|
|
698
|
+
staticClass:
|
|
699
|
+
"event-info__description zd-pt-0 zd-flex-grow-1",
|
|
700
|
+
},
|
|
701
|
+
[
|
|
702
|
+
_c(
|
|
703
|
+
"zd-text",
|
|
704
|
+
_vm._b(
|
|
705
|
+
{
|
|
706
|
+
attrs: { name: "description_" + _vm.instance.name },
|
|
707
|
+
},
|
|
708
|
+
"zd-text",
|
|
709
|
+
{
|
|
710
|
+
text: _vm.selectedEvent.description,
|
|
711
|
+
tag: "p",
|
|
712
|
+
},
|
|
713
|
+
false
|
|
714
|
+
)
|
|
715
|
+
),
|
|
716
|
+
],
|
|
717
|
+
1
|
|
718
|
+
)
|
|
719
|
+
: _vm._e(),
|
|
720
|
+
],
|
|
721
|
+
1
|
|
722
|
+
)
|
|
723
|
+
: _vm._e(),
|
|
724
|
+
],
|
|
725
|
+
1
|
|
726
|
+
)
|
|
727
|
+
};
|
|
728
|
+
var __vue_staticRenderFns__$2 = [];
|
|
729
|
+
__vue_render__$2._withStripped = true;
|
|
730
|
+
|
|
731
|
+
/* style */
|
|
732
|
+
const __vue_inject_styles__$2 = function (inject) {
|
|
733
|
+
if (!inject) return
|
|
734
|
+
inject("data-v-29169b90_0", { source: ".event-info__toolbar .v-toolbar__content {\n width: 100%;\n align-items: start;\n}\n.event-info .event-color-sample {\n height: 14px;\n width: 14px;\n border-radius: 4px;\n margin: 6px 0 3px 0;\n}\n.event-info__header {\n min-height: 28px;\n}\n.event-info__title {\n min-height: 28px;\n}\n.event-info__title > * {\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 3;\n line-clamp: 3;\n line-break: anywhere;\n}\n.event-info__description {\n overflow-y: auto;\n}", map: undefined, media: undefined });
|
|
735
|
+
|
|
736
|
+
};
|
|
737
|
+
/* scoped */
|
|
738
|
+
const __vue_scope_id__$2 = undefined;
|
|
739
|
+
/* module identifier */
|
|
740
|
+
const __vue_module_identifier__$2 = undefined;
|
|
741
|
+
/* functional template */
|
|
742
|
+
const __vue_is_functional_template__$2 = false;
|
|
743
|
+
/* style inject SSR */
|
|
744
|
+
|
|
745
|
+
/* style inject shadow dom */
|
|
746
|
+
|
|
747
|
+
|
|
748
|
+
|
|
749
|
+
const __vue_component__$2 = /*#__PURE__*/normalizeComponent(
|
|
750
|
+
{ render: __vue_render__$2, staticRenderFns: __vue_staticRenderFns__$2 },
|
|
751
|
+
__vue_inject_styles__$2,
|
|
752
|
+
__vue_script__$2,
|
|
753
|
+
__vue_scope_id__$2,
|
|
754
|
+
__vue_is_functional_template__$2,
|
|
755
|
+
__vue_module_identifier__$2,
|
|
756
|
+
false,
|
|
757
|
+
createInjector,
|
|
758
|
+
undefined,
|
|
759
|
+
undefined
|
|
760
|
+
);
|
|
761
|
+
|
|
762
|
+
let CalendarYear = class CalendarYear extends Vue {
|
|
763
|
+
constructor() {
|
|
764
|
+
super(...arguments);
|
|
765
|
+
this.showMenu = false;
|
|
766
|
+
this.menuX = 0;
|
|
767
|
+
this.menuY = 0;
|
|
768
|
+
this.selectedDate = null;
|
|
769
|
+
this.menuWidth = 224;
|
|
770
|
+
this.selectedOpen = false;
|
|
771
|
+
this.selectedElement = null;
|
|
772
|
+
this.selectedEvent = null;
|
|
773
|
+
this.resetTimer = null;
|
|
774
|
+
}
|
|
775
|
+
changeMenuVisibility() {
|
|
776
|
+
if (!this.showMenu) {
|
|
777
|
+
// If menu closes, wait 200ms before clearing the date
|
|
778
|
+
this.resetTimer = window.setTimeout(() => {
|
|
779
|
+
this.selectedDate = null;
|
|
780
|
+
}, 200);
|
|
781
|
+
return;
|
|
782
|
+
}
|
|
783
|
+
// If menu opens (becomes true), cancel any pending clear
|
|
784
|
+
if (this.resetTimer) {
|
|
785
|
+
clearTimeout(this.resetTimer);
|
|
786
|
+
this.resetTimer = null;
|
|
787
|
+
}
|
|
788
|
+
}
|
|
789
|
+
beforeDestroy() {
|
|
790
|
+
if (this.resetTimer) {
|
|
791
|
+
clearTimeout(this.resetTimer);
|
|
792
|
+
}
|
|
793
|
+
}
|
|
794
|
+
/**
|
|
795
|
+
* Triggered when user clicks on a calendar event inside a calendar-day-info dropdown
|
|
796
|
+
*/
|
|
797
|
+
clickEvent({ event, selectedEvent }) {
|
|
798
|
+
const open = () => {
|
|
799
|
+
const { target } = event;
|
|
800
|
+
if (!(target instanceof HTMLElement))
|
|
801
|
+
return;
|
|
802
|
+
const el = target.closest('.v-event');
|
|
803
|
+
if (!el)
|
|
804
|
+
return;
|
|
805
|
+
this.selectedEvent = selectedEvent;
|
|
806
|
+
this.selectedElement = el;
|
|
807
|
+
requestAnimationFrame(() => { requestAnimationFrame(() => { this.selectedOpen = true; }); });
|
|
808
|
+
};
|
|
809
|
+
if (this.selectedOpen) {
|
|
810
|
+
this.selectedOpen = false;
|
|
811
|
+
requestAnimationFrame(() => requestAnimationFrame(() => open()));
|
|
812
|
+
}
|
|
813
|
+
else {
|
|
814
|
+
open();
|
|
815
|
+
}
|
|
816
|
+
event.stopPropagation();
|
|
817
|
+
}
|
|
818
|
+
/**
|
|
819
|
+
* Triggered when user clicks on the day number inside a calendar-day-info dropdown
|
|
820
|
+
*/
|
|
821
|
+
clickDay({ date }) {
|
|
822
|
+
this.instance.type = 'day';
|
|
823
|
+
this.instance.value = date;
|
|
824
|
+
this.showMenu = false;
|
|
825
|
+
}
|
|
826
|
+
clickEditEvent(selectedEvent, nativeEvent) {
|
|
827
|
+
this.instance.clickEditEvent(selectedEvent, this.$el, nativeEvent);
|
|
828
|
+
}
|
|
829
|
+
clickDeleteEvent(selectedEvent, nativeEvent) {
|
|
830
|
+
this.instance.clickDeleteEvent(selectedEvent, this.$el, nativeEvent);
|
|
831
|
+
}
|
|
832
|
+
dateClick(date) {
|
|
833
|
+
this.selectedDate = date;
|
|
834
|
+
const buttonId = `date-${this.instance.name}-picker-${date}`;
|
|
835
|
+
const buttonElement = document.getElementById(buttonId);
|
|
836
|
+
if (!buttonElement) {
|
|
837
|
+
// If we can't find the button, do not try to show the menu
|
|
838
|
+
// to avoid positioning issues.
|
|
839
|
+
console.warn(`Date button element with id '${buttonId}' not found.`);
|
|
840
|
+
return;
|
|
841
|
+
}
|
|
842
|
+
const rect = buttonElement.getBoundingClientRect();
|
|
843
|
+
this.showMenu = false;
|
|
844
|
+
this.menuY = rect.bottom;
|
|
845
|
+
// Viewport dimensions
|
|
846
|
+
const viewportWidth = window.innerWidth;
|
|
847
|
+
// Calculate default positions (bottom-right)
|
|
848
|
+
let menuX = rect.right;
|
|
849
|
+
// Check if menu would overflow on the right side
|
|
850
|
+
// If so, flip to the left (align menu's right edge with button's left edge)
|
|
851
|
+
if (menuX + this.menuWidth > viewportWidth) {
|
|
852
|
+
menuX = rect.left - this.menuWidth;
|
|
853
|
+
// Ensure we don't go off the left edge
|
|
854
|
+
if (menuX < 0) {
|
|
855
|
+
menuX = rect.left;
|
|
856
|
+
}
|
|
857
|
+
}
|
|
858
|
+
this.menuX = menuX;
|
|
859
|
+
setTimeout(() => {
|
|
860
|
+
this.showMenu = true;
|
|
861
|
+
});
|
|
862
|
+
}
|
|
863
|
+
assignPickerButtonIds(monthNumber) {
|
|
864
|
+
const pickerId = `${this.instance.name}-picker-${this.year}-${monthNumber}`;
|
|
865
|
+
const pickerElement = document.getElementById(pickerId);
|
|
866
|
+
if (!pickerElement)
|
|
867
|
+
return;
|
|
868
|
+
const cellButtons = pickerElement.querySelectorAll('tbody button');
|
|
869
|
+
cellButtons.forEach((buttonElement, i) => {
|
|
870
|
+
const dayNumber = this.doubleDigit(i + 1);
|
|
871
|
+
buttonElement.id = `date-${pickerId}-${dayNumber}`;
|
|
872
|
+
});
|
|
873
|
+
}
|
|
874
|
+
pickerMounted(monthNumber) {
|
|
875
|
+
this.assignPickerButtonIds(monthNumber);
|
|
876
|
+
}
|
|
877
|
+
changeYear() {
|
|
878
|
+
// wait for transitions to finish
|
|
879
|
+
setTimeout(() => {
|
|
880
|
+
for (let i = 1; i <= 12; i += 1) {
|
|
881
|
+
const monthNumber = this.doubleDigit(i);
|
|
882
|
+
this.assignPickerButtonIds(monthNumber);
|
|
883
|
+
}
|
|
884
|
+
}, 600);
|
|
885
|
+
}
|
|
886
|
+
doubleDigit(n) {
|
|
887
|
+
if (n < 10)
|
|
888
|
+
return `0${n}`;
|
|
889
|
+
return String(n);
|
|
890
|
+
}
|
|
891
|
+
firstLetterUpperCase(str) {
|
|
892
|
+
return str.charAt(0).toUpperCase() + str.slice(1);
|
|
893
|
+
}
|
|
894
|
+
/**
|
|
895
|
+
* @param monthNumber the number of the month between 1 and 12
|
|
896
|
+
*/
|
|
897
|
+
getMonthName(monthNumber) {
|
|
898
|
+
if (monthNumber < 1 || monthNumber > 12) {
|
|
899
|
+
console.error('Error: Month number must be between 1 and 12.');
|
|
900
|
+
return null;
|
|
901
|
+
}
|
|
902
|
+
const dateInMonth = dayjs().month(monthNumber - 1);
|
|
903
|
+
const monthName = dateInMonth.format('MMMM');
|
|
904
|
+
return this.firstLetterUpperCase(monthName);
|
|
905
|
+
}
|
|
906
|
+
get sortedEvents() {
|
|
907
|
+
if (!this.selectedDate)
|
|
908
|
+
return [];
|
|
909
|
+
const events = this.instance.getEventsByDate(this.selectedDate);
|
|
910
|
+
const sortedEvents = [...events];
|
|
911
|
+
sortedEvents.sort((eventA, eventB) => {
|
|
912
|
+
const dateA = dayjs(eventA.start);
|
|
913
|
+
const dateB = dayjs(eventB.start);
|
|
914
|
+
// use Day.js's comparison methods:
|
|
915
|
+
if (dateA.isBefore(dateB)) {
|
|
916
|
+
return -1; // dateA is earlier, so it comes first
|
|
917
|
+
}
|
|
918
|
+
if (dateA.isAfter(dateB)) {
|
|
919
|
+
return 1; // dateB is earlier, so it comes first
|
|
920
|
+
}
|
|
921
|
+
// If dates are the same
|
|
922
|
+
return 0;
|
|
923
|
+
});
|
|
924
|
+
return sortedEvents;
|
|
925
|
+
}
|
|
926
|
+
};
|
|
927
|
+
__decorate([
|
|
928
|
+
Prop({ type: Object, required: true }),
|
|
929
|
+
__metadata("design:type", Calendar)
|
|
930
|
+
], CalendarYear.prototype, "instance", void 0);
|
|
931
|
+
__decorate([
|
|
932
|
+
Prop({ type: String, required: true }),
|
|
933
|
+
__metadata("design:type", String)
|
|
934
|
+
], CalendarYear.prototype, "year", void 0);
|
|
935
|
+
__decorate([
|
|
936
|
+
Watch('showMenu'),
|
|
937
|
+
__metadata("design:type", Function),
|
|
938
|
+
__metadata("design:paramtypes", []),
|
|
939
|
+
__metadata("design:returntype", void 0)
|
|
940
|
+
], CalendarYear.prototype, "changeMenuVisibility", null);
|
|
941
|
+
__decorate([
|
|
942
|
+
Watch('year'),
|
|
943
|
+
__metadata("design:type", Function),
|
|
944
|
+
__metadata("design:paramtypes", []),
|
|
945
|
+
__metadata("design:returntype", void 0)
|
|
946
|
+
], CalendarYear.prototype, "changeYear", null);
|
|
947
|
+
CalendarYear = __decorate([
|
|
948
|
+
Component({
|
|
949
|
+
components: {
|
|
950
|
+
CalendarDayInfo: __vue_component__$3,
|
|
951
|
+
CalendarEventInfo: __vue_component__$2,
|
|
952
|
+
},
|
|
953
|
+
})
|
|
954
|
+
], CalendarYear);
|
|
955
|
+
var script$1 = CalendarYear;
|
|
956
|
+
|
|
957
|
+
/* script */
|
|
958
|
+
const __vue_script__$1 = script$1;
|
|
959
|
+
|
|
960
|
+
/* template */
|
|
961
|
+
var __vue_render__$1 = function () {
|
|
962
|
+
var _vm = this;
|
|
963
|
+
var _h = _vm.$createElement;
|
|
964
|
+
var _c = _vm._self._c || _h;
|
|
965
|
+
return _c("div", { staticClass: "zd-calendar-year" }, [
|
|
966
|
+
_c(
|
|
967
|
+
"div",
|
|
968
|
+
{ staticClass: "zd-display-flex zd-justify-space-between zd-flex-wrap" },
|
|
969
|
+
[
|
|
970
|
+
_vm._l(12, function (i) {
|
|
971
|
+
return [
|
|
972
|
+
_c("div", { staticClass: "zd-calendar-year--item" }, [
|
|
973
|
+
_c(
|
|
974
|
+
"div",
|
|
975
|
+
{
|
|
976
|
+
staticClass:
|
|
977
|
+
"zd-calendar-year__month-container zd-flex-column zd-display-flex zd-align-start",
|
|
978
|
+
},
|
|
979
|
+
[
|
|
980
|
+
_c("span", { staticClass: "zd-calendar-year__month-title" }, [
|
|
981
|
+
_vm._v(
|
|
982
|
+
"\n " +
|
|
983
|
+
_vm._s(_vm.getMonthName(i)) +
|
|
984
|
+
"\n "
|
|
985
|
+
),
|
|
986
|
+
]),
|
|
987
|
+
_vm._v(" "),
|
|
988
|
+
_c("v-date-picker", {
|
|
989
|
+
attrs: {
|
|
990
|
+
id:
|
|
991
|
+
_vm.instance.name +
|
|
992
|
+
"-picker-" +
|
|
993
|
+
_vm.year +
|
|
994
|
+
"-" +
|
|
995
|
+
_vm.doubleDigit(i),
|
|
996
|
+
"picker-date": _vm.year + "-" + _vm.doubleDigit(i),
|
|
997
|
+
color: "primary",
|
|
998
|
+
flat: "",
|
|
999
|
+
"no-title": "",
|
|
1000
|
+
"full-width": "",
|
|
1001
|
+
},
|
|
1002
|
+
on: {
|
|
1003
|
+
"click:date": function ($event) {
|
|
1004
|
+
return _vm.dateClick($event)
|
|
1005
|
+
},
|
|
1006
|
+
"hook:mounted": function ($event) {
|
|
1007
|
+
_vm.pickerMounted(_vm.doubleDigit(i));
|
|
1008
|
+
},
|
|
1009
|
+
},
|
|
1010
|
+
}),
|
|
1011
|
+
],
|
|
1012
|
+
1
|
|
1013
|
+
),
|
|
1014
|
+
]),
|
|
1015
|
+
]
|
|
1016
|
+
}),
|
|
1017
|
+
_vm._v(" "),
|
|
1018
|
+
_c("calendar-day-info", {
|
|
1019
|
+
attrs: {
|
|
1020
|
+
"menu-x": _vm.menuX,
|
|
1021
|
+
"menu-y": _vm.menuY,
|
|
1022
|
+
"menu-width": _vm.menuWidth,
|
|
1023
|
+
"selected-date": _vm.selectedDate,
|
|
1024
|
+
events: _vm.sortedEvents,
|
|
1025
|
+
},
|
|
1026
|
+
on: {
|
|
1027
|
+
"click:event": _vm.clickEvent,
|
|
1028
|
+
"click:day": function ($event) {
|
|
1029
|
+
return _vm.clickDay($event)
|
|
1030
|
+
},
|
|
1031
|
+
},
|
|
1032
|
+
model: {
|
|
1033
|
+
value: _vm.showMenu,
|
|
1034
|
+
callback: function ($$v) {
|
|
1035
|
+
_vm.showMenu = $$v;
|
|
1036
|
+
},
|
|
1037
|
+
expression: "showMenu",
|
|
1038
|
+
},
|
|
1039
|
+
}),
|
|
1040
|
+
_vm._v(" "),
|
|
1041
|
+
_c("calendar-event-info", {
|
|
1042
|
+
attrs: {
|
|
1043
|
+
"selected-event": _vm.selectedEvent,
|
|
1044
|
+
activator: _vm.selectedElement,
|
|
1045
|
+
instance: _vm.instance,
|
|
1046
|
+
"offset-x": true,
|
|
1047
|
+
"offset-overflow": "",
|
|
1048
|
+
},
|
|
1049
|
+
on: {
|
|
1050
|
+
"click:edit": _vm.clickEditEvent,
|
|
1051
|
+
"click:delete": _vm.clickDeleteEvent,
|
|
1052
|
+
},
|
|
1053
|
+
model: {
|
|
1054
|
+
value: _vm.selectedOpen,
|
|
1055
|
+
callback: function ($$v) {
|
|
1056
|
+
_vm.selectedOpen = $$v;
|
|
1057
|
+
},
|
|
1058
|
+
expression: "selectedOpen",
|
|
1059
|
+
},
|
|
1060
|
+
}),
|
|
1061
|
+
],
|
|
1062
|
+
2
|
|
1063
|
+
),
|
|
1064
|
+
])
|
|
1065
|
+
};
|
|
1066
|
+
var __vue_staticRenderFns__$1 = [];
|
|
1067
|
+
__vue_render__$1._withStripped = true;
|
|
1068
|
+
|
|
1069
|
+
/* style */
|
|
1070
|
+
const __vue_inject_styles__$1 = function (inject) {
|
|
1071
|
+
if (!inject) return
|
|
1072
|
+
inject("data-v-c153b644_0", { source: ".zd-calendar-year--item {\n flex-basis: 25%;\n}\n.zd-calendar-year__month-container {\n padding: 0 19px 0 14px;\n min-width: 208px;\n max-width: 256px;\n}\n.zd-calendar-year__month-container .zd-calendar-year__month-title {\n margin: 0 10px;\n font-size: 15px;\n}\n.zd-calendar-year__month-container .v-picker__body {\n background-color: inherit;\n}\n.zd-calendar-year__month-container .v-date-picker-header {\n display: none;\n}\n.zd-calendar-year__month-container .v-date-picker-table {\n padding: 0;\n}\n.zd-calendar-year__month-container .v-date-picker-table table {\n border-spacing: 0;\n}\n.zd-calendar-year__month-container .v-date-picker-table .v-btn, .zd-calendar-year__month-container .v-date-picker-table th {\n font-size: 10px;\n}\n.zd-calendar-year__month-container .v-date-picker-table td {\n padding: 1px;\n}\n.zd-calendar-year__month-container .v-date-picker-table button {\n width: 24px;\n height: 24px;\n}", map: undefined, media: undefined });
|
|
1073
|
+
|
|
1074
|
+
};
|
|
1075
|
+
/* scoped */
|
|
1076
|
+
const __vue_scope_id__$1 = undefined;
|
|
1077
|
+
/* module identifier */
|
|
1078
|
+
const __vue_module_identifier__$1 = undefined;
|
|
1079
|
+
/* functional template */
|
|
1080
|
+
const __vue_is_functional_template__$1 = false;
|
|
1081
|
+
/* style inject SSR */
|
|
1082
|
+
|
|
1083
|
+
/* style inject shadow dom */
|
|
1084
|
+
|
|
1085
|
+
|
|
1086
|
+
|
|
1087
|
+
const __vue_component__$1 = /*#__PURE__*/normalizeComponent(
|
|
1088
|
+
{ render: __vue_render__$1, staticRenderFns: __vue_staticRenderFns__$1 },
|
|
1089
|
+
__vue_inject_styles__$1,
|
|
1090
|
+
__vue_script__$1,
|
|
1091
|
+
__vue_scope_id__$1,
|
|
1092
|
+
__vue_is_functional_template__$1,
|
|
1093
|
+
__vue_module_identifier__$1,
|
|
1094
|
+
false,
|
|
1095
|
+
createInjector,
|
|
1096
|
+
undefined,
|
|
1097
|
+
undefined
|
|
1098
|
+
);
|
|
1099
|
+
|
|
32
1100
|
let ZdCalendar = class ZdCalendar extends ZdComponentRender {
|
|
33
1101
|
constructor() {
|
|
34
1102
|
super(...arguments);
|
|
@@ -38,6 +1106,9 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
|
|
|
38
1106
|
this.selectedEvent = null;
|
|
39
1107
|
this.showDatePicker = false;
|
|
40
1108
|
}
|
|
1109
|
+
get dayjsValue() {
|
|
1110
|
+
return dayjs(this.instance.value, 'YYYY-MM-DD');
|
|
1111
|
+
}
|
|
41
1112
|
onChangePicker() {
|
|
42
1113
|
this.showDatePicker = false;
|
|
43
1114
|
}
|
|
@@ -45,6 +1116,9 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
|
|
|
45
1116
|
if (this.instance.title) {
|
|
46
1117
|
return this.instance.title;
|
|
47
1118
|
}
|
|
1119
|
+
if (this.instance.type === 'year') {
|
|
1120
|
+
return this.currentYear;
|
|
1121
|
+
}
|
|
48
1122
|
const calendarRef = this.$refs.calendar;
|
|
49
1123
|
if (calendarRef) {
|
|
50
1124
|
const { title } = calendarRef;
|
|
@@ -61,14 +1135,24 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
|
|
|
61
1135
|
prev(event) {
|
|
62
1136
|
this.instance.beforePrevious(this.$el);
|
|
63
1137
|
if (!(event === null || event === void 0 ? void 0 : event.defaultPrevented)) {
|
|
64
|
-
this
|
|
1138
|
+
if (this.instance.type === 'year') {
|
|
1139
|
+
this.instance.value = this.dayjsValue.add(-1, 'year').format('YYYY-MM-DD');
|
|
1140
|
+
}
|
|
1141
|
+
else {
|
|
1142
|
+
this.$refs.calendar.prev();
|
|
1143
|
+
}
|
|
65
1144
|
this.instance.previous(this.$el);
|
|
66
1145
|
}
|
|
67
1146
|
}
|
|
68
1147
|
next(event) {
|
|
69
1148
|
this.instance.beforeNext(this.$el);
|
|
70
1149
|
if (!(event === null || event === void 0 ? void 0 : event.defaultPrevented)) {
|
|
71
|
-
this
|
|
1150
|
+
if (this.instance.type === 'year') {
|
|
1151
|
+
this.instance.value = this.dayjsValue.add(1, 'year').format('YYYY-MM-DD');
|
|
1152
|
+
}
|
|
1153
|
+
else {
|
|
1154
|
+
this.$refs.calendar.next();
|
|
1155
|
+
}
|
|
72
1156
|
this.instance.next(this.$el);
|
|
73
1157
|
}
|
|
74
1158
|
}
|
|
@@ -85,13 +1169,18 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
|
|
|
85
1169
|
}
|
|
86
1170
|
showEvent({ nativeEvent, event }) {
|
|
87
1171
|
const open = () => {
|
|
1172
|
+
const { target } = nativeEvent;
|
|
1173
|
+
if (!(target instanceof HTMLElement))
|
|
1174
|
+
return;
|
|
1175
|
+
const el = target.closest('.v-event');
|
|
1176
|
+
if (!el)
|
|
1177
|
+
return;
|
|
88
1178
|
this.selectedEvent = event;
|
|
89
|
-
this.selectedElement =
|
|
1179
|
+
this.selectedElement = el;
|
|
90
1180
|
requestAnimationFrame(() => { requestAnimationFrame(() => { this.selectedOpen = true; }); });
|
|
91
1181
|
};
|
|
92
1182
|
if (this.selectedOpen) {
|
|
93
1183
|
this.selectedOpen = false;
|
|
94
|
-
this.selectedEvent = null;
|
|
95
1184
|
requestAnimationFrame(() => requestAnimationFrame(() => open()));
|
|
96
1185
|
}
|
|
97
1186
|
else {
|
|
@@ -149,6 +1238,17 @@ let ZdCalendar = class ZdCalendar extends ZdComponentRender {
|
|
|
149
1238
|
? this.instance.canDeleteEvent(event)
|
|
150
1239
|
: this.instance.canDeleteEvent;
|
|
151
1240
|
}
|
|
1241
|
+
get currentYear() {
|
|
1242
|
+
return this.dayjsValue.format('YYYY');
|
|
1243
|
+
}
|
|
1244
|
+
get showYear() {
|
|
1245
|
+
return this.instance.type && this.instance.type === 'year';
|
|
1246
|
+
}
|
|
1247
|
+
get vCalendarType() {
|
|
1248
|
+
if (this.instance.type === 'year')
|
|
1249
|
+
return 'month';
|
|
1250
|
+
return this.instance.type;
|
|
1251
|
+
}
|
|
152
1252
|
};
|
|
153
1253
|
__decorate([
|
|
154
1254
|
Prop({ type: [String, Array], default: undefined }),
|
|
@@ -389,138 +1489,11 @@ __decorate([
|
|
|
389
1489
|
ZdCalendar = __decorate([
|
|
390
1490
|
Component({
|
|
391
1491
|
mixins: [FillHeightMixin],
|
|
1492
|
+
components: { CalendarYear: __vue_component__$1, CalendarEventInfo: __vue_component__$2 },
|
|
392
1493
|
})
|
|
393
1494
|
], ZdCalendar);
|
|
394
1495
|
var script = ZdCalendar;
|
|
395
1496
|
|
|
396
|
-
function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
|
|
397
|
-
if (typeof shadowMode !== 'boolean') {
|
|
398
|
-
createInjectorSSR = createInjector;
|
|
399
|
-
createInjector = shadowMode;
|
|
400
|
-
shadowMode = false;
|
|
401
|
-
}
|
|
402
|
-
// Vue.extend constructor export interop.
|
|
403
|
-
const options = typeof script === 'function' ? script.options : script;
|
|
404
|
-
// render functions
|
|
405
|
-
if (template && template.render) {
|
|
406
|
-
options.render = template.render;
|
|
407
|
-
options.staticRenderFns = template.staticRenderFns;
|
|
408
|
-
options._compiled = true;
|
|
409
|
-
// functional template
|
|
410
|
-
if (isFunctionalTemplate) {
|
|
411
|
-
options.functional = true;
|
|
412
|
-
}
|
|
413
|
-
}
|
|
414
|
-
// scopedId
|
|
415
|
-
if (scopeId) {
|
|
416
|
-
options._scopeId = scopeId;
|
|
417
|
-
}
|
|
418
|
-
let hook;
|
|
419
|
-
if (moduleIdentifier) {
|
|
420
|
-
// server build
|
|
421
|
-
hook = function (context) {
|
|
422
|
-
// 2.3 injection
|
|
423
|
-
context =
|
|
424
|
-
context || // cached call
|
|
425
|
-
(this.$vnode && this.$vnode.ssrContext) || // stateful
|
|
426
|
-
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional
|
|
427
|
-
// 2.2 with runInNewContext: true
|
|
428
|
-
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
|
|
429
|
-
context = __VUE_SSR_CONTEXT__;
|
|
430
|
-
}
|
|
431
|
-
// inject component styles
|
|
432
|
-
if (style) {
|
|
433
|
-
style.call(this, createInjectorSSR(context));
|
|
434
|
-
}
|
|
435
|
-
// register component module identifier for async chunk inference
|
|
436
|
-
if (context && context._registeredComponents) {
|
|
437
|
-
context._registeredComponents.add(moduleIdentifier);
|
|
438
|
-
}
|
|
439
|
-
};
|
|
440
|
-
// used by ssr in case component is cached and beforeCreate
|
|
441
|
-
// never gets called
|
|
442
|
-
options._ssrRegister = hook;
|
|
443
|
-
}
|
|
444
|
-
else if (style) {
|
|
445
|
-
hook = shadowMode
|
|
446
|
-
? function (context) {
|
|
447
|
-
style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
|
|
448
|
-
}
|
|
449
|
-
: function (context) {
|
|
450
|
-
style.call(this, createInjector(context));
|
|
451
|
-
};
|
|
452
|
-
}
|
|
453
|
-
if (hook) {
|
|
454
|
-
if (options.functional) {
|
|
455
|
-
// register for functional component in vue file
|
|
456
|
-
const originalRender = options.render;
|
|
457
|
-
options.render = function renderWithStyleInjection(h, context) {
|
|
458
|
-
hook.call(context);
|
|
459
|
-
return originalRender(h, context);
|
|
460
|
-
};
|
|
461
|
-
}
|
|
462
|
-
else {
|
|
463
|
-
// inject component registration as beforeCreate hook
|
|
464
|
-
const existing = options.beforeCreate;
|
|
465
|
-
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
|
|
466
|
-
}
|
|
467
|
-
}
|
|
468
|
-
return script;
|
|
469
|
-
}
|
|
470
|
-
|
|
471
|
-
const isOldIE = typeof navigator !== 'undefined' &&
|
|
472
|
-
/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());
|
|
473
|
-
function createInjector(context) {
|
|
474
|
-
return (id, style) => addStyle(id, style);
|
|
475
|
-
}
|
|
476
|
-
let HEAD;
|
|
477
|
-
const styles = {};
|
|
478
|
-
function addStyle(id, css) {
|
|
479
|
-
const group = isOldIE ? css.media || 'default' : id;
|
|
480
|
-
const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] });
|
|
481
|
-
if (!style.ids.has(id)) {
|
|
482
|
-
style.ids.add(id);
|
|
483
|
-
let code = css.source;
|
|
484
|
-
if (css.map) {
|
|
485
|
-
// https://developer.chrome.com/devtools/docs/javascript-debugging
|
|
486
|
-
// this makes source maps inside style tags work properly in Chrome
|
|
487
|
-
code += '\n/*# sourceURL=' + css.map.sources[0] + ' */';
|
|
488
|
-
// http://stackoverflow.com/a/26603875
|
|
489
|
-
code +=
|
|
490
|
-
'\n/*# sourceMappingURL=data:application/json;base64,' +
|
|
491
|
-
btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) +
|
|
492
|
-
' */';
|
|
493
|
-
}
|
|
494
|
-
if (!style.element) {
|
|
495
|
-
style.element = document.createElement('style');
|
|
496
|
-
style.element.type = 'text/css';
|
|
497
|
-
if (css.media)
|
|
498
|
-
style.element.setAttribute('media', css.media);
|
|
499
|
-
if (HEAD === undefined) {
|
|
500
|
-
HEAD = document.head || document.getElementsByTagName('head')[0];
|
|
501
|
-
}
|
|
502
|
-
HEAD.appendChild(style.element);
|
|
503
|
-
}
|
|
504
|
-
if ('styleSheet' in style.element) {
|
|
505
|
-
style.styles.push(code);
|
|
506
|
-
style.element.styleSheet.cssText = style.styles
|
|
507
|
-
.filter(Boolean)
|
|
508
|
-
.join('\n');
|
|
509
|
-
}
|
|
510
|
-
else {
|
|
511
|
-
const index = style.ids.size - 1;
|
|
512
|
-
const textNode = document.createTextNode(code);
|
|
513
|
-
const nodes = style.element.childNodes;
|
|
514
|
-
if (nodes[index])
|
|
515
|
-
style.element.removeChild(nodes[index]);
|
|
516
|
-
if (nodes.length)
|
|
517
|
-
style.element.insertBefore(textNode, nodes[index]);
|
|
518
|
-
else
|
|
519
|
-
style.element.appendChild(textNode);
|
|
520
|
-
}
|
|
521
|
-
}
|
|
522
|
-
}
|
|
523
|
-
|
|
524
1497
|
/* script */
|
|
525
1498
|
const __vue_script__ = script;
|
|
526
1499
|
|
|
@@ -732,9 +1705,10 @@ var __vue_render__ = function () {
|
|
|
732
1705
|
light: _vm.instance.light,
|
|
733
1706
|
datasource: _vm.instance.selectTypeData || {
|
|
734
1707
|
data: [
|
|
735
|
-
{ name: _vm.$t("CALENDAR_MONTH"), value: "month" },
|
|
736
|
-
{ name: _vm.$t("CALENDAR_WEEK"), value: "week" },
|
|
737
1708
|
{ name: _vm.$t("CALENDAR_DAY"), value: "day" },
|
|
1709
|
+
{ name: _vm.$t("CALENDAR_WEEK"), value: "week" },
|
|
1710
|
+
{ name: _vm.$t("CALENDAR_MONTH"), value: "month" },
|
|
1711
|
+
{ name: _vm.$t("CALENDAR_YEAR"), value: "year" },
|
|
738
1712
|
{
|
|
739
1713
|
name: _vm.$t("CALENDAR_CATEGORY"),
|
|
740
1714
|
value: "category",
|
|
@@ -766,6 +1740,14 @@ var __vue_render__ = function () {
|
|
|
766
1740
|
},
|
|
767
1741
|
[
|
|
768
1742
|
_c("v-calendar", {
|
|
1743
|
+
directives: [
|
|
1744
|
+
{
|
|
1745
|
+
name: "show",
|
|
1746
|
+
rawName: "v-show",
|
|
1747
|
+
value: !_vm.showYear,
|
|
1748
|
+
expression: "!showYear",
|
|
1749
|
+
},
|
|
1750
|
+
],
|
|
769
1751
|
ref: "calendar",
|
|
770
1752
|
attrs: {
|
|
771
1753
|
categories: _vm.instance.categories,
|
|
@@ -805,7 +1787,7 @@ var __vue_render__ = function () {
|
|
|
805
1787
|
id: _vm.instance.name,
|
|
806
1788
|
name: _vm.instance.name,
|
|
807
1789
|
start: _vm.instance.start,
|
|
808
|
-
type: _vm.
|
|
1790
|
+
type: _vm.vCalendarType,
|
|
809
1791
|
value: _vm.instance.value,
|
|
810
1792
|
now: _vm.instance.now,
|
|
811
1793
|
"show-week": _vm.instance.showWeek,
|
|
@@ -859,7 +1841,7 @@ var __vue_render__ = function () {
|
|
|
859
1841
|
},
|
|
860
1842
|
style: _vm.callDayStyle(date),
|
|
861
1843
|
},
|
|
862
|
-
[_vm._v("\n
|
|
1844
|
+
[_vm._v("\n \n ")]
|
|
863
1845
|
),
|
|
864
1846
|
]
|
|
865
1847
|
},
|
|
@@ -874,187 +1856,38 @@ var __vue_render__ = function () {
|
|
|
874
1856
|
},
|
|
875
1857
|
}),
|
|
876
1858
|
_vm._v(" "),
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
attrs: {
|
|
910
|
-
color: _vm.selectedEvent.color,
|
|
911
|
-
elevation: "0",
|
|
912
|
-
dark: "",
|
|
913
|
-
},
|
|
914
|
-
},
|
|
915
|
-
[
|
|
916
|
-
_c(
|
|
917
|
-
"zd-text",
|
|
918
|
-
_vm._b(
|
|
919
|
-
{
|
|
920
|
-
staticClass: "mx-2",
|
|
921
|
-
attrs: {
|
|
922
|
-
name: "title_" + _vm.instance.name,
|
|
923
|
-
},
|
|
924
|
-
},
|
|
925
|
-
"zd-text",
|
|
926
|
-
{
|
|
927
|
-
text: _vm.selectedEvent.name,
|
|
928
|
-
tag: "h5",
|
|
929
|
-
},
|
|
930
|
-
false
|
|
931
|
-
)
|
|
932
|
-
),
|
|
933
|
-
_vm._v(" "),
|
|
934
|
-
_c("v-spacer"),
|
|
935
|
-
_vm._v(" "),
|
|
936
|
-
_c(
|
|
937
|
-
"span",
|
|
938
|
-
[
|
|
939
|
-
_vm.callCanEditEvent(_vm.selectedEvent)
|
|
940
|
-
? _c(
|
|
941
|
-
"v-btn",
|
|
942
|
-
{
|
|
943
|
-
attrs: { icon: "" },
|
|
944
|
-
on: {
|
|
945
|
-
click: function ($event) {
|
|
946
|
-
return _vm.clickEditEvent(
|
|
947
|
-
_vm.selectedEvent,
|
|
948
|
-
$event
|
|
949
|
-
)
|
|
950
|
-
},
|
|
951
|
-
},
|
|
952
|
-
},
|
|
953
|
-
[
|
|
954
|
-
_c(
|
|
955
|
-
"v-icon",
|
|
956
|
-
{
|
|
957
|
-
on: {
|
|
958
|
-
click: function ($event) {},
|
|
959
|
-
},
|
|
960
|
-
},
|
|
961
|
-
[
|
|
962
|
-
_vm._v(
|
|
963
|
-
"\n " +
|
|
964
|
-
_vm._s(
|
|
965
|
-
_vm.$getIcon("pencil")
|
|
966
|
-
) +
|
|
967
|
-
"\n "
|
|
968
|
-
),
|
|
969
|
-
]
|
|
970
|
-
),
|
|
971
|
-
],
|
|
972
|
-
1
|
|
973
|
-
)
|
|
974
|
-
: _vm._e(),
|
|
975
|
-
_vm._v(" "),
|
|
976
|
-
_vm.callCanDeleteEvent(_vm.selectedEvent)
|
|
977
|
-
? _c(
|
|
978
|
-
"v-btn",
|
|
979
|
-
{
|
|
980
|
-
attrs: { icon: "" },
|
|
981
|
-
on: {
|
|
982
|
-
click: function ($event) {
|
|
983
|
-
return _vm.clickDeleteEvent(
|
|
984
|
-
_vm.selectedEvent,
|
|
985
|
-
$event
|
|
986
|
-
)
|
|
987
|
-
},
|
|
988
|
-
},
|
|
989
|
-
},
|
|
990
|
-
[
|
|
991
|
-
_c("v-icon", [
|
|
992
|
-
_vm._v(
|
|
993
|
-
"\n " +
|
|
994
|
-
_vm._s(_vm.$getIcon("trash")) +
|
|
995
|
-
"\n "
|
|
996
|
-
),
|
|
997
|
-
]),
|
|
998
|
-
],
|
|
999
|
-
1
|
|
1000
|
-
)
|
|
1001
|
-
: _vm._e(),
|
|
1002
|
-
],
|
|
1003
|
-
1
|
|
1004
|
-
),
|
|
1005
|
-
],
|
|
1006
|
-
1
|
|
1007
|
-
),
|
|
1008
|
-
_vm._v(" "),
|
|
1009
|
-
_c(
|
|
1010
|
-
"v-card-text",
|
|
1011
|
-
[
|
|
1012
|
-
_c(
|
|
1013
|
-
"zd-text",
|
|
1014
|
-
_vm._b(
|
|
1015
|
-
{
|
|
1016
|
-
attrs: {
|
|
1017
|
-
name: "description_" + _vm.instance.name,
|
|
1018
|
-
},
|
|
1019
|
-
},
|
|
1020
|
-
"zd-text",
|
|
1021
|
-
{
|
|
1022
|
-
text: _vm.selectedEvent.description,
|
|
1023
|
-
tag: "p",
|
|
1024
|
-
},
|
|
1025
|
-
false
|
|
1026
|
-
)
|
|
1027
|
-
),
|
|
1028
|
-
],
|
|
1029
|
-
1
|
|
1030
|
-
),
|
|
1031
|
-
_vm._v(" "),
|
|
1032
|
-
_c(
|
|
1033
|
-
"v-card-actions",
|
|
1034
|
-
[
|
|
1035
|
-
_c("zd-button", {
|
|
1036
|
-
attrs: {
|
|
1037
|
-
name: "buttonClose_" + _vm.instance.name,
|
|
1038
|
-
flat: "",
|
|
1039
|
-
color: "secondary",
|
|
1040
|
-
label: "$t(CALENDAR_CLOSE)",
|
|
1041
|
-
},
|
|
1042
|
-
on: {
|
|
1043
|
-
click: function ($event) {
|
|
1044
|
-
_vm.selectedOpen = !_vm.selectedOpen;
|
|
1045
|
-
},
|
|
1046
|
-
},
|
|
1047
|
-
}),
|
|
1048
|
-
],
|
|
1049
|
-
1
|
|
1050
|
-
),
|
|
1051
|
-
],
|
|
1052
|
-
1
|
|
1053
|
-
),
|
|
1054
|
-
],
|
|
1055
|
-
1
|
|
1056
|
-
)
|
|
1057
|
-
: _vm._e(),
|
|
1859
|
+
_c("calendar-year", {
|
|
1860
|
+
directives: [
|
|
1861
|
+
{
|
|
1862
|
+
name: "show",
|
|
1863
|
+
rawName: "v-show",
|
|
1864
|
+
value: _vm.showYear,
|
|
1865
|
+
expression: "showYear",
|
|
1866
|
+
},
|
|
1867
|
+
],
|
|
1868
|
+
attrs: { instance: _vm.instance, year: _vm.currentYear },
|
|
1869
|
+
}),
|
|
1870
|
+
_vm._v(" "),
|
|
1871
|
+
_c("calendar-event-info", {
|
|
1872
|
+
attrs: {
|
|
1873
|
+
"selected-event": _vm.selectedEvent,
|
|
1874
|
+
activator: _vm.selectedElement,
|
|
1875
|
+
instance: _vm.instance,
|
|
1876
|
+
right: "",
|
|
1877
|
+
"offset-x": "",
|
|
1878
|
+
},
|
|
1879
|
+
on: {
|
|
1880
|
+
"click:edit": _vm.clickEditEvent,
|
|
1881
|
+
"click:delete": _vm.clickDeleteEvent,
|
|
1882
|
+
},
|
|
1883
|
+
model: {
|
|
1884
|
+
value: _vm.selectedOpen,
|
|
1885
|
+
callback: function ($$v) {
|
|
1886
|
+
_vm.selectedOpen = $$v;
|
|
1887
|
+
},
|
|
1888
|
+
expression: "selectedOpen",
|
|
1889
|
+
},
|
|
1890
|
+
}),
|
|
1058
1891
|
],
|
|
1059
1892
|
1
|
|
1060
1893
|
),
|
|
@@ -1070,7 +1903,7 @@ __vue_render__._withStripped = true;
|
|
|
1070
1903
|
/* style */
|
|
1071
1904
|
const __vue_inject_styles__ = function (inject) {
|
|
1072
1905
|
if (!inject) return
|
|
1073
|
-
inject("data-v-
|
|
1906
|
+
inject("data-v-22c86241_0", { source: ".event-info__toolbar .v-toolbar__content {\n width: 100%;\n align-items: start;\n}\n.event-info .event-color-sample {\n height: 14px;\n width: 14px;\n border-radius: 4px;\n margin: 6px 0 3px 0;\n}\n.event-info__header {\n min-height: 28px;\n}\n.event-info__title {\n min-height: 28px;\n}\n.event-info__title > * {\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 3;\n line-clamp: 3;\n line-break: anywhere;\n}\n.zd-calendar {\n display: flex;\n flex-direction: column;\n}\n.zd-calendar .v-btn--fab {\n z-index: 2;\n}\n.zd-calendar-content {\n display: flex;\n overflow: auto;\n height: 100%;\n}\n.zd-calendar .zd-toolbar-calendar {\n display: flex;\n flex: 0 1 auto;\n justify-items: center;\n justify-content: space-between;\n background-color: #fff;\n padding: 0.75rem 0.5rem;\n margin: 0;\n}\n.zd-calendar .zd-toolbar-calendar.theme--dark {\n background-color: #1e1e1e;\n}\n.zd-calendar .zd-toolbar-calendar div {\n align-items: center;\n display: flex;\n}\n@media screen and (max-width: 376px) {\n.zd-calendar .zd-toolbar-calendar {\n flex-direction: column;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-nav-title,\n .zd-calendar .zd-toolbar-calendar .zd-calendar-button-today {\n max-width: 100%;\n flex: 1;\n align-items: center;\n justify-content: space-between !important;\n}\n.zd-calendar .zd-toolbar-calendar .zd-calendar-button-today button {\n width: 100%;\n margin-right: 0px !important;\n}\n}\n.zd-calendar .zd-calendar-content-title .zd-calendar-title {\n display: flex;\n flex-direction: column;\n width: 154px;\n}", map: undefined, media: undefined });
|
|
1074
1907
|
|
|
1075
1908
|
};
|
|
1076
1909
|
/* scoped */
|