From 781599e2b7947c54b70f7f29a7cc7f999522d239 Mon Sep 17 00:00:00 2001 From: Polianin Nikita Date: Tue, 11 Jun 2024 00:21:29 +0300 Subject: [PATCH] feat: add schedule page --- src/app/app.routes.ts | 4 + src/pages/schedule/schedule.component.css | 16 +++ src/pages/schedule/schedule.component.html | 5 + src/pages/schedule/schedule.component.ts | 115 +++++++++++++++++++++ 4 files changed, 140 insertions(+) create mode 100644 src/pages/schedule/schedule.component.css create mode 100644 src/pages/schedule/schedule.component.html create mode 100644 src/pages/schedule/schedule.component.ts diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index dc39edb..7a49e21 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -1,3 +1,7 @@ import { Routes } from '@angular/router'; +import {Routes} from '@angular/router'; +import {ScheduleComponent} from "@page/schedule/schedule.component"; export const routes: Routes = []; +export const routes: Routes = [ +]; diff --git a/src/pages/schedule/schedule.component.css b/src/pages/schedule/schedule.component.css new file mode 100644 index 0000000..8f0a297 --- /dev/null +++ b/src/pages/schedule/schedule.component.css @@ -0,0 +1,16 @@ +.schedule { + padding: 50px 15%; + min-height: 60vh; +} + +@media screen and (max-width: 599px) { + .schedule { + padding: 25px; + } +} + +@media screen and (min-width: 600px) and (max-width: 959px) { + .schedule { + padding: 30px 10%; + } +} diff --git a/src/pages/schedule/schedule.component.html b/src/pages/schedule/schedule.component.html new file mode 100644 index 0000000..5ffe3ac --- /dev/null +++ b/src/pages/schedule/schedule.component.html @@ -0,0 +1,5 @@ + + + + + diff --git a/src/pages/schedule/schedule.component.ts b/src/pages/schedule/schedule.component.ts new file mode 100644 index 0000000..a35977b --- /dev/null +++ b/src/pages/schedule/schedule.component.ts @@ -0,0 +1,115 @@ +import {Component, LOCALE_ID, ViewChild} from '@angular/core'; +import {TableComponent} from "@component/schedule/table/table.component"; +import {MatFormField, MatInput} from "@angular/material/input"; +import {MatButton} from "@angular/material/button"; +import {FormsModule} from "@angular/forms"; +import {AdditionalText, TableHeaderComponent} from "@component/schedule/table-header/table-header.component"; +import {addDays, weekInYear} from "@progress/kendo-date-math"; +import {MatCard} from "@angular/material/card"; +import {MatSidenavContainer} from "@angular/material/sidenav"; +import {TabsComponent, TabsSelect} from "@component/schedule/tabs/tabs.component"; +import {catchError, Observable} from "rxjs"; +import {ScheduleService} from "@api/v1/schedule.service"; +import {ScheduleResponse} from "@api/v1/scheduleResponse"; +import {PeriodTimes} from "@model/pairPeriodTime"; + +@Component({ + selector: 'app-schedule', + standalone: true, + imports: [ + TableComponent, + MatInput, + MatFormField, + MatButton, + FormsModule, + TableHeaderComponent, + MatCard, + MatSidenavContainer, + TabsComponent + ], + templateUrl: './schedule.component.html', + styleUrl: './schedule.component.css', + providers: [ + ScheduleService, + {provide: LOCALE_ID, useValue: 'ru-RU'} + ] +}) + +export class ScheduleComponent { + protected startWeek!: Date; + protected data: ScheduleResponse[] = []; + protected startTerm: Date; + protected isLoadTable: boolean = false; + protected pairPeriods: PeriodTimes = {}; + + @ViewChild('tableHeader') childComponent!: TableHeaderComponent; + + constructor(private api: ScheduleService) { + this.calculateCurrentWeek(); + this.startTerm = new Date(1, 1, 1); + api.pairPeriod().subscribe(date => { + this.pairPeriods = date; + }); + api.startTerm().subscribe(date => { + this.startTerm = date.date; + }); + } + + protected result(data: [TabsSelect, number, Observable]) { + this.isLoadTable = true; + data[2] + .pipe(catchError(error => { + this.data = []; + throw error; + })) + .subscribe(x => { + this.data = x; + switch (data[0]) { + case TabsSelect.Group: + this.childComponent.AdditionalText(AdditionalText.Group, this.data[0].group); + break; + case TabsSelect.Professor: + let indexProfessor = this.data[0].professorsId.findIndex(p => p === data[1]); + console.log(indexProfessor); + console.log(data[1]); + this.childComponent.AdditionalText(AdditionalText.Professor, this.data[0].professors[indexProfessor]); + break; + case TabsSelect.LectureHall: + this.childComponent.AdditionalText(AdditionalText.LectureHall, `${this.data[0].lectureHalls[0]} (${this.data[0].campus[0]})`); + break; + case TabsSelect.Other: + this.childComponent.AdditionalText(AdditionalText.Other, ''); + break; + } + + this.isLoadTable = false; + }); + } + + private calculateCurrentWeek() { + let currentDate = new Date(); + + function startOfWeek(date: Date) { + return addDays(date, -date.getDay() + 1); + } + + this.startWeek = currentDate.getDay() === 0 ? startOfWeek(addDays(currentDate, 1)) : startOfWeek(currentDate); + + if (this.startWeek < this.startTerm) + this.startWeek = this.startTerm; + } + + protected handleWeekEvent(eventData: boolean | null) { + if (eventData === null) { + this.calculateCurrentWeek(); + } else if (eventData) { + this.startWeek = addDays(this.startWeek, 7); + } else { + this.startWeek = addDays(this.startWeek, -7); + } + } + + get currentWeek(): number { + return (weekInYear(this.startWeek) - weekInYear(this.startTerm)) + 1; + } +}