Skip to content
Snippets Groups Projects
Commit f5093a5c authored by jvanboxtel@wisc.edu's avatar jvanboxtel@wisc.edu Committed by Joe Van Boxtel
Browse files

ROENROLL-1900 audit fixes, stepper tweaks

parent 3bc4bc13
No related branches found
No related tags found
No related merge requests found
......@@ -53,6 +53,7 @@
<section class="audit-section audit-credit-tables">
<!-- TODO Figure out how to get this to look like a matTable -->
<div class="hs-units" *ngIf="audit.topSection.highSchoolUnitsSection?.units.length > 0">
<table mat-table [dataSource]="formatHighSchoolUnitData(audit.topSection.highSchoolUnitsSection.units)">
<caption>HS Units</caption>
......@@ -79,7 +80,9 @@
<td mat-cell *matCellDef="let courses">{{courses['SOC STUD']}}</td>
</ng-container>
</table>
</div>
<div class="advanced-standing-creds" *ngIf="audit.topSection.advancedStandingCreditsSection?.advanceStandingCredits.length > 0">
<table mat-table [dataSource]="audit.topSection.advancedStandingCreditsSection?.advanceStandingCredits">
<caption>{{audit.topSection.advancedStandingCreditsSection?.sectionLabel}}</caption>
<tr mat-header-row *matHeaderRowDef="advancedStandingCredits"></tr>
......@@ -110,6 +113,7 @@
<td mat-footer-cell *matFooterCellDef class="bold text-align-right">{{audit.topSection.advancedStandingCreditsSection?.totals.courseCreditsValue}}</td>
</ng-container>
</table>
</div>
</section>
<section class="audit-section">
......
......@@ -303,7 +303,8 @@ $black: #000000;
display: flex;
justify-content: space-between;
> table {
.hs-units,
.advanced-standing-creds {
width: 48%;
}
}
......@@ -319,6 +320,7 @@ $black: #000000;
border-top-width: 0px;
border-radius: 0 0 5px 5px;
box-shadow: none;
width: 100%;
caption {
padding: 10px 20px;
......
......@@ -104,41 +104,45 @@
<div class="step-actions">
<button mat-button matStepperPrevious>Back</button>
<button mat-stroked-button matStepperNext [disabled]="!chosenAuditSettings.valid">Next</button>
<button mat-stroked-button matStepperNext [disabled]="!chosenAuditSettings.valid" *ngIf="chosenAuditSettings.get('includeCoursesFrom')?.value === 'planned'">Next</button>
<button mat-raised-button color="primary" (click)="submitAudit()" *ngIf="chosenAuditSettings.get('includeCoursesFrom')?.value !== 'planned'">Request audit</button>
</div>
</form>
</mat-step>
<mat-step [stepControl]="chosenCreditSettings" label="Select credits">
<mat-step [stepControl]="chosenCreditSettings" label="Select credits" *ngIf="chosenAuditSettings.get('includeCoursesFrom')?.value === 'planned'">
<p>To provide a more accurate audit, specify the number of credits you plan to take in the following courses:</p>
<form [formGroup]="chosenCreditSettings">
<ng-container *ngIf="variableCreditCourses$ | async as variableCreditCourses; else loading">
<ng-container *ngIf="variableCreditCourses.length > 0; else noVariableCreditCourses">
<div class="credit-selector" *ngFor="let course of variableCreditCourses; let i = index" [formGroupName]="i">
<label id="credits-range-{{ course.id }}">
{{ course.termCode | getTermDescription }}: {{ course | courseDescription }}
<br>
<small>{{ course.title }}</small>
</label>
<mat-form-field>
<mat-label>{{ course.creditMin }}-{{ course.creditMax }} cr</mat-label>
<mat-select formControlName="credits" aria-labelledby="credits-range-{{ course.id }}">
<mat-option
*ngFor="let credit of course.range"
[value]="credit">
{{ credit }} cr
</mat-option>
</mat-select>
</mat-form-field>
</div>
<!-- skip variable credits select if not using planned courses -->
<!-- <div *ngIf="chosenAuditSettings.get('includeCoursesFrom')?.value !== 'planned'">
<p><strong>No variable credits found. The audit is ready to be run.</strong></p>
</div> -->
<ng-container *ngIf="variableCreditCourses$ | async as variableCreditCourses; else loading">
<ng-container *ngIf="variableCreditCourses.length > 0; else noVariableCreditCourses">
<div class="credit-selector" *ngFor="let course of variableCreditCourses; let i = index" [formGroupName]="i">
<label id="credits-range-{{ course.id }}">
{{ course.termCode | getTermDescription }}: {{ course | courseDescription }}
<br>
<small>{{ course.title }}</small>
</label>
<mat-form-field>
<mat-label>{{ course.creditMin }}-{{ course.creditMax }} cr</mat-label>
<mat-select formControlName="credits" aria-labelledby="credits-range-{{ course.id }}">
<mat-option
*ngFor="let credit of course.range"
[value]="credit">
{{ credit }} cr
</mat-option>
</mat-select>
</mat-form-field>
</div>
<ng-template #noVariableCreditCourses>
<p><strong>No variable credits found. The audit is ready to be run.</strong></p>
</ng-template>
</ng-container>
</ng-container>
<ng-template #noVariableCreditCourses>
<p><strong>No variable credits found. The audit is ready to be run.</strong></p>
</ng-template>
</ng-container>
<div class="step-actions">
<button mat-button matStepperPrevious>Back</button>
<button
......
......@@ -4,6 +4,10 @@
flex-direction: column;
}
.mat-stepper-vertical {
width: 731px;
}
.mat-radio-button {
margin: 5px;
}
......
......@@ -103,75 +103,93 @@ export class NewDegreeAuditDialogComponent implements OnInit {
}),
);
this.variableCreditCourses$ = this.store.select(degreePlans).pipe(
map(plans => plans.find(plan => plan.primary)),
filter((plan): plan is DegreePlan => plan !== undefined),
flatMap(plan => this.api.getAllCourses(plan.roadmapId)),
map(courses => {
return courses.filter(course => {
return (
!!course.creditMin &&
!!course.creditMax &&
course.creditMax > course.creditMin
);
});
}),
map(courses =>
courses.map(course => ({
...course,
range: inclusiveRange(
course.creditMin as number,
course.creditMax as number,
),
})),
),
share(),
);
this.degreePlans$ = this.store.select(degreePlans).pipe(shareReplay());
this.degreePlans$.subscribe(plans => {
const primaryPlan = plans.find(p => p.primary);
this.chosenAuditSettings.controls['degreePlan'].setValue(primaryPlan);
if (primaryPlan) {
this.chosenRoadmapId$.next(primaryPlan.roadmapId);
}
});
const degreePlanFormControl = this.chosenAuditSettings.get('degreePlan');
const includeCoursesFrom = this.chosenAuditSettings.get(
'includeCoursesFrom',
);
if (includeCoursesFrom && degreePlanFormControl) {
includeCoursesFrom.valueChanges.subscribe(selected => {
if (selected !== 'planned') {
degreePlanFormControl.reset();
degreePlanFormControl.disable();
} else {
console.log(degreePlanFormControl);
degreePlanFormControl.enable();
degreePlanFormControl.valueChanges.subscribe(plan => {
this.chosenRoadmapId$.next(plan.roadmapId);
});
}
});
}
this.variableCreditCourses$.subscribe(courses => {
while (this.chosenCreditSettings.length !== 0) {
this.chosenCreditSettings.removeAt(0);
}
courses.forEach(course => {
this.chosenCreditSettings.push(
this.fb.group({
course,
credits: this.fb.control(course.credits || '', Validators.required),
if (degreePlanFormControl) {
degreePlanFormControl.valueChanges.subscribe(currentPlan => {
this.chosenRoadmapId$.next(currentPlan.roadmapId);
this.variableCreditCourses$ = this.store.select(degreePlans).pipe(
flatMap(plan => this.api.getAllCourses(currentPlan.roadmapId)),
map(courses => {
return courses.filter(course => {
return (
!!course.creditMin &&
!!course.creditMax &&
course.creditMax > course.creditMin
);
});
}),
map(courses =>
courses.map(course => ({
...course,
range: inclusiveRange(
course.creditMin as number,
course.creditMax as number,
),
})),
),
share(),
);
});
});
if (includeCoursesFrom) {
includeCoursesFrom.valueChanges.subscribe(selected => {
if (selected === 'planned') {
this.variableCreditCourses$ = this.store.select(degreePlans).pipe(
map(plans => plans.find(plan => plan.primary)),
filter((plan): plan is DegreePlan => plan !== undefined),
flatMap(plan => this.api.getAllCourses(plan.roadmapId)),
map(courses => {
return courses.filter(course => {
return (
!!course.creditMin &&
!!course.creditMax &&
course.creditMax > course.creditMin
);
});
}),
map(courses =>
courses.map(course => ({
...course,
range: inclusiveRange(
course.creditMin as number,
course.creditMax as number,
),
})),
),
share(),
);
this.variableCreditCourses$.subscribe(courses => {
while (this.chosenCreditSettings.length !== 0) {
this.chosenCreditSettings.removeAt(0);
}
courses.forEach(course => {
this.chosenCreditSettings.push(
this.fb.group({
course,
credits: this.fb.control(
course.credits || '',
Validators.required,
),
}),
);
});
});
}
});
}
}
}
public darsInstitutionCode<T>(fallback: T): string | T {
......@@ -192,8 +210,14 @@ export class NewDegreeAuditDialogComponent implements OnInit {
public degreePlannerPlanName<T>(fallback: T): string | T {
const control = this.chosenAuditSettings.get('degreePlan');
if (control && control.value !== null) {
return control.value.name;
const coursesControl = this.chosenAuditSettings.get('includeCoursesFrom');
if (coursesControl && coursesControl.value === 'planned') {
if (control && control.value !== null) {
return control.value.name;
} else {
return fallback;
}
} else {
return fallback;
}
......@@ -210,14 +234,9 @@ export class NewDegreeAuditDialogComponent implements OnInit {
// If a degree plan name is included in the request we do not need this property
public includeCoursesFrom<T>(fallback: T): string | T {
const controlDegreePlan = this.chosenAuditSettings.get('degreePlan');
if (controlDegreePlan && controlDegreePlan.status === 'DISABLED') {
const control = this.chosenAuditSettings.get('includeCoursesFrom');
if (control !== null) {
return control.value.toString();
} else {
return fallback;
}
const control = this.chosenAuditSettings.get('includeCoursesFrom');
if (control && control.value !== 'planned') {
return control.value.toString();
} else {
return fallback;
}
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment