PluginProbe ʕ •ᴥ•ʔ
Booking for Appointments and Events Calendar – Amelia / 2.4.8
Booking for Appointments and Events Calendar – Amelia v2.4.8
2.4.8 2.4.7 2.4.6 2.4.5 2.4.4 2.4.3 2.4.2 2.4.1 2.4 trunk 1.2.1 1.2.10 1.2.11 1.2.12 1.2.13 1.2.14 1.2.15 1.2.16 1.2.17 1.2.18 1.2.19 1.2.2 1.2.20 1.2.21 1.2.22 1.2.23 1.2.24 1.2.25 1.2.26 1.2.27 1.2.28 1.2.29 1.2.3 1.2.30 1.2.31 1.2.32 1.2.33 1.2.34 1.2.35 1.2.36 1.2.37 1.2.38 1.2.4 1.2.5 1.2.6 1.2.7 1.2.8 1.2.9 2.0 2.0.1 2.0.2 2.1 2.1.1 2.1.2 2.1.3 2.2 2.2.1 2.3
ameliabooking / v3 / src / views / admin / customize / steps / Events / EventCalendar / EventsCalendar.vue
ameliabooking / v3 / src / views / admin / customize / steps / Events / EventCalendar Last commit date
EventsCalendar.vue 1 month ago
EventsCalendar.vue
5383 lines
1 <template>
2 <div
3 ref="evtCalPageRef"
4 class="am-ecs__page"
5 :class="{ 'am-tablet': pageWidth < 992 }"
6 :style="cssVars"
7 >
8 <div
9 ref="mainBlockRef"
10 class="am-ecs__main"
11 :class="{
12 'am-full-width': pageWidth < 992 || !customizeOptions.upcomingBlock.visibility,
13 }"
14 >
15 <!-- Filters -->
16 <div
17 v-if="customizeOptions.search.visibility || customizeOptions.filters.visibility"
18 ref="filtersRef"
19 class="am-ecs__filters"
20 >
21 <div class="am-ecs__filters-top">
22 <div
23 v-if="customizeOptions.search.visibility"
24 class="am-ecs__filters-search"
25 :class="filterResponsiveClass"
26 >
27 <AmInput
28 v-model="eventSearch"
29 :placeholder="`${labelsDisplay('event_search')}...`"
30 :prefix-icon="iconSearch"
31 size="small"
32 />
33 </div>
34 <div
35 v-if="customizeOptions.filters.visibility"
36 class="am-ecs__filters-btn"
37 :class="[{ 'am-single': !customizeOptions.search.visibility }, filterResponsiveClass]"
38 >
39 <AmButton
40 :icon="filterIcon"
41 :icon-only="filtersWidth <= 500"
42 custom-class="am-ecs__filters-btn__inner"
43 category="secondary"
44 type="plain"
45 size="small"
46 @click="filtersMenuVisibility = !filtersMenuVisibility"
47 >
48 <span class="am-icon-filter"></span>
49 <span v-if="filtersWidth > 500">{{ labelsDisplay('event_filters') }}</span>
50 </AmButton>
51 </div>
52 </div>
53
54 <Transition name="am-slide-fade">
55 <div
56 v-if="filtersMenuVisibility"
57 class="am-ecs__filters-menu"
58 :class="filterResponsiveClass"
59 >
60 <div
61 v-if="amSettings.featuresIntegrations.eventTags.enabled"
62 class="am-ecs__filters-menu__items"
63 :class="[filterResponsiveClass, filterClassWidth.tag]"
64 >
65 <AmSelect
66 v-model="tagFilter"
67 clearable
68 size="small"
69 :filterable="false"
70 :multiple="true"
71 :collapse-tags="true"
72 :placeholder="labelsDisplay('event_type')"
73 :prefix-icon="tagFilter.length ? '' : iconType"
74 >
75 <AmOption
76 v-for="(tag, index) in tags"
77 :key="index"
78 :value="tag.name"
79 :label="tag.name"
80 >
81 </AmOption>
82 </AmSelect>
83 </div>
84 <div
85 v-if="locations.length > 0"
86 class="am-ecs__filters-menu__items"
87 :class="[filterResponsiveClass, filterClassWidth.location]"
88 >
89 <AmSelect
90 v-model="locationFilter"
91 clearable
92 size="small"
93 :filterable="false"
94 :multiple="true"
95 :collapse-tags="true"
96 :placeholder="labelsDisplay('event_location')"
97 :prefix-icon="locationFilter.length ? '' : iconLocation"
98 >
99 <AmOption
100 v-for="location in locations"
101 :key="location.id"
102 :value="location.id"
103 :label="location.name"
104 >
105 </AmOption>
106 </AmSelect>
107 </div>
108 <div
109 v-if="employees.length > 0"
110 class="am-ecs__filters-menu__items"
111 :class="[filterResponsiveClass, filterClassWidth.employee]"
112 >
113 <AmSelect
114 v-model="employeeFilter"
115 clearable
116 size="small"
117 :filterable="false"
118 :multiple="true"
119 :collapse-tags="true"
120 :placeholder="labelsDisplay('event_employee')"
121 :prefix-icon="employeeFilter.length ? '' : iconEmployee"
122 >
123 <AmOption
124 v-for="emp in employees"
125 :key="emp.id"
126 :value="emp.id"
127 :label="`${emp.firstName} ${emp.lastName}`"
128 >
129 </AmOption>
130 </AmSelect>
131 </div>
132 <div
133 class="am-ecs__filters-menu__items"
134 :class="[filterResponsiveClass, filterClassWidth.status]"
135 >
136 <AmSelect
137 v-model="statusFilter"
138 clearable
139 size="small"
140 :filterable="false"
141 :multiple="true"
142 :collapse-tags="true"
143 :placeholder="labelsDisplay('event_status')"
144 :prefix-icon="statusFilter.length ? '' : iconStatus"
145 @change="selectEventStatus"
146 >
147 <AmOption
148 v-for="status in evtStatus"
149 :key="status.toLowerCase()"
150 :value="status.toLowerCase()"
151 :label="labelsDisplay(status.toLowerCase())"
152 >
153 </AmOption>
154 </AmSelect>
155 </div>
156 </div>
157 </Transition>
158 </div>
159 <!-- /Filters -->
160
161 <!-- Header -->
162 <div ref="headerRef" class="am-ecs__header">
163 <div class="am-ecs__header-inner" :class="responsiveCalClass">
164 <div class="am-ecs__header-actions">
165 <AmButton
166 custom-class="am-ecs__header-today"
167 category="secondary"
168 type="plain"
169 size="small"
170 @click="calendarChangeMonth('today')"
171 >
172 {{ labelsDisplay('event_today') }}
173 </AmButton>
174 <AmButton
175 custom-class="am-ecs__header-prev"
176 :icon-only="true"
177 :icon="iconArrLeft"
178 category="secondary"
179 type="plain"
180 size="small"
181 @click="calendarChangeMonth('prev')"
182 />
183 <AmButton
184 custom-class="am-ecs__header-next"
185 :icon-only="true"
186 :icon="iconArrRight"
187 category="secondary"
188 type="plain"
189 size="small"
190 @click="calendarChangeMonth('next')"
191 />
192 </div>
193 <div class="am-ecs__header-text">
194 {{ headerTitle }}
195 </div>
196 </div>
197 <div class="am-ecs__header-selection" :class="responsiveCalClass">
198 <AmSelect v-model="selectedMonth" size="small" @change="dateSelection">
199 <AmOption
200 v-for="month in dropdownMonths"
201 :key="month.value"
202 :value="month.value"
203 :label="month.label"
204 ></AmOption>
205 </AmSelect>
206 <AmSelect v-model="selectedYear" size="small" @change="dateSelection">
207 <AmOption v-for="year in dropdownYears" :key="year.value" :value="year.value">
208 </AmOption>
209 </AmSelect>
210 </div>
211 </div>
212 <!-- /Header -->
213
214 <!-- Calendar -->
215 <div class="am-ecs">
216 <FullCalendar ref="eventCalendarRef" :options="calendarOptions"> </FullCalendar>
217 </div>
218 <!-- /Calendar -->
219 </div>
220 <div
221 v-if="customizeOptions.upcomingBlock.visibility"
222 ref="sideRef"
223 class="am-ecs__side"
224 :class="{ 'am-full-width': pageWidth < 992 }"
225 >
226 <div ref="sideHeaderRef" class="am-ecs__side-header">
227 <div class="am-ecs__side-header__text">
228 {{ labelsDisplay('event_upcoming_events') }}
229 </div>
230 <div class="am-ecs__side-header__range">
231 <div>
232 {{
233 `${translationObject[`month${moment(upcomingRange[0]).format('M')}`]}
234 ${moment(upcomingRange[0]).format('YYYY')}`
235 }}
236 </div>
237 </div>
238 <div class="am-ecs__side-header__actions">
239 <AmButton
240 custom-class="am-ecs__side-header__btn"
241 :icon-only="true"
242 :icon="iconArrLeft"
243 category="secondary"
244 type="plain"
245 size="small"
246 :disabled="upcomingNumber === 1"
247 />
248 <AmButton
249 custom-class="am-ecs__side-header__btn"
250 :icon-only="true"
251 :icon="iconArrRight"
252 category="secondary"
253 type="plain"
254 size="small"
255 />
256 </div>
257 </div>
258
259 <div v-if="features.waitingList" ref="sideTabRef" class="am-ecs__side-tab">
260 <div
261 v-for="(item, index) in sideTabs"
262 :key="index"
263 class="am-ecs__side-tab__item"
264 :class="[{ 'am-active': activeTabIndex === index }, item.class]"
265 @click="() => (activeTabIndex = index)"
266 >
267 {{ item.title }}
268 </div>
269 </div>
270
271 <div
272 class="am-ecs__side-main"
273 :class="sideResponsiveClass"
274 :style="pageWidth > 991 ? { height: `${sideBlockHeight}px` } : {}"
275 >
276 <template v-if="activeTabIndex === 0">
277 <div
278 v-for="evt in upcomingEvents"
279 :key="evt.id"
280 class="am-ecs__side-card"
281 :class="sideResponsiveClass"
282 :style="{
283 '--am-c-evt': evt.color,
284 '--am-c-evt-op05': useColorTransparency(evt.color, 0.05),
285 }"
286 >
287 <div class="am-ecs__side-card__header">
288 <span v-if="multipleDaysEvent(evt.periods)" class="am-ecs__side-card__begins">
289 {{ labelsDisplay('event_begins') }}
290 </span>
291 <span v-if="customizeOptions.price.visibility" class="am-ecs__side-card__price">
292 {{ calculatedEventPrice(evt) }}
293 <template v-if="taxVisibility">
294 {{
295 amSettings.payments?.taxes?.excluded
296 ? ` +${labelsDisplay('total_tax_colon')}`
297 : ` ${labelsDisplay('incl_tax')}`
298 }}
299 </template>
300 </span>
301 </div>
302 <div class="am-ecs__side-card__date-time">
303 <span class="am-ecs__side-card__day">
304 {{ moment(evt.periods?.[0]?.periodStart?.split(' ')?.[0] || '').format('DD') }}
305 </span>
306 <span class="am-ecs__side-card__month">
307 {{
308 translationObject.months[
309 moment(evt.periods?.[0]?.periodStart?.split(' ')?.[0] || '')
310 .format('MMM')
311 .toLowerCase()
312 ]?.toUpperCase() || ''
313 }},
314 </span>
315 <span class="am-ecs__side-card__year">
316 {{ moment(evt.periods?.[0]?.periodStart?.split(' ')?.[0] || '').format('YYYY') }}
317 </span>
318 <span class="am-ecs__side-card__at">{{ labelsDisplay('event_at') }}</span>
319 <span class="am-ecs__side-card__time">
320 {{
321 getEventFrontedFormattedTime(evt.periods?.[0]?.periodStart?.split(' ')?.[1] || '')
322 }}
323 </span>
324 </div>
325 <div class="am-ecs__side-card__name">
326 {{ evt.name }}
327 </div>
328 <div v-if="customizeOptions.location.visibility" class="am-ecs__side-card__location">
329 {{ useEventLocation(evt, locations) }}
330 </div>
331 <div
332 v-if="customizeOptions.status.visibility || customizeOptions.capacity.visibility"
333 class="am-ecs__side-card__footer"
334 >
335 <div
336 v-if="customizeOptions.status.visibility"
337 class="am-ecs__side-card__status"
338 :class="`am-${useEventStatus(evt)}`"
339 >
340 {{ labelsDisplay(useEventStatus(evt)) }}
341 </div>
342 <div v-if="customizeOptions.capacity.visibility" class="am-ecs__side-card__spots">
343 <span v-if="placesCalculation(evt)" class="am-ecs__side-card__spots-numb">
344 {{ placesCalculation(evt) }}
345 </span>
346 <span class="am-ecs__side-card__spots-text">
347 {{ eventPlacesBlock(evt) }}
348 </span>
349 </div>
350 </div>
351 </div>
352 </template>
353
354 <template v-if="activeTabIndex === 1">
355 <div
356 v-for="evt in waitingEvents"
357 :key="evt.id"
358 class="am-ecs__side-card"
359 :class="sideResponsiveClass"
360 :style="{
361 '--am-c-evt': evt.color,
362 '--am-c-evt-op05': useColorTransparency(evt.color, 0.05),
363 }"
364 >
365 <div class="am-ecs__side-card__header">
366 <span v-if="multipleDaysEvent(evt.periods)" class="am-ecs__side-card__begins">
367 {{ labelsDisplay('event_begins') }}
368 </span>
369 <span v-if="customizeOptions.price.visibility" class="am-ecs__side-card__price">
370 {{ calculatedEventPrice(evt) }}
371 <template v-if="taxVisibility">
372 {{
373 amSettings.payments?.taxes?.excluded
374 ? ` +${labelsDisplay('total_tax_colon')}`
375 : ` ${labelsDisplay('incl_tax')}`
376 }}
377 </template>
378 </span>
379 </div>
380 <div class="am-ecs__side-card__date-time">
381 <span class="am-ecs__side-card__day">
382 {{ moment(evt.periods?.[0]?.periodStart?.split(' ')?.[0] || '').format('DD') }}
383 </span>
384 <span class="am-ecs__side-card__month">
385 {{
386 translationObject.months[
387 moment(evt.periods?.[0]?.periodStart?.split(' ')?.[0] || '')
388 .format('MMM')
389 .toLowerCase()
390 ]?.toUpperCase() || ''
391 }},
392 </span>
393 <span class="am-ecs__side-card__year">
394 {{ moment(evt.periods?.[0]?.periodStart?.split(' ')?.[0] || '').format('YYYY') }}
395 </span>
396 <span class="am-ecs__side-card__at">{{ labelsDisplay('event_at') }}</span>
397 <span class="am-ecs__side-card__time">
398 {{
399 getEventFrontedFormattedTime(evt.periods?.[0]?.periodStart?.split(' ')?.[1] || '')
400 }}
401 </span>
402 </div>
403 <div class="am-ecs__side-card__name">
404 {{ evt.name }}
405 </div>
406 <div v-if="customizeOptions.location.visibility" class="am-ecs__side-card__location">
407 {{ useEventLocation(evt, locations) }}
408 </div>
409 <div
410 v-if="customizeOptions.status.visibility || customizeOptions.capacity.visibility"
411 class="am-ecs__side-card__footer"
412 >
413 <div
414 v-if="customizeOptions.status.visibility"
415 class="am-ecs__side-card__status am-waiting"
416 >
417 {{ labelsDisplay('waiting_list') }}
418 </div>
419 <div v-if="customizeOptions.capacity.visibility" class="am-ecs__side-card__spots">
420 <span v-if="placesCalculation(evt)" class="am-ecs__side-card__spots-numb">
421 {{ placesCalculation(evt) }}
422 </span>
423 <span class="am-ecs__side-card__spots-text">
424 {{
425 placesCalculation(evt) === 1
426 ? labelsDisplay('person_waiting')
427 : labelsDisplay('people_waiting')
428 }}
429 </span>
430 </div>
431 </div>
432 </div>
433 </template>
434 </div>
435 </div>
436 </div>
437 </template>
438
439 <script setup>
440 // * Libraries
441 import moment from 'moment'
442 import FullCalendar from '@fullcalendar/vue3'
443 import dayGridPlugin from '@fullcalendar/daygrid'
444 import interactionPlugin from '@fullcalendar/interaction'
445 import allLocales from '@fullcalendar/core/locales-all'
446
447 // * Import from Vue
448 import {
449 computed,
450 inject,
451 nextTick,
452 onMounted,
453 ref,
454 watch,
455 watchEffect,
456 onBeforeUnmount,
457 } from 'vue'
458
459 // * Components Width and Height
460 import { useElementSize } from '@vueuse/core'
461
462 // * Composables
463 import {
464 getEventFrontedFormattedTime,
465 getFirstDayOfWeek,
466 } from '../../../../../../assets/js/common/date'
467 import { useColorTransparency } from '../../../../../../assets/js/common/colorManipulation'
468 import { useResponsiveClass } from '../../../../../../assets/js/common/responsive'
469 import { elementPlusTranslations } from '../../../../../../assets/js/common/translationsElementPlus'
470 import {
471 useCheckIfEventNotFree,
472 useEventLocation,
473 useEventStatus,
474 useMinTicketPrice,
475 } from '../../../../../../assets/js/public/events'
476 import { useFormattedPrice } from '../../../../../../assets/js/common/formatting'
477 import { useReactiveCustomize } from '../../../../../../assets/js/admin/useReactiveCustomize.js'
478
479 // * Structure Components
480 import AmButton from '../../../../../_components/button/AmButton.vue'
481 import IconComponent from '../../../../../_components/icons/IconComponent.vue'
482 import AmSelect from '../../../../../_components/select/AmSelect.vue'
483 import AmOption from '../../../../../_components/select/AmOption.vue'
484 import AmInput from '../../../../../_components/input/AmInput.vue'
485
486 // * Licence
487 let licence = inject('licence')
488
489 // * Features
490 let features = inject('features')
491
492 // * Root Settings
493 let amSettings = inject('settings')
494
495 // * Calendar page Reference
496 const evtCalPageRef = ref(null)
497 const { width: pageWidth } = useElementSize(evtCalPageRef)
498
499 // * Main Wrapper Reference
500 const mainBlockRef = ref(null)
501 const { width: mainWidth } = useElementSize(mainBlockRef)
502
503 let responsiveCalClass = computed(() => {
504 return useResponsiveClass(mainWidth.value)
505 })
506
507 // * Calendar Reference
508 const eventCalendarRef = ref(null)
509 const { width: calWidth, height: calHeight } = useElementSize(eventCalendarRef)
510
511 // * Filters Reference
512 let filtersRef = ref(null)
513 const { width: filtersWidth, height: filtersHeight } = useElementSize(filtersRef)
514 let filterResponsiveClass = computed(() => useResponsiveClass(filtersWidth.value))
515
516 // * Header Reference
517 let headerRef = ref(null)
518 const { height: headerHeight } = useElementSize(headerRef)
519
520 // * Sidebar Reference
521 let sideRef = ref(null)
522 const { width: sideWidth } = useElementSize(sideRef)
523 let sideResponsiveClass = computed(() => useResponsiveClass(sideWidth.value))
524
525 // * Sidebar Header Reference
526 let sideHeaderRef = ref(null)
527 const { height: sideHeaderHeight } = useElementSize(sideHeaderRef)
528
529 // * Sidebar Tabs Reference
530 let sideTabRef = ref(null)
531 const { height: sideTabHeight } = useElementSize(sideTabRef)
532
533 // * Calendar Loader Height
534 let calLoaderHeight = ref(0)
535
536 // * Side Block Height
537 let sideBlockHeight = ref(0)
538
539 /// * Customize
540 const { amCustomize } = useReactiveCustomize()
541
542 // * Options
543 let customizeOptions = computed(() => {
544 return amCustomize.value.ecf.calendar.options
545 })
546
547 let langKey = inject('langKey')
548 let amLabels = inject('labels')
549
550 // * This object contains translations for months days etc
551 let translationObject = computed(() => elementPlusTranslations(langKey.value).el.datepicker)
552
553 function labelsDisplay(label) {
554 let computedLabel = computed(() => {
555 let translations = amCustomize.value.ecf.calendar.translations
556 return translations && translations[label] && translations[label][langKey.value]
557 ? translations[label][langKey.value]
558 : amLabels[label]
559 })
560
561 return computedLabel.value
562 }
563
564 // * Base Urls
565 const baseUrls = inject('baseUrls')
566
567 // * Events array
568 let events = computed(() => [
569 {
570 id: 1,
571 bookable: false,
572 color: '#1788FB',
573 opened: true,
574 full: false,
575 closed: false,
576 description:
577 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
578 fullPayment: false,
579 gallery: [
580 {
581 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
582 },
583 {
584 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
585 },
586 {
587 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
588 },
589 {
590 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
591 },
592 {
593 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
594 },
595 ],
596 locationId: 1,
597 customPricing: true,
598 customTickets: [
599 {
600 enabled: true,
601 id: 1,
602 eventId: 1,
603 name: 'Ticket one',
604 price: 10,
605 sold: 0,
606 spots: 20,
607 },
608 {
609 enabled: true,
610 id: 2,
611 eventId: 1,
612 name: 'Ticket two',
613 price: 50,
614 sold: 0,
615 spots: 20,
616 },
617 {
618 enabled: true,
619 id: 2,
620 eventId: 1,
621 name: 'Ticket three',
622 price: 100,
623 sold: 0,
624 spots: 20,
625 },
626 ],
627 depositPerPerson: true,
628 depositPayment: 'percentage',
629 deposit: 10,
630 maxCapacity: 9,
631 maxCustomCapacity: null,
632 maxExtraPeople: 3,
633 name: 'Event 1',
634 organizerId: 1,
635 periods: [
636 {
637 id: 1,
638 eventId: 1,
639 periodStart: moment()
640 .startOf('month')
641 .subtract(2, 'days')
642 .add(5, 'hours')
643 .format('YYYY-MM-DD hh:mm:ss'),
644 periodEnd: moment()
645 .startOf('month')
646 .add(2, 'days')
647 .add(10, 'hours')
648 .format('YYYY-MM-DD hh:mm:ss'),
649 },
650 ],
651 pictureFullPath: null,
652 pictureThumbPath: null,
653 places: 30,
654 price: 10,
655 providers: [],
656 show: true,
657 status: 'approved',
658 tags: [{}],
659 },
660 {
661 id: 2,
662 bookable: true,
663 color: '#4bbec6',
664 opened: true,
665 full: true,
666 closed: false,
667 description:
668 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
669 fullPayment: false,
670 gallery: [
671 {
672 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
673 },
674 {
675 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
676 },
677 {
678 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
679 },
680 {
681 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
682 },
683 {
684 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
685 },
686 ],
687 locationId: 1,
688 customPricing: true,
689 customTickets: [
690 {
691 enabled: true,
692 id: 1,
693 eventId: 1,
694 name: 'Ticket one',
695 price: 10,
696 sold: 0,
697 spots: 20,
698 },
699 {
700 enabled: true,
701 id: 2,
702 eventId: 1,
703 name: 'Ticket two',
704 price: 50,
705 sold: 0,
706 spots: 20,
707 },
708 {
709 enabled: true,
710 id: 2,
711 eventId: 1,
712 name: 'Ticket three',
713 price: 100,
714 sold: 0,
715 spots: 20,
716 },
717 ],
718 depositPerPerson: true,
719 depositPayment: 'percentage',
720 deposit: 10,
721 maxCapacity: 9,
722 maxCustomCapacity: null,
723 maxExtraPeople: 3,
724 name: 'Event 2',
725 organizerId: 1,
726 periods: [
727 {
728 id: 1,
729 eventId: 1,
730 periodStart: moment()
731 .startOf('month')
732 .add(6, 'days')
733 .add(5, 'hours')
734 .format('YYYY-MM-DD hh:mm:ss'),
735 periodEnd: moment()
736 .startOf('month')
737 .add(8, 'days')
738 .add(10, 'hours')
739 .format('YYYY-MM-DD hh:mm:ss'),
740 },
741 ],
742 pictureFullPath: null,
743 pictureThumbPath: null,
744 places: 30,
745 price: 10,
746 providers: [],
747 show: true,
748 status: 'approved',
749 tags: [{}],
750 },
751 {
752 id: 3,
753 bookable: true,
754 color: '#fbc22d',
755 opened: true,
756 full: false,
757 closed: false,
758 description:
759 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
760 fullPayment: false,
761 gallery: [
762 {
763 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
764 },
765 {
766 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
767 },
768 {
769 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
770 },
771 {
772 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
773 },
774 {
775 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
776 },
777 ],
778 locationId: 1,
779 customPricing: true,
780 customTickets: [
781 {
782 enabled: true,
783 id: 1,
784 eventId: 1,
785 name: 'Ticket one',
786 price: 10,
787 sold: 0,
788 spots: 20,
789 },
790 {
791 enabled: true,
792 id: 2,
793 eventId: 1,
794 name: 'Ticket two',
795 price: 50,
796 sold: 0,
797 spots: 20,
798 },
799 {
800 enabled: true,
801 id: 2,
802 eventId: 1,
803 name: 'Ticket three',
804 price: 100,
805 sold: 0,
806 spots: 20,
807 },
808 ],
809 depositPerPerson: true,
810 depositPayment: 'percentage',
811 deposit: 10,
812 maxCapacity: 9,
813 maxCustomCapacity: null,
814 maxExtraPeople: 3,
815 name: 'Event 3',
816 organizerId: 1,
817 periods: [
818 {
819 id: 1,
820 eventId: 1,
821 periodStart: moment()
822 .startOf('month')
823 .add(8, 'days')
824 .add(5, 'hours')
825 .format('YYYY-MM-DD hh:mm:ss'),
826 periodEnd: moment()
827 .startOf('month')
828 .add(10, 'days')
829 .add(10, 'hours')
830 .format('YYYY-MM-DD hh:mm:ss'),
831 },
832 ],
833 pictureFullPath: null,
834 pictureThumbPath: null,
835 places: 30,
836 price: 10,
837 providers: [],
838 show: true,
839 status: 'approved',
840 tags: [{}],
841 },
842 {
843 id: 4,
844 bookable: true,
845 color: '#FA3C52',
846 opened: true,
847 full: false,
848 closed: false,
849 description:
850 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
851 fullPayment: false,
852 gallery: [
853 {
854 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
855 },
856 {
857 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
858 },
859 {
860 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
861 },
862 {
863 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
864 },
865 {
866 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
867 },
868 ],
869 locationId: 1,
870 customPricing: true,
871 customTickets: [
872 {
873 enabled: true,
874 id: 1,
875 eventId: 1,
876 name: 'Ticket one',
877 price: 10,
878 sold: 0,
879 spots: 20,
880 },
881 {
882 enabled: true,
883 id: 2,
884 eventId: 1,
885 name: 'Ticket two',
886 price: 50,
887 sold: 0,
888 spots: 20,
889 },
890 {
891 enabled: true,
892 id: 2,
893 eventId: 1,
894 name: 'Ticket three',
895 price: 100,
896 sold: 0,
897 spots: 20,
898 },
899 ],
900 depositPerPerson: true,
901 depositPayment: 'percentage',
902 deposit: 10,
903 maxCapacity: 9,
904 maxCustomCapacity: null,
905 maxExtraPeople: 3,
906 name: 'Event 4',
907 organizerId: 1,
908 periods: [
909 {
910 id: 1,
911 eventId: 1,
912 periodStart: moment()
913 .startOf('month')
914 .add(10, 'days')
915 .add(5, 'hours')
916 .format('YYYY-MM-DD hh:mm:ss'),
917 periodEnd: moment()
918 .startOf('month')
919 .add(11, 'days')
920 .add(10, 'hours')
921 .format('YYYY-MM-DD hh:mm:ss'),
922 },
923 ],
924 pictureFullPath: null,
925 pictureThumbPath: null,
926 places: 30,
927 price: 10,
928 providers: [],
929 show: true,
930 status: 'approved',
931 tags: [{}],
932 },
933 {
934 id: 5,
935 bookable: false,
936 color: '#D696B8',
937 opened: true,
938 full: false,
939 closed: false,
940 cancelable: true,
941 description:
942 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
943 fullPayment: false,
944 gallery: [
945 {
946 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
947 },
948 {
949 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
950 },
951 {
952 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
953 },
954 {
955 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
956 },
957 {
958 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
959 },
960 ],
961 locationId: 1,
962 customPricing: true,
963 customTickets: [
964 {
965 enabled: true,
966 id: 1,
967 eventId: 1,
968 name: 'Ticket one',
969 price: 10,
970 sold: 0,
971 spots: 20,
972 },
973 {
974 enabled: true,
975 id: 2,
976 eventId: 1,
977 name: 'Ticket two',
978 price: 50,
979 sold: 0,
980 spots: 20,
981 },
982 {
983 enabled: true,
984 id: 2,
985 eventId: 1,
986 name: 'Ticket three',
987 price: 100,
988 sold: 0,
989 spots: 20,
990 },
991 ],
992 depositPerPerson: true,
993 depositPayment: 'percentage',
994 deposit: 10,
995 maxCapacity: 9,
996 maxCustomCapacity: null,
997 maxExtraPeople: 3,
998 name: 'Event 5',
999 organizerId: 1,
1000 periods: [
1001 {
1002 id: 1,
1003 eventId: 1,
1004 periodStart: moment()
1005 .startOf('month')
1006 .add(12, 'days')
1007 .add(5, 'hours')
1008 .format('YYYY-MM-DD hh:mm:ss'),
1009 periodEnd: moment()
1010 .startOf('month')
1011 .add(14, 'days')
1012 .add(10, 'hours')
1013 .format('YYYY-MM-DD hh:mm:ss'),
1014 },
1015 ],
1016 pictureFullPath: null,
1017 pictureThumbPath: null,
1018 places: 30,
1019 price: 10,
1020 providers: [],
1021 show: true,
1022 status: 'rejected',
1023 tags: [{}],
1024 },
1025 {
1026 id: 6,
1027 bookable: false,
1028 color: '#689BCA',
1029 opened: false,
1030 full: false,
1031 closed: false,
1032 upcoming: true,
1033 description:
1034 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1035 fullPayment: false,
1036 gallery: [
1037 {
1038 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1039 },
1040 {
1041 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1042 },
1043 {
1044 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1045 },
1046 {
1047 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1048 },
1049 {
1050 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1051 },
1052 ],
1053 locationId: 1,
1054 customPricing: true,
1055 customTickets: [
1056 {
1057 enabled: true,
1058 id: 1,
1059 eventId: 1,
1060 name: 'Ticket one',
1061 price: 10,
1062 sold: 0,
1063 spots: 20,
1064 },
1065 {
1066 enabled: true,
1067 id: 2,
1068 eventId: 1,
1069 name: 'Ticket two',
1070 price: 50,
1071 sold: 0,
1072 spots: 20,
1073 },
1074 {
1075 enabled: true,
1076 id: 2,
1077 eventId: 1,
1078 name: 'Ticket three',
1079 price: 100,
1080 sold: 0,
1081 spots: 20,
1082 },
1083 ],
1084 depositPerPerson: true,
1085 depositPayment: 'percentage',
1086 deposit: 10,
1087 maxCapacity: 9,
1088 maxCustomCapacity: null,
1089 maxExtraPeople: 3,
1090 name: 'Event 6',
1091 organizerId: 1,
1092 periods: [
1093 {
1094 id: 1,
1095 eventId: 1,
1096 periodStart: moment()
1097 .startOf('month')
1098 .add(15, 'days')
1099 .add(5, 'hours')
1100 .format('YYYY-MM-DD hh:mm:ss'),
1101 periodEnd: moment()
1102 .startOf('month')
1103 .add(15, 'days')
1104 .add(10, 'hours')
1105 .format('YYYY-MM-DD hh:mm:ss'),
1106 },
1107 ],
1108 pictureFullPath: null,
1109 pictureThumbPath: null,
1110 places: 30,
1111 price: 10,
1112 providers: [],
1113 show: true,
1114 status: 'approved',
1115 tags: [{}],
1116 },
1117 {
1118 id: 7,
1119 bookable: true,
1120 color: '#26CC2B',
1121 opened: true,
1122 full: false,
1123 closed: false,
1124 description:
1125 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1126 fullPayment: false,
1127 gallery: [
1128 {
1129 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1130 },
1131 {
1132 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1133 },
1134 {
1135 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1136 },
1137 {
1138 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1139 },
1140 {
1141 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1142 },
1143 ],
1144 locationId: 1,
1145 customPricing: false,
1146 customTickets: [
1147 {
1148 enabled: true,
1149 id: 1,
1150 eventId: 1,
1151 name: 'Ticket one',
1152 price: 10,
1153 sold: 0,
1154 spots: 20,
1155 },
1156 {
1157 enabled: true,
1158 id: 2,
1159 eventId: 1,
1160 name: 'Ticket two',
1161 price: 50,
1162 sold: 0,
1163 spots: 20,
1164 },
1165 {
1166 enabled: true,
1167 id: 2,
1168 eventId: 1,
1169 name: 'Ticket three',
1170 price: 100,
1171 sold: 0,
1172 spots: 20,
1173 },
1174 ],
1175 depositPerPerson: true,
1176 depositPayment: 'percentage',
1177 deposit: 10,
1178 maxCapacity: 9,
1179 maxCustomCapacity: null,
1180 maxExtraPeople: 3,
1181 name: 'Event 7',
1182 organizerId: 1,
1183 periods: [
1184 {
1185 id: 1,
1186 eventId: 1,
1187 periodStart: moment()
1188 .startOf('month')
1189 .add(16, 'days')
1190 .add(5, 'hours')
1191 .format('YYYY-MM-DD hh:mm:ss'),
1192 periodEnd: moment()
1193 .startOf('month')
1194 .add(17, 'days')
1195 .add(10, 'hours')
1196 .format('YYYY-MM-DD hh:mm:ss'),
1197 },
1198 ],
1199 pictureFullPath: null,
1200 pictureThumbPath: null,
1201 places: 1,
1202 price: 10,
1203 providers: [],
1204 show: true,
1205 status: 'approved',
1206 tags: [{}],
1207 },
1208 {
1209 id: 8,
1210 bookable: true,
1211 color: '#FD7E35',
1212 opened: true,
1213 full: false,
1214 closed: false,
1215 description:
1216 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1217 fullPayment: false,
1218 gallery: [
1219 {
1220 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1221 },
1222 {
1223 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1224 },
1225 {
1226 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1227 },
1228 {
1229 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1230 },
1231 {
1232 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1233 },
1234 ],
1235 locationId: 1,
1236 customPricing: false,
1237 customTickets: [
1238 {
1239 enabled: true,
1240 id: 1,
1241 eventId: 1,
1242 name: 'Ticket one',
1243 price: 10,
1244 sold: 0,
1245 spots: 20,
1246 },
1247 {
1248 enabled: true,
1249 id: 2,
1250 eventId: 1,
1251 name: 'Ticket two',
1252 price: 50,
1253 sold: 0,
1254 spots: 20,
1255 },
1256 {
1257 enabled: true,
1258 id: 2,
1259 eventId: 1,
1260 name: 'Ticket three',
1261 price: 100,
1262 sold: 0,
1263 spots: 20,
1264 },
1265 ],
1266 depositPerPerson: true,
1267 depositPayment: 'percentage',
1268 deposit: 10,
1269 maxCapacity: 9,
1270 maxCustomCapacity: null,
1271 maxExtraPeople: 3,
1272 name: 'Event 8',
1273 organizerId: 1,
1274 periods: [
1275 {
1276 id: 1,
1277 eventId: 1,
1278 periodStart: moment()
1279 .startOf('month')
1280 .add(17, 'days')
1281 .add(5, 'hours')
1282 .format('YYYY-MM-DD hh:mm:ss'),
1283 periodEnd: moment()
1284 .startOf('month')
1285 .add(20, 'days')
1286 .add(10, 'hours')
1287 .format('YYYY-MM-DD hh:mm:ss'),
1288 },
1289 ],
1290 pictureFullPath: null,
1291 pictureThumbPath: null,
1292 places: 1,
1293 price: 10,
1294 providers: [],
1295 show: true,
1296 status: 'approved',
1297 tags: [{}],
1298 },
1299 {
1300 id: 9,
1301 bookable: true,
1302 color: '#E38587',
1303 opened: true,
1304 full: false,
1305 closed: false,
1306 description:
1307 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1308 fullPayment: false,
1309 gallery: [
1310 {
1311 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1312 },
1313 {
1314 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1315 },
1316 {
1317 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1318 },
1319 {
1320 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1321 },
1322 {
1323 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1324 },
1325 ],
1326 locationId: 1,
1327 customPricing: false,
1328 customTickets: [
1329 {
1330 enabled: true,
1331 id: 1,
1332 eventId: 1,
1333 name: 'Ticket one',
1334 price: 10,
1335 sold: 0,
1336 spots: 20,
1337 },
1338 {
1339 enabled: true,
1340 id: 2,
1341 eventId: 1,
1342 name: 'Ticket two',
1343 price: 50,
1344 sold: 0,
1345 spots: 20,
1346 },
1347 {
1348 enabled: true,
1349 id: 2,
1350 eventId: 1,
1351 name: 'Ticket three',
1352 price: 100,
1353 sold: 0,
1354 spots: 20,
1355 },
1356 ],
1357 depositPerPerson: true,
1358 depositPayment: 'percentage',
1359 deposit: 10,
1360 maxCapacity: 9,
1361 maxCustomCapacity: null,
1362 maxExtraPeople: 3,
1363 name: 'Event 9',
1364 organizerId: 1,
1365 periods: [
1366 {
1367 id: 1,
1368 eventId: 1,
1369 periodStart: moment()
1370 .startOf('month')
1371 .add(18, 'days')
1372 .add(5, 'hours')
1373 .format('YYYY-MM-DD hh:mm:ss'),
1374 periodEnd: moment()
1375 .startOf('month')
1376 .add(21, 'days')
1377 .add(10, 'hours')
1378 .format('YYYY-MM-DD hh:mm:ss'),
1379 },
1380 ],
1381 pictureFullPath: null,
1382 pictureThumbPath: null,
1383 places: 1,
1384 price: 10,
1385 providers: [],
1386 show: true,
1387 status: 'approved',
1388 tags: [{}],
1389 },
1390 {
1391 id: 10,
1392 bookable: true,
1393 color: '#774DFB',
1394 opened: true,
1395 full: false,
1396 closed: false,
1397 description:
1398 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1399 fullPayment: false,
1400 gallery: [
1401 {
1402 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1403 },
1404 {
1405 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1406 },
1407 {
1408 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1409 },
1410 {
1411 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1412 },
1413 {
1414 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1415 },
1416 ],
1417 locationId: 1,
1418 customPricing: false,
1419 customTickets: [
1420 {
1421 enabled: true,
1422 id: 1,
1423 eventId: 1,
1424 name: 'Ticket one',
1425 price: 10,
1426 sold: 0,
1427 spots: 20,
1428 },
1429 {
1430 enabled: true,
1431 id: 2,
1432 eventId: 1,
1433 name: 'Ticket two',
1434 price: 50,
1435 sold: 0,
1436 spots: 20,
1437 },
1438 {
1439 enabled: true,
1440 id: 2,
1441 eventId: 1,
1442 name: 'Ticket three',
1443 price: 100,
1444 sold: 0,
1445 spots: 20,
1446 },
1447 ],
1448 depositPerPerson: true,
1449 depositPayment: 'percentage',
1450 deposit: 10,
1451 maxCapacity: 9,
1452 maxCustomCapacity: null,
1453 maxExtraPeople: 3,
1454 name: 'Event 10',
1455 organizerId: 1,
1456 periods: [
1457 {
1458 id: 1,
1459 eventId: 1,
1460 periodStart: moment()
1461 .startOf('month')
1462 .add(21, 'days')
1463 .add(5, 'hours')
1464 .format('YYYY-MM-DD hh:mm:ss'),
1465 periodEnd: moment()
1466 .startOf('month')
1467 .add(22, 'days')
1468 .add(10, 'hours')
1469 .format('YYYY-MM-DD hh:mm:ss'),
1470 },
1471 ],
1472 pictureFullPath: null,
1473 pictureThumbPath: null,
1474 places: 1,
1475 price: 10,
1476 providers: [],
1477 show: true,
1478 status: 'waiting',
1479 tags: [{}],
1480 },
1481 {
1482 id: 11,
1483 bookable: true,
1484 color: '#bcfb00',
1485 opened: true,
1486 full: false,
1487 closed: false,
1488 description:
1489 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1490 fullPayment: false,
1491 gallery: [
1492 {
1493 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1494 },
1495 {
1496 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1497 },
1498 {
1499 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1500 },
1501 {
1502 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1503 },
1504 {
1505 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1506 },
1507 ],
1508 locationId: 1,
1509 customPricing: false,
1510 customTickets: [
1511 {
1512 enabled: true,
1513 id: 1,
1514 eventId: 1,
1515 name: 'Ticket one',
1516 price: 10,
1517 sold: 0,
1518 spots: 20,
1519 },
1520 {
1521 enabled: true,
1522 id: 2,
1523 eventId: 1,
1524 name: 'Ticket two',
1525 price: 50,
1526 sold: 0,
1527 spots: 20,
1528 },
1529 {
1530 enabled: true,
1531 id: 2,
1532 eventId: 1,
1533 name: 'Ticket three',
1534 price: 100,
1535 sold: 0,
1536 spots: 20,
1537 },
1538 ],
1539 depositPerPerson: true,
1540 depositPayment: 'percentage',
1541 deposit: 10,
1542 maxCapacity: 9,
1543 maxCustomCapacity: null,
1544 maxExtraPeople: 3,
1545 name: 'Event 11',
1546 organizerId: 1,
1547 periods: [
1548 {
1549 id: 1,
1550 eventId: 1,
1551 periodStart: moment()
1552 .startOf('month')
1553 .add(23, 'days')
1554 .add(5, 'hours')
1555 .format('YYYY-MM-DD hh:mm:ss'),
1556 periodEnd: moment()
1557 .startOf('month')
1558 .add(26, 'days')
1559 .add(10, 'hours')
1560 .format('YYYY-MM-DD hh:mm:ss'),
1561 },
1562 ],
1563 pictureFullPath: null,
1564 pictureThumbPath: null,
1565 places: 1,
1566 price: 10,
1567 providers: [],
1568 show: true,
1569 status: 'approved',
1570 tags: [{}],
1571 },
1572 {
1573 id: 12,
1574 bookable: true,
1575 color: '#082770',
1576 opened: true,
1577 full: false,
1578 closed: false,
1579 description:
1580 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1581 fullPayment: false,
1582 gallery: [
1583 {
1584 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1585 },
1586 {
1587 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1588 },
1589 {
1590 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1591 },
1592 {
1593 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1594 },
1595 {
1596 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1597 },
1598 ],
1599 locationId: 1,
1600 customPricing: false,
1601 customTickets: [
1602 {
1603 enabled: true,
1604 id: 1,
1605 eventId: 1,
1606 name: 'Ticket one',
1607 price: 10,
1608 sold: 0,
1609 spots: 20,
1610 },
1611 {
1612 enabled: true,
1613 id: 2,
1614 eventId: 1,
1615 name: 'Ticket two',
1616 price: 50,
1617 sold: 0,
1618 spots: 20,
1619 },
1620 {
1621 enabled: true,
1622 id: 2,
1623 eventId: 1,
1624 name: 'Ticket three',
1625 price: 100,
1626 sold: 0,
1627 spots: 20,
1628 },
1629 ],
1630 depositPerPerson: true,
1631 depositPayment: 'percentage',
1632 deposit: 10,
1633 maxCapacity: 9,
1634 maxCustomCapacity: null,
1635 maxExtraPeople: 3,
1636 name: 'Event 12',
1637 organizerId: 1,
1638 periods: [
1639 {
1640 id: 1,
1641 eventId: 1,
1642 periodStart: moment()
1643 .startOf('month')
1644 .add(26, 'days')
1645 .add(5, 'hours')
1646 .format('YYYY-MM-DD hh:mm:ss'),
1647 periodEnd: moment()
1648 .startOf('month')
1649 .add(30, 'days')
1650 .add(10, 'hours')
1651 .format('YYYY-MM-DD hh:mm:ss'),
1652 },
1653 ],
1654 pictureFullPath: null,
1655 pictureThumbPath: null,
1656 places: 1,
1657 price: 10,
1658 providers: [],
1659 show: true,
1660 status: 'approved',
1661 tags: [{}],
1662 },
1663 {
1664 id: 13,
1665 bookable: true,
1666 color: '#409e40',
1667 opened: true,
1668 full: false,
1669 closed: false,
1670 description:
1671 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1672 fullPayment: false,
1673 gallery: [
1674 {
1675 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1676 },
1677 {
1678 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1679 },
1680 {
1681 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1682 },
1683 {
1684 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1685 },
1686 {
1687 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1688 },
1689 ],
1690 locationId: 1,
1691 customPricing: false,
1692 customTickets: [
1693 {
1694 enabled: true,
1695 id: 1,
1696 eventId: 1,
1697 name: 'Ticket one',
1698 price: 10,
1699 sold: 0,
1700 spots: 20,
1701 },
1702 {
1703 enabled: true,
1704 id: 2,
1705 eventId: 1,
1706 name: 'Ticket two',
1707 price: 50,
1708 sold: 0,
1709 spots: 20,
1710 },
1711 {
1712 enabled: true,
1713 id: 2,
1714 eventId: 1,
1715 name: 'Ticket three',
1716 price: 100,
1717 sold: 0,
1718 spots: 20,
1719 },
1720 ],
1721 depositPerPerson: true,
1722 depositPayment: 'percentage',
1723 deposit: 10,
1724 maxCapacity: 9,
1725 maxCustomCapacity: null,
1726 maxExtraPeople: 3,
1727 name: 'Event 13',
1728 organizerId: 1,
1729 periods: [
1730 {
1731 id: 1,
1732 eventId: 1,
1733 periodStart: moment()
1734 .startOf('month')
1735 .add(29, 'days')
1736 .add(5, 'hours')
1737 .format('YYYY-MM-DD hh:mm:ss'),
1738 periodEnd: moment()
1739 .startOf('month')
1740 .add(31, 'days')
1741 .add(10, 'hours')
1742 .format('YYYY-MM-DD hh:mm:ss'),
1743 },
1744 ],
1745 pictureFullPath: null,
1746 pictureThumbPath: null,
1747 places: 1,
1748 price: 10,
1749 providers: [],
1750 show: true,
1751 status: 'approved',
1752 tags: [{}],
1753 },
1754 {
1755 id: 14,
1756 bookable: true,
1757 color: '#fbba17',
1758 opened: true,
1759 full: false,
1760 closed: false,
1761 description:
1762 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
1763 fullPayment: false,
1764 gallery: [
1765 {
1766 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1767 },
1768 {
1769 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1770 },
1771 {
1772 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1773 },
1774 {
1775 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1776 },
1777 {
1778 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
1779 },
1780 ],
1781 locationId: 1,
1782 customPricing: false,
1783 customTickets: [
1784 {
1785 enabled: true,
1786 id: 1,
1787 eventId: 1,
1788 name: 'Ticket one',
1789 price: 10,
1790 sold: 0,
1791 spots: 20,
1792 },
1793 {
1794 enabled: true,
1795 id: 2,
1796 eventId: 1,
1797 name: 'Ticket two',
1798 price: 50,
1799 sold: 0,
1800 spots: 20,
1801 },
1802 {
1803 enabled: true,
1804 id: 2,
1805 eventId: 1,
1806 name: 'Ticket three',
1807 price: 100,
1808 sold: 0,
1809 spots: 20,
1810 },
1811 ],
1812 depositPerPerson: true,
1813 depositPayment: 'percentage',
1814 deposit: 10,
1815 maxCapacity: 9,
1816 maxCustomCapacity: null,
1817 maxExtraPeople: 3,
1818 name: 'Event 14',
1819 organizerId: 1,
1820 periods: [
1821 {
1822 id: 1,
1823 eventId: 1,
1824 periodStart: moment()
1825 .startOf('month')
1826 .add(30, 'days')
1827 .add(5, 'hours')
1828 .format('YYYY-MM-DD hh:mm:ss'),
1829 periodEnd: moment()
1830 .startOf('month')
1831 .add(32, 'days')
1832 .add(10, 'hours')
1833 .format('YYYY-MM-DD hh:mm:ss'),
1834 },
1835 ],
1836 pictureFullPath: null,
1837 pictureThumbPath: null,
1838 places: 1,
1839 price: 10,
1840 providers: [],
1841 show: true,
1842 status: 'approved',
1843 tags: [{}],
1844 },
1845 ])
1846
1847 // * Date Reference
1848 let dateReference = ref(moment().format('YYYY-MM-DD'))
1849
1850 // * Event Calendar Options
1851 let calendarOptions = ref({
1852 locale: computed(() => langKey.value.split('_')[0]),
1853 locales: allLocales,
1854 plugins: [interactionPlugin, dayGridPlugin],
1855 initialView: 'dayGridMonth',
1856 headerToolbar: false,
1857 slotLabelFormat: {
1858 hour: 'numeric',
1859 minute: '2-digit',
1860 hour12: false,
1861 },
1862 eventTimeFormat: {
1863 hour: 'numeric',
1864 minute: '2-digit',
1865 hour12: false,
1866 },
1867 aspectRatio: 0.9,
1868 firstDay: getFirstDayOfWeek(),
1869 dayMaxEvents: true,
1870 selectable: true,
1871 unselectAuto: false,
1872 selectLongPressDelay: 0,
1873 dayCellClassNames: 'am-evt-day-wrapper',
1874 unselectCancel: '.am-evt-more-link-inner',
1875 moreLinkClassNames: 'am-evt-more-link',
1876 eventClassNames: 'am-evt-block',
1877 eventContent: calendarEventBlock,
1878 eventClick: calendarEventClick,
1879 dateClick: calendarDateClick,
1880 moreLinkContent: calendarMoreLinkBlock,
1881 moreLinkClick: calendarMoreLinkClick,
1882 events: [],
1883 })
1884
1885 function calendarEventBlock(eventInfo) {
1886 let props = eventInfo.event.extendedProps
1887 let eventColor = props.evtColor
1888 // * event card text
1889 let spotsText =
1890 props.places === 1
1891 ? `${props.places} ${labelsDisplay('event_slot_left')}`
1892 : `${props.places} ${labelsDisplay('event_slots_left')}`
1893 let noSpotsText = labelsDisplay('event_no_spots')
1894 let closedText = labelsDisplay('closed')
1895 let canceledText = labelsDisplay('canceled')
1896 let spots = props.places <= 0 ? noSpotsText : spotsText
1897 if (props.evtStatus === 'closed') spots = closedText
1898 if (props.evtStatus === 'canceled') spots = canceledText
1899 if (props.evtStatus === 'waiting') spots = labelsDisplay('join_waiting_list')
1900 let spotsBlock = '<span class="am-evt-spots-left">' + spots + '</span>'
1901 let spotsWrapper = '<div class="am-evt-spots">' + spotsBlock + '</div>'
1902
1903 if (
1904 props.evtStatus === 'closed' ||
1905 props.evtStatus === 'canceled' ||
1906 props.evtStatus === 'waiting'
1907 ) {
1908 spotsWrapper = customizeOptions.value.status.visibility ? spotsWrapper : ''
1909 } else {
1910 spotsWrapper = customizeOptions.value.capacity.visibility ? spotsWrapper : ''
1911 }
1912
1913 // * event card classes
1914 let hoverClass = props.hovered ? ' am-evt-hovered' : ''
1915 let statusClass = ` am-evt-${props.evtStatus}`
1916
1917 let eventBlock =
1918 '<div class="am-evt-wrapper' +
1919 hoverClass +
1920 statusClass +
1921 '" style="--am-c-evt: ' +
1922 eventColor +
1923 '">' +
1924 '<span class="am-evt-background"></span>' +
1925 '<div class="am-evt-time">' +
1926 getEventFrontedFormattedTime(props.evtTimeStart) +
1927 '</div>' +
1928 '<div class="am-evt-inner">' +
1929 '<p class="am-evt-text">' +
1930 eventInfo.event.title +
1931 '</p>' +
1932 '</div>' +
1933 spotsWrapper +
1934 '</div>'
1935 return { html: eventBlock }
1936 }
1937
1938 function calendarEventClick(eventInfo) {
1939 calendarOptions.value.events.map((event) => {
1940 event.hovered = parseInt(event.evtId) === parseInt(eventInfo.event.extendedProps.evtId)
1941 })
1942 }
1943
1944 function calendarDateClick() {}
1945
1946 function calendarMoreLinkBlock(moreLinkInfo) {
1947 let text = amLabels.value.event
1948 if (moreLinkInfo.num > 1) {
1949 text = labelsDisplay('events')
1950 }
1951
1952 let calendarApi = eventCalendarRef.value.getApi()
1953
1954 if (calendarApi.el.offsetWidth < 448) {
1955 return { html: '<div class="am-evt-more-link-inner mobile"></div>' }
1956 }
1957
1958 return {
1959 html: '<div class="am-evt-more-link-inner">' + '+' + moreLinkInfo.num + ' ' + text + '</div>',
1960 }
1961 }
1962
1963 function calendarMoreLinkClick(info) {
1964 info.jsEvent.stopPropagation()
1965 }
1966
1967 function mergePeriods(periods) {
1968 if (!periods.length) return []
1969
1970 // Convert to moment objects and sort by start date
1971 periods = periods
1972 .map((period) => ({
1973 periodStart: moment(period.periodStart),
1974 periodEnd: moment(period.periodEnd),
1975 }))
1976 .sort((a, b) => a.periodStart - b.periodStart)
1977
1978 const mergedPeriods = [periods[0]]
1979
1980 for (let i = 1; i < periods.length; i++) {
1981 const lastMerged = mergedPeriods[mergedPeriods.length - 1]
1982 const current = periods[i]
1983
1984 if (current.periodStart <= lastMerged.periodEnd) {
1985 // Overlapping periods, merge them
1986 lastMerged.periodEnd = moment.max(lastMerged.periodEnd, current.periodEnd)
1987 } else {
1988 // No overlap, add to the merged periods
1989 mergedPeriods.push(current)
1990 }
1991 }
1992
1993 return mergedPeriods.map((period) => ({
1994 periodStart: period.periodStart.format('YYYY-MM-DD HH:mm:ss'),
1995 periodEnd: period.periodEnd.format('YYYY-MM-DD HH:mm:ss'),
1996 }))
1997 }
1998
1999 function eventArrayBuilder(evtArr) {
2000 let buildArr = []
2001 evtArr.forEach(function (event) {
2002 mergePeriods(event.periods).forEach((period) => {
2003 let periodStartDate = moment(period.periodStart.split(' ')[0], 'YYYY-MM-DD')
2004 let periodEndDate = moment(period.periodEnd.split(' ')[0], 'YYYY-MM-DD')
2005 let periodStartTime = moment(period.periodStart.split(' ')[1], 'HH:mm:ss').format('HH:mm:ss')
2006 let periodEndTime = moment(period.periodEnd.split(' ')[1], 'HH:mm:ss').format('HH:mm:ss')
2007
2008 if (periodEndTime === '00:00:00') {
2009 periodEndTime = '24:00:00'
2010 periodEndDate.subtract(1, 'days')
2011 }
2012
2013 let isWaiting = event.name === 'Event 10' && features.value.waitingList
2014
2015 buildArr.push({
2016 evtId: event.id,
2017 evtStatus: isWaiting ? 'waiting' : useEventStatus(event),
2018 periodId: period.id,
2019 locationId: event.locationId,
2020 customLocation: event.customLocation,
2021 title: event.name,
2022 places: placesCalculation(event),
2023 evtColor: event.color,
2024 hovered: false,
2025 evtTimeStart: periodStartTime,
2026 start: periodStartDate.format('YYYY-MM-DD') + ' ' + periodStartTime,
2027 end: periodEndDate.format('YYYY-MM-DD') + ' ' + periodEndTime,
2028 })
2029 })
2030 })
2031
2032 let eventsToDisplay = []
2033 buildArr.forEach((a) => {
2034 if (
2035 !eventsToDisplay.find(
2036 (b) => b.evtId === a.evtId && b.start.split(' ')[0] === a.start.split(' ')[0],
2037 )
2038 ) {
2039 eventsToDisplay.push(a)
2040 }
2041 })
2042
2043 calendarOptions.value.events = eventsToDisplay
2044
2045 nextTick(() => {
2046 setTimeout(() => {
2047 eventCalendarRef.value.getApi().render()
2048 }, 100)
2049 })
2050 }
2051
2052 onMounted(() => {
2053 let evtArr = Array.from(events.value)
2054
2055 eventArrayBuilder(evtArr)
2056 })
2057
2058 function placesCalculation(evt) {
2059 if (evt.customPricing) {
2060 let places = 0
2061 let eventTickets = evt.customTickets
2062
2063 if (evt.maxCustomCapacity) {
2064 let sold = 0
2065 eventTickets.forEach((t) => {
2066 if ('enabled' in t ? t.enabled : true) {
2067 sold += t.sold
2068 }
2069 })
2070
2071 places = evt.maxCustomCapacity - sold
2072 } else {
2073 eventTickets.forEach((t) => {
2074 if ('enabled' in t ? t.enabled : true) {
2075 places += t.spots - t.sold - ('persons' in t ? t.persons : 0)
2076 }
2077 })
2078 }
2079
2080 return places
2081 }
2082
2083 return evt.places
2084 }
2085
2086 // * Header Functionality
2087
2088 function getEventBasedOnDateChange() {
2089 return [
2090 moment(dateReference.value).startOf('month').subtract(15, 'days').format('YYYY-MM-DD'),
2091 moment(dateReference.value).endOf('month').add(15, 'days').format('YYYY-MM-DD'),
2092 ]
2093 }
2094 function calendarChangeMonth(monthType) {
2095 if (monthType === 'today') {
2096 eventCalendarRef.value.getApi().today()
2097 }
2098 if (monthType === 'prev') {
2099 eventCalendarRef.value.getApi().prev()
2100 }
2101 if (monthType === 'next') {
2102 eventCalendarRef.value.getApi().next()
2103 }
2104
2105 dateReference.value = moment(eventCalendarRef.value.getApi().getDate().toUTCString()).format(
2106 'YYYY-MM-DD',
2107 )
2108
2109 selectedMonth.value = moment(dateReference.value).format('MM')
2110 selectedYear.value = moment(dateReference.value).format('YYYY')
2111
2112 getEventBasedOnDateChange()
2113 }
2114
2115 let selectedMonth = ref(moment(dateReference.value).format('MM'))
2116 let dropdownMonths = computed(() => {
2117 return [
2118 {
2119 value: '01',
2120 label: translationObject.value.month1,
2121 },
2122 {
2123 value: '02',
2124 label: translationObject.value.month2,
2125 },
2126 {
2127 value: '03',
2128 label: translationObject.value.month3,
2129 },
2130 {
2131 value: '04',
2132 label: translationObject.value.month4,
2133 },
2134 {
2135 value: '05',
2136 label: translationObject.value.month5,
2137 },
2138 {
2139 value: '06',
2140 label: translationObject.value.month6,
2141 },
2142 {
2143 value: '07',
2144 label: translationObject.value.month7,
2145 },
2146 {
2147 value: '08',
2148 label: translationObject.value.month8,
2149 },
2150 {
2151 value: '09',
2152 label: translationObject.value.month9,
2153 },
2154 {
2155 value: '10',
2156 label: translationObject.value.month10,
2157 },
2158 {
2159 value: '11',
2160 label: translationObject.value.month11,
2161 },
2162 {
2163 value: '12',
2164 label: translationObject.value.month12,
2165 },
2166 ]
2167 })
2168
2169 let selectedYear = ref(moment(dateReference.value).format('YYYY'))
2170 let dropdownYears = ref([
2171 {
2172 value: moment().format('YYYY'),
2173 },
2174 {
2175 value: moment().add(1, 'year').format('YYYY'),
2176 },
2177 {
2178 value: moment().add(2, 'year').format('YYYY'),
2179 },
2180 ])
2181
2182 function dateSelection() {
2183 dateReference.value = moment(`${selectedYear.value}-${selectedMonth.value}`, 'YYYY-MM').format(
2184 'YYYY-MM-DD',
2185 )
2186 getEventBasedOnDateChange()
2187 }
2188
2189 // * Event Header
2190 let headerTitle = computed(() => {
2191 return `${
2192 dropdownMonths.value.find((m) => m.value === selectedMonth.value).label
2193 }, ${selectedYear.value}`
2194 })
2195
2196 let iconArrLeft = {
2197 components: { IconComponent },
2198 template: `<IconComponent icon="arrow-left"/>`,
2199 }
2200
2201 let iconArrRight = {
2202 components: { IconComponent },
2203 template: `<IconComponent icon="arrow-right"/>`,
2204 }
2205
2206 let iconType = {
2207 components: { IconComponent },
2208 template: `<IconComponent icon="folder"/>`,
2209 }
2210
2211 let iconLocation = {
2212 components: { IconComponent },
2213 template: `<IconComponent icon="locations"/>`,
2214 }
2215
2216 let iconEmployee = {
2217 components: { IconComponent },
2218 template: `<IconComponent icon="employee"/>`,
2219 }
2220
2221 let iconStatus = {
2222 components: { IconComponent },
2223 template: `<IconComponent icon="circle-empty"/>`,
2224 }
2225
2226 // ** Filters **
2227 let filtersMenuVisibility = ref(false)
2228
2229 // * Locations array
2230 let locations = computed(() => {
2231 if (licence.isLite || licence.isStarter) return []
2232
2233 return [
2234 {
2235 id: 1,
2236 name: 'Location 1',
2237 address: 'Location 1',
2238 },
2239 {
2240 id: 2,
2241 name: 'Location 2',
2242 address: 'Location 2',
2243 },
2244 {
2245 id: 3,
2246 name: 'Location 3',
2247 address: 'Location 3',
2248 },
2249 ]
2250 })
2251
2252 // * Tags array
2253 let tags = ref([{ name: 'Tag 1' }, { name: 'Tag 2' }, { name: 'Tag 3' }])
2254
2255 // * Employees array
2256 let employees = computed(() => {
2257 if (licence.isLite) return []
2258
2259 return [
2260 {
2261 id: 1,
2262 firstName: 'John',
2263 lastName: 'Doe',
2264 },
2265 {
2266 id: 2,
2267 firstName: 'Jane',
2268 lastName: 'Doe',
2269 },
2270 {
2271 id: 3,
2272 firstName: 'John',
2273 lastName: 'Wick',
2274 },
2275 ]
2276 })
2277
2278 // * Status Array
2279 let evtStatus = ref(['Open', 'Full', 'Upcoming', 'Closed', 'Canceled'])
2280
2281 // * Filter class generated according to filter elements visibility
2282 let filterClassWidth = computed(() => {
2283 let tagVisibility = tags.value.length > 0 && amSettings.featuresIntegrations.eventTags.enabled
2284 let locationVisibility = locations.value.length > 0
2285 let employeeVisibility = employees.value.length > 0
2286
2287 let classFilter = {
2288 tag: 'am-mw25',
2289 location: 'am-mw25',
2290 employee: 'am-mw25',
2291 status: 'am-mw25',
2292 }
2293
2294 if (!tagVisibility && !locationVisibility && !employeeVisibility) {
2295 classFilter.status = 'am-mw100'
2296 } else {
2297 let visibleCount = tagVisibility + locationVisibility + employeeVisibility
2298
2299 if (visibleCount === 2) {
2300 let wideClass = 'am-mw33'
2301 let narrowClass = 'am-mw33'
2302 if (tagVisibility) classFilter.tag = wideClass
2303 if (locationVisibility) classFilter.location = wideClass
2304 if (employeeVisibility) classFilter.employee = wideClass
2305 classFilter.status = narrowClass
2306 } else if (visibleCount === 1) {
2307 let singleClass = 'am-mw50'
2308 if (tagVisibility) classFilter.tag = singleClass
2309 if (locationVisibility) classFilter.location = singleClass
2310 if (employeeVisibility) classFilter.employee = singleClass
2311 classFilter.status = singleClass
2312 }
2313 }
2314
2315 return classFilter
2316 })
2317
2318 let filterIcon = {
2319 components: { IconComponent },
2320 template: `<IconComponent icon="filter"/>`,
2321 }
2322
2323 let eventSearch = ref('')
2324
2325 let iconSearch = {
2326 components: { IconComponent },
2327 template: `<IconComponent icon="search"/>`,
2328 }
2329
2330 let tagFilter = ref('')
2331
2332 let locationFilter = ref('')
2333
2334 let employeeFilter = ref('')
2335
2336 let statusFilter = ref('')
2337
2338 function selectEventStatus(status) {
2339 let evtArr = Array.from(events.value)
2340
2341 if (status.length) {
2342 let filteredArray = []
2343 evtArr.forEach((evt) => {
2344 status.forEach((s) => {
2345 if (s === evt.status) filteredArray.push(evt)
2346 })
2347 })
2348 eventArrayBuilder(filteredArray)
2349 } else {
2350 eventArrayBuilder(evtArr)
2351 }
2352 }
2353
2354 watchEffect(() => {
2355 if (calHeight.value) {
2356 calLoaderHeight.value = calHeight.value
2357 sideBlockHeight.value =
2358 calHeight.value +
2359 filtersHeight.value +
2360 headerHeight.value +
2361 48 -
2362 (sideHeaderHeight.value + 36)
2363
2364 if (features.value.waitingList) {
2365 sideBlockHeight.value += sideTabHeight.value
2366 }
2367 }
2368
2369 if (calWidth.value < 448) {
2370 calendarOptions.value.moreLinkClassNames += !calendarOptions.value.moreLinkClassNames.includes(
2371 'mobile',
2372 )
2373 ? ' mobile'
2374 : ''
2375 calendarOptions.value.dayCellClassNames += !calendarOptions.value.dayCellClassNames.includes(
2376 'mobile',
2377 )
2378 ? ' mobile'
2379 : ''
2380 } else {
2381 calendarOptions.value.moreLinkClassNames = 'am-evt-more-link'
2382 calendarOptions.value.dayCellClassNames = 'am-evt-day-wrapper'
2383 }
2384 })
2385
2386 let typingInLabelsInputs = ref(null)
2387 watch([amCustomize, customizeOptions], () => {
2388 clearTimeout(typingInLabelsInputs.value)
2389 typingInLabelsInputs.value = setTimeout(() => {
2390 eventCalendarRef.value.getApi().render()
2391 }, 500)
2392 })
2393
2394 // ** Upcoming events
2395 let upcomingArray = ref([
2396 {
2397 id: 1,
2398 bookable: false,
2399 color: '#1788FB',
2400 opened: true,
2401 full: false,
2402 closed: false,
2403 description:
2404 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
2405 fullPayment: false,
2406 gallery: [
2407 {
2408 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2409 },
2410 {
2411 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2412 },
2413 {
2414 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2415 },
2416 {
2417 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2418 },
2419 {
2420 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2421 },
2422 ],
2423 locationId: 1,
2424 customPricing: true,
2425 customTickets: [
2426 {
2427 enabled: true,
2428 id: 1,
2429 eventId: 1,
2430 name: 'Ticket one',
2431 price: 10,
2432 sold: 0,
2433 spots: 20,
2434 },
2435 {
2436 enabled: true,
2437 id: 2,
2438 eventId: 1,
2439 name: 'Ticket two',
2440 price: 50,
2441 sold: 0,
2442 spots: 20,
2443 },
2444 {
2445 enabled: true,
2446 id: 2,
2447 eventId: 1,
2448 name: 'Ticket three',
2449 price: 100,
2450 sold: 0,
2451 spots: 20,
2452 },
2453 ],
2454 depositPerPerson: true,
2455 depositPayment: 'percentage',
2456 deposit: 10,
2457 maxCapacity: 9,
2458 maxCustomCapacity: null,
2459 maxExtraPeople: 3,
2460 name: 'Event 1',
2461 organizerId: 1,
2462 periods: [
2463 {
2464 id: 1,
2465 eventId: 1,
2466 periodStart: moment()
2467 .startOf('month')
2468 .add(1, 'month')
2469 .subtract(2, 'days')
2470 .add(5, 'hours')
2471 .format('YYYY-MM-DD hh:mm:ss'),
2472 periodEnd: moment()
2473 .startOf('month')
2474 .add(1, 'month')
2475 .add(2, 'days')
2476 .add(10, 'hours')
2477 .format('YYYY-MM-DD hh:mm:ss'),
2478 },
2479 ],
2480 pictureFullPath: null,
2481 pictureThumbPath: null,
2482 places: 30,
2483 price: 10,
2484 providers: [],
2485 show: true,
2486 status: 'approved',
2487 tags: [{}],
2488 },
2489 {
2490 id: 2,
2491 bookable: true,
2492 color: '#4bbec6',
2493 opened: true,
2494 full: true,
2495 closed: false,
2496 description:
2497 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
2498 fullPayment: false,
2499 gallery: [
2500 {
2501 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2502 },
2503 {
2504 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2505 },
2506 {
2507 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2508 },
2509 {
2510 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2511 },
2512 {
2513 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2514 },
2515 ],
2516 locationId: 1,
2517 customPricing: true,
2518 customTickets: [
2519 {
2520 enabled: true,
2521 id: 1,
2522 eventId: 1,
2523 name: 'Ticket one',
2524 price: 10,
2525 sold: 0,
2526 spots: 20,
2527 },
2528 {
2529 enabled: true,
2530 id: 2,
2531 eventId: 1,
2532 name: 'Ticket two',
2533 price: 50,
2534 sold: 0,
2535 spots: 20,
2536 },
2537 {
2538 enabled: true,
2539 id: 2,
2540 eventId: 1,
2541 name: 'Ticket three',
2542 price: 100,
2543 sold: 0,
2544 spots: 20,
2545 },
2546 ],
2547 depositPerPerson: true,
2548 depositPayment: 'percentage',
2549 deposit: 10,
2550 maxCapacity: 9,
2551 maxCustomCapacity: null,
2552 maxExtraPeople: 3,
2553 name: 'Event 2',
2554 organizerId: 1,
2555 periods: [
2556 {
2557 id: 1,
2558 eventId: 1,
2559 periodStart: moment()
2560 .startOf('month')
2561 .add(1, 'month')
2562 .add(6, 'days')
2563 .add(5, 'hours')
2564 .format('YYYY-MM-DD hh:mm:ss'),
2565 periodEnd: moment()
2566 .startOf('month')
2567 .add(1, 'month')
2568 .add(8, 'days')
2569 .add(10, 'hours')
2570 .format('YYYY-MM-DD hh:mm:ss'),
2571 },
2572 ],
2573 pictureFullPath: null,
2574 pictureThumbPath: null,
2575 places: 30,
2576 price: 10,
2577 providers: [],
2578 show: true,
2579 status: 'approved',
2580 tags: [{}],
2581 },
2582 {
2583 id: 3,
2584 bookable: true,
2585 color: '#fbc22d',
2586 opened: true,
2587 full: false,
2588 closed: false,
2589 description:
2590 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
2591 fullPayment: false,
2592 gallery: [
2593 {
2594 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2595 },
2596 {
2597 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2598 },
2599 {
2600 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2601 },
2602 {
2603 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2604 },
2605 {
2606 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2607 },
2608 ],
2609 locationId: 1,
2610 customPricing: true,
2611 customTickets: [
2612 {
2613 enabled: true,
2614 id: 1,
2615 eventId: 1,
2616 name: 'Ticket one',
2617 price: 10,
2618 sold: 0,
2619 spots: 20,
2620 },
2621 {
2622 enabled: true,
2623 id: 2,
2624 eventId: 1,
2625 name: 'Ticket two',
2626 price: 50,
2627 sold: 0,
2628 spots: 20,
2629 },
2630 {
2631 enabled: true,
2632 id: 2,
2633 eventId: 1,
2634 name: 'Ticket three',
2635 price: 100,
2636 sold: 0,
2637 spots: 20,
2638 },
2639 ],
2640 depositPerPerson: true,
2641 depositPayment: 'percentage',
2642 deposit: 10,
2643 maxCapacity: 9,
2644 maxCustomCapacity: null,
2645 maxExtraPeople: 3,
2646 name: 'Event 3',
2647 organizerId: 1,
2648 periods: [
2649 {
2650 id: 1,
2651 eventId: 1,
2652 periodStart: moment()
2653 .startOf('month')
2654 .add(1, 'month')
2655 .add(8, 'days')
2656 .add(5, 'hours')
2657 .format('YYYY-MM-DD hh:mm:ss'),
2658 periodEnd: moment()
2659 .startOf('month')
2660 .add(1, 'month')
2661 .add(10, 'days')
2662 .add(10, 'hours')
2663 .format('YYYY-MM-DD hh:mm:ss'),
2664 },
2665 ],
2666 pictureFullPath: null,
2667 pictureThumbPath: null,
2668 places: 30,
2669 price: 10,
2670 providers: [],
2671 show: true,
2672 status: 'approved',
2673 tags: [{}],
2674 },
2675 {
2676 id: 4,
2677 bookable: true,
2678 color: '#FA3C52',
2679 opened: true,
2680 full: false,
2681 closed: false,
2682 description:
2683 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
2684 fullPayment: false,
2685 gallery: [
2686 {
2687 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2688 },
2689 {
2690 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2691 },
2692 {
2693 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2694 },
2695 {
2696 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2697 },
2698 {
2699 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2700 },
2701 ],
2702 locationId: 1,
2703 customPricing: true,
2704 customTickets: [
2705 {
2706 enabled: true,
2707 id: 1,
2708 eventId: 1,
2709 name: 'Ticket one',
2710 price: 10,
2711 sold: 0,
2712 spots: 20,
2713 },
2714 {
2715 enabled: true,
2716 id: 2,
2717 eventId: 1,
2718 name: 'Ticket two',
2719 price: 50,
2720 sold: 0,
2721 spots: 20,
2722 },
2723 {
2724 enabled: true,
2725 id: 2,
2726 eventId: 1,
2727 name: 'Ticket three',
2728 price: 100,
2729 sold: 0,
2730 spots: 20,
2731 },
2732 ],
2733 depositPerPerson: true,
2734 depositPayment: 'percentage',
2735 deposit: 10,
2736 maxCapacity: 9,
2737 maxCustomCapacity: null,
2738 maxExtraPeople: 3,
2739 name: 'Event 4',
2740 organizerId: 1,
2741 periods: [
2742 {
2743 id: 1,
2744 eventId: 1,
2745 periodStart: moment()
2746 .startOf('month')
2747 .add(1, 'month')
2748 .add(10, 'days')
2749 .add(5, 'hours')
2750 .format('YYYY-MM-DD hh:mm:ss'),
2751 periodEnd: moment()
2752 .startOf('month')
2753 .add(1, 'month')
2754 .add(11, 'days')
2755 .add(10, 'hours')
2756 .format('YYYY-MM-DD hh:mm:ss'),
2757 },
2758 ],
2759 pictureFullPath: null,
2760 pictureThumbPath: null,
2761 places: 30,
2762 price: 10,
2763 providers: [],
2764 show: true,
2765 status: 'approved',
2766 tags: [{}],
2767 },
2768 {
2769 id: 5,
2770 bookable: false,
2771 color: '#D696B8',
2772 opened: true,
2773 full: false,
2774 closed: false,
2775 cancelable: true,
2776 description:
2777 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
2778 fullPayment: false,
2779 gallery: [
2780 {
2781 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2782 },
2783 {
2784 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2785 },
2786 {
2787 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2788 },
2789 {
2790 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2791 },
2792 {
2793 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2794 },
2795 ],
2796 locationId: 1,
2797 customPricing: true,
2798 customTickets: [
2799 {
2800 enabled: true,
2801 id: 1,
2802 eventId: 1,
2803 name: 'Ticket one',
2804 price: 10,
2805 sold: 0,
2806 spots: 20,
2807 },
2808 {
2809 enabled: true,
2810 id: 2,
2811 eventId: 1,
2812 name: 'Ticket two',
2813 price: 50,
2814 sold: 0,
2815 spots: 20,
2816 },
2817 {
2818 enabled: true,
2819 id: 2,
2820 eventId: 1,
2821 name: 'Ticket three',
2822 price: 100,
2823 sold: 0,
2824 spots: 20,
2825 },
2826 ],
2827 depositPerPerson: true,
2828 depositPayment: 'percentage',
2829 deposit: 10,
2830 maxCapacity: 9,
2831 maxCustomCapacity: null,
2832 maxExtraPeople: 3,
2833 name: 'Event 5',
2834 organizerId: 1,
2835 periods: [
2836 {
2837 id: 1,
2838 eventId: 1,
2839 periodStart: moment()
2840 .startOf('month')
2841 .add(1, 'month')
2842 .add(12, 'days')
2843 .add(5, 'hours')
2844 .format('YYYY-MM-DD hh:mm:ss'),
2845 periodEnd: moment()
2846 .startOf('month')
2847 .add(1, 'month')
2848 .add(14, 'days')
2849 .add(10, 'hours')
2850 .format('YYYY-MM-DD hh:mm:ss'),
2851 },
2852 ],
2853 pictureFullPath: null,
2854 pictureThumbPath: null,
2855 places: 30,
2856 price: 10,
2857 providers: [],
2858 show: true,
2859 status: 'rejected',
2860 tags: [{}],
2861 },
2862 {
2863 id: 6,
2864 bookable: false,
2865 color: '#689BCA',
2866 opened: false,
2867 full: false,
2868 closed: false,
2869 upcoming: true,
2870 description:
2871 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
2872 fullPayment: false,
2873 gallery: [
2874 {
2875 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2876 },
2877 {
2878 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2879 },
2880 {
2881 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2882 },
2883 {
2884 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2885 },
2886 {
2887 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2888 },
2889 ],
2890 locationId: 1,
2891 customPricing: true,
2892 customTickets: [
2893 {
2894 enabled: true,
2895 id: 1,
2896 eventId: 1,
2897 name: 'Ticket one',
2898 price: 10,
2899 sold: 0,
2900 spots: 20,
2901 },
2902 {
2903 enabled: true,
2904 id: 2,
2905 eventId: 1,
2906 name: 'Ticket two',
2907 price: 50,
2908 sold: 0,
2909 spots: 20,
2910 },
2911 {
2912 enabled: true,
2913 id: 2,
2914 eventId: 1,
2915 name: 'Ticket three',
2916 price: 100,
2917 sold: 0,
2918 spots: 20,
2919 },
2920 ],
2921 depositPerPerson: true,
2922 depositPayment: 'percentage',
2923 deposit: 10,
2924 maxCapacity: 9,
2925 maxCustomCapacity: null,
2926 maxExtraPeople: 3,
2927 name: 'Event 6',
2928 organizerId: 1,
2929 periods: [
2930 {
2931 id: 1,
2932 eventId: 1,
2933 periodStart: moment()
2934 .startOf('month')
2935 .add(1, 'month')
2936 .add(15, 'days')
2937 .add(5, 'hours')
2938 .format('YYYY-MM-DD hh:mm:ss'),
2939 periodEnd: moment()
2940 .startOf('month')
2941 .add(1, 'month')
2942 .add(15, 'days')
2943 .add(10, 'hours')
2944 .format('YYYY-MM-DD hh:mm:ss'),
2945 },
2946 ],
2947 pictureFullPath: null,
2948 pictureThumbPath: null,
2949 places: 30,
2950 price: 10,
2951 providers: [],
2952 show: true,
2953 status: 'approved',
2954 tags: [{}],
2955 },
2956 {
2957 id: 7,
2958 bookable: true,
2959 color: '#26CC2B',
2960 opened: true,
2961 full: false,
2962 closed: false,
2963 description:
2964 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
2965 fullPayment: false,
2966 gallery: [
2967 {
2968 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2969 },
2970 {
2971 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2972 },
2973 {
2974 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2975 },
2976 {
2977 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2978 },
2979 {
2980 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
2981 },
2982 ],
2983 locationId: 1,
2984 customPricing: false,
2985 customTickets: [
2986 {
2987 enabled: true,
2988 id: 1,
2989 eventId: 1,
2990 name: 'Ticket one',
2991 price: 10,
2992 sold: 0,
2993 spots: 20,
2994 },
2995 {
2996 enabled: true,
2997 id: 2,
2998 eventId: 1,
2999 name: 'Ticket two',
3000 price: 50,
3001 sold: 0,
3002 spots: 20,
3003 },
3004 {
3005 enabled: true,
3006 id: 2,
3007 eventId: 1,
3008 name: 'Ticket three',
3009 price: 100,
3010 sold: 0,
3011 spots: 20,
3012 },
3013 ],
3014 depositPerPerson: true,
3015 depositPayment: 'percentage',
3016 deposit: 10,
3017 maxCapacity: 9,
3018 maxCustomCapacity: null,
3019 maxExtraPeople: 3,
3020 name: 'Event 7',
3021 organizerId: 1,
3022 periods: [
3023 {
3024 id: 1,
3025 eventId: 1,
3026 periodStart: moment()
3027 .startOf('month')
3028 .add(1, 'month')
3029 .add(16, 'days')
3030 .add(5, 'hours')
3031 .format('YYYY-MM-DD hh:mm:ss'),
3032 periodEnd: moment()
3033 .startOf('month')
3034 .add(1, 'month')
3035 .add(17, 'days')
3036 .add(10, 'hours')
3037 .format('YYYY-MM-DD hh:mm:ss'),
3038 },
3039 ],
3040 pictureFullPath: null,
3041 pictureThumbPath: null,
3042 places: 1,
3043 price: 10,
3044 providers: [],
3045 show: true,
3046 status: 'approved',
3047 tags: [{}],
3048 },
3049 {
3050 id: 8,
3051 bookable: true,
3052 color: '#FD7E35',
3053 opened: true,
3054 full: false,
3055 closed: false,
3056 description:
3057 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3058 fullPayment: false,
3059 gallery: [
3060 {
3061 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3062 },
3063 {
3064 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3065 },
3066 {
3067 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3068 },
3069 {
3070 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3071 },
3072 {
3073 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3074 },
3075 ],
3076 locationId: 1,
3077 customPricing: false,
3078 customTickets: [
3079 {
3080 enabled: true,
3081 id: 1,
3082 eventId: 1,
3083 name: 'Ticket one',
3084 price: 10,
3085 sold: 0,
3086 spots: 20,
3087 },
3088 {
3089 enabled: true,
3090 id: 2,
3091 eventId: 1,
3092 name: 'Ticket two',
3093 price: 50,
3094 sold: 0,
3095 spots: 20,
3096 },
3097 {
3098 enabled: true,
3099 id: 2,
3100 eventId: 1,
3101 name: 'Ticket three',
3102 price: 100,
3103 sold: 0,
3104 spots: 20,
3105 },
3106 ],
3107 depositPerPerson: true,
3108 depositPayment: 'percentage',
3109 deposit: 10,
3110 maxCapacity: 9,
3111 maxCustomCapacity: null,
3112 maxExtraPeople: 3,
3113 name: 'Event 8',
3114 organizerId: 1,
3115 periods: [
3116 {
3117 id: 1,
3118 eventId: 1,
3119 periodStart: moment()
3120 .startOf('month')
3121 .add(1, 'month')
3122 .add(17, 'days')
3123 .add(5, 'hours')
3124 .format('YYYY-MM-DD hh:mm:ss'),
3125 periodEnd: moment()
3126 .startOf('month')
3127 .add(1, 'month')
3128 .add(20, 'days')
3129 .add(10, 'hours')
3130 .format('YYYY-MM-DD hh:mm:ss'),
3131 },
3132 ],
3133 pictureFullPath: null,
3134 pictureThumbPath: null,
3135 places: 1,
3136 price: 10,
3137 providers: [],
3138 show: true,
3139 status: 'approved',
3140 tags: [{}],
3141 },
3142 {
3143 id: 9,
3144 bookable: true,
3145 color: '#E38587',
3146 opened: true,
3147 full: false,
3148 closed: false,
3149 description:
3150 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3151 fullPayment: false,
3152 gallery: [
3153 {
3154 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3155 },
3156 {
3157 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3158 },
3159 {
3160 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3161 },
3162 {
3163 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3164 },
3165 {
3166 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3167 },
3168 ],
3169 locationId: 1,
3170 customPricing: false,
3171 customTickets: [
3172 {
3173 enabled: true,
3174 id: 1,
3175 eventId: 1,
3176 name: 'Ticket one',
3177 price: 10,
3178 sold: 0,
3179 spots: 20,
3180 },
3181 {
3182 enabled: true,
3183 id: 2,
3184 eventId: 1,
3185 name: 'Ticket two',
3186 price: 50,
3187 sold: 0,
3188 spots: 20,
3189 },
3190 {
3191 enabled: true,
3192 id: 2,
3193 eventId: 1,
3194 name: 'Ticket three',
3195 price: 100,
3196 sold: 0,
3197 spots: 20,
3198 },
3199 ],
3200 depositPerPerson: true,
3201 depositPayment: 'percentage',
3202 deposit: 10,
3203 maxCapacity: 9,
3204 maxCustomCapacity: null,
3205 maxExtraPeople: 3,
3206 name: 'Event 9',
3207 organizerId: 1,
3208 periods: [
3209 {
3210 id: 1,
3211 eventId: 1,
3212 periodStart: moment()
3213 .startOf('month')
3214 .add(1, 'month')
3215 .add(18, 'days')
3216 .add(5, 'hours')
3217 .format('YYYY-MM-DD hh:mm:ss'),
3218 periodEnd: moment()
3219 .startOf('month')
3220 .add(1, 'month')
3221 .add(21, 'days')
3222 .add(10, 'hours')
3223 .format('YYYY-MM-DD hh:mm:ss'),
3224 },
3225 ],
3226 pictureFullPath: null,
3227 pictureThumbPath: null,
3228 places: 1,
3229 price: 10,
3230 providers: [],
3231 show: true,
3232 status: 'approved',
3233 tags: [{}],
3234 },
3235 {
3236 id: 10,
3237 bookable: true,
3238 color: '#774DFB',
3239 opened: true,
3240 full: false,
3241 closed: false,
3242 description:
3243 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3244 fullPayment: false,
3245 gallery: [
3246 {
3247 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3248 },
3249 {
3250 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3251 },
3252 {
3253 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3254 },
3255 {
3256 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3257 },
3258 {
3259 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3260 },
3261 ],
3262 locationId: 1,
3263 customPricing: false,
3264 customTickets: [
3265 {
3266 enabled: true,
3267 id: 1,
3268 eventId: 1,
3269 name: 'Ticket one',
3270 price: 10,
3271 sold: 0,
3272 spots: 20,
3273 },
3274 {
3275 enabled: true,
3276 id: 2,
3277 eventId: 1,
3278 name: 'Ticket two',
3279 price: 50,
3280 sold: 0,
3281 spots: 20,
3282 },
3283 {
3284 enabled: true,
3285 id: 2,
3286 eventId: 1,
3287 name: 'Ticket three',
3288 price: 100,
3289 sold: 0,
3290 spots: 20,
3291 },
3292 ],
3293 depositPerPerson: true,
3294 depositPayment: 'percentage',
3295 deposit: 10,
3296 maxCapacity: 9,
3297 maxCustomCapacity: null,
3298 maxExtraPeople: 3,
3299 name: 'Event 10',
3300 organizerId: 1,
3301 periods: [
3302 {
3303 id: 1,
3304 eventId: 1,
3305 periodStart: moment()
3306 .startOf('month')
3307 .add(1, 'month')
3308 .add(21, 'days')
3309 .add(5, 'hours')
3310 .format('YYYY-MM-DD hh:mm:ss'),
3311 periodEnd: moment()
3312 .startOf('month')
3313 .add(1, 'month')
3314 .add(22, 'days')
3315 .add(10, 'hours')
3316 .format('YYYY-MM-DD hh:mm:ss'),
3317 },
3318 ],
3319 pictureFullPath: null,
3320 pictureThumbPath: null,
3321 places: 1,
3322 price: 10,
3323 providers: [],
3324 show: true,
3325 status: 'approved',
3326 tags: [{}],
3327 },
3328 {
3329 id: 11,
3330 bookable: true,
3331 color: '#bcfb00',
3332 opened: true,
3333 full: false,
3334 closed: false,
3335 description:
3336 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3337 fullPayment: false,
3338 gallery: [
3339 {
3340 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3341 },
3342 {
3343 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3344 },
3345 {
3346 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3347 },
3348 {
3349 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3350 },
3351 {
3352 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3353 },
3354 ],
3355 locationId: 1,
3356 customPricing: false,
3357 customTickets: [
3358 {
3359 enabled: true,
3360 id: 1,
3361 eventId: 1,
3362 name: 'Ticket one',
3363 price: 10,
3364 sold: 0,
3365 spots: 20,
3366 },
3367 {
3368 enabled: true,
3369 id: 2,
3370 eventId: 1,
3371 name: 'Ticket two',
3372 price: 50,
3373 sold: 0,
3374 spots: 20,
3375 },
3376 {
3377 enabled: true,
3378 id: 2,
3379 eventId: 1,
3380 name: 'Ticket three',
3381 price: 100,
3382 sold: 0,
3383 spots: 20,
3384 },
3385 ],
3386 depositPerPerson: true,
3387 depositPayment: 'percentage',
3388 deposit: 10,
3389 maxCapacity: 9,
3390 maxCustomCapacity: null,
3391 maxExtraPeople: 3,
3392 name: 'Event 11',
3393 organizerId: 1,
3394 periods: [
3395 {
3396 id: 1,
3397 eventId: 1,
3398 periodStart: moment()
3399 .startOf('month')
3400 .add(1, 'month')
3401 .add(23, 'days')
3402 .add(5, 'hours')
3403 .format('YYYY-MM-DD hh:mm:ss'),
3404 periodEnd: moment()
3405 .startOf('month')
3406 .add(1, 'month')
3407 .add(26, 'days')
3408 .add(10, 'hours')
3409 .format('YYYY-MM-DD hh:mm:ss'),
3410 },
3411 ],
3412 pictureFullPath: null,
3413 pictureThumbPath: null,
3414 places: 1,
3415 price: 10,
3416 providers: [],
3417 show: true,
3418 status: 'approved',
3419 tags: [{}],
3420 },
3421 {
3422 id: 12,
3423 bookable: true,
3424 color: '#082770',
3425 opened: true,
3426 full: false,
3427 closed: false,
3428 description:
3429 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3430 fullPayment: false,
3431 gallery: [
3432 {
3433 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3434 },
3435 {
3436 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3437 },
3438 {
3439 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3440 },
3441 {
3442 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3443 },
3444 {
3445 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3446 },
3447 ],
3448 locationId: 1,
3449 customPricing: false,
3450 customTickets: [
3451 {
3452 enabled: true,
3453 id: 1,
3454 eventId: 1,
3455 name: 'Ticket one',
3456 price: 10,
3457 sold: 0,
3458 spots: 20,
3459 },
3460 {
3461 enabled: true,
3462 id: 2,
3463 eventId: 1,
3464 name: 'Ticket two',
3465 price: 50,
3466 sold: 0,
3467 spots: 20,
3468 },
3469 {
3470 enabled: true,
3471 id: 2,
3472 eventId: 1,
3473 name: 'Ticket three',
3474 price: 100,
3475 sold: 0,
3476 spots: 20,
3477 },
3478 ],
3479 depositPerPerson: true,
3480 depositPayment: 'percentage',
3481 deposit: 10,
3482 maxCapacity: 9,
3483 maxCustomCapacity: null,
3484 maxExtraPeople: 3,
3485 name: 'Event 12',
3486 organizerId: 1,
3487 periods: [
3488 {
3489 id: 1,
3490 eventId: 1,
3491 periodStart: moment()
3492 .startOf('month')
3493 .add(1, 'month')
3494 .add(26, 'days')
3495 .add(5, 'hours')
3496 .format('YYYY-MM-DD hh:mm:ss'),
3497 periodEnd: moment()
3498 .startOf('month')
3499 .add(1, 'month')
3500 .add(30, 'days')
3501 .add(10, 'hours')
3502 .format('YYYY-MM-DD hh:mm:ss'),
3503 },
3504 ],
3505 pictureFullPath: null,
3506 pictureThumbPath: null,
3507 places: 1,
3508 price: 10,
3509 providers: [],
3510 show: true,
3511 status: 'approved',
3512 tags: [{}],
3513 },
3514 {
3515 id: 13,
3516 bookable: true,
3517 color: '#409e40',
3518 opened: true,
3519 full: false,
3520 closed: false,
3521 description:
3522 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3523 fullPayment: false,
3524 gallery: [
3525 {
3526 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3527 },
3528 {
3529 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3530 },
3531 {
3532 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3533 },
3534 {
3535 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3536 },
3537 {
3538 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3539 },
3540 ],
3541 locationId: 1,
3542 customPricing: false,
3543 customTickets: [
3544 {
3545 enabled: true,
3546 id: 1,
3547 eventId: 1,
3548 name: 'Ticket one',
3549 price: 10,
3550 sold: 0,
3551 spots: 20,
3552 },
3553 {
3554 enabled: true,
3555 id: 2,
3556 eventId: 1,
3557 name: 'Ticket two',
3558 price: 50,
3559 sold: 0,
3560 spots: 20,
3561 },
3562 {
3563 enabled: true,
3564 id: 2,
3565 eventId: 1,
3566 name: 'Ticket three',
3567 price: 100,
3568 sold: 0,
3569 spots: 20,
3570 },
3571 ],
3572 depositPerPerson: true,
3573 depositPayment: 'percentage',
3574 deposit: 10,
3575 maxCapacity: 9,
3576 maxCustomCapacity: null,
3577 maxExtraPeople: 3,
3578 name: 'Event 13',
3579 organizerId: 1,
3580 periods: [
3581 {
3582 id: 1,
3583 eventId: 1,
3584 periodStart: moment()
3585 .startOf('month')
3586 .add(1, 'month')
3587 .add(29, 'days')
3588 .add(5, 'hours')
3589 .format('YYYY-MM-DD hh:mm:ss'),
3590 periodEnd: moment()
3591 .startOf('month')
3592 .add(1, 'month')
3593 .add(31, 'days')
3594 .add(10, 'hours')
3595 .format('YYYY-MM-DD hh:mm:ss'),
3596 },
3597 ],
3598 pictureFullPath: null,
3599 pictureThumbPath: null,
3600 places: 1,
3601 price: 10,
3602 providers: [],
3603 show: true,
3604 status: 'approved',
3605 tags: [{}],
3606 },
3607 {
3608 id: 14,
3609 bookable: true,
3610 color: '#fbba17',
3611 opened: true,
3612 full: false,
3613 closed: false,
3614 description:
3615 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3616 fullPayment: false,
3617 gallery: [
3618 {
3619 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3620 },
3621 {
3622 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3623 },
3624 {
3625 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3626 },
3627 {
3628 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3629 },
3630 {
3631 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3632 },
3633 ],
3634 locationId: 1,
3635 customPricing: false,
3636 customTickets: [
3637 {
3638 enabled: true,
3639 id: 1,
3640 eventId: 1,
3641 name: 'Ticket one',
3642 price: 10,
3643 sold: 0,
3644 spots: 20,
3645 },
3646 {
3647 enabled: true,
3648 id: 2,
3649 eventId: 1,
3650 name: 'Ticket two',
3651 price: 50,
3652 sold: 0,
3653 spots: 20,
3654 },
3655 {
3656 enabled: true,
3657 id: 2,
3658 eventId: 1,
3659 name: 'Ticket three',
3660 price: 100,
3661 sold: 0,
3662 spots: 20,
3663 },
3664 ],
3665 depositPerPerson: true,
3666 depositPayment: 'percentage',
3667 deposit: 10,
3668 maxCapacity: 9,
3669 maxCustomCapacity: null,
3670 maxExtraPeople: 3,
3671 name: 'Event 14',
3672 organizerId: 1,
3673 periods: [
3674 {
3675 id: 1,
3676 eventId: 1,
3677 periodStart: moment()
3678 .startOf('month')
3679 .add(1, 'month')
3680 .add(30, 'days')
3681 .add(5, 'hours')
3682 .format('YYYY-MM-DD hh:mm:ss'),
3683 periodEnd: moment()
3684 .startOf('month')
3685 .add(1, 'month')
3686 .add(32, 'days')
3687 .add(10, 'hours')
3688 .format('YYYY-MM-DD hh:mm:ss'),
3689 },
3690 ],
3691 pictureFullPath: null,
3692 pictureThumbPath: null,
3693 places: 1,
3694 price: 10,
3695 providers: [],
3696 show: true,
3697 status: 'approved',
3698 tags: [{}],
3699 },
3700 ])
3701 let upcomingEvents = ref(
3702 upcomingArray.value.filter(
3703 (e) => useEventStatus(e) === 'open' || useEventStatus(e) === 'upcoming',
3704 ),
3705 )
3706
3707 // * Upcoming Number
3708 let upcomingNumber = ref(1)
3709
3710 let upcomingRange = ref([
3711 moment().add(1, 'month').startOf('month').format('YYYY-MM-DD'),
3712 moment().add(1, 'month').startOf('month').format('YYYY-MM-DD'),
3713 ])
3714
3715 // * Sidebar tabs
3716 let sideTabs = ref([
3717 {
3718 title: computed(() => labelsDisplay('upcoming')),
3719 class: 'am-upcoming',
3720 },
3721 {
3722 title: computed(() => labelsDisplay('waiting_list')),
3723 class: 'am-waiting',
3724 },
3725 ])
3726 let activeTabIndex = ref(0)
3727
3728 // * Waiting array
3729 let waitingEvents = ref([
3730 {
3731 id: 3,
3732 bookable: true,
3733 color: '#fbc22d',
3734 opened: true,
3735 full: false,
3736 closed: false,
3737 description:
3738 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3739 fullPayment: false,
3740 gallery: [
3741 {
3742 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3743 },
3744 {
3745 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3746 },
3747 {
3748 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3749 },
3750 {
3751 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3752 },
3753 {
3754 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3755 },
3756 ],
3757 locationId: 1,
3758 customPricing: true,
3759 customTickets: [
3760 {
3761 enabled: true,
3762 id: 1,
3763 eventId: 1,
3764 name: 'Ticket one',
3765 price: 10,
3766 sold: 0,
3767 spots: 20,
3768 },
3769 {
3770 enabled: true,
3771 id: 2,
3772 eventId: 1,
3773 name: 'Ticket two',
3774 price: 50,
3775 sold: 0,
3776 spots: 20,
3777 },
3778 {
3779 enabled: true,
3780 id: 2,
3781 eventId: 1,
3782 name: 'Ticket three',
3783 price: 100,
3784 sold: 0,
3785 spots: 20,
3786 },
3787 ],
3788 depositPerPerson: true,
3789 depositPayment: 'percentage',
3790 deposit: 10,
3791 maxCapacity: 9,
3792 maxCustomCapacity: null,
3793 maxExtraPeople: 3,
3794 name: 'Event 3',
3795 organizerId: 1,
3796 periods: [
3797 {
3798 id: 1,
3799 eventId: 1,
3800 periodStart: moment()
3801 .startOf('month')
3802 .add(1, 'month')
3803 .add(8, 'days')
3804 .add(5, 'hours')
3805 .format('YYYY-MM-DD hh:mm:ss'),
3806 periodEnd: moment()
3807 .startOf('month')
3808 .add(1, 'month')
3809 .add(10, 'days')
3810 .add(10, 'hours')
3811 .format('YYYY-MM-DD hh:mm:ss'),
3812 },
3813 ],
3814 pictureFullPath: null,
3815 pictureThumbPath: null,
3816 places: 30,
3817 price: 10,
3818 providers: [],
3819 show: true,
3820 status: 'waiting',
3821 tags: [{}],
3822 },
3823 {
3824 id: 4,
3825 bookable: true,
3826 color: '#FA3C52',
3827 opened: true,
3828 full: false,
3829 closed: false,
3830 description:
3831 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3832 fullPayment: false,
3833 gallery: [
3834 {
3835 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3836 },
3837 {
3838 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3839 },
3840 {
3841 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3842 },
3843 {
3844 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3845 },
3846 {
3847 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3848 },
3849 ],
3850 locationId: 1,
3851 customPricing: true,
3852 customTickets: [
3853 {
3854 enabled: true,
3855 id: 1,
3856 eventId: 1,
3857 name: 'Ticket one',
3858 price: 10,
3859 sold: 0,
3860 spots: 20,
3861 },
3862 {
3863 enabled: true,
3864 id: 2,
3865 eventId: 1,
3866 name: 'Ticket two',
3867 price: 50,
3868 sold: 0,
3869 spots: 20,
3870 },
3871 {
3872 enabled: true,
3873 id: 2,
3874 eventId: 1,
3875 name: 'Ticket three',
3876 price: 100,
3877 sold: 0,
3878 spots: 20,
3879 },
3880 ],
3881 depositPerPerson: true,
3882 depositPayment: 'percentage',
3883 deposit: 10,
3884 maxCapacity: 9,
3885 maxCustomCapacity: null,
3886 maxExtraPeople: 3,
3887 name: 'Event 4',
3888 organizerId: 1,
3889 periods: [
3890 {
3891 id: 1,
3892 eventId: 1,
3893 periodStart: moment()
3894 .startOf('month')
3895 .add(1, 'month')
3896 .add(10, 'days')
3897 .add(5, 'hours')
3898 .format('YYYY-MM-DD hh:mm:ss'),
3899 periodEnd: moment()
3900 .startOf('month')
3901 .add(1, 'month')
3902 .add(11, 'days')
3903 .add(10, 'hours')
3904 .format('YYYY-MM-DD hh:mm:ss'),
3905 },
3906 ],
3907 pictureFullPath: null,
3908 pictureThumbPath: null,
3909 places: 30,
3910 price: 10,
3911 providers: [],
3912 show: true,
3913 status: 'waiting',
3914 tags: [{}],
3915 },
3916 {
3917 id: 6,
3918 bookable: false,
3919 color: '#689BCA',
3920 opened: false,
3921 full: false,
3922 closed: false,
3923 upcoming: true,
3924 description:
3925 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
3926 fullPayment: false,
3927 gallery: [
3928 {
3929 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3930 },
3931 {
3932 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3933 },
3934 {
3935 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3936 },
3937 {
3938 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3939 },
3940 {
3941 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
3942 },
3943 ],
3944 locationId: 1,
3945 customPricing: true,
3946 customTickets: [
3947 {
3948 enabled: true,
3949 id: 1,
3950 eventId: 1,
3951 name: 'Ticket one',
3952 price: 10,
3953 sold: 0,
3954 spots: 20,
3955 },
3956 {
3957 enabled: true,
3958 id: 2,
3959 eventId: 1,
3960 name: 'Ticket two',
3961 price: 50,
3962 sold: 0,
3963 spots: 20,
3964 },
3965 {
3966 enabled: true,
3967 id: 2,
3968 eventId: 1,
3969 name: 'Ticket three',
3970 price: 100,
3971 sold: 0,
3972 spots: 20,
3973 },
3974 ],
3975 depositPerPerson: true,
3976 depositPayment: 'percentage',
3977 deposit: 10,
3978 maxCapacity: 9,
3979 maxCustomCapacity: null,
3980 maxExtraPeople: 3,
3981 name: 'Event 6',
3982 organizerId: 1,
3983 periods: [
3984 {
3985 id: 1,
3986 eventId: 1,
3987 periodStart: moment()
3988 .startOf('month')
3989 .add(1, 'month')
3990 .add(15, 'days')
3991 .add(5, 'hours')
3992 .format('YYYY-MM-DD hh:mm:ss'),
3993 periodEnd: moment()
3994 .startOf('month')
3995 .add(1, 'month')
3996 .add(15, 'days')
3997 .add(10, 'hours')
3998 .format('YYYY-MM-DD hh:mm:ss'),
3999 },
4000 ],
4001 pictureFullPath: null,
4002 pictureThumbPath: null,
4003 places: 30,
4004 price: 10,
4005 providers: [],
4006 show: true,
4007 status: 'waiting',
4008 tags: [{}],
4009 },
4010 {
4011 id: 7,
4012 bookable: true,
4013 color: '#26CC2B',
4014 opened: true,
4015 full: false,
4016 closed: false,
4017 description:
4018 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
4019 fullPayment: false,
4020 gallery: [
4021 {
4022 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4023 },
4024 {
4025 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4026 },
4027 {
4028 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4029 },
4030 {
4031 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4032 },
4033 {
4034 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4035 },
4036 ],
4037 locationId: 1,
4038 customPricing: false,
4039 customTickets: [
4040 {
4041 enabled: true,
4042 id: 1,
4043 eventId: 1,
4044 name: 'Ticket one',
4045 price: 10,
4046 sold: 0,
4047 spots: 20,
4048 },
4049 {
4050 enabled: true,
4051 id: 2,
4052 eventId: 1,
4053 name: 'Ticket two',
4054 price: 50,
4055 sold: 0,
4056 spots: 20,
4057 },
4058 {
4059 enabled: true,
4060 id: 2,
4061 eventId: 1,
4062 name: 'Ticket three',
4063 price: 100,
4064 sold: 0,
4065 spots: 20,
4066 },
4067 ],
4068 depositPerPerson: true,
4069 depositPayment: 'percentage',
4070 deposit: 10,
4071 maxCapacity: 9,
4072 maxCustomCapacity: null,
4073 maxExtraPeople: 3,
4074 name: 'Event 7',
4075 organizerId: 1,
4076 periods: [
4077 {
4078 id: 1,
4079 eventId: 1,
4080 periodStart: moment()
4081 .startOf('month')
4082 .add(1, 'month')
4083 .add(16, 'days')
4084 .add(5, 'hours')
4085 .format('YYYY-MM-DD hh:mm:ss'),
4086 periodEnd: moment()
4087 .startOf('month')
4088 .add(1, 'month')
4089 .add(17, 'days')
4090 .add(10, 'hours')
4091 .format('YYYY-MM-DD hh:mm:ss'),
4092 },
4093 ],
4094 pictureFullPath: null,
4095 pictureThumbPath: null,
4096 places: 1,
4097 price: 10,
4098 providers: [],
4099 show: true,
4100 status: 'waiting',
4101 tags: [{}],
4102 },
4103 {
4104 id: 8,
4105 bookable: true,
4106 color: '#FD7E35',
4107 opened: true,
4108 full: false,
4109 closed: false,
4110 description:
4111 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
4112 fullPayment: false,
4113 gallery: [
4114 {
4115 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4116 },
4117 {
4118 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4119 },
4120 {
4121 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4122 },
4123 {
4124 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4125 },
4126 {
4127 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4128 },
4129 ],
4130 locationId: 1,
4131 customPricing: false,
4132 customTickets: [
4133 {
4134 enabled: true,
4135 id: 1,
4136 eventId: 1,
4137 name: 'Ticket one',
4138 price: 10,
4139 sold: 0,
4140 spots: 20,
4141 },
4142 {
4143 enabled: true,
4144 id: 2,
4145 eventId: 1,
4146 name: 'Ticket two',
4147 price: 50,
4148 sold: 0,
4149 spots: 20,
4150 },
4151 {
4152 enabled: true,
4153 id: 2,
4154 eventId: 1,
4155 name: 'Ticket three',
4156 price: 100,
4157 sold: 0,
4158 spots: 20,
4159 },
4160 ],
4161 depositPerPerson: true,
4162 depositPayment: 'percentage',
4163 deposit: 10,
4164 maxCapacity: 9,
4165 maxCustomCapacity: null,
4166 maxExtraPeople: 3,
4167 name: 'Event 8',
4168 organizerId: 1,
4169 periods: [
4170 {
4171 id: 1,
4172 eventId: 1,
4173 periodStart: moment()
4174 .startOf('month')
4175 .add(1, 'month')
4176 .add(17, 'days')
4177 .add(5, 'hours')
4178 .format('YYYY-MM-DD hh:mm:ss'),
4179 periodEnd: moment()
4180 .startOf('month')
4181 .add(1, 'month')
4182 .add(20, 'days')
4183 .add(10, 'hours')
4184 .format('YYYY-MM-DD hh:mm:ss'),
4185 },
4186 ],
4187 pictureFullPath: null,
4188 pictureThumbPath: null,
4189 places: 1,
4190 price: 10,
4191 providers: [],
4192 show: true,
4193 status: 'waiting',
4194 tags: [{}],
4195 },
4196 {
4197 id: 9,
4198 bookable: true,
4199 color: '#E38587',
4200 opened: true,
4201 full: false,
4202 closed: false,
4203 description:
4204 "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
4205 fullPayment: false,
4206 gallery: [
4207 {
4208 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4209 },
4210 {
4211 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4212 },
4213 {
4214 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4215 },
4216 {
4217 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4218 },
4219 {
4220 pictureFullPath: `${baseUrls.value.wpAmeliaPluginURL}v3/src/assets/img/admin/customize/img_holder1.svg`,
4221 },
4222 ],
4223 locationId: 1,
4224 customPricing: false,
4225 customTickets: [
4226 {
4227 enabled: true,
4228 id: 1,
4229 eventId: 1,
4230 name: 'Ticket one',
4231 price: 10,
4232 sold: 0,
4233 spots: 20,
4234 },
4235 {
4236 enabled: true,
4237 id: 2,
4238 eventId: 1,
4239 name: 'Ticket two',
4240 price: 50,
4241 sold: 0,
4242 spots: 20,
4243 },
4244 {
4245 enabled: true,
4246 id: 2,
4247 eventId: 1,
4248 name: 'Ticket three',
4249 price: 100,
4250 sold: 0,
4251 spots: 20,
4252 },
4253 ],
4254 depositPerPerson: true,
4255 depositPayment: 'percentage',
4256 deposit: 10,
4257 maxCapacity: 9,
4258 maxCustomCapacity: null,
4259 maxExtraPeople: 3,
4260 name: 'Event 9',
4261 organizerId: 1,
4262 periods: [
4263 {
4264 id: 1,
4265 eventId: 1,
4266 periodStart: moment()
4267 .startOf('month')
4268 .add(1, 'month')
4269 .add(18, 'days')
4270 .add(5, 'hours')
4271 .format('YYYY-MM-DD hh:mm:ss'),
4272 periodEnd: moment()
4273 .startOf('month')
4274 .add(1, 'month')
4275 .add(21, 'days')
4276 .add(10, 'hours')
4277 .format('YYYY-MM-DD hh:mm:ss'),
4278 },
4279 ],
4280 pictureFullPath: null,
4281 pictureThumbPath: null,
4282 places: 1,
4283 price: 10,
4284 providers: [],
4285 show: true,
4286 status: 'waiting',
4287 tags: [{}],
4288 },
4289 ])
4290
4291 function calculatedEventPrice(evt) {
4292 if (evt.customPricing) {
4293 if (useCheckIfEventNotFree(evt)) {
4294 return `${labelsDisplay('from')} ${useFormattedPrice(useMinTicketPrice(evt))}`
4295 } else {
4296 return labelsDisplay('event_free')
4297 }
4298 }
4299
4300 return useCheckIfEventNotFree(evt) ? useFormattedPrice(evt.price) : labelsDisplay('event_free')
4301 }
4302
4303 function multipleDaysEvent(arr) {
4304 let testArr = []
4305 arr.forEach((period) => {
4306 testArr.push(period.periodStart.split(' ')[0])
4307 testArr.push(period.periodEnd.split(' ')[0])
4308 })
4309
4310 return !testArr.every((val) => val === testArr[0])
4311 }
4312
4313 function eventPlacesBlock(evt) {
4314 let spots = placesCalculation(evt)
4315 let spotsText = spots === 1 ? labelsDisplay('event_slot_left') : labelsDisplay('event_slots_left')
4316 let noSpotsText = labelsDisplay('event_no_spots')
4317
4318 return spots <= 0 ? noSpotsText : spotsText
4319 }
4320
4321 let taxVisibility = computed(() => {
4322 return (
4323 amSettings.payments?.taxes?.enabled &&
4324 customizeOptions.value.tax.visibility &&
4325 !licence.isStarter &&
4326 !licence.isLite
4327 )
4328 })
4329
4330 // * Window resize
4331 window.addEventListener('resize', handleResize)
4332 function handleResize() {
4333 eventCalendarRef.value.getApi().render()
4334 }
4335
4336 onBeforeUnmount(() => {
4337 window.removeEventListener('resize', handleResize)
4338 })
4339
4340 // * Colors
4341 let amColors = inject('amColors')
4342
4343 // * CSS Vars
4344 let cssVars = computed(() => {
4345 return {
4346 '--am-c-ecal-bgr': amColors.value.colorMainBgr,
4347 '--am-c-ecal-heading-text': amColors.value.colorMainHeadingText,
4348 '--am-c-ecal-heading-text-op70': useColorTransparency(amColors.value.colorMainHeadingText, 0.7),
4349 '--am-c-ecal-text': amColors.value.colorMainText,
4350 '--am-c-ecal-text-op03': useColorTransparency(amColors.value.colorMainText, 0.03),
4351 '--am-c-ecal-text-op05': useColorTransparency(amColors.value.colorMainText, 0.05),
4352 '--am-c-ecal-text-op10': useColorTransparency(amColors.value.colorMainText, 0.1),
4353 '--am-c-ecal-text-op20': useColorTransparency(amColors.value.colorMainText, 0.2),
4354 '--am-c-ecal-text-op30': useColorTransparency(amColors.value.colorMainText, 0.3),
4355 '--am-c-ecal-text-op50': useColorTransparency(amColors.value.colorMainText, 0.5),
4356 '--am-c-ecal-text-op70': useColorTransparency(amColors.value.colorMainText, 0.7),
4357 '--am-c-ecal-card-bgr': amColors.value.colorCardBgr,
4358 '--am-c-ecal-card-border': amColors.value.colorCardBorder,
4359 '--am-c-ecal-card-border-op10': useColorTransparency(amColors.value.colorCardBorder, 0.1),
4360 '--am-c-ecal-card-text': amColors.value.colorCardText,
4361 '--am-c-ecal-card-text-op80': useColorTransparency(amColors.value.colorCardText, 0.8),
4362 '--am-c-ecal-card-text-op50': useColorTransparency(amColors.value.colorCardText, 0.5),
4363 '--am-c-ecal-error': amColors.value.colorError,
4364 '--am-c-ecal-primary': amColors.value.colorPrimary,
4365 '--am-c-ecal-primary-op30': useColorTransparency(amColors.value.colorPrimary, 0.3),
4366 '--am-c-ecal-success': amColors.value.colorSuccess,
4367 '--am-c-ecal-warning': amColors.value.colorWarning,
4368 }
4369 })
4370 </script>
4371
4372 <script>
4373 export default {
4374 name: 'EventsCalendar',
4375 key: 'calendar',
4376 }
4377 </script>
4378
4379 <style lang="scss">
4380 @import '../../../../../../assets/scss/common/transitions/_transitions-mixin.scss';
4381
4382 //ecs - event calendar step
4383 @mixin am-ecs-block {
4384 .am-ecs {
4385 &__page {
4386 display: flex;
4387 background-color: var(--am-c-ecal-bgr);
4388 border-radius: 8px;
4389 border: 1px solid var(--am-c-ecal-text-op10);
4390 box-shadow: 0 5px 5px 0 var(--am-c-ecal-text-op03);
4391
4392 &.am-tablet {
4393 flex-wrap: wrap;
4394 }
4395
4396 * {
4397 font-family: var(--am-font-family, 'Amelia Roboto'), sans-serif;
4398 font-style: initial;
4399 box-sizing: border-box;
4400 text-decoration: unset;
4401 }
4402 }
4403
4404 &__filters {
4405 @include slide-fade;
4406 margin: 16px;
4407
4408 &-top {
4409 display: flex;
4410 align-items: center;
4411 justify-content: center;
4412 }
4413
4414 &-search {
4415 flex: 0 1 auto;
4416 width: 100%;
4417 }
4418
4419 &-btn {
4420 margin-left: 8px;
4421
4422 &.am-rw-500 {
4423 width: auto;
4424 }
4425
4426 &.am-single {
4427 margin: 0 0 0 auto;
4428 }
4429
4430 .am-button {
4431 width: 100%;
4432
4433 &__inner {
4434 width: 100%;
4435 justify-content: space-evenly;
4436
4437 span {
4438 line-height: 1;
4439 }
4440 }
4441
4442 .am-icon-filter {
4443 font-size: 20px;
4444 }
4445 }
4446 }
4447
4448 &-menu {
4449 display: flex;
4450 align-items: center;
4451 justify-content: space-between;
4452 margin: 16px 0 0;
4453 background-color: var(--am-c-ecal-text-op03);
4454 border-radius: 6px;
4455 padding: 12px 20px;
4456
4457 &.am-rw-650 {
4458 flex-wrap: wrap;
4459 }
4460
4461 &__items {
4462 width: 100%;
4463
4464 &.am-mw {
4465 &25 {
4466 max-width: calc(25% - 16px);
4467
4468 &.am-rw-650 {
4469 max-width: calc(50% - 4px);
4470 padding: 4px 0;
4471 }
4472
4473 &.am-rw-420 {
4474 max-width: 100%;
4475 }
4476 }
4477
4478 &33 {
4479 max-width: calc(33.333% - 16px);
4480 &.am-rw-600 {
4481 max-width: calc(50% - 4px);
4482 padding: 4px 0;
4483
4484 &:last-child {
4485 max-width: 100%;
4486 }
4487 }
4488
4489 &.am-rw-420 {
4490 max-width: 100%;
4491 }
4492 }
4493
4494 &50 {
4495 max-width: calc(50% - 16px);
4496
4497 &.am-rw-600 {
4498 max-width: calc(50% - 4px);
4499 }
4500
4501 &.am-rw-420 {
4502 max-width: 100%;
4503 padding: 4px 0;
4504 }
4505 }
4506
4507 &100 {
4508 max-width: 100%;
4509 }
4510 }
4511
4512 & .am-select {
4513 .el-select__tags {
4514 & > span {
4515 width: 100%;
4516 display: flex;
4517 align-items: center;
4518 justify-content: space-between;
4519 flex-wrap: nowrap;
4520
4521 .el-tag {
4522 background-color: transparent;
4523 border: none;
4524 font-size: 14px;
4525 font-weight: 500;
4526
4527 &.is-hit {
4528 width: calc(100% - 24px);
4529 padding: 0 0 0 8px;
4530
4531 .el-tag__content {
4532 width: 100%;
4533 }
4534 }
4535
4536 &:not(.is-hit) {
4537 width: 24px;
4538 }
4539
4540 &__close {
4541 display: none;
4542 }
4543
4544 .el-select__tags-text {
4545 display: block;
4546 max-width: unset !important;
4547 width: 100%;
4548 text-overflow: ellipsis;
4549 overflow: hidden;
4550 white-space: nowrap;
4551 color: var(--am-c-inp-text);
4552 font-size: 14px;
4553 font-weight: 500;
4554 }
4555 }
4556 }
4557 }
4558
4559 .el-input__prefix {
4560 left: 4px;
4561 font-size: 25px;
4562
4563 span {
4564 color: var(--am-c-select-placeholder);
4565 }
4566 }
4567 }
4568 }
4569 }
4570 }
4571
4572 &__header {
4573 display: flex;
4574 flex-wrap: wrap;
4575 align-items: center;
4576 justify-content: space-between;
4577 margin: 8px 16px;
4578
4579 &-inner {
4580 display: flex;
4581 align-items: center;
4582 justify-content: flex-start;
4583 margin: 8px 0;
4584 }
4585
4586 &-actions {
4587 display: flex;
4588 align-items: center;
4589 justify-content: flex-start;
4590 }
4591
4592 &-today {
4593 &.am-button.am-button--small {
4594 --am-padd-btn: 6px 30px;
4595 margin: 0 16px 0 0;
4596 }
4597 }
4598
4599 &-prev {
4600 &.am-button.am-button--small {
4601 --am-fs-btn: 16px;
4602 margin: 0 8px 0 0;
4603 }
4604 }
4605
4606 &-next {
4607 &.am-button.am-button--small {
4608 --am-fs-btn: 16px;
4609 margin: 0 16px 0 0;
4610 }
4611 }
4612
4613 &-text {
4614 font-size: 18px;
4615 font-weight: 500;
4616 line-height: 1.555556;
4617 color: var(--am-c-ecal-heading-text);
4618 }
4619
4620 &-selection {
4621 display: flex;
4622 align-items: center;
4623 justify-content: space-between;
4624 width: 40%;
4625 margin: 8px 0;
4626
4627 &.am-rw-650 {
4628 width: 100%;
4629 }
4630
4631 .am-select-wrapper {
4632 width: calc(50% - 3px);
4633 }
4634 }
4635 }
4636
4637 &__main {
4638 width: calc(100% - 290px);
4639
4640 &.am-full-width {
4641 width: 100%;
4642 }
4643 }
4644
4645 &__side {
4646 max-width: 290px;
4647 width: 100%;
4648 border-radius: 8px;
4649 background-color: var(--am-c-ecal-text-op03);
4650
4651 &-header {
4652 padding: 16px 24px 0;
4653
4654 &__text {
4655 font-size: 24px;
4656 font-style: normal;
4657 font-weight: 500;
4658 line-height: 1.33333;
4659 color: var(--am-c-ecal-heading-text);
4660 margin: 0 0 12px;
4661 }
4662
4663 &__range {
4664 display: flex;
4665 align-items: center;
4666 justify-content: flex-start;
4667 flex-wrap: wrap;
4668 font-size: 15px;
4669 font-style: normal;
4670 font-weight: 500;
4671 line-height: 1.6;
4672 color: var(--am-c-ecal-heading-text-op70);
4673 margin: 0 0 12px;
4674 }
4675
4676 &__actions {
4677 display: flex;
4678 align-items: center;
4679 justify-content: space-between;
4680 margin: 0 0 12px;
4681 }
4682
4683 &__btn.am-button.am-button--small.is-icon-only {
4684 width: calc(50% - 4px);
4685 font-size: 16px;
4686 }
4687 }
4688
4689 &-tab {
4690 display: flex;
4691 align-items: center;
4692 justify-content: space-between;
4693 padding: 16px 24px 12px;
4694
4695 &__item {
4696 position: relative;
4697 display: flex;
4698 align-items: center;
4699 justify-content: center;
4700 width: calc(50% - 4px);
4701 padding: 12px 16px 10px 16px;
4702 color: var(--am-c-ecal-text);
4703 background-color: var(--am-c-ecal-text-op05);
4704 border-radius: 9px 9px 0 0;
4705 font-size: 14px;
4706 font-style: normal;
4707 font-weight: 500;
4708 line-height: 1.42857;
4709 cursor: pointer;
4710 transition: all 0.3s ease-in-out;
4711
4712 &:hover:not(.am-active) {
4713 background-color: var(--am-c-ecal-text-op10);
4714 }
4715
4716 &:after {
4717 content: '';
4718 display: block;
4719 width: 100%;
4720 height: 1px;
4721 position: absolute;
4722 bottom: -3px;
4723 left: 0;
4724 background-color: var(--am-c-ecal-text-op20);
4725 }
4726
4727 &.am-upcoming {
4728 &.am-active {
4729 color: var(--am-c-ecal-bgr);
4730 background-color: var(--am-c-ecal-primary);
4731
4732 &:after {
4733 background-color: var(--am-c-ecal-primary);
4734 }
4735 }
4736 }
4737
4738 &.am-waiting {
4739 &.am-active {
4740 color: var(--am-c-ecal-bgr);
4741 background-color: var(--am-c-ecal-warning);
4742
4743 &:after {
4744 background-color: var(--am-c-ecal-warning);
4745 }
4746 }
4747 }
4748 }
4749 }
4750
4751 &-main {
4752 padding: 0 24px;
4753 overflow-x: hidden;
4754
4755 // Main Scroll styles
4756 &::-webkit-scrollbar {
4757 width: 6px;
4758 }
4759
4760 &::-webkit-scrollbar-thumb {
4761 border-radius: 6px;
4762 background: var(--am-c-scroll-op30);
4763 }
4764
4765 &::-webkit-scrollbar-track {
4766 border-radius: 6px;
4767 background: var(--am-c-scroll-op10);
4768 }
4769 }
4770
4771 &-card {
4772 display: flex;
4773 flex-wrap: wrap;
4774 width: 100%;
4775 padding: 12px 16px 12px 24px;
4776 border-radius: 8px;
4777 background-color: var(--am-c-ecal-card-bgr);
4778 box-shadow:
4779 4px 0 0 0 var(--am-c-evt) inset,
4780 0 2px 2px -1px var(--am-c-ecal-card-border),
4781 0 0 11px 0px var(--am-c-ecal-card-border-op10);
4782 margin: 0 0 12px;
4783 cursor: pointer;
4784 transition: background-color 0.2s ease-in-out;
4785
4786 &:hover {
4787 background-color: var(--am-c-evt-op05);
4788 }
4789
4790 &__header {
4791 width: 100%;
4792 display: flex;
4793 align-items: center;
4794 justify-content: space-between;
4795 margin: 0 0 4px;
4796 }
4797
4798 &__begins {
4799 font-size: 12px;
4800 font-style: normal;
4801 font-weight: 400;
4802 line-height: 1.5;
4803 color: var(--am-c-ecal-card-text-op50);
4804 }
4805
4806 &__price {
4807 text-align: end;
4808 font-size: 13px;
4809 font-style: normal;
4810 font-weight: 700;
4811 line-height: 1.38462;
4812 color: var(--am-c-ecal-primary);
4813 margin-left: auto;
4814 }
4815
4816 &__date-time {
4817 display: flex;
4818 align-items: center;
4819 justify-content: flex-start;
4820 flex: 0 0 auto;
4821 gap: 4px;
4822 }
4823
4824 &__day {
4825 font-size: 18px;
4826 font-style: normal;
4827 font-weight: 500;
4828 line-height: 1.111111;
4829 color: var(--am-c-ecal-card-text);
4830 }
4831
4832 &__month,
4833 &__at,
4834 &__time,
4835 &__year {
4836 font-size: 14px;
4837 font-style: normal;
4838 font-weight: 400;
4839 line-height: 1;
4840 color: var(--am-c-ecal-card-text);
4841 }
4842
4843 &__name {
4844 width: 100%;
4845 font-size: 14px;
4846 font-style: normal;
4847 font-weight: 700;
4848 line-height: 1.42857;
4849 color: var(--am-c-ecal-card-text);
4850 margin: 8px 0 0;
4851 }
4852
4853 &__location {
4854 width: 100%;
4855 font-size: 13px;
4856 font-style: normal;
4857 font-weight: 400;
4858 line-height: 1.38462;
4859 color: var(--am-c-ecal-card-text-op80);
4860 margin: 4px 0 0;
4861 }
4862
4863 &__footer {
4864 width: 100%;
4865 display: flex;
4866 align-items: center;
4867 justify-content: space-between;
4868 }
4869
4870 &__status {
4871 font-size: 13px;
4872 font-style: normal;
4873 font-weight: 700;
4874 line-height: 1.38462; /* 138.462% */
4875
4876 &.am-open {
4877 color: var(--am-c-ecal-success);
4878 }
4879 &.am-full {
4880 color: var(--am-c-ecal-primary);
4881 }
4882 &.am-upcoming {
4883 color: var(--am-c-ecal-warning);
4884 }
4885 &.am-waiting {
4886 color: var(--am-c-ecal-warning);
4887 }
4888 }
4889
4890 &__spots {
4891 font-size: 13px;
4892 font-style: normal;
4893 font-weight: 400;
4894 line-height: 1.38462; /* 138.462% */
4895 color: var(--am-c-ecal-card-text-op80);
4896 margin-left: auto;
4897
4898 &-numb {
4899 font-weight: 700;
4900 margin: 0 4px 0 0;
4901 }
4902 }
4903 }
4904
4905 &-empty {
4906 display: flex;
4907 align-items: center;
4908 justify-content: center;
4909 text-align: center;
4910 color: var(--am-c-ecal-card-text);
4911 font-size: 16px;
4912 margin: 16px 0;
4913 }
4914
4915 &.am-full-width {
4916 max-width: 100%;
4917
4918 .am-ecs__side {
4919 &-header {
4920 width: 100%;
4921 display: flex;
4922 flex-wrap: wrap;
4923 align-items: center;
4924 justify-content: space-between;
4925
4926 &__actions {
4927 max-width: 100px;
4928 width: 100%;
4929 }
4930 }
4931
4932 &-main {
4933 display: flex;
4934 flex-wrap: wrap;
4935 justify-content: space-between;
4936 }
4937
4938 &-card {
4939 width: calc(33.33333% - 6px);
4940
4941 &.am-rw-768 {
4942 width: calc(50% - 6px);
4943 }
4944
4945 &.am-rw-600 {
4946 width: 100%;
4947 }
4948 }
4949 }
4950 }
4951 }
4952
4953 .fc {
4954 &.fc-theme-standard {
4955 .fc-scrollgrid-liquid {
4956 border: none;
4957 }
4958
4959 .fc-scrollgrid-liquid {
4960 // calendar heading
4961 .fc-scrollgrid-section-header {
4962 & > th {
4963 background-color: var(--am-c-ecal-text-op03);
4964 border-right: none;
4965 border-left: none;
4966 }
4967
4968 .fc-col-header-cell {
4969 border: none;
4970 }
4971
4972 .fc-scrollgrid-sync-inner {
4973 display: flex;
4974 align-items: center;
4975 justify-content: center;
4976 }
4977
4978 .fc-col-header-cell-cushion {
4979 font-size: 12px;
4980 font-weight: 400;
4981 line-height: 1;
4982 text-transform: uppercase;
4983 color: var(--am-c-ecal-text-op50);
4984 padding: 7px 0;
4985 }
4986 }
4987
4988 // calendar body
4989 .fc-scrollgrid-section-body {
4990 & > td {
4991 border: none;
4992 }
4993 }
4994
4995 .fc-scrollgrid-sync-table {
4996 tr {
4997 &:last-of-type {
4998 td {
4999 border-bottom: none;
5000 }
5001 }
5002 }
5003
5004 td {
5005 border: 1px solid var(--am-c-ecal-text-op05);
5006 padding: 4px 0 0;
5007 background-color: transparent;
5008
5009 &:first-of-type {
5010 border-left: none;
5011 }
5012
5013 &:last-of-type {
5014 border-right: none;
5015 }
5016
5017 .fc-highlight {
5018 background-color: transparent;
5019 }
5020 }
5021
5022 .fc-daygrid-day-number {
5023 font-size: 14px;
5024 font-weight: 400;
5025 line-height: 1.42857;
5026 color: var(--am-c-ecal-text);
5027 padding: 0 4px;
5028 }
5029
5030 .am-evt-day-wrapper.mobile {
5031 &.fc-day-today {
5032 .fc-daygrid-day-number {
5033 color: var(--am-c-ecal-bgr);
5034 }
5035 }
5036
5037 .fc-daygrid-day {
5038 &-top {
5039 padding: 6px 0;
5040
5041 &:before {
5042 left: 50%;
5043 transform: translate(-50%, -50%);
5044 width: 20px;
5045 height: 20px;
5046 }
5047 }
5048
5049 &-number {
5050 width: 100%;
5051 text-align: center;
5052 line-height: 1;
5053 }
5054
5055 &-events {
5056 height: calc(100% - 26px);
5057 }
5058 }
5059 }
5060 }
5061 }
5062 }
5063 }
5064
5065 .am-evt {
5066 &-day {
5067 &-wrapper {
5068 &.fc-popover {
5069 max-width: 430px;
5070 background-color: var(--am-c-ecal-bgr);
5071 border-radius: 8px;
5072 overflow: hidden;
5073
5074 .fc-popover {
5075 &-header {
5076 padding: 16px 16px 8px;
5077 background-color: transparent;
5078 }
5079
5080 &-title {
5081 font-size: 15px;
5082 font-style: normal;
5083 font-weight: 500;
5084 line-height: 1.333333; /* 133.333% */
5085 color: var(--am-c-ecal-text);
5086 }
5087
5088 &-close {
5089 font-size: 18px;
5090 line-height: 1;
5091 color: var(--am-c-ecal-text);
5092
5093 &:hover {
5094 color: var(--am-c-ecal-text-op70);
5095 }
5096 }
5097
5098 &-body {
5099 background-color: var(--am-c-ecal-bgr);
5100 padding: 0 16px 16px;
5101
5102 .fc-daygrid-event-harness {
5103 background-color: transparent;
5104 }
5105
5106 .am-evt-block {
5107 &:focus {
5108 background-color: transparent;
5109
5110 &:after {
5111 background-color: transparent;
5112 }
5113 }
5114 }
5115 }
5116 }
5117 }
5118
5119 &.fc-day-today {
5120 .fc-daygrid-day-top {
5121 position: relative;
5122
5123 &::before {
5124 content: '';
5125 position: absolute;
5126 top: 50%;
5127 left: 8px;
5128 display: block;
5129 width: 8px;
5130 height: 8px;
5131 border-radius: 50%;
5132 background-color: var(--am-c-ecal-error);
5133 transform: translateY(-50%);
5134 }
5135 }
5136 }
5137 }
5138 }
5139
5140 &-block {
5141 background-color: var(--am-c-main-bgr);
5142 border-radius: 4px;
5143 text-decoration: none;
5144 margin: 0 4px 4px;
5145 border: none;
5146
5147 &:hover {
5148 text-decoration: none;
5149 cursor: pointer;
5150 }
5151
5152 &:focus {
5153 &:after {
5154 background-color: transparent;
5155 }
5156 }
5157 }
5158
5159 &-wrapper {
5160 position: relative;
5161 display: flex;
5162 flex-wrap: wrap;
5163 flex-direction: row;
5164 align-items: center;
5165 justify-content: flex-start;
5166 width: 100%;
5167 height: auto;
5168 border-radius: 4px;
5169 padding: 2px 2px 2px 6px;
5170 overflow: hidden;
5171 box-shadow:
5172 2px 0 0 0 var(--am-c-evt) inset,
5173 0px 1px 1px 0px var(--am-c-ecal-text-op30);
5174 box-sizing: border-box;
5175 transition: 0.5s all ease-in-out;
5176
5177 &.am-evt-hovered {
5178 .am-evt-background {
5179 opacity: 0.25;
5180 }
5181 }
5182
5183 // status styles for event cards
5184 &.am-evt {
5185 &-closed {
5186 .am-evt {
5187 &-background {
5188 background-color: var(--am-c-ecal-text-op03);
5189 opacity: 1;
5190 }
5191
5192 &-time {
5193 color: var(--am-c-ecal-text-op30);
5194 }
5195
5196 &-text {
5197 color: var(--am-c-ecal-text-op50);
5198 }
5199
5200 &-spots-left {
5201 color: var(--am-c-ecal-text-op30);
5202 }
5203 }
5204 }
5205
5206 &-canceled {
5207 box-shadow: 0 1px 1px 0 var(--am-c-ecal-text-op30);
5208
5209 .am-evt {
5210 &-background {
5211 background-color: var(--am-c-ecal-text-op03);
5212 opacity: 1;
5213 }
5214
5215 &-time {
5216 color: var(--am-c-ecal-text-op30);
5217 }
5218
5219 &-text {
5220 color: var(--am-c-ecal-text-op50);
5221 }
5222
5223 &-spots-left {
5224 color: var(--am-c-ecal-text-op30);
5225 }
5226 }
5227 }
5228
5229 &-full {
5230 .am-evt {
5231 &-time {
5232 color: var(--am-c-ecal-text-op30);
5233 }
5234
5235 &-text {
5236 color: var(--am-c-ecal-text-op50);
5237 }
5238
5239 &-spots-left {
5240 color: var(--am-c-ecal-text-op30);
5241 }
5242 }
5243 }
5244 }
5245 }
5246
5247 &-time {
5248 display: flex;
5249 width: 100%;
5250 font-size: 11px;
5251 font-weight: 500;
5252 line-height: 1.454545;
5253 color: var(--am-c-ecal-text-op70);
5254 margin: 0;
5255 padding: 0;
5256 text-overflow: ellipsis;
5257 white-space: nowrap;
5258 overflow: hidden;
5259 }
5260
5261 &-inner {
5262 display: flex;
5263 overflow: hidden;
5264 }
5265
5266 &-background {
5267 position: absolute;
5268 top: 0;
5269 left: 0;
5270 width: 100%;
5271 height: 100%;
5272 opacity: 0.08;
5273 z-index: -1;
5274 background-color: var(--am-c-evt);
5275 }
5276
5277 &-color {
5278 position: absolute;
5279 top: 4px;
5280 left: 4px;
5281 width: 4px;
5282 height: calc(100% - 8px);
5283 border-radius: 2px;
5284 }
5285
5286 &-text {
5287 display: inline-block;
5288 font-size: 12px;
5289 font-weight: 500;
5290 line-height: 1.333333;
5291 color: var(--am-c-ecal-text);
5292 margin: 0;
5293 text-overflow: ellipsis;
5294 white-space: nowrap;
5295 overflow: hidden;
5296 }
5297
5298 &-spots-left {
5299 flex: 1;
5300 font-size: 11px;
5301 font-weight: 500;
5302 line-height: 1.27273;
5303 color: var(--am-c-ecal-text-op70);
5304 padding: 0;
5305 overflow: hidden;
5306 white-space: nowrap;
5307 text-overflow: ellipsis;
5308 }
5309
5310 &-spots {
5311 width: 100%;
5312 display: flex;
5313 flex-direction: row;
5314 justify-content: space-between;
5315 align-items: center;
5316 }
5317
5318 &-more-link {
5319 width: calc(100% - 8px);
5320 background-color: var(--am-c-ecal-text-op05);
5321 box-shadow: 0 1px 1px 0 var(--am-c-ecal-text-op30);
5322 border-radius: 4px;
5323 padding: 4px 6px;
5324 margin: 0 4px 2px;
5325
5326 &:hover {
5327 background-color: var(--am-c-ecal-text-op10);
5328 }
5329
5330 &.mobile {
5331 position: absolute;
5332 width: 100%;
5333 height: 100%;
5334 display: flex;
5335 align-items: center;
5336 justify-content: center;
5337 background-color: transparent;
5338 box-shadow: none;
5339 padding: 0;
5340 margin: 0;
5341 overflow: visible;
5342 }
5343
5344 &-inner {
5345 position: relative;
5346 width: 100%;
5347 font-size: 11px;
5348 font-weight: 500;
5349 line-height: 1.45455;
5350 color: var(--am-c-ecal-text-op70);
5351 z-index: 2;
5352 overflow: hidden;
5353 text-overflow: ellipsis;
5354 white-space: nowrap;
5355
5356 &.mobile {
5357 display: flex;
5358 width: 8px;
5359 height: 8px;
5360 align-items: center;
5361 justify-content: center;
5362 background-color: var(--am-c-ecal-primary);
5363 box-shadow: 0 1px 1px 0 var(--am-c-ecal-primary-op30);
5364 color: var(--am-c-ecal-bgr);
5365 font-size: 16px;
5366 line-height: 1;
5367 padding: 0;
5368 border-radius: 50%;
5369 overflow: visible;
5370 text-overflow: unset;
5371 white-space: normal;
5372 }
5373 }
5374 }
5375 }
5376 }
5377 }
5378
5379 #amelia-app-backend-new #amelia-container {
5380 @include am-ecs-block;
5381 }
5382 </style>
5383