feat: add saving of user's selection
This commit is contained in:
@ -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();
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user