feat: add saving of user's selection

This commit is contained in:
2024-08-23 23:19:25 +03:00
parent 2e36b06aea
commit e0a2ba257c
10 changed files with 429 additions and 136 deletions

View File

@ -1,6 +1,6 @@
import {Component, EventEmitter, Output, ViewChild} from '@angular/core';
import {MatExpansionModule, MatExpansionPanel} from "@angular/material/expansion";
import {MatChipListboxChange, MatChipsModule} from '@angular/material/chips';
import {MatChipListbox, MatChipsModule} from '@angular/material/chips';
import {FormControl, FormsModule, ReactiveFormsModule} from "@angular/forms";
import {catchError} from "rxjs";
import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component";
@ -8,6 +8,12 @@ import {GroupResponse} from "@api/v1/groupResponse";
import {FacultyResponse} from "@api/v1/facultyResponse";
import {FacultyService} from "@api/v1/faculty.service";
import {GroupService} from "@api/v1/group.service";
import {IScheduleTab} from "@component/schedule/tabs/ischedule-tab";
import {
TabSelect,
TabSelectType,
TabStorageComponent
} from "@component/common/tab-storage/tab-storage.component";
@Component({
selector: 'app-group',
@ -24,121 +30,159 @@ import {GroupService} from "@api/v1/group.service";
providers: [FacultyService, GroupService]
})
export class GroupComponent {
export class GroupComponent implements IScheduleTab {
protected faculties: FacultyResponse[] | null = null;
protected courseNumbers: number[] | null = null;
private groups: GroupResponse[] | null = null;
protected filteredGroups: GroupResponse[] | null = [];
protected facultyId: number | null = null;
protected courseNumber: number | null = null;
protected filteredGroups: GroupResponse[] = [];
protected courseNumbers: number[] = [];
private groups: GroupResponse[] = [];
protected formChipCourse: FormControl = new FormControl();
protected formChipGroup: FormControl = new FormControl();
protected faculties: FacultyResponse[] = [];
@ViewChild('courseNumberPanel') courseNumberPanel!: MatExpansionPanel;
@ViewChild('groupPanel') groupPanel!: MatExpansionPanel;
protected facultiesLoaded: boolean | null = false;
protected groupsLoaded: boolean | null = false;
@ViewChild('facultyChip') facultyChip!: MatChipListbox;
@ViewChild('courseChip') courseChip!: MatChipListbox;
@ViewChild('groupChip') groupChip!: MatChipListbox;
private readonly selected: TabSelect[] | null = null;
@ViewChild('facultyIndicator') facultyIndicator!: LoadingIndicatorComponent;
@ViewChild('courseIndicator') courseIndicator!: LoadingIndicatorComponent;
@ViewChild('groupIndicator') groupIndicator!: LoadingIndicatorComponent;
@Output() eventResult = new EventEmitter<number>();
constructor(private facultyApi: FacultyService, private groupApi: GroupService) {
this.loadFaculties();
let selectedData = TabStorageComponent.selected;
if (selectedData !== null && selectedData.selected !== null) {
if (selectedData.type === TabSelectType.group)
this.selected = selectedData.selected;
}
}
protected loadFaculties() {
this.facultiesLoaded = false;
this.facultyApi.getFaculties()
.pipe(catchError(error => {
this.facultiesLoaded = null;
this.facultyIndicator.loading = false;
throw error;
}))
.subscribe(data => {
this.faculties = data;
this.facultiesLoaded = true;
if (this.selected !== null && this.selected.length >= 1) {
let selectedFaculty = data.find(x => x.id === this.selected![0].index);
if (selectedFaculty === undefined || selectedFaculty.name !== this.selected[0].name)
selectedFaculty = data.find(x => x.name === this.selected![0].name);
if (selectedFaculty !== undefined) {
TabStorageComponent.trySelectChip(selectedFaculty.id, this.facultyChip);
this.onFacultySelected(selectedFaculty.id);
}
}
});
}
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;
if (this.facultyId === null)
return;
this.groupApi.getGroups().pipe(
catchError(error => {
this.groupsLoaded = null;
if (this.groups === null || this.groups.length === 0 || this.groups[0].facultyId !== this.facultyId) {
this.groupApi.getByFaculty(this.facultyId)
.pipe(catchError(error => {
this.groupIndicator.loading = false;
this.courseIndicator.loading = false;
throw error;
})
).subscribe(data => {
this.groups = data;
if (this.courseNumber === null)
this.filteringCourseNumber();
else
this.filteringGroup();
}))
.subscribe(data => {
this.groups = data;
this.courseNumbers = Array.from(
new Set(
this.groups!
.map(x => x.courseNumber)
.sort((a, b) => a - b))
);
this.groupsLoaded = true;
});
if (this.selected !== null && this.selected.length >= 2) {
let selectedCourse = this.courseNumbers.find(x => x === this.selected![1].index);
return
if (selectedCourse !== undefined) {
TabStorageComponent.trySelectChip(selectedCourse, this.courseChip);
this.onCourseSelected(selectedCourse);
}
}
if (this.selected !== null && this.selected.length >= 3) {
let selectedGroup = data.find(x => x.id === this.selected![2].index);
if (selectedGroup === undefined || selectedGroup.name !== this.selected[2].name)
selectedGroup = data.find(x => x.name === this.selected![2].name);
if (selectedGroup !== undefined) {
TabStorageComponent.trySelectChip(selectedGroup.id, this.groupChip);
this.onGroupSelected(selectedGroup.id);
}
}
});
return;
}
if (this.courseNumber === null)
this.filteringCourseNumber();
else
this.filteringGroup();
if (this.courseNumber !== null)
this.filteredGroups = this.groups!.filter(x => x.courseNumber === this.courseNumber);
}
protected chooseFaculty(event: MatChipListboxChange) {
protected onFacultySelected(index: number) {
this.courseNumber = null;
this.groups = [];
this.formChipGroup.reset();
this.formChipCourse.reset();
if (event.value === undefined || event.value === null) {
if (index === undefined) {
this.facultyId = null;
return;
}
this.facultyId = event.value;
TabStorageComponent.select(new TabSelect(index, this.faculties!.find(x => x.id === index)?.name ?? ''), TabSelectType.group, 0);
this.facultyId = index;
this.courseNumberPanel.open();
this.loadCourseGroup();
}
protected chooseCourseNumber(event: MatChipListboxChange) {
protected onCourseSelected(course: number) {
this.filteredGroups = [];
this.formChipGroup.reset();
if (event.value === undefined || event.value === null) {
if (course === undefined) {
this.courseNumber = null;
return;
}
this.courseNumber = event.value;
TabStorageComponent.select(new TabSelect(course, course.toString()), TabSelectType.group, 1);
this.courseNumber = course;
this.groupPanel.open();
this.loadCourseGroup();
}
protected chooseGroup(event: MatChipListboxChange) {
if (event.value === undefined || event.value === null)
protected onGroupSelected(index: number) {
if (index === undefined)
return;
TabStorageComponent.select(new TabSelect(index, this.groups!.find(x => x.id == index)?.name ?? ''), TabSelectType.group, 2);
this.groupPanel.close();
this.eventResult.emit(event.value);
this.eventResult.emit(index);
}
public load() {
if (this.faculties === null)
this.loadFaculties();
}
}