Roenroll 1791 form data

src/app/dars/dars-view/new-audit-options/new-audit-options.component.html

@@ -42,11 +42,28 @@
 
             <mat-step class="audit-step" formGroupName="1" [stepControl]="formArray?.get([1])">
               <ng-template matStepLabel>Select program of study</ng-template>
-                <mat-radio-group class="audit-radio-group" formControlName="programOfStudy">
-                  <mat-radio-button class="audit-radio-button" name="" id="" value="" aria-label="">
-                      Major: Psychology
-                  </mat-radio-button>
-                </mat-radio-group>
+
+              <!-- If audit with declared major was selected in #1 show this -->
+              <mat-radio-group class="audit-radio-group" formControlName="programOfStudy">
+                <mat-radio-button checked="true" class="audit-radio-button" name="" id="" value="" aria-label="">
+                    Major: Psychology
+                </mat-radio-button>
+              </mat-radio-group>
+
+              <!-- If what-if audit was selected in #1 -->
+              <mat-form-field class="audit-program">
+                <mat-select formControlName="programOfStudy" placeholder="School, College or Population" aria-label="Select School, College or Population" [disableOptionCentering]="true">
+                  <mat-option value="">Engineering</mat-option>
+                </mat-select>
+              </mat-form-field>
+
+              <!-- Show after School, College or Population was selected -->
+              <mat-form-field class="audit-program">
+                <mat-select formControlName="academicProgram" placeholder="Academic Plan Program" aria-label="Academic Plan Program" [disableOptionCentering]="true">
+                  <mat-option value="">Biomedical Engineering</mat-option>
+                </mat-select>
+              </mat-form-field>
+
               <div class="step-buttons-group">
                 <button mat-button matStepperPrevious color="primary">Back</button>
                 <button mat-button matStepperNext mat-stroked-button color="primary">Next</button>
@@ -62,8 +79,8 @@
                 </mat-select>
               </mat-form-field>
               <mat-form-field class="audit-settings-option">
-                  <mat-label>Include Courses Form</mat-label>
-                  <mat-select formControlName="coursesForm" placeholder="Include Courses Form" aria-label="Include Courses Form" [disableOptionCentering]="true">
+                  <mat-label>Include Courses From</mat-label>
+                  <mat-select formControlName="includeCoursesFrom" placeholder="Include Courses From" aria-label="Include Courses From" [disableOptionCentering]="true">
                     <mat-option value="">Previous, current, future, and planned terms</mat-option>
                   </mat-select>
                 </mat-form-field>
@@ -87,21 +104,21 @@
               <p>To provide more accurate audit, specify the number of credits you planto make in the following course(s):</p>
               <!-- If no variable credits were found, show the message -->
               <!-- <p>No variable credits found.The audit is ready to be run.</p> -->
-              <div fxLayout="row" fxFlex="100">
+              <div fxLayout="row" fxFlex="100" style="margin-top: 18px;">
                 <div fxLayoutAlign="start center" fxFlex="80">
-                  <p>Spring 2020: BIO 151 <br /> Introductory biology</p>
+                  <span>Spring 2020: BIO 151 <br /> Introductory biology</span>
                 </div>
                 <div fxLayoutAlign="end center" fxFlex="20">
                   <mat-form-field id="audit-credits-selector">
                     <mat-select formControlName="credits" placeholder="" aria-label="Number of credits" [disableOptionCentering]="true">
-                      <mat-option value="">2</mat-option>
+                        <mat-option value="">2</mat-option>
                     </mat-select>
                   </mat-form-field>
                 </div>
               </div>
               <div class="step-buttons-group">
                 <button mat-button matStepperPrevious color="primary">Back</button>
-                <button mat-button mat-raised-button color="primary">Run Audit</button>
+                <button mat-button mat-raised-button color="primary" (click)="runDARSAudit();">Run Audit</button>
                 <!-- <button mat-button (click)="stepper.reset()" mat-stroked-button color="primary">Reset</button> -->
               </div>
             </mat-step>

src/app/dars/dars-view/new-audit-options/new-audit-options.component.scss

@@ -30,7 +30,3 @@
     text-transform: uppercase;
   }
 }
-
-#audit-credits-selector {
-  margin-top: 12px;
-}

src/app/dars/dars-view/new-audit-options/new-audit-options.component.ts

 import { Component, OnInit } from '@angular/core';
+import { MatDialogRef, MatSnackBar } from '@angular/material';
 import {
   FormBuilder,
   FormGroup,
@@ -20,7 +21,11 @@ export class NewAuditOptionsComponent implements OnInit {
     return this.newAuditForm.get('formArray');
   }
 
-  constructor(private fb: FormBuilder) {}
+  constructor(
+    private fb: FormBuilder,
+    private dialogRef: MatDialogRef<NewAuditOptionsComponent>,
+    private snackBar: MatSnackBar,
+  ) {}
 
   ngOnInit() {
     this.newAuditForm = this.fb.group({
@@ -30,10 +35,11 @@ export class NewAuditOptionsComponent implements OnInit {
         }),
         this.fb.group({
           programOfStudy: new FormControl(''),
+          academicProgram: new FormControl(''),
         }),
         this.fb.group({
           honors: new FormControl(''),
-          coursesForm: new FormControl(''),
+          includeCoursesFrom: new FormControl(''),
           runAgainst: new FormControl(''),
         }),
         this.fb.group({
@@ -42,4 +48,21 @@ export class NewAuditOptionsComponent implements OnInit {
       ]),
     });
   }
+
+  public runDARSAudit() {
+    const {
+      auditType,
+      programOfStudy,
+      academicProgram,
+      honors,
+      includeCoursesFrom,
+      runAgainst,
+      credits,
+    } = this.newAuditForm.value;
+
+    this.dialogRef.close();
+    this.snackBar.open(
+      'Audit in progress. You will be notified when the audit is ready to be viewed.',
+    );
+  }
 }

src/assets/sass/general.scss

@@ -317,7 +317,8 @@ body {
   }
 }
 
-.audit-settings-option {
+.audit-settings-option,
+.audit-program {
   .mat-form-field-wrapper {
     width: 100% !important;
   }