122 lines
3.9 KiB
HTML
122 lines
3.9 KiB
HTML
<section class="mat-elevation-z8 table-section" tabindex="0" [style.overflow]="(dataSource.length === 0 || isLoad ? 'hidden' : 'auto')">
|
|
@if (dataSource.length === 0 || isLoad) {
|
|
<div class="overlay">
|
|
@if (isLoad) {
|
|
<app-data-spinner/>
|
|
} @else {
|
|
<p class="mat-h2">Нет данных.</p>
|
|
<p class="mat-body-2">Выберите необходимое расписание сверху</p>
|
|
}
|
|
</div>
|
|
}
|
|
|
|
<table mat-table [dataSource]="tableDataSource" class="schedule-table size-icon">
|
|
<!-- Pair Number -->
|
|
<ng-container matColumnDef="pairNumber" sticky>
|
|
<th mat-header-cell *matHeaderCellDef style="width: 0; min-width: fit-content;">
|
|
Пара
|
|
<!-- Even Or Odd -->
|
|
<hr/>
|
|
@if (currentWeek % 2 === 0) {
|
|
Четная
|
|
} @else {
|
|
Нечетная
|
|
}
|
|
</th>
|
|
|
|
<td mat-cell *matCellDef="let element" class="pair-cell" sticky>
|
|
{{ element["pairNumber"] }}
|
|
</td>
|
|
</ng-container>
|
|
|
|
<!-- Day of Week -->
|
|
@for (day of daysOfWeek; track $index) {
|
|
<ng-container [matColumnDef]="day">
|
|
<!-- Day of Week Name -->
|
|
<th mat-header-cell *matHeaderCellDef>
|
|
<span class="mat-body-1">
|
|
{{ day }}
|
|
</span>
|
|
<br/>
|
|
<span class="mat-caption">
|
|
{{ addDays(startWeek, daysOfWeek.indexOf(day)) | date:"shortDate" }}
|
|
</span>
|
|
</th>
|
|
|
|
<!-- Info About Pairs -->
|
|
<td mat-cell *matCellDef="let element" class="table-element">
|
|
@for (elementData of element.data[daysOfWeek.indexOf(day) + 1]; track $index) {
|
|
<!-- Discipline -->
|
|
<div class="mat-body-1">{{ elementData["discipline"] }}</div>
|
|
<!-- Type of Occupation -->
|
|
@for (typeOfOccupation of elementData["typeOfOccupations"]; track $index) {
|
|
@if ($index !== 0) {
|
|
<br/>
|
|
}
|
|
<div class="mat-body">({{typeOfOccupation}})</div>
|
|
}
|
|
|
|
<!-- Professors -->
|
|
@if (checkAvailableData(elementData["professors"])) {
|
|
<div class="mat-body">
|
|
<i>
|
|
<mat-icon fontIcon="person"/>
|
|
</i>
|
|
@for (professor of elementData["professors"]; track $index) {
|
|
@if ($index !== 0) {
|
|
<br/>
|
|
}
|
|
{{ professor }}
|
|
}
|
|
</div>
|
|
}
|
|
|
|
<!-- Address (Lecture Hall & Campus) -->
|
|
@if (checkAvailableData(elementData["lectureHalls"]) && checkAvailableData(elementData["campus"])) {
|
|
<div class="mat-body">
|
|
<i>
|
|
<mat-icon fontIcon="location_on"/>
|
|
</i>
|
|
@for (lectureHall of elementData["lectureHalls"]; track $index) {
|
|
@if ($index !== 0) {
|
|
<br/>
|
|
}
|
|
@if (lectureHall) {
|
|
{{ lectureHall }}
|
|
} @else {
|
|
N/A
|
|
}
|
|
/
|
|
@if (elementData["campus"][$index]) {
|
|
{{ elementData["campus"][$index] }}
|
|
} @else {
|
|
N/A
|
|
}
|
|
}
|
|
</div>
|
|
}
|
|
|
|
<!-- Group -->
|
|
@if (!isOneGroup) {
|
|
<div class="mat-body">
|
|
<i>
|
|
<mat-icon fontIcon="group"/>
|
|
</i>
|
|
{{ elementData["group"] }}
|
|
</div>
|
|
}
|
|
|
|
@if ($index + 1 !== element.data[daysOfWeek.indexOf(day) + 1].length) {
|
|
<hr style="margin: 10px 0;"/>
|
|
}
|
|
}
|
|
|
|
</td>
|
|
</ng-container>
|
|
}
|
|
|
|
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
|
|
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
|
</table>
|
|
</section>
|