mirror of
https://gitlab.com/openstapps/openstapps.git
synced 2026-04-09 16:03:06 +00:00
107 lines
3.1 KiB
HTML
107 lines
3.1 KiB
HTML
<!--
|
|
~ Copyright (C) 2022 StApps
|
|
~ This program is free software: you can redistribute it and/or modify it
|
|
~ under the terms of the GNU General Public License as published by the Free
|
|
~ Software Foundation, version 3.
|
|
~
|
|
~ This program is distributed in the hope that it will be useful, but WITHOUT
|
|
~ ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
|
|
~ FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
|
|
~ more details.
|
|
~
|
|
~ You should have received a copy of the GNU General Public License along with
|
|
~ this program. If not, see <https://www.gnu.org/licenses/>.
|
|
-->
|
|
<div class="header">
|
|
<ion-button
|
|
fill="clear"
|
|
class="left-button"
|
|
(click)="mainSwiper.swiperRef.slidePrev()"
|
|
>
|
|
<ion-icon slot="icon-only" name="navigate_before"></ion-icon>
|
|
</ion-button>
|
|
<ion-button
|
|
fill="clear"
|
|
class="right-button"
|
|
(click)="mainSwiper.swiperRef.slideNext()"
|
|
>
|
|
<ion-icon slot="icon-only" name="navigate_next"></ion-icon>
|
|
</ion-button>
|
|
<swiper
|
|
class="header-swiper"
|
|
#headerSwiper
|
|
[slidesPerView]="1"
|
|
(activeIndexChange)="syncSwiper(headerSwiper, mainSwiper)"
|
|
>
|
|
<ng-template let-index>
|
|
<div
|
|
*ngIf="index | dateFromIndex: baselineDate as date"
|
|
class="day-labels"
|
|
>
|
|
<ion-button
|
|
expand="block"
|
|
fill="clear"
|
|
[id]="'date-select-button' + index"
|
|
>
|
|
{{ dateRange.startDate }} - {{ dateRange.endDate }}
|
|
</ion-button>
|
|
|
|
<ion-popover [trigger]="'date-select-button' + index">
|
|
<ng-template>
|
|
<ion-datetime
|
|
#popoverDateTime
|
|
presentation="date"
|
|
[value]="date | amDateFormat: 'YYYY-MM-DD'"
|
|
(ionChange)="presentScheduleDatePopover(index, popoverDateTime)"
|
|
>
|
|
</ion-datetime>
|
|
</ng-template>
|
|
</ion-popover>
|
|
</div>
|
|
</ng-template>
|
|
</swiper>
|
|
</div>
|
|
|
|
<ion-content>
|
|
<div
|
|
class="schedule-wrapper"
|
|
[style.height.px]="scale * (hoursRange.to - hoursRange.from + 1) + scale"
|
|
>
|
|
<div class="hours-wrapper">
|
|
<!-- add margin top +45 to start below the date header -->
|
|
<div
|
|
class="hour-lines"
|
|
*ngFor="let i of hours"
|
|
[style.marginTop.px]="i * scale + 45"
|
|
>
|
|
{{ i + hoursRange.from }}
|
|
</div>
|
|
</div>
|
|
<div class="infinite-swiper-wrapper">
|
|
<swiper
|
|
#mainSwiper
|
|
[slidesPerView]="layout.days"
|
|
(indexChange)="onPageChange($event)"
|
|
(activeIndexChange)="syncSwiper(mainSwiper, headerSwiper)"
|
|
class="full-height"
|
|
>
|
|
<ng-template swiperSlide *ngFor="let day of weekDates; index as i">
|
|
<schedule-day
|
|
[day]="day"
|
|
[hoursRange]="hoursRange"
|
|
[scale]="scale"
|
|
[uuids]="uuids"
|
|
[dateSeries]="testSchedule[i]"
|
|
[layout]="layout"
|
|
[isLeftmost]="
|
|
dateRange.startDate ===
|
|
(i | dateFromIndex: baselineDate).format('DD.MM.YY')
|
|
"
|
|
>
|
|
</schedule-day>
|
|
</ng-template>
|
|
</swiper>
|
|
</div>
|
|
</div>
|
|
</ion-content>
|