@opentinyvue/vue-calendar-view 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.
@@ -6,36 +6,40 @@ import SliderButton from '@opentinyvue/vue-slider-button';
6
6
  import SliderButtonGroup from '@opentinyvue/vue-slider-button-group';
7
7
  import Tooltip from '@opentinyvue/vue-tooltip';
8
8
  import { IconCheckedSur, IconPlus, IconChevronLeft, IconChevronRight, IconDayView, IconAgendaView, IconMonthView } from '@opentinyvue/vue-icon';
9
+ import { resolveComponent, openBlock, createElementBlock, createVNode, withCtx, createElementVNode, toDisplayString, createTextVNode, renderSlot, createBlock, Fragment, renderList, resolveDynamicComponent, createCommentVNode, normalizeClass, normalizeStyle } from 'vue';
9
10
 
10
- function normalizeComponent(scriptExports, render, staticRenderFns, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
11
- var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
12
- if (render) {
13
- options.render = render;
14
- options.staticRenderFns = staticRenderFns;
15
- options._compiled = true;
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
- var hook;
18
- if (injectStyles) {
19
- hook = injectStyles;
20
- }
21
- if (hook) {
22
- if (options.functional) {
23
- options._injectStyles = hook;
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
44
  var classes = {
41
45
  "theme-blue": "text-color-brand bg-color-brand-hover-subtle border-l-2 border-color-brand",
@@ -61,7 +65,7 @@ var classes = {
61
65
  "mark-cyan": "bg-color-chart-5",
62
66
  "mark-grey": "bg-color-none"
63
67
  };
64
- var __vue2_script = defineComponent({
68
+ var _sfc_main = defineComponent({
65
69
  name: $prefix + "CalendarView",
66
70
  emits: ["update:modelValue", "new-schedule", "selected-date-change", "prev-week-click", "next-week-click", "week-change", "year-change", "month-change", "date-click", "mode-change"],
67
71
  components: {
@@ -93,410 +97,578 @@ var __vue2_script = defineComponent({
93
97
  });
94
98
  }
95
99
  });
96
- var render = function render2() {
97
- var _vm = this;
98
- var _h = _vm.$createElement;
99
- var _c = _vm._self._c || _h;
100
- return _c("div", {
101
- staticClass: "w-full h-auto",
102
- attrs: {
103
- "data-tag": "tiny-calendar-view"
104
- }
105
- }, [_c("tiny-tooltip", {
100
+ var _hoisted_1 = {
101
+ "data-tag": "tiny-calendar-view",
102
+ class: "w-full h-auto"
103
+ };
104
+ var _hoisted_2 = {
105
+ class: "p-2"
106
+ };
107
+ var _hoisted_3 = {
108
+ class: "px-1.5 mb-1.5 border-l-2 border-color-brand"
109
+ };
110
+ var _hoisted_4 = {
111
+ class: "mb-1.5 px-2 text-color-text-placeholder"
112
+ };
113
+ var _hoisted_5 = {
114
+ class: "px-2 text-color-icon-primary"
115
+ };
116
+ var _hoisted_6 = {
117
+ "data-tag": "tiny-calendar-view-today",
118
+ class: "flex justify-around items-center mb-3"
119
+ };
120
+ var _hoisted_7 = {
121
+ class: "flex-1 mx-5",
122
+ "data-tag": "tiny-calendar-view-tool"
123
+ };
124
+ var _hoisted_8 = {
125
+ key: 0,
126
+ "data-tag": "tiny-calendar-view-monthbox",
127
+ class: "shadow-sm"
128
+ };
129
+ var _hoisted_9 = {
130
+ "data-tag": "tiny-calendar-view-month",
131
+ class: "flex relative justify-around h-10 shadow-sm"
132
+ };
133
+ var _hoisted_10 = {
134
+ "data-tag": "tiny-calendar-view-monthlist",
135
+ class: "flex justify-around flex-1 h-full"
136
+ };
137
+ var _hoisted_11 = {
138
+ class: "text-sm text-color-text-primary"
139
+ };
140
+ var _hoisted_12 = {
141
+ "data-tag": "tiny-calendar-view-calendarbox",
142
+ class: "w-full overflow-hidden"
143
+ };
144
+ var _hoisted_13 = {
145
+ class: "w-full mt-0.5"
146
+ };
147
+ var _hoisted_14 = ["onClick"];
148
+ var _hoisted_15 = {
149
+ key: 0,
150
+ "data-tag": "tiny-calendar-view-multiselect",
151
+ class: "absolute top-0 right-0 bg-color-brand h-4 w-4 overflow-hidden rounded-bl-lg"
152
+ };
153
+ var _hoisted_16 = {
154
+ "data-tag": "tiny-calendar-view-timebox",
155
+ class: "overflow-y-auto scrollbar-size-0 w-full",
156
+ style: {
157
+ "max-height": "calc(100% - 26px)"
158
+ }
159
+ };
160
+ var _hoisted_17 = ["onMouseenter", "onMouseleave"];
161
+ var _hoisted_18 = {
162
+ key: 1,
163
+ "data-tag": "tiny-calendar-view-not-month",
164
+ class: "shadow-sm"
165
+ };
166
+ var _hoisted_19 = {
167
+ class: "flex justify-around items-center h-10 shadow-sm"
168
+ };
169
+ var _hoisted_20 = {
170
+ "data-tag": "tiny-calendar-view-weekdates",
171
+ class: "flex justify-around flex-1 h-full"
172
+ };
173
+ var _hoisted_21 = {
174
+ class: "w-12",
175
+ "data-tag": "tiny-calendar-view-timelinelist"
176
+ };
177
+ var _hoisted_22 = {
178
+ class: "text-sm text-color-text-primary"
179
+ };
180
+ var _hoisted_23 = {
181
+ class: "flex-1",
182
+ "data-tag": "tiny-calendar-view-timelinelist"
183
+ };
184
+ var _hoisted_24 = {
185
+ class: "w-full flex justify-around"
186
+ };
187
+ var _hoisted_25 = {
188
+ class: "flex w-full",
189
+ "data-tag": "tiny-calendar-view-schedulelist"
190
+ };
191
+ var _hoisted_26 = {
192
+ class: "px-1.5 mb-1.5 border-l-2 border-color-brand"
193
+ };
194
+ var _hoisted_27 = {
195
+ class: "mb-1.5 px-2 text-color-text-placeholder"
196
+ };
197
+ var _hoisted_28 = {
198
+ class: "px-2 text-color-icon-primary line-clamp-2"
199
+ };
200
+ var _hoisted_29 = ["onClick"];
201
+ var _hoisted_30 = {
202
+ class: "ml-1 text-color-text-placeholder"
203
+ };
204
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
205
+ var _component_tiny_tooltip = resolveComponent("tiny-tooltip");
206
+ var _component_tiny_button = resolveComponent("tiny-button");
207
+ var _component_tiny_date_picker = resolveComponent("tiny-date-picker");
208
+ var _component_tiny_slider_button = resolveComponent("tiny-slider-button");
209
+ var _component_tiny_slider_button_group = resolveComponent("tiny-slider-button-group");
210
+ var _component_icon_chevron_left = resolveComponent("icon-chevron-left");
211
+ var _component_icon_chevron_right = resolveComponent("icon-chevron-right");
212
+ var _component_icon_checked_sur = resolveComponent("icon-checked-sur");
213
+ var _component_icon_plus = resolveComponent("icon-plus");
214
+ return openBlock(), createElementBlock("div", _hoisted_1, [createVNode(_component_tiny_tooltip, {
106
215
  ref: "tooltip",
107
- attrs: {
108
- "popper-class": "absolute max-w-[theme(spacing.80)]",
109
- "manual": true,
110
- "effect": "light",
111
- "placement": "right"
112
- },
113
- scopedSlots: _vm._u([{
114
- key: "content",
115
- fn: function fn() {
116
- return [_c("div", {
117
- staticClass: "p-2"
118
- }, [_c("div", {
119
- staticClass: "px-1.5 mb-1.5 border-l-2 border-color-brand"
120
- }, [_vm._v(_vm._s(_vm.state.eventTipContent.title))]), _c("div", {
121
- staticClass: "mb-1.5 px-2 text-color-text-placeholder"
122
- }, [_vm._v(" " + _vm._s(_vm.state.eventTipContent.startDay) + " " + _vm._s(_vm.state.eventTipContent.startTime) + " ~ " + _vm._s(_vm.state.eventTipContent.endDay) + " " + _vm._s(_vm.state.eventTipContent.endTime) + " ")]), _c("p", {
123
- staticClass: "px-2 text-color-icon-primary"
124
- }, [_vm._v(_vm._s(_vm.state.eventTipContent.content || ""))])])];
125
- },
126
- proxy: true
127
- }]),
128
- model: {
129
- value: _vm.state.eventTipVisible,
130
- callback: function callback($$v) {
131
- _vm.$set(_vm.state, "eventTipVisible", $$v);
132
- },
133
- expression: "state.eventTipVisible"
134
- }
135
- }), _c("div", {
136
- staticClass: "flex justify-around items-center mb-3",
137
- attrs: {
138
- "data-tag": "tiny-calendar-view-today"
139
- }
140
- }, [_c("tiny-button", {
141
- on: {
142
- "click": _vm.toToday
143
- }
144
- }, [_vm._v(_vm._s(_vm.t("ui.calendarView.backToday")))]), _c("tiny-date-picker", {
145
- staticClass: "ml-5 shrink-0",
146
- attrs: {
147
- "shape": "filter",
148
- "type": "month",
149
- "clearable": false,
150
- "format": _vm.t("ui.calendarView.dateFormat")
151
- },
152
- on: {
153
- "change": _vm.currentDateChange
154
- },
155
- model: {
156
- value: _vm.state.currentDate,
157
- callback: function callback($$v) {
158
- _vm.$set(_vm.state, "currentDate", $$v);
159
- },
160
- expression: "state.currentDate"
161
- }
162
- }), _c("div", {
163
- staticClass: "flex-1 mx-5",
164
- attrs: {
165
- "data-tag": "tiny-calendar-view-tool"
166
- }
167
- }, [_vm._t("tool")], 2), _vm.modes.length ? _c("tiny-slider-button-group", {
168
- staticClass: "shrink-0",
169
- attrs: {
170
- "type": "icon"
171
- },
172
- model: {
173
- value: _vm.state.mode,
174
- callback: function callback($$v) {
175
- _vm.$set(_vm.state, "mode", $$v);
176
- },
177
- expression: "state.mode"
178
- }
179
- }, _vm._l(_vm.modes, function(mode) {
180
- return _c("tiny-slider-button", {
181
- key: mode,
182
- attrs: {
183
- "label": mode
184
- }
185
- }, [_c(_vm.state.modesIcon[mode], {
186
- tag: "component"
187
- })], 1);
188
- }), 1) : _vm._e()], 1), _vm.state.mode === "month" ? _c("div", {
189
- staticClass: "shadow-sm",
190
- attrs: {
191
- "data-tag": "tiny-calendar-view-monthbox"
192
- }
193
- }, [_c("div", {
194
- staticClass: "flex relative justify-around h-10 shadow-sm",
195
- attrs: {
196
- "data-tag": "tiny-calendar-view-month"
197
- }
198
- }, [_c("div", {
199
- staticClass: "absolute left-3 top-2.5 cursor-pointer",
200
- attrs: {
201
- "data-tag": "tiny-calendar-view-prevmonth"
202
- },
203
- on: {
204
- "click": _vm.goPrevMonth
205
- }
206
- }, [_c("icon-chevron-left")], 1), _c("ul", {
207
- staticClass: "flex justify-around flex-1 h-full",
208
- attrs: {
209
- "data-tag": "tiny-calendar-view-monthlist"
210
- }
211
- }, _vm._l(_vm.state.weekDays, function(day) {
212
- return _c("li", {
213
- key: day,
214
- staticClass: "leading-10",
215
- attrs: {
216
- "data-tag": "tiny-calendar-view-monthitem"
217
- }
218
- }, [_c("span", {
219
- staticClass: "text-sm text-color-text-primary"
220
- }, [_vm._v(_vm._s(_vm.t("ui.calendarView.weekDays." + day)))])]);
221
- }), 0), _c("div", {
222
- staticClass: "absolute right-3 top-2.5 cursor-pointer",
223
- attrs: {
224
- "data-tag": "tiny-calendar-view-nextmonth"
225
- },
226
- on: {
227
- "click": _vm.goNextMonth
228
- }
229
- }, [_c("icon-chevron-right")], 1)]), _c("div", {
230
- staticClass: "w-full overflow-hidden",
231
- attrs: {
232
- "data-tag": "tiny-calendar-view-calendarbox"
233
- }
234
- }, [_c("div", {
235
- staticClass: "w-full mt-0.5"
236
- }, _vm._l(_vm.state.calendar, function(item, index) {
237
- return _c("ul", {
238
- key: index,
239
- staticClass: "w-full flex justify-around border-b border-color-bg-2",
240
- attrs: {
241
- "data-tag": "tiny-calendar-view-calendarlist"
242
- }
243
- }, _vm._l(item, function(day, i) {
244
- return _c("li", {
245
- key: i,
246
- staticClass: "py-0.5 relative h-20 overflow-hidden border-r border-color-bg-2",
247
- class: _vm.m(i === 0 || i === 6 ? "bg-color-bg-6" : "bg-color-bg-1", day.isLast || day.isNext || day.disabled ? "" : _vm.isSelectedDate(day) ? "bg-color-brand-hover-subtle hover:bg-color-brand-hover-subtle" : "hover:bg-color-brand-hover-subtler", _vm.gcls("bg-" + _vm.getDayBgColor(day))),
248
- style: {
249
- "width": "14.2857%"
250
- },
251
- attrs: {
252
- "data-tag": "tiny-calendar-view-calendaritem"
253
- },
254
- on: {
255
- "click": function click($event) {
256
- return _vm.selectDay(day);
257
- }
258
- }
259
- }, [_vm.multiSelect && _vm.isSelectedDate(day) ? _c("div", {
260
- staticClass: "absolute top-0 right-0 bg-color-brand h-4 w-4 overflow-hidden rounded-bl-lg",
261
- attrs: {
262
- "data-tag": "tiny-calendar-view-multiselect"
263
- }
264
- }, [_c("icon-checked-sur", {
265
- staticClass: "fill-color-brand relative -right-px -top-0.5"
266
- })], 1) : _vm._e(), _c("div", {
267
- staticClass: "py-1.5 pl-2",
268
- class: _vm.m(day.isLast || day.isNext ? "text-color-text-primary opacity-30" : _vm.isToday(day) || _vm.isSelectedDate(day) ? "text-color-brand" : "text-color-text-primary", day.disabled ? "text-color-none-hover" : ""),
269
- attrs: {
270
- "data-tag": "tiny-calendar-view-daytag"
271
- }
272
- }, [_vm._v(" " + _vm._s(_vm.isToday(day) ? _vm.t("ui.datepicker.today") : day.value) + " ")]), _c("div", {
273
- staticClass: "overflow-y-auto scrollbar-size-0 w-full",
274
- staticStyle: {
275
- "max-height": "calc(100% - 26px)"
276
- },
277
- attrs: {
278
- "data-tag": "tiny-calendar-view-timebox"
216
+ modelValue: _ctx.state.eventTipVisible,
217
+ "onUpdate:modelValue": _cache[0] || (_cache[0] = function($event) {
218
+ return _ctx.state.eventTipVisible = $event;
219
+ }),
220
+ "popper-class": "absolute max-w-[theme(spacing.80)]",
221
+ manual: true,
222
+ effect: "light",
223
+ placement: "right"
224
+ }, {
225
+ content: withCtx(function() {
226
+ return [createElementVNode("div", _hoisted_2, [createElementVNode(
227
+ "div",
228
+ _hoisted_3,
229
+ toDisplayString(_ctx.state.eventTipContent.title),
230
+ 1
231
+ /* TEXT */
232
+ ), createElementVNode(
233
+ "div",
234
+ _hoisted_4,
235
+ toDisplayString(_ctx.state.eventTipContent.startDay) + " " + toDisplayString(_ctx.state.eventTipContent.startTime) + " ~ " + toDisplayString(_ctx.state.eventTipContent.endDay) + " " + toDisplayString(_ctx.state.eventTipContent.endTime),
236
+ 1
237
+ /* TEXT */
238
+ ), createElementVNode(
239
+ "p",
240
+ _hoisted_5,
241
+ toDisplayString(_ctx.state.eventTipContent.content || ""),
242
+ 1
243
+ /* TEXT */
244
+ )])];
245
+ }),
246
+ _: 1
247
+ /* STABLE */
248
+ }, 8, ["modelValue"]), createElementVNode("div", _hoisted_6, [createVNode(_component_tiny_button, {
249
+ onClick: _ctx.toToday
250
+ }, {
251
+ default: withCtx(function() {
252
+ return [createTextVNode(
253
+ toDisplayString(_ctx.t("ui.calendarView.backToday")),
254
+ 1
255
+ /* TEXT */
256
+ )];
257
+ }),
258
+ _: 1
259
+ /* STABLE */
260
+ }, 8, ["onClick"]), createVNode(_component_tiny_date_picker, {
261
+ modelValue: _ctx.state.currentDate,
262
+ "onUpdate:modelValue": _cache[1] || (_cache[1] = function($event) {
263
+ return _ctx.state.currentDate = $event;
264
+ }),
265
+ class: "ml-5 shrink-0",
266
+ shape: "filter",
267
+ type: "month",
268
+ clearable: false,
269
+ onChange: _ctx.currentDateChange,
270
+ format: _ctx.t("ui.calendarView.dateFormat")
271
+ }, null, 8, ["modelValue", "onChange", "format"]), createElementVNode("div", _hoisted_7, [renderSlot(_ctx.$slots, "tool")]), _ctx.modes.length ? (openBlock(), createBlock(_component_tiny_slider_button_group, {
272
+ key: 0,
273
+ modelValue: _ctx.state.mode,
274
+ "onUpdate:modelValue": _cache[2] || (_cache[2] = function($event) {
275
+ return _ctx.state.mode = $event;
276
+ }),
277
+ type: "icon",
278
+ class: "shrink-0"
279
+ }, {
280
+ default: withCtx(function() {
281
+ return [(openBlock(true), createElementBlock(
282
+ Fragment,
283
+ null,
284
+ renderList(_ctx.modes, function(mode) {
285
+ return openBlock(), createBlock(_component_tiny_slider_button, {
286
+ key: mode,
287
+ label: mode
288
+ }, {
289
+ default: withCtx(function() {
290
+ return [(openBlock(), createBlock(resolveDynamicComponent(_ctx.state.modesIcon[mode])))];
291
+ }),
292
+ _: 2
293
+ /* DYNAMIC */
294
+ }, 1032, ["label"]);
295
+ }),
296
+ 128
297
+ /* KEYED_FRAGMENT */
298
+ ))];
299
+ }),
300
+ _: 1
301
+ /* STABLE */
302
+ }, 8, ["modelValue"])) : createCommentVNode("v-if", true)]), _ctx.state.mode === "month" ? (openBlock(), createElementBlock("div", _hoisted_8, [createElementVNode("div", _hoisted_9, [createElementVNode("div", {
303
+ "data-tag": "tiny-calendar-view-prevmonth",
304
+ class: "absolute left-3 top-2.5 cursor-pointer",
305
+ onClick: _cache[3] || (_cache[3] = function() {
306
+ return _ctx.goPrevMonth && _ctx.goPrevMonth.apply(_ctx, arguments);
307
+ })
308
+ }, [createVNode(_component_icon_chevron_left)]), createElementVNode("ul", _hoisted_10, [(openBlock(true), createElementBlock(
309
+ Fragment,
310
+ null,
311
+ renderList(_ctx.state.weekDays, function(day) {
312
+ return openBlock(), createElementBlock("li", {
313
+ "data-tag": "tiny-calendar-view-monthitem",
314
+ key: day,
315
+ class: "leading-10"
316
+ }, [createElementVNode(
317
+ "span",
318
+ _hoisted_11,
319
+ toDisplayString(_ctx.t("ui.calendarView.weekDays." + day)),
320
+ 1
321
+ /* TEXT */
322
+ )]);
323
+ }),
324
+ 128
325
+ /* KEYED_FRAGMENT */
326
+ ))]), createElementVNode("div", {
327
+ "data-tag": "tiny-calendar-view-nextmonth",
328
+ class: "absolute right-3 top-2.5 cursor-pointer",
329
+ onClick: _cache[4] || (_cache[4] = function() {
330
+ return _ctx.goNextMonth && _ctx.goNextMonth.apply(_ctx, arguments);
331
+ })
332
+ }, [createVNode(_component_icon_chevron_right)])]), createElementVNode("div", _hoisted_12, [createElementVNode("div", _hoisted_13, [(openBlock(true), createElementBlock(
333
+ Fragment,
334
+ null,
335
+ renderList(_ctx.state.calendar, function(item, index) {
336
+ return openBlock(), createElementBlock("ul", {
337
+ "data-tag": "tiny-calendar-view-calendarlist",
338
+ key: index,
339
+ class: "w-full flex justify-around border-b border-color-bg-2"
340
+ }, [(openBlock(true), createElementBlock(
341
+ Fragment,
342
+ null,
343
+ renderList(item, function(day, i) {
344
+ return openBlock(), createElementBlock("li", {
345
+ "data-tag": "tiny-calendar-view-calendaritem",
346
+ key: i,
347
+ onClick: function onClick($event) {
348
+ return _ctx.selectDay(day);
349
+ },
350
+ style: {
351
+ "width": "14.2857%"
352
+ },
353
+ class: normalizeClass(["py-0.5 relative h-20 overflow-hidden border-r border-color-bg-2", _ctx.m(i === 0 || i === 6 ? "bg-color-bg-6" : "bg-color-bg-1", day.isLast || day.isNext || day.disabled ? "" : _ctx.isSelectedDate(day) ? "bg-color-brand-hover-subtle hover:bg-color-brand-hover-subtle" : "hover:bg-color-brand-hover-subtler", _ctx.gcls("bg-" + _ctx.getDayBgColor(day)))])
354
+ }, [_ctx.multiSelect && _ctx.isSelectedDate(day) ? (openBlock(), createElementBlock("div", _hoisted_15, [createVNode(_component_icon_checked_sur, {
355
+ class: "fill-color-brand relative -right-px -top-0.5"
356
+ })])) : createCommentVNode("v-if", true), createElementVNode(
357
+ "div",
358
+ {
359
+ "data-tag": "tiny-calendar-view-daytag",
360
+ class: normalizeClass(["py-1.5 pl-2", _ctx.m(day.isLast || day.isNext ? "text-color-text-primary opacity-30" : _ctx.isToday(day) || _ctx.isSelectedDate(day) ? "text-color-brand" : "text-color-text-primary", day.disabled ? "text-color-none-hover" : "")])
361
+ },
362
+ toDisplayString(_ctx.isToday(day) ? _ctx.t("ui.datepicker.today") : day.value),
363
+ 3
364
+ /* TEXT, CLASS */
365
+ ), createElementVNode("div", _hoisted_16, [(openBlock(true), createElementBlock(
366
+ Fragment,
367
+ null,
368
+ renderList(_ctx.getEventByTime(day, _ctx._constants.DAY_START_TIME, _ctx._constants.DAY_END_TIME), function(event, idx) {
369
+ return openBlock(), createElementBlock("div", {
370
+ key: idx,
371
+ onMouseenter: function onMouseenter($event) {
372
+ return _ctx.handleMouseenter($event, event);
373
+ },
374
+ onMouseleave: function onMouseleave($event) {
375
+ return _ctx.handleMouseleave($event, event);
376
+ },
377
+ class: "mb-0.5"
378
+ }, [_ctx.isStartOrEndDay("start", day.value, _ctx._constants.DAY_START_TIME, _ctx._constants.DAY_END_TIME, event) ? (openBlock(), createElementBlock(
379
+ "div",
380
+ {
381
+ key: 0,
382
+ class: normalizeClass(["pl-0.5", [event.dayNumber > 1 ? "pr-0" : "pr-0.5"]])
383
+ },
384
+ [createElementVNode(
385
+ "span",
386
+ {
387
+ "data-tag": "tiny-calendar-view-time",
388
+ class: normalizeClass(["px-1.5 inline-block rounded-sm leading-5 line-clamp-1", [_ctx.gcls("theme-" + event.theme)]])
389
+ },
390
+ toDisplayString(event.title),
391
+ 3
392
+ /* TEXT, CLASS */
393
+ )],
394
+ 2
395
+ /* CLASS */
396
+ )) : (openBlock(), createElementBlock(
397
+ "div",
398
+ {
399
+ key: 1,
400
+ "data-tag": "tiny-calendar-view-theme",
401
+ class: normalizeClass(["h-5 leading-5", [_ctx.isStartOrEndDay("end", day.value, _ctx._constants.DAY_START_TIME, _ctx._constants.DAY_END_TIME, event) ? "mr-0.5" : "mr-0", _ctx.gcls("bg-" + event.theme)]])
402
+ },
403
+ null,
404
+ 2
405
+ /* CLASS */
406
+ ))], 40, _hoisted_17);
407
+ }),
408
+ 128
409
+ /* KEYED_FRAGMENT */
410
+ ))])], 10, _hoisted_14);
411
+ }),
412
+ 128
413
+ /* KEYED_FRAGMENT */
414
+ ))]);
415
+ }),
416
+ 128
417
+ /* KEYED_FRAGMENT */
418
+ ))])])])) : (openBlock(), createElementBlock("div", _hoisted_18, [createElementVNode("div", _hoisted_19, [createElementVNode("div", {
419
+ class: "w-7 shrink-0 text-right cursor-pointer",
420
+ "data-tag": "tiny-calendar-view-prevweek",
421
+ onClick: _cache[5] || (_cache[5] = function() {
422
+ return _ctx.getPrevWeek && _ctx.getPrevWeek.apply(_ctx, arguments);
423
+ })
424
+ }, [createVNode(_component_icon_chevron_left)]), createElementVNode("ul", _hoisted_20, [(openBlock(true), createElementBlock(
425
+ Fragment,
426
+ null,
427
+ renderList(_ctx.state.weekDates, function(date, index) {
428
+ return openBlock(), createElementBlock("li", {
429
+ "data-tag": "tiny-calendar-view-weekitem",
430
+ key: date.value,
431
+ class: "leading-10"
432
+ }, [renderSlot(_ctx.$slots, "header", {
433
+ slotScope: {
434
+ date: date.value,
435
+ weekDay: _ctx.t("ui.calendarView.weekDays." + index)
279
436
  }
280
- }, _vm._l(_vm.getEventByTime(day, _vm._constants.DAY_START_TIME, _vm._constants.DAY_END_TIME), function(event, idx) {
281
- return _c("div", {
282
- key: idx,
283
- staticClass: "mb-0.5",
284
- on: {
285
- "mouseenter": function mouseenter($event) {
286
- return _vm.handleMouseenter($event, event);
437
+ }, function() {
438
+ return [createElementVNode(
439
+ "span",
440
+ {
441
+ class: normalizeClass(["relative mr-2.5 text-base", [_ctx.dateIsToday(date.value) ? "text-color-brand" : "text-color-text-primary"]])
442
+ },
443
+ [createElementVNode(
444
+ "span",
445
+ null,
446
+ toDisplayString(date.value.split("-")[2]),
447
+ 1
448
+ /* TEXT */
449
+ ), _ctx.isShowMark(date.value) ? (openBlock(), createElementBlock(
450
+ "span",
451
+ {
452
+ key: 0,
453
+ class: normalizeClass(["w-1.5 h-1.5 absolute -bottom-2 rounded-full", [date.value.split("-")[2] > 9 ? "left-2" : "left-0.5", _ctx.gcls("mark-" + _ctx.markColor)]])
287
454
  },
288
- "mouseleave": function mouseleave($event) {
289
- return _vm.handleMouseleave($event, event);
290
- }
291
- }
292
- }, [_vm.isStartOrEndDay("start", day.value, _vm._constants.DAY_START_TIME, _vm._constants.DAY_END_TIME, event) ? _c("div", {
293
- staticClass: "pl-0.5",
294
- class: [event.dayNumber > 1 ? "pr-0" : "pr-0.5"]
295
- }, [_c("span", {
296
- staticClass: "px-1.5 inline-block rounded-sm leading-5 line-clamp-1",
297
- class: [_vm.gcls("theme-" + event.theme)],
298
- attrs: {
299
- "data-tag": "tiny-calendar-view-time"
300
- }
301
- }, [_vm._v(" " + _vm._s(event.title) + " ")])]) : _c("div", {
302
- staticClass: "h-5 leading-5",
303
- class: [_vm.isStartOrEndDay("end", day.value, _vm._constants.DAY_START_TIME, _vm._constants.DAY_END_TIME, event) ? "mr-0.5" : "mr-0", _vm.gcls("bg-" + event.theme)],
304
- attrs: {
305
- "data-tag": "tiny-calendar-view-theme"
306
- }
307
- })]);
308
- }), 0)]);
309
- }), 0);
310
- }), 0)])]) : _c("div", {
311
- staticClass: "shadow-sm",
312
- attrs: {
313
- "data-tag": "tiny-calendar-view-not-month"
314
- }
315
- }, [_c("div", {
316
- staticClass: "flex justify-around items-center h-10 shadow-sm"
317
- }, [_c("div", {
318
- staticClass: "w-7 shrink-0 text-right cursor-pointer",
319
- attrs: {
320
- "data-tag": "tiny-calendar-view-prevweek"
321
- },
322
- on: {
323
- "click": _vm.getPrevWeek
324
- }
325
- }, [_c("icon-chevron-left")], 1), _c("ul", {
326
- staticClass: "flex justify-around flex-1 h-full",
327
- attrs: {
328
- "data-tag": "tiny-calendar-view-weekdates"
329
- }
330
- }, _vm._l(_vm.state.weekDates, function(date, index) {
331
- return _c("li", {
332
- key: date.value,
333
- staticClass: "leading-10",
334
- attrs: {
335
- "data-tag": "tiny-calendar-view-weekitem"
336
- }
337
- }, [_vm._t("header", function() {
338
- return [_c("span", {
339
- staticClass: "relative mr-2.5 text-base",
340
- class: [_vm.dateIsToday(date.value) ? "text-color-brand" : "text-color-text-primary"]
341
- }, [_c("span", [_vm._v(_vm._s(date.value.split("-")[2]))]), _vm.isShowMark(date.value) ? _c("span", {
342
- staticClass: "w-1.5 h-1.5 absolute -bottom-2 rounded-full",
343
- class: [date.value.split("-")[2] > 9 ? "left-2" : "left-0.5", _vm.gcls("mark-" + _vm.markColor)]
344
- }) : _vm._e()]), _c("span", {
345
- staticClass: "text-sm",
346
- class: [_vm.dateIsToday(date.value) ? "text-color-brand" : "text-color-text-placeholder"]
347
- }, [_vm._v(_vm._s(_vm.dateIsToday(date.value) ? _vm.t("ui.datepicker.today") : _vm.t("ui.calendarView.weekDays." + index)))])];
348
- }, {
349
- "slotScope": {
350
- date: date.value,
351
- weekDay: _vm.t("ui.calendarView.weekDays." + index)
352
- }
353
- })], 2);
354
- }), 0), _c("div", {
355
- staticClass: "w-7 shrink-0 text-left cursor-pointer",
356
- attrs: {
357
- "data-tag": "tiny-calendar-view-nextvweek"
358
- },
359
- on: {
360
- "click": _vm.getNextWeek
361
- }
362
- }, [_c("icon-chevron-right")], 1)]), _vm.state.mode === "timeline" ? _c("div", {
363
- staticClass: "w-full h-112 flex overflow-y-auto mt-1",
364
- style: {
365
- "height": _vm.height
455
+ null,
456
+ 2
457
+ /* CLASS */
458
+ )) : createCommentVNode("v-if", true)],
459
+ 2
460
+ /* CLASS */
461
+ ), createElementVNode(
462
+ "span",
463
+ {
464
+ class: normalizeClass(["text-sm", [_ctx.dateIsToday(date.value) ? "text-color-brand" : "text-color-text-placeholder"]])
465
+ },
466
+ toDisplayString(_ctx.dateIsToday(date.value) ? _ctx.t("ui.datepicker.today") : _ctx.t("ui.calendarView.weekDays." + index)),
467
+ 3
468
+ /* TEXT, CLASS */
469
+ )];
470
+ })]);
471
+ }),
472
+ 128
473
+ /* KEYED_FRAGMENT */
474
+ ))]), createElementVNode("div", {
475
+ "data-tag": "tiny-calendar-view-nextvweek",
476
+ class: "w-7 shrink-0 text-left cursor-pointer",
477
+ onClick: _cache[6] || (_cache[6] = function() {
478
+ return _ctx.getNextWeek && _ctx.getNextWeek.apply(_ctx, arguments);
479
+ })
480
+ }, [createVNode(_component_icon_chevron_right)])]), _ctx.state.mode === "timeline" ? (openBlock(), createElementBlock(
481
+ "div",
482
+ {
483
+ key: 0,
484
+ "data-tag": "tiny-calendar-view-timeline",
485
+ class: "w-full h-112 flex overflow-y-auto mt-1",
486
+ style: normalizeStyle({
487
+ "height": _ctx.height
488
+ })
366
489
  },
367
- attrs: {
368
- "data-tag": "tiny-calendar-view-timeline"
369
- }
370
- }, [_c("div", {
371
- staticClass: "w-12",
372
- attrs: {
373
- "data-tag": "tiny-calendar-view-timelinelist"
374
- }
375
- }, [_c("ul", _vm._l(_vm.state.dayTimes, function(item, i) {
376
- return _c("li", {
377
- key: item.time,
378
- staticClass: "h-5 text-center border-b",
379
- class: [i % 2 === 1 ? "border-color-bg-2" : "border-color-bg-1"],
380
- attrs: {
381
- "data-tag": "tiny-calendar-view-timelineitem"
382
- }
383
- }, [_c("span", {
384
- staticClass: "text-sm text-color-text-primary"
385
- }, [_vm._v(_vm._s(item.text.includes("30") ? "" : item.text))])]);
386
- }), 0)]), _c("div", {
387
- staticClass: "flex-1",
388
- attrs: {
389
- "data-tag": "tiny-calendar-view-timelinelist"
390
- }
391
- }, [_c("ul", {
392
- staticClass: "w-full flex justify-around"
393
- }, _vm._l(_vm.state.weekDates, function(date, index) {
394
- return _c("li", {
395
- key: date.value,
396
- staticClass: "relative",
397
- class: [index === 0 || index === 6 ? "bg-color-bg-6" : ""],
398
- staticStyle: {
399
- "width": "calc((100% - 10px) / 7)"
400
- },
401
- attrs: {
402
- "data-tag": "tiny-calendar-view-timelineitem"
403
- }
404
- }, [_vm._t("timeline" + (index + 1), function() {
405
- return [_c("ul", _vm._l(_vm.state.dayTimes, function(item, i) {
406
- return _c("li", {
407
- key: date.value + item.time,
408
- staticClass: "relative h-5 p-0.5 list-none border-b border-color-bg-2",
409
- class: [i % 2 === 0 ? "border-dashed" : "border-solid"]
410
- }, _vm._l(_vm.getEventByTime(date.value, item.time, _vm.state.dayTimes[i + 1] && _vm.state.dayTimes[i + 1].time), function(event, idx) {
411
- return _c("div", {
412
- key: idx,
413
- staticClass: "w-11/12 flex items-center px-1.5 absolute top-0 left-0 z-10 leading-normal rounded-sm",
414
- class: [_vm.gcls("theme-" + (event.theme || _vm.blue))],
490
+ [createElementVNode("div", _hoisted_21, [createElementVNode("ul", null, [(openBlock(true), createElementBlock(
491
+ Fragment,
492
+ null,
493
+ renderList(_ctx.state.dayTimes, function(item, i) {
494
+ return openBlock(), createElementBlock(
495
+ "li",
496
+ {
497
+ "data-tag": "tiny-calendar-view-timelineitem",
498
+ key: item.time,
499
+ class: normalizeClass(["h-5 text-center border-b", [i % 2 === 1 ? "border-color-bg-2" : "border-color-bg-1"]])
500
+ },
501
+ [createElementVNode(
502
+ "span",
503
+ _hoisted_22,
504
+ toDisplayString(item.text.includes("30") ? "" : item.text),
505
+ 1
506
+ /* TEXT */
507
+ )],
508
+ 2
509
+ /* CLASS */
510
+ );
511
+ }),
512
+ 128
513
+ /* KEYED_FRAGMENT */
514
+ ))])]), createElementVNode("div", _hoisted_23, [createElementVNode("ul", _hoisted_24, [(openBlock(true), createElementBlock(
515
+ Fragment,
516
+ null,
517
+ renderList(_ctx.state.weekDates, function(date, index) {
518
+ return openBlock(), createElementBlock(
519
+ "li",
520
+ {
521
+ "data-tag": "tiny-calendar-view-timelineitem",
522
+ key: date.value,
523
+ class: normalizeClass(["relative", [index === 0 || index === 6 ? "bg-color-bg-6" : ""]]),
415
524
  style: {
416
- "height": event.height + "px",
417
- "left": event.left + "px",
418
- "width": "calc(92% - " + event.left + "px)"
525
+ "width": "calc((100% - 10px) / 7)"
419
526
  }
420
- }, [_c("span", [_vm._v(_vm._s(event.title))])]);
421
- }), 0);
422
- }), 0)];
423
- }, {
424
- "slotScope": {
425
- date: date.value,
426
- events: _vm.state.curWeekEvents[date.value]
427
- }
428
- })], 2);
429
- }), 0)])]) : _vm._e(), _vm.state.mode === "schedule" ? _c("div", {
430
- staticClass: "w-full px-6 pb-4 overflow-y-auto h-112",
431
- style: {
432
- "height": _vm.height
527
+ },
528
+ [renderSlot(_ctx.$slots, "timeline" + (index + 1), {
529
+ slotScope: {
530
+ date: date.value,
531
+ events: _ctx.state.curWeekEvents[date.value]
532
+ }
533
+ }, function() {
534
+ return [createElementVNode("ul", null, [(openBlock(true), createElementBlock(
535
+ Fragment,
536
+ null,
537
+ renderList(_ctx.state.dayTimes, function(item, i) {
538
+ return openBlock(), createElementBlock(
539
+ "li",
540
+ {
541
+ key: date.value + item.time,
542
+ class: normalizeClass(["relative h-5 p-0.5 list-none border-b border-color-bg-2", [i % 2 === 0 ? "border-dashed" : "border-solid"]])
543
+ },
544
+ [(openBlock(true), createElementBlock(
545
+ Fragment,
546
+ null,
547
+ renderList(_ctx.getEventByTime(date.value, item.time, _ctx.state.dayTimes[i + 1] && _ctx.state.dayTimes[i + 1].time), function(event, idx) {
548
+ return openBlock(), createElementBlock(
549
+ "div",
550
+ {
551
+ key: idx,
552
+ class: normalizeClass(["w-11/12 flex items-center px-1.5 absolute top-0 left-0 z-10 leading-normal rounded-sm", [_ctx.gcls("theme-" + (event.theme || _ctx.blue))]]),
553
+ style: normalizeStyle({
554
+ "height": event.height + "px",
555
+ "left": event.left + "px",
556
+ "width": "calc(92% - " + event.left + "px)"
557
+ })
558
+ },
559
+ [createElementVNode(
560
+ "span",
561
+ null,
562
+ toDisplayString(event.title),
563
+ 1
564
+ /* TEXT */
565
+ )],
566
+ 6
567
+ /* CLASS, STYLE */
568
+ );
569
+ }),
570
+ 128
571
+ /* KEYED_FRAGMENT */
572
+ ))],
573
+ 2
574
+ /* CLASS */
575
+ );
576
+ }),
577
+ 128
578
+ /* KEYED_FRAGMENT */
579
+ ))])];
580
+ })],
581
+ 2
582
+ /* CLASS */
583
+ );
584
+ }),
585
+ 128
586
+ /* KEYED_FRAGMENT */
587
+ ))])])],
588
+ 4
589
+ /* STYLE */
590
+ )) : createCommentVNode("v-if", true), _ctx.state.mode === "schedule" ? (openBlock(), createElementBlock(
591
+ "div",
592
+ {
593
+ key: 1,
594
+ "data-tag": "tiny-calendar-view-schedule",
595
+ class: "w-full px-6 pb-4 overflow-y-auto h-112",
596
+ style: normalizeStyle({
597
+ "height": _ctx.height
598
+ })
433
599
  },
434
- attrs: {
435
- "data-tag": "tiny-calendar-view-schedule"
436
- }
437
- }, [_c("ul", {
438
- staticClass: "flex w-full",
439
- attrs: {
440
- "data-tag": "tiny-calendar-view-schedulelist"
441
- }
442
- }, _vm._l(_vm.state.weekDates, function(date, index) {
443
- return _c("li", {
444
- key: date.value,
445
- staticClass: "h-full py-3 px-2",
446
- staticStyle: {
447
- "width": "14.28%"
448
- },
449
- attrs: {
450
- "data-tag": "tiny-calendar-view-scheduleitem"
451
- }
452
- }, [_vm._t("weekday" + (index + 1), function() {
453
- return _vm._l(_vm.state.curWeekEvents[date.value] || [], function(event, idx) {
454
- return _c("div", {
455
- key: idx,
456
- staticClass: "py-1.5 h-auto border border-color-border-separator rounded mb-2 shadow-sm",
457
- attrs: {
458
- "data-tag": "tiny-calendar-view-curWeek"
600
+ [createElementVNode("ul", _hoisted_25, [(openBlock(true), createElementBlock(
601
+ Fragment,
602
+ null,
603
+ renderList(_ctx.state.weekDates, function(date, index) {
604
+ return openBlock(), createElementBlock("li", {
605
+ "data-tag": "tiny-calendar-view-scheduleitem",
606
+ key: date.value,
607
+ class: "h-full py-3 px-2",
608
+ style: {
609
+ "width": "14.28%"
459
610
  }
460
- }, [_c("div", {
461
- staticClass: "px-1.5 mb-1.5 border-l-2 border-color-brand"
462
- }, [_vm._v(_vm._s(event.title))]), _c("div", {
463
- staticClass: "mb-1.5 px-2 text-color-text-placeholder"
464
- }, [_vm._v(" " + _vm._s(_vm.getEventShowTime("start", event, date.value)) + " - " + _vm._s(_vm.getEventShowTime("end", event, date.value)) + " ")]), _c("p", {
465
- staticClass: "px-2 text-color-icon-primary line-clamp-2"
466
- }, [_vm._v(_vm._s(event.content || ""))])]);
467
- });
468
- }, {
469
- "slotScope": {
470
- date: date.value,
471
- events: _vm.state.curWeekEvents[date.value]
472
- }
473
- }), _vm.isShowNewSchedule(date.value) ? _c("div", {
474
- staticClass: "h-8 text-center leading-8 w-full mt-2 border border-color-border-separator rounded cursor-pointer",
475
- attrs: {
476
- "data-tag": "tiny-calendar-view-newschedule"
477
- },
478
- on: {
479
- "click": function click($event) {
480
- return _vm.newSchedule(date.value);
481
- }
482
- }
483
- }, [_c("icon-plus", {
484
- staticClass: "align-sub fill-color-text-placeholder"
485
- }), _c("span", {
486
- staticClass: "ml-1 text-color-text-placeholder"
487
- }, [_vm._v(_vm._s(_vm.t("ui.calendarView.new")))])], 1) : _vm._e()], 2);
488
- }), 0)]) : _vm._e()])], 1);
489
- };
490
- var staticRenderFns = [];
491
- var __cssModules = {};
492
- var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, render, staticRenderFns, false, __vue2_injectStyles);
493
- function __vue2_injectStyles(context) {
494
- for (var o in __cssModules) {
495
- this[o] = __cssModules[o];
496
- }
611
+ }, [renderSlot(_ctx.$slots, "weekday" + (index + 1), {
612
+ slotScope: {
613
+ date: date.value,
614
+ events: _ctx.state.curWeekEvents[date.value]
615
+ }
616
+ }, function() {
617
+ return [(openBlock(true), createElementBlock(
618
+ Fragment,
619
+ null,
620
+ renderList(_ctx.state.curWeekEvents[date.value] || [], function(event, idx) {
621
+ return openBlock(), createElementBlock("div", {
622
+ "data-tag": "tiny-calendar-view-curWeek",
623
+ key: idx,
624
+ class: "py-1.5 h-auto border border-color-border-separator rounded mb-2 shadow-sm"
625
+ }, [createElementVNode(
626
+ "div",
627
+ _hoisted_26,
628
+ toDisplayString(event.title),
629
+ 1
630
+ /* TEXT */
631
+ ), createElementVNode(
632
+ "div",
633
+ _hoisted_27,
634
+ toDisplayString(_ctx.getEventShowTime("start", event, date.value)) + " - " + toDisplayString(_ctx.getEventShowTime("end", event, date.value)),
635
+ 1
636
+ /* TEXT */
637
+ ), createElementVNode(
638
+ "p",
639
+ _hoisted_28,
640
+ toDisplayString(event.content || ""),
641
+ 1
642
+ /* TEXT */
643
+ )]);
644
+ }),
645
+ 128
646
+ /* KEYED_FRAGMENT */
647
+ ))];
648
+ }), _ctx.isShowNewSchedule(date.value) ? (openBlock(), createElementBlock("div", {
649
+ key: 0,
650
+ "data-tag": "tiny-calendar-view-newschedule",
651
+ class: "h-8 text-center leading-8 w-full mt-2 border border-color-border-separator rounded cursor-pointer",
652
+ onClick: function onClick($event) {
653
+ return _ctx.newSchedule(date.value);
654
+ }
655
+ }, [createVNode(_component_icon_plus, {
656
+ class: "align-sub fill-color-text-placeholder"
657
+ }), createElementVNode(
658
+ "span",
659
+ _hoisted_30,
660
+ toDisplayString(_ctx.t("ui.calendarView.new")),
661
+ 1
662
+ /* TEXT */
663
+ )], 8, _hoisted_29)) : createCommentVNode("v-if", true)]);
664
+ }),
665
+ 128
666
+ /* KEYED_FRAGMENT */
667
+ ))])],
668
+ 4
669
+ /* STYLE */
670
+ )) : createCommentVNode("v-if", true)]))]);
497
671
  }
498
- var mobileFirst = /* @__PURE__ */ function() {
499
- return __component__.exports;
500
- }();
672
+ var mobileFirst = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
501
673
 
502
674
  export { mobileFirst as default };