refactor: bind components to api

This commit is contained in:
Polianin Nikita 2024-06-11 00:16:17 +03:00
parent bd03cde151
commit 8a1921b6cb
8 changed files with 294 additions and 246 deletions

View File

@ -6,12 +6,13 @@
</mat-panel-title> </mat-panel-title>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-chip-listbox hideSingleSelectionIndicator (change)="chooseFaculty($event)"> <mat-chip-listbox hideSingleSelectionIndicator (change)="chooseFaculty($event)">
@for (faculty of faculties | async; track $index) { @for (faculty of faculties; track $index) {
<mat-chip-option [value]="faculty.id" color="accent"> <mat-chip-option [value]="faculty.id" color="accent">
{{ faculty.name }} {{ faculty.name }}
</mat-chip-option> </mat-chip-option>
} @empty { } @empty {
<app-loading-indicator [loading]="facultiesLoaded !== null" (retryFunction)="facultiesLoadRetry.emit()"/> <app-loading-indicator [loading]="facultiesLoaded !== null"
(retryFunction)="loadFaculties()"/>
} }
</mat-chip-listbox> </mat-chip-listbox>
</mat-expansion-panel> </mat-expansion-panel>
@ -22,14 +23,14 @@
Курс Курс
</mat-panel-title> </mat-panel-title>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-chip-listbox hideSingleSelectionIndicator (change)="chooseCourseNumber($event)" [formControl]="chipCourse"> <mat-chip-listbox hideSingleSelectionIndicator (change)="chooseCourseNumber($event)" [formControl]="formChipCourse">
@for (course of courseNumbers | async; track $index) { @for (course of courseNumbers; track $index) {
<mat-chip-option [value]="course" color="accent"> <mat-chip-option [value]="course" color="accent">
{{ course }} {{ course }}
</mat-chip-option> </mat-chip-option>
} @empty { } @empty {
<app-loading-indicator [loading]="groupsLoaded !== null" <app-loading-indicator [loading]="groupsLoaded !== null"
(retryFunction)="groupsLoadRetry.emit(this.facultyId!)"/> (retryFunction)="loadCourseGroup()"/>
} }
</mat-chip-listbox> </mat-chip-listbox>
</mat-expansion-panel> </mat-expansion-panel>
@ -40,14 +41,14 @@
Группа Группа
</mat-panel-title> </mat-panel-title>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-chip-listbox hideSingleSelectionIndicator (change)="chooseGroup($event)" [formControl]="chipGroup"> <mat-chip-listbox hideSingleSelectionIndicator (change)="chooseGroup($event)" [formControl]="formChipGroup">
@for (group of filteredGroups | async; track $index) { @for (group of filteredGroups; track $index) {
<mat-chip-option [value]="group.id" color="accent"> <mat-chip-option [value]="group.id" color="accent">
{{ group.name }} {{ group.name }}
</mat-chip-option> </mat-chip-option>
} @empty { } @empty {
<app-loading-indicator [loading]="groupsLoaded !== null" <app-loading-indicator [loading]="groupsLoaded !== null"
(retryFunction)="groupsLoadRetry.emit(this.facultyId!)"/> (retryFunction)="loadCourseGroup()"/>
} }
</mat-chip-listbox> </mat-chip-listbox>
</mat-expansion-panel> </mat-expansion-panel>

View File

@ -1,12 +1,13 @@
import {Component, EventEmitter, Input, Output, ViewChild} from '@angular/core'; import {Component, EventEmitter, Output, ViewChild} from '@angular/core';
import {MatExpansionModule, MatExpansionPanel} from "@angular/material/expansion"; import {MatExpansionModule, MatExpansionPanel} from "@angular/material/expansion";
import {MatChipListboxChange, MatChipsModule} from '@angular/material/chips'; import {MatChipListboxChange, MatChipsModule} from '@angular/material/chips';
import {FormControl, ReactiveFormsModule} from "@angular/forms"; import {FormControl, FormsModule, ReactiveFormsModule} from "@angular/forms";
import {AsyncPipe} from "@angular/common"; import {catchError} from "rxjs";
import {map, Observable, of} from "rxjs";
import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component"; import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component";
import {GroupResponse} from "@api/v1/groupResponse"; import {GroupResponse} from "@api/v1/groupResponse";
import {FacultyResponse} from "@api/v1/facultyResponse"; import {FacultyResponse} from "@api/v1/facultyResponse";
import {FacultyService} from "@api/v1/faculty.service";
import {GroupService} from "@api/v1/group.service";
@Component({ @Component({
selector: 'app-group', selector: 'app-group',
@ -16,49 +17,98 @@ import {FacultyResponse} from "@api/v1/facultyResponse";
MatChipsModule, MatChipsModule,
ReactiveFormsModule, ReactiveFormsModule,
LoadingIndicatorComponent, LoadingIndicatorComponent,
AsyncPipe FormsModule
], ],
templateUrl: './group.component.html', templateUrl: './group.component.html',
styleUrl: './group.component.css' styleUrl: './group.component.css',
providers: [FacultyService, GroupService]
}) })
export class GroupComponent { export class GroupComponent {
protected facultyId: number | null = null; protected facultyId: number | null = null;
protected courseNumber: number | null = null; protected courseNumber: number | null = null;
protected filteredGroups: Observable<GroupResponse[]> = of([]); protected filteredGroups: GroupResponse[] = [];
protected courseNumbers: Observable<number[]> = of([]); protected courseNumbers: number[] = [];
protected groups: Observable<GroupResponse[]> = of([]); private groups: GroupResponse[] = [];
protected chipCourse: FormControl = new FormControl(); protected formChipCourse: FormControl = new FormControl();
protected chipGroup: FormControl = new FormControl(); protected formChipGroup: FormControl = new FormControl();
protected faculties: FacultyResponse[] = [];
@ViewChild('courseNumberPanel') courseNumberPanel!: MatExpansionPanel; @ViewChild('courseNumberPanel') courseNumberPanel!: MatExpansionPanel;
@ViewChild('groupPanel') groupPanel!: MatExpansionPanel; @ViewChild('groupPanel') groupPanel!: MatExpansionPanel;
@Input() faculties: Observable<FacultyResponse[]> = of([]); protected facultiesLoaded: boolean | null = false;
@Input() facultiesLoaded: boolean | null = false; protected groupsLoaded: boolean | null = false;
@Output() facultiesLoadRetry: EventEmitter<void> = new EventEmitter<void>();
@Input() groupsLoaded: boolean | null = false;
@Output() groupsLoadRetry: EventEmitter<number> = new EventEmitter<number>();
@Input() set setGroups(data: Observable<GroupResponse[]>) { @Output() eventResult = new EventEmitter<number>();
this.groups = data;
this.courseNumbers = this.groups.pipe( constructor(private facultyApi: FacultyService, private groupApi: GroupService) {
map(data => data.map(g => g.courseNumber)), this.loadFaculties();
map(courseNumbersArray => courseNumbersArray.filter((value, index, self) => self.indexOf(value) === index)),
map(uniqueCourseNumbers => uniqueCourseNumbers.sort((a, b) => a - b))
);
} }
@Output() groupSelected = new EventEmitter<number>(); protected loadFaculties() {
@Output() facultySelected = new EventEmitter<number>(); this.facultiesLoaded = false;
this.facultyApi.getFaculties()
.pipe(catchError(error => {
this.facultiesLoaded = null;
throw error;
}))
.subscribe(data => {
this.faculties = data;
this.facultiesLoaded = true;
});
}
private filteringCourseNumber() {
this.courseNumbers = Array.from(
new Set(
this.groups
.filter(x => x.facultyId === this.facultyId)
.map(x => x.courseNumber)
)
).sort((a, b) => a - b);
}
private filteringGroup() {
this.filteredGroups = this.groups.filter(x => x.facultyId === this.facultyId && x.courseNumber === this.courseNumber);
}
protected loadCourseGroup() {
if (this.groups.length === 0) {
this.groupsLoaded = false;
this.groupApi.getGroups().pipe(
catchError(error => {
this.groupsLoaded = null;
throw error;
})
).subscribe(data => {
this.groups = data;
if (this.courseNumber === null)
this.filteringCourseNumber();
else
this.filteringGroup();
this.groupsLoaded = true;
});
return
}
if (this.courseNumber === null)
this.filteringCourseNumber();
else
this.filteringGroup();
}
protected chooseFaculty(event: MatChipListboxChange) { protected chooseFaculty(event: MatChipListboxChange) {
this.courseNumber = null; this.courseNumber = null;
this.groups = of([]); this.groups = [];
this.chipGroup.reset(); this.formChipGroup.reset();
this.chipCourse.reset(); this.formChipCourse.reset();
if (event.value === undefined || event.value === null) { if (event.value === undefined || event.value === null) {
this.facultyId = null; this.facultyId = null;
@ -67,12 +117,12 @@ export class GroupComponent {
this.facultyId = event.value; this.facultyId = event.value;
this.courseNumberPanel.open(); this.courseNumberPanel.open();
this.facultySelected.emit(this.facultyId!); this.loadCourseGroup();
} }
protected chooseCourseNumber(event: MatChipListboxChange) { protected chooseCourseNumber(event: MatChipListboxChange) {
this.filteredGroups = of([]); this.filteredGroups = [];
this.chipGroup.reset(); this.formChipGroup.reset();
if (event.value === undefined || event.value === null) { if (event.value === undefined || event.value === null) {
this.courseNumber = null; this.courseNumber = null;
@ -81,8 +131,7 @@ export class GroupComponent {
this.courseNumber = event.value; this.courseNumber = event.value;
this.groupPanel.open(); this.groupPanel.open();
this.groups.subscribe(data => this.loadCourseGroup();
this.filteredGroups = of(data.filter(g => g.courseNumber === this.courseNumber)));
} }
protected chooseGroup(event: MatChipListboxChange) { protected chooseGroup(event: MatChipListboxChange) {
@ -90,6 +139,6 @@ export class GroupComponent {
return; return;
this.groupPanel.close(); this.groupPanel.close();
this.groupSelected.emit(event.value); this.eventResult.emit(event.value);
} }
} }

View File

@ -6,12 +6,12 @@
</mat-panel-title> </mat-panel-title>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-chip-listbox hideSingleSelectionIndicator (change)="chooseCampus($event)"> <mat-chip-listbox hideSingleSelectionIndicator (change)="chooseCampus($event)">
@for (campus of campuses | async; track $index) { @for (campus of campuses; track $index) {
<mat-chip-option [value]="campus.id" color="accent"> <mat-chip-option [value]="campus.id" color="accent">
{{ campus.codeName }} {{ campus.codeName }}
</mat-chip-option> </mat-chip-option>
} @empty { } @empty {
<app-loading-indicator [loading]="campusesLoaded !== null" (retryFunction)="campusesLoadRetry.emit()"/> <app-loading-indicator [loading]="campusesLoaded !== null" (retryFunction)="loadCampuses()"/>
} }
</mat-chip-listbox> </mat-chip-listbox>
</mat-expansion-panel> </mat-expansion-panel>
@ -23,12 +23,12 @@
</mat-panel-title> </mat-panel-title>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-chip-listbox hideSingleSelectionIndicator (change)="chooseLectureHall($event)" [formControl]="chipLecture"> <mat-chip-listbox hideSingleSelectionIndicator (change)="chooseLectureHall($event)" [formControl]="chipLecture">
@for (lectureHall of lectureHalls | async; track $index) { @for (lectureHall of lectureHallsFiltered; track $index) {
<mat-chip-option [value]="lectureHall.id" color="accent"> <mat-chip-option [value]="lectureHall.id" color="accent">
{{ lectureHall.name }} {{ lectureHall.name }}
</mat-chip-option> </mat-chip-option>
} @empty { } @empty {
<app-loading-indicator [loading]="lectureHallsLoaded !== null" (retryFunction)="lectureHallsLoadRetry.emit()"/> <app-loading-indicator [loading]="lectureHallsLoaded !== null" (retryFunction)="loadLectureHalls()"/>
} }
</mat-chip-listbox> </mat-chip-listbox>
</mat-expansion-panel> </mat-expansion-panel>

View File

@ -2,11 +2,13 @@ import {Component, EventEmitter, Input, Output, ViewChild} from '@angular/core';
import {AsyncPipe} from "@angular/common"; import {AsyncPipe} from "@angular/common";
import {MatAccordion, MatExpansionModule, MatExpansionPanel} from "@angular/material/expansion"; import {MatAccordion, MatExpansionModule, MatExpansionPanel} from "@angular/material/expansion";
import {MatChipListboxChange, MatChipsModule} from "@angular/material/chips"; import {MatChipListboxChange, MatChipsModule} from "@angular/material/chips";
import {Observable, of} from "rxjs"; import {catchError, Observable, of} from "rxjs";
import {FormControl, ReactiveFormsModule} from "@angular/forms"; import {FormControl, ReactiveFormsModule} from "@angular/forms";
import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component"; import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component";
import {CampusBasicInfoResponse} from "@api/v1/campusBasicInfoResponse"; import {CampusBasicInfoResponse} from "@api/v1/campusBasicInfoResponse";
import {LectureHallResponse} from "@api/v1/lectureHallResponse"; import {LectureHallResponse} from "@api/v1/lectureHallResponse";
import {CampusService} from "@api/v1/campus.service";
import {LectureHallService} from "@api/v1/lectureHall.service";
@Component({ @Component({
selector: 'app-lecture-hall', selector: 'app-lecture-hall',
@ -20,7 +22,8 @@ import {LectureHallResponse} from "@api/v1/lectureHallResponse";
LoadingIndicatorComponent LoadingIndicatorComponent
], ],
templateUrl: './lecture-hall.component.html', templateUrl: './lecture-hall.component.html',
styleUrl: './lecture-hall.component.css' styleUrl: './lecture-hall.component.css',
providers: [CampusService, LectureHallService]
}) })
export class LectureHallComponent { export class LectureHallComponent {
@ -29,29 +32,66 @@ export class LectureHallComponent {
@ViewChild('lecturePanel') lecturePanel!: MatExpansionPanel; @ViewChild('lecturePanel') lecturePanel!: MatExpansionPanel;
@Input() campuses: Observable<CampusBasicInfoResponse[]> = of([]); protected campuses: CampusBasicInfoResponse[] = [];
@Input() campusesLoaded: boolean | null = false; protected campusesLoaded: boolean | null = false;
@Output() campusesLoadRetry: EventEmitter<void> = new EventEmitter<void>();
@Input() lectureHalls: Observable<LectureHallResponse[]> = of([]);
@Input() lectureHallsLoaded: boolean | null = false;
@Output() lectureHallsLoadRetry: EventEmitter<number> = new EventEmitter<number>();
@Output() campusSelected = new EventEmitter<number>(); private lectureHalls: LectureHallResponse[] = [];
@Output() lectureHallSelected = new EventEmitter<number>(); protected lectureHallsFiltered: LectureHallResponse[] = [];
protected lectureHallsLoaded: boolean | null = false;
@Output() eventResult = new EventEmitter<number>();
constructor(private campusApi: CampusService, private lectureHallApi: LectureHallService) {
this.loadCampuses();
}
protected loadCampuses() {
this.campusesLoaded = false;
this.campusApi.getCampus()
.pipe(catchError(error => {
this.campusesLoaded = null;
throw error;
}))
.subscribe(data => {
this.campuses = data;
this.campusesLoaded = true;
});
}
private filteringLectureHalls() {
this.lectureHallsFiltered = this.lectureHalls.filter(x => x.campusId === this.campusId);
}
protected chooseCampus(event: MatChipListboxChange) { protected chooseCampus(event: MatChipListboxChange) {
this.chipLecture.reset(); this.chipLecture.reset();
if (event.value === undefined || event.value === null) { if (event.value === undefined || event.value === null) {
this.campusId = null; this.campusId = null;
this.lectureHalls = of([]); this.lectureHalls = [];
return; return;
} }
this.campusId = event.value; this.campusId = event.value;
this.lecturePanel.open(); this.lecturePanel.open();
this.campusSelected.emit(this.campusId!); if (this.lectureHalls.length === 0)
this.loadLectureHalls();
else
this.filteringLectureHalls();
}
protected loadLectureHalls() {
this.lectureHallsLoaded = false;
this.lectureHallApi.getLectureHalls()
.pipe(catchError(error => {
this.lectureHallsLoaded = null;
throw error;
}))
.subscribe(data => {
this.lectureHalls = data;
this.filteringLectureHalls();
this.lectureHallsLoaded = true;
});
} }
protected chooseLectureHall(event: MatChipListboxChange) { protected chooseLectureHall(event: MatChipListboxChange) {
@ -59,6 +99,6 @@ export class LectureHallComponent {
return; return;
this.lecturePanel.close(); this.lecturePanel.close();
this.lectureHallSelected.emit(event.value); this.eventResult.emit(event.value);
} }
} }

View File

@ -1,6 +1,6 @@
<div class="search-content"> <div class="search-content">
@if (professors.length === 0) { @if (professors.length === 0) {
<app-loading-indicator [loading]="professorsLoaded !== null" (retryFunction)="professorsLoadRetry.emit()"/> <app-loading-indicator [loading]="professorsLoaded !== null" (retryFunction)="loadProfessors()"/>
} @else { } @else {
<mat-form-field color="accent" style="width: 100%;"> <mat-form-field color="accent" style="width: 100%;">
<input type="text" placeholder="Поиск..." matInput [formControl]="professorControl" [matAutocomplete]="auto"> <input type="text" placeholder="Поиск..." matInput [formControl]="professorControl" [matAutocomplete]="auto">

View File

@ -3,9 +3,10 @@ import {MatFormField, MatInput} from "@angular/material/input";
import {FormControl, ReactiveFormsModule} from "@angular/forms"; import {FormControl, ReactiveFormsModule} from "@angular/forms";
import {MatAutocompleteModule, MatAutocompleteSelectedEvent} from "@angular/material/autocomplete"; import {MatAutocompleteModule, MatAutocompleteSelectedEvent} from "@angular/material/autocomplete";
import {AsyncPipe} from "@angular/common"; import {AsyncPipe} from "@angular/common";
import {map, Observable, startWith} from "rxjs"; import {catchError, map, Observable, startWith} from "rxjs";
import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component"; import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component";
import {ProfessorResponse} from "@api/v1/professorResponse"; import {ProfessorResponse} from "@api/v1/professorResponse";
import {ProfessorService} from "@api/v1/professor.service";
@Component({ @Component({
selector: 'app-professor', selector: 'app-professor',
@ -19,17 +20,37 @@ import {ProfessorResponse} from "@api/v1/professorResponse";
LoadingIndicatorComponent LoadingIndicatorComponent
], ],
templateUrl: './professor.component.html', templateUrl: './professor.component.html',
styleUrl: './professor.component.css' styleUrl: './professor.component.css',
providers: [ProfessorService]
}) })
export class ProfessorComponent implements OnInit { export class ProfessorComponent implements OnInit {
protected professorControl = new FormControl(); protected professorControl = new FormControl();
protected filteredProfessors!: Observable<ProfessorResponse[]>; protected filteredProfessors!: Observable<ProfessorResponse[]>;
@Input() professors: ProfessorResponse[] = []; protected professors: ProfessorResponse[] = [];
@Output() professorSelected = new EventEmitter<number>(); protected professorsLoaded: boolean | null = false;
@Input() professorsLoaded: boolean | null = false; @Output() eventResult = new EventEmitter<number>();
@Output() professorsLoadRetry: EventEmitter<void> = new EventEmitter<void>();
constructor(private api: ProfessorService) {
this.loadProfessors();
}
protected loadProfessors() {
if (this.professors.length === 0) {
this.professorsLoaded = false;
this.api.getProfessors()
.pipe(catchError(error => {
this.professorsLoaded = null;
throw error;
}))
.subscribe(data => {
this.professors = data;
this.professorsLoaded = true;
});
}
}
ngOnInit(): void { ngOnInit(): void {
this.filteredProfessors = this.professorControl.valueChanges.pipe( this.filteredProfessors = this.professorControl.valueChanges.pipe(
@ -53,7 +74,7 @@ export class ProfessorComponent implements OnInit {
const selectedOption = this.professors.find(teacher => teacher.id === event.option.value); const selectedOption = this.professors.find(teacher => teacher.id === event.option.value);
if (selectedOption) { if (selectedOption) {
this.professorControl.setValue(selectedOption.name); this.professorControl.setValue(selectedOption.name);
this.professorSelected.emit(selectedOption.id); this.eventResult.emit(selectedOption.id);
} }
} }
} }

View File

@ -2,24 +2,17 @@
(selectedTabChange)="chooseTabs($event)"> (selectedTabChange)="chooseTabs($event)">
<mat-tab label="Группа"> <mat-tab label="Группа">
<div> <div>
<app-group (groupSelected)="groupSelected.emit($event)" (facultySelected)="groupLoad($event)" <app-group (eventResult)="groupSelected($event)"/>
[setGroups]="groups" [faculties]="faculties" [facultiesLoaded]="facultiesLoaded"
[groupsLoaded]="groupLoaded" (groupsLoadRetry)="groupLoad($event)"
(facultiesLoadRetry)="facultyLoad()"/>
</div> </div>
</mat-tab> </mat-tab>
<mat-tab label="Преподаватель"> <mat-tab label="Преподаватель">
<div> <div>
<app-professor (professorSelected)="professorSelected.emit($event)" [professors]="professorsData" [professorsLoaded]="professorsLoaded" (professorsLoadRetry)="professorsLoad()"/> <app-professor (eventResult)="professorSelected($event)"/>
</div> </div>
</mat-tab> </mat-tab>
<mat-tab label="Кабинет"> <mat-tab label="Кабинет">
<div> <div>
<app-lecture-hall (lectureHallSelected)="lectureHallSelected.emit($event)" [campuses]="campuses" <app-lecture-hall (eventResult)="lectureHallSelected($event)"/>
(campusSelected)="lectureHallLoad($event)" [lectureHalls]="lectureHalls"
[campusesLoaded]="campusesLoaded" [lectureHallsLoaded]="lectureHallsLoaded"
(campusesLoadRetry)="campusLoad()"
(lectureHallsLoadRetry)="lectureHallLoad($event)"/>
</div> </div>
</mat-tab> </mat-tab>
<mat-tab label="Другое"> <mat-tab label="Другое">

View File

@ -1,38 +1,31 @@
import {Component, EventEmitter, Output, ViewChild} from '@angular/core'; import {Component, EventEmitter, Output} from '@angular/core';
import {HttpClientModule} from "@angular/common/http";
import {OtherComponent} from "@component/schedule/tabs/other/other.component"; import {OtherComponent} from "@component/schedule/tabs/other/other.component";
import {MatTab, MatTabChangeEvent, MatTabGroup} from "@angular/material/tabs"; import {MatTab, MatTabChangeEvent, MatTabGroup} from "@angular/material/tabs";
import {catchError, map, Observable, of, switchMap, tap} from "rxjs"; import {map, Observable} from "rxjs";
import {ReactiveFormsModule} from "@angular/forms"; import {ReactiveFormsModule} from "@angular/forms";
import {AsyncPipe, NgIf} from "@angular/common";
import {MatButton} from "@angular/material/button"; import {MatButton} from "@angular/material/button";
import {DataSpinnerComponent} from "@component/common/data-spinner/data-spinner.component"; import {DataSpinnerComponent} from "@component/common/data-spinner/data-spinner.component";
import {ProfessorResponse} from "@api/v1/professorResponse";
import {FacultyResponse} from "@api/v1/facultyResponse";
import {GroupResponse} from "@api/v1/groupResponse";
import {CampusBasicInfoResponse} from "@api/v1/campusBasicInfoResponse";
import {LectureHallResponse} from "@api/v1/lectureHallResponse";
import {DisciplineService} from "@api/v1/discipline.service";
import {GroupComponent} from "@component/schedule/tabs/group/group.component"; import {GroupComponent} from "@component/schedule/tabs/group/group.component";
import {ProfessorComponent} from "@component/schedule/tabs/professor/professor.component"; import {ProfessorComponent} from "@component/schedule/tabs/professor/professor.component";
import {LectureHallComponent} from "@component/schedule/tabs/lecture-hall/lecture-hall.component"; import {LectureHallComponent} from "@component/schedule/tabs/lecture-hall/lecture-hall.component";
import {FacultyService} from "@api/v1/faculty.service"; import {ScheduleService} from "@api/v1/schedule.service";
import {GroupService} from "@api/v1/group.service"; import {ScheduleResponse} from "@api/v1/scheduleResponse";
import {ProfessorService} from "@api/v1/professor.service";
import {CampusService} from "@api/v1/campus.service"; export enum TabsSelect {
import {LectureHallService} from "@api/v1/lectureHall.service"; Group,
Professor,
LectureHall,
Other
}
@Component({ @Component({
selector: 'app-tabs', selector: 'app-tabs',
standalone: true, standalone: true,
imports: [ imports: [
HttpClientModule,
OtherComponent, OtherComponent,
MatTabGroup, MatTabGroup,
MatTab, MatTab,
ReactiveFormsModule, ReactiveFormsModule,
AsyncPipe,
NgIf,
MatButton, MatButton,
DataSpinnerComponent, DataSpinnerComponent,
GroupComponent, GroupComponent,
@ -41,171 +34,122 @@ import {LectureHallService} from "@api/v1/lectureHall.service";
], ],
templateUrl: './tabs.component.html', templateUrl: './tabs.component.html',
styleUrl: './tabs.component.css', styleUrl: './tabs.component.css',
providers: [FacultyService, GroupService, ProfessorService, CampusService, LectureHallService, DisciplineService ] providers: [ScheduleService]
}) })
export class TabsComponent { export class TabsComponent {
protected professorsData: ProfessorResponse[] = []; @Output() eventResult = new EventEmitter<[TabsSelect, number, Observable<ScheduleResponse[]>]>();
protected faculties: Observable<FacultyResponse[]> = of([]); constructor(private scheduleApi: ScheduleService) {
protected groups: Observable<GroupResponse[]> = of([]); }
private groupsData: Observable<GroupResponse[]> = of([]);
protected campuses: Observable<CampusBasicInfoResponse[]> = of([]); protected campuses: Observable<CampusBasicInfoResponse[]> = of([]);
protected lectureHalls: Observable<LectureHallResponse[]> = of([]); protected lectureHalls: Observable<LectureHallResponse[]> = of([]);
private lectureHallsData: Observable<LectureHallResponse[]> = of([]); private lectureHallsData: Observable<LectureHallResponse[]> = of([]);
protected groupSelected(id: number) {
this.eventResult.emit(
[
TabsSelect.Group,
id,
this.scheduleApi.getByGroup(id)
.pipe(
map(g =>
g.map(data =>
({
dayOfWeek: data.dayOfWeek,
pairNumber: data.pairNumber,
isEven: data.isEven,
discipline: data.discipline,
disciplineId: data.disciplineId,
isExcludedWeeks: data.isExcludedWeeks,
weeks: data.weeks,
typeOfOccupations: data.typeOfOccupations,
group: data.group,
groupId: data.groupId,
lectureHalls: data.lectureHalls,
lectureHallsId: data.lectureHallsId,
professors: data.professors,
professorsId: data.professorsId,
campus: data.campus,
campusId: data.campusId,
linkToMeet: data.linkToMeet
}))
)
)
]
);
}
// States protected professorSelected(id: number) {
protected facultiesLoaded: boolean | null = false; this.eventResult.emit(
protected groupLoaded: boolean | null = false; [
protected campusesLoaded: boolean | null = false; TabsSelect.Professor,
protected lectureHallsLoaded: boolean | null = false; id,
protected disciplinesLoaded: boolean | null = false; this.scheduleApi.getByProfessor(id)
protected professorsLoaded: boolean | null = false; .pipe(
map(p =>
p.map(data =>
({
dayOfWeek: data.dayOfWeek,
pairNumber: data.pairNumber,
isEven: data.isEven,
discipline: data.discipline,
disciplineId: data.disciplineId,
isExcludedWeeks: data.isExcludedWeeks,
weeks: data.weeks,
typeOfOccupations: data.typeOfOccupations,
group: data.group,
groupId: data.groupId,
lectureHalls: data.lectureHalls,
lectureHallsId: data.lectureHallsId,
professors: data.professors,
professorsId: data.professorsId,
campus: data.campus,
campusId: data.campusId,
linkToMeet: data.linkToMeet
}))
)
)
]
);
}
@Output() groupSelected: EventEmitter<number> = new EventEmitter<number>(); protected lectureHallSelected(id: number) {
@Output() lectureHallSelected: EventEmitter<number> = new EventEmitter<number>(); this.eventResult.emit(
@Output() professorSelected: EventEmitter<number> = new EventEmitter<number>(); [
TabsSelect.LectureHall,
constructor( id,
private facultyApi: FacultyService, this.scheduleApi.getByLectureHall(id)
private groupApi: GroupService, .pipe(
private professorApi: ProfessorService, map(lh =>
private campusApi: CampusService, lh.map(data =>
private lectureHallApi: LectureHallService, ({
private disciplineApi: DisciplineService) { dayOfWeek: data.dayOfWeek,
this.facultyLoad().then(); pairNumber: data.pairNumber,
isEven: data.isEven,
discipline: data.discipline,
disciplineId: data.disciplineId,
isExcludedWeeks: data.isExcludedWeeks,
weeks: data.weeks,
typeOfOccupations: data.typeOfOccupations,
group: data.group,
groupId: data.groupId,
lectureHalls: data.lectureHalls,
lectureHallsId: data.lectureHallsId,
professors: data.professors,
professorsId: data.professorsId,
campus: data.campus,
campusId: data.campusId,
linkToMeet: data.linkToMeet
}))
)
)
]
);
} }
protected async chooseTabs(event: MatTabChangeEvent) { protected async chooseTabs(event: MatTabChangeEvent) {
switch (event.index) { switch (event.index) {
case 0:
await this.facultyLoad();
break;
case 1:
this.professorsLoad();
break;
case 2:
await this.campusLoad();
break;
case 3:
await this.extensionLoad();
break;
}
}
protected async facultyLoad() {
if (this.facultiesLoaded === null) this.facultiesLoaded = false;
if (this.facultiesLoaded) return;
this.faculties = this.facultyApi.getFaculties().pipe(
tap(() => {
this.facultiesLoaded = true;
}),
catchError((error) => {
this.facultiesLoaded = null;
throw error;
})
);
}
protected groupLoad(id: number) {
if (this.groupLoaded === null) this.groupLoaded = false;
if (this.groupLoaded)
this.groups = this.groupsData.pipe(map(data => data.filter(x => x.facultyId === id)));
else
this.groups = this.groupApi.getByFaculty(id).pipe(
tap(() => {
this.groupLoaded = false;
}),
catchError((error) => {
this.groupLoaded = null;
throw error;
})
);
}
protected professorsLoad() {
if (this.professorsLoaded === null) this.professorsLoaded = false;
if (this.professorsLoaded) return;
this.professorApi.getProfessors().pipe(
catchError((error) => {
this.professorsLoaded = null;
throw error;
})
).subscribe(data => {
this.professorsData = data;
this.professorEx.Data = data.map(x =>
({
id: x.id,
name: x.altName ? x.altName : x.name,
selected: false
}));
});
}
protected async campusLoad() {
if (this.campusesLoaded === null) this.campusesLoaded = false;
if (this.campusesLoaded) return;
this.campuses = this.campusApi.getCampus().pipe(
tap(() => {
this.campusesLoaded = true;
}),
catchError((error) => {
this.campusesLoaded = null;
throw error;
})
);
}
protected lectureHallLoad(id: number) {
if (this.lectureHallsLoaded === null) this.lectureHallsLoaded = false;
if (this.lectureHallsLoaded)
this.lectureHalls = this.lectureHallsData.pipe(map(data => data.filter(x => x.campusId === id)));
else
this.lectureHalls = this.lectureHallApi.getByCampus(id).pipe(
tap(() => {
this.lectureHallsLoaded = false;
}),
catchError((error) => {
this.lectureHallsLoaded = null;
throw error;
})
);
}
protected async loadLectureHalls() {
if (!this.campusesLoaded)
await this.campusLoad();
if (!this.lectureHallsLoaded) {
this.lectureHallsData = this.lectureHallApi.getLectureHalls();
this.lectureHallsData.pipe(
switchMap(lectureHalls => this.campuses.pipe(
map(campuses => {
return lectureHalls.map(x => {
const campus = campuses.find(c => c.id === x.campusId);
const codeName = campus ? campus.codeName : '';
return {
id: x.id,
name: `${x.name} (${codeName})`,
selected: false
};
});
})
)),
).subscribe(data => {
this.lectureHallEx.Data = data;
this.lectureHallsLoaded = true;
this.campusesLoaded = true;
});
} }
} }