Merge branch 'feature/stratification-UI-changes' of https://github.co…

…m/CarnegieLearningWeb/UpGrade into feature/stratification-UI-changes
CarnegieLearningWeb · Sep 21, 2023 · b4ff9bb · b4ff9bb
2 parents 6ef44ae + 2ddcd0e
commit b4ff9bb
Show file tree

Hide file tree

Showing 7 changed files with 73 additions and 25 deletions.
diff --git a/backend/packages/Upgrade/src/api/controllers/StratificationController.ts b/backend/packages/Upgrade/src/api/controllers/StratificationController.ts
@@ -303,8 +303,7 @@ export class StratificationController {
   @Post()
   @UseBefore(upload.single('file'))
   public insertStratification(@Req() request: AppRequest): Promise<UserStratificationFactor[]> {
-    const csvData = request.file['buffer'].toString();
-
+    const csvData = request.body[0].file
     const rows = csvData.split('\n');
     const columnNames = rows[0].split(',');
 

diff --git a/...jects/upgrade/src/app/core/stratification-factors/store/stratification-factors.actions.ts b/...jects/upgrade/src/app/core/stratification-factors/store/stratification-factors.actions.ts
@@ -29,6 +29,19 @@ export const actionDeleteStratificationFactorFailure = createAction(
   '[Stratification Factors] Delete Stratification Factor Failure'
 );
 
+export const actionImportStratificationFactor = createAction(
+  '[Stratification Factors] Import Stratification Factor',
+  props<{ csvData: string }>()
+);
+
+export const actionImportStratificationFactorSuccess = createAction(
+  '[Stratification Factors] Import Stratification Factor Success'
+);
+
+export const actionImportStratificationFactorFailure = createAction(
+  '[Stratification Factors] Import Stratification Factor Failure'
+);
+
 export const actionExportStratificationFactor = createAction(
   '[Stratification Factors] Export Stratification Factor',
   props<{ factorId: string }>()

diff --git a/...jects/upgrade/src/app/core/stratification-factors/store/stratification-factors.effects.ts b/...jects/upgrade/src/app/core/stratification-factors/store/stratification-factors.effects.ts
@@ -54,6 +54,22 @@ export class StratificationFactorsEffects {
     )
   );
 
+  importStratificationFactor$ = createEffect(() =>
+    this.actions$.pipe(
+      ofType(StratificationFactorsActions.actionImportStratificationFactor),
+      map((action) => ({ csvData: action.csvData })),
+      filter(({ csvData }) => !!csvData),
+      switchMap(({ csvData }) =>
+        this.stratificationFactorsDataService.importStratificationFactors(csvData).pipe(
+          map((data) => {
+            return StratificationFactorsActions.actionImportStratificationFactorSuccess();
+          }),
+          catchError(() => [StratificationFactorsActions.actionImportStratificationFactorFailure()])
+        )
+      )
+    )
+  );
+
   exportStratificationFactor$ = createEffect(() =>
     this.actions$.pipe(
       ofType(StratificationFactorsActions.actionExportStratificationFactor),

diff --git a/...ojects/upgrade/src/app/core/stratification-factors/stratification-factors.data.service.ts b/...ojects/upgrade/src/app/core/stratification-factors/stratification-factors.data.service.ts
@@ -11,6 +11,11 @@ export class StratificationFactorsDataService {
     return this.http.get(url);
   }
 
+  importStratificationFactors(stratificationFactors) {
+    const url = this.environment.api.stratification;
+    return this.http.post(url, stratificationFactors);
+  }
+
   deleteStratificationFactor(id: string) {
     const url = `${this.environment.api.stratification}/${id}`;
     return this.http.delete(url);

diff --git a/...nd/projects/upgrade/src/app/core/stratification-factors/stratification-factors.service.ts b/...nd/projects/upgrade/src/app/core/stratification-factors/stratification-factors.service.ts
@@ -24,6 +24,10 @@ export class StratificationFactorsService {
     this.store$.dispatch(StratificationFactorsActions.actionDeleteStratificationFactor({ factorId }));
   }
 
+  importStratificationFactors(csvData: string) {
+    this.store$.dispatch(StratificationFactorsActions.actionImportStratificationFactor({ csvData }));
+  }
+
   exportStratificationFactors(factorId: string) {
     this.store$.dispatch(StratificationFactorsActions.actionExportStratificationFactor({ factorId }));
   }

diff --git a/...s/stratification-factor-list/import-stratifications/import-stratifications.component.html b/...s/stratification-factor-list/import-stratifications/import-stratifications.component.html
@@ -5,8 +5,8 @@
     <p class="ft-16-400">
       {{ 'stratifications.import-stratification.message.text' | translate }}
     </p>
-    <input accept=".json" type="file" multiple class="ft-14-400 file-input" (change)="uploadFile($event)" />
-    <span class="error-msg" *ngIf="!isStratificationJSONValid">
+    <input accept=".csv" type="file" multiple class="ft-14-400 file-input" (change)="uploadFile($event)" />
+    <span class="error-msg" *ngIf="!isStratificationCSVValid">
       {{ 'stratifications.import-stratification.error.message.text' | translate }}
     </span>
   </div>
@@ -15,13 +15,7 @@
     <button class="shared-modal--modal-btn" mat-raised-button (click)="onCancelClick()">
       {{ 'global.cancel.text' | translate }}
     </button>
-    <button
-      mat-raised-button
-      class="shared-modal--modal-btn default-button"
-      [ngClass]="{ 'default-button--disabled': !stratificationInfo }"
-      [disabled]="!stratificationInfo"
-      (click)="importStratification()"
-    >
+    <button mat-raised-button class="shared-modal--modal-btn default-button" (click)="importStratification()">
       {{ 'global.import.text' | translate }}
     </button>
   </div>

diff --git a/...nts/stratification-factor-list/import-stratifications/import-stratifications.component.ts b/...nts/stratification-factor-list/import-stratifications/import-stratifications.component.ts
@@ -3,6 +3,7 @@ import {
   MatLegacyDialogRef as MatDialogRef,
   MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
 } from '@angular/material/legacy-dialog';
+import { StratificationFactorsService } from '../../../../../../core/stratification-factors/stratification-factors.service';
 
 @Component({
   selector: 'app-import-stratifications',
@@ -13,32 +14,48 @@ import {
 export class ImportStratificationsComponent {
   file: any;
   stratificationInfo: any;
-  isStratificationJSONValid = true;
+  isStratificationCSVValid = true;
+  csvData: any = [];
 
   // eslint-disable-next-line @typescript-eslint/no-empty-function
   constructor(
+    private stratificationFactorsService: StratificationFactorsService,
     public dialogRef: MatDialogRef<ImportStratificationsComponent>,
     @Inject(MAT_DIALOG_DATA) public data: any
   ) {}
 
-  onCancelClick(): void {
+  onCancelClick() {
     this.dialogRef.close();
   }
 
   importStratification() {
-    console.log('import stratifications');
+    this.stratificationFactorsService.importStratificationFactors(this.csvData);
+    this.onCancelClick();
   }
 
-  uploadFile(event) {
-    // const reader = new FileReader();
-    // reader.addEventListener(
-    //   'load',
-    //   function () {
-    //     const result = JSON.parse(reader.result as any);
-    //     this.segmentInfo = result;
-    //   }.bind(this)
-    // );
-    // reader.readAsText(event.target.files[0]);
-    console.log(event.target.files[0].name);
+  uploadFile(event: Event) {
+    // Get the input element from the event
+    const inputElement = event.target as HTMLInputElement;
+    // Get the FileList from the input element
+    const fileList = inputElement.files;
+
+    if (fileList) {
+      // Loop through the files in the FileList
+      for (let i = 0; i < fileList.length; i++) {
+        const file = fileList.item(i);
+        if (file) {
+          // Process the file (e.g., upload to server, read its contents, etc.)
+          // For demonstration purposes, we will simply log the file name
+          // If you want to read the contents of the file, you can use the FileReader API
+          const reader = new FileReader();
+          reader.onload = (e) => {
+            const fileContent = e.target?.result as string;
+            console.log(fileContent); // Log the content of the file
+            this.csvData.push({ "file": fileContent});
+          };
+          reader.readAsText(file);
+        }
+      }
+    }
   }
 }