CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

refactor: client view survey page (#1112)

Browse Source 
Fixes: #1111
This commit is contained in:
Karan Takalkar
2020-07-15 17:25:17 +05:30
committed by GitHub
parent 3fbe2815a0
commit 2670137564
12 changed files with 67 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/clients/clients-view/client-actions/client-actions.component.html
+1
View File
@@ -12,3 +12,4 @@
<mifosx-reactivate-client *ngIf="actions['Reactivate']"></mifosx-reactivate-client>
<mifosx-undo-client-rejection *ngIf="actions['Undo Rejection']"></mifosx-undo-client-rejection>
<mifosx-add-client-charge *ngIf="actions['Add Charge']"></mifosx-add-client-charge>
<mifosx-take-survey *ngIf="actions['Take Survey']"></mifosx-take-survey>
src/app/clients/clients-view/client-actions/client-actions.component.ts
+3 -1
View File
@@ -27,6 +27,7 @@ export class ClientActionsComponent {
'Reactivate': boolean
'Undo Rejection': boolean
'Add Charge': boolean
'Take Survey': boolean
} = {
'Assign Staff': false,
'Close': false,
@@ -40,7 +41,8 @@ export class ClientActionsComponent {
'Reject Transfer': false,
'Reactivate': false,
'Undo Rejection': false,
'Add Charge': false
'Add Charge': false,
'Take Survey': false
};
/**
src/app/clients/clients-view/client-actions/view-survey/take-survey/take-survey.component.html → src/app/clients/clients-view/client-actions/take-survey/take-survey.component.html
-2
View File
@@ -1,7 +1,5 @@
<div class="container mat-typography" style="padding-bottom: 20px;">
<h2>Surveys</h2>
<div class="mat-elevation-z2 surveyCont">
<div class="surveySelect" fxLayout="row">
src/app/clients/clients-view/client-actions/view-survey/take-survey/take-survey.component.scss → src/app/clients/clients-view/client-actions/take-survey/take-survey.component.scss
View File
src/app/clients/clients-view/client-actions/view-survey/take-survey/take-survey.component.spec.ts → src/app/clients/clients-view/client-actions/take-survey/take-survey.component.spec.ts
View File
src/app/clients/clients-view/client-actions/view-survey/take-survey/take-survey.component.ts → src/app/clients/clients-view/client-actions/take-survey/take-survey.component.ts
+4 -4
View File
@@ -3,8 +3,8 @@ import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
/** Custom Services */
import { ClientsService } from '../../../../clients.service';
import { AuthenticationService } from '../../../../../core/authentication/authentication.service';
import { ClientsService } from '../../../clients.service';
import { AuthenticationService } from '../../../../core/authentication/authentication.service';
/**
* Take Survey Component
*/
@@ -44,8 +44,8 @@ export class TakeSurveyComponent implements OnInit {
private clientsService: ClientsService,
private router: Router,
private authenticationService: AuthenticationService) {
this.route.data.subscribe((data: { allSurveysData: any }) => {
this.allSurveyData = data.allSurveysData;
this.route.data.subscribe((data: { clientActionData: any }) => {
this.allSurveyData = data.clientActionData;
this.clientId = this.route.parent.parent.snapshot.paramMap.get('clientId');
});
src/app/clients/clients-view/client-actions/view-survey/view-survey.component.html
+37 -57
View File
@@ -1,71 +1,51 @@
<div class="container m-b-20" fxLayoutAlign="end">
<button mat-raised-button color="primary" [routerLink]="['../Take Survey']">
<fa-icon icon="edit"></fa-icon>&nbsp;&nbsp;
Take Survey
</button>
</div>
<div class="container">
<mat-card>
<div fxLayout="row">
<mat-form-field fxFlex>
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event.target.value)">
</mat-form-field>
</div>
<div class="container">
<div class="mat-elevation-z8">
<mat-card-content>
<table mat-table [dataSource]="dataSource" matSort>
<div class="headingContent">
<div fxLayout="column" fxFlex="50%">
<div className="headingName">
<h3>List of All Surveys</h3>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div fxLayout="row" fxLayoutAlign="flex-end">
<button mat-raised-button color="primary" [routerLink]="['./Take-Survey']">
<fa-icon icon="plus"></fa-icon>&nbsp;&nbsp;
Take Survey
</button>
</div>
</div>
</div>
<ng-container matColumnDef="surveyName">
<th mat-header-cell *matHeaderCellDef mat-sort-header='surveyName'> Survey </th>
<td mat-cell *matCellDef="let survey"> {{ survey.surveyName }} </td>
</ng-container>
<div fxLayout="row">
<mat-form-field fxFlex>
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event.target.value)">
</mat-form-field>
</div>
<ng-container matColumnDef="createdBy">
<th mat-header-cell *matHeaderCellDef mat-sort-header='createdBy'> Created By </th>
<td mat-cell *matCellDef="let survey"> {{ survey.createdBy }} </td>
</ng-container>
<div>
<ng-container matColumnDef="date">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Date </th>
<td mat-cell *matCellDef="let survey"> {{ survey.date | date }} </td>
</ng-container>
<table mat-table [dataSource]="dataSource" matSort>
<ng-container matColumnDef="score">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Score </th>
<td mat-cell *matCellDef="let survey"> {{ survey.score }} </td>
</ng-container>
<ng-container matColumnDef="surveyName">
<th mat-header-cell *matHeaderCellDef mat-sort-header='surveyName'> Survey </th>
<td mat-cell *matCellDef="let surveydata"> {{ surveydata.surveyName }} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<ng-container matColumnDef="createdBy">
<th mat-header-cell *matHeaderCellDef mat-sort-header='createdby'> Created By </th>
<td mat-cell *matCellDef="let surveydata"> {{ surveydata.createdby }} </td>
</ng-container>
</table>
<ng-container matColumnDef="date">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Date </th>
<td mat-cell *matCellDef="let surveydata"> {{ surveydata.date | date }} </td>
</ng-container>
<mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
<ng-container matColumnDef="score">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Score </th>
<td mat-cell *matCellDef="let surveydata"> {{ surveydata.score }} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" class="select-row"></tr>
</table>
<mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
</div>
</mat-card-content>
</div>
</mat-card>
</div>
</div>
src/app/clients/clients-view/client-actions/view-survey/view-survey.component.ts
+15 -13
View File
@@ -13,11 +13,13 @@ import { MatTableDataSource, MatPaginator, MatSort } from '@angular/material';
})
export class ViewSurveyComponent implements OnInit {
/** Survey Data */
surveyData: any;
/** Data source for view surveys table. */
dataSource: MatTableDataSource<any>;
/** Columns to be displayed in list of surveys table. */
displayedColumns: string[] = ['surveyName', 'createdBy', 'date', 'score'];
/** Paginator for list of surveys table. */
@ViewChild(MatPaginator) paginator: MatPaginator;
/** Sorter for list of surveys table. */
@@ -35,26 +37,26 @@ export class ViewSurveyComponent implements OnInit {
}
ngOnInit() {
this.constructSurvey(this.surveyData);
this.constructSurveys(this.surveyData);
}
/**
* Constructs the list of survey data
* Sets datasource, paginator and sorter for surveys table.
* @param data Survey Data
*/
constructSurvey(data: any) {
const surveys: any[] = [];
data.forEach((ele: { id: number, userId: number, username: string, clientId: number, surveyId: number, surveyName: string, scorecardValues: Object[] }) => {
ele.scorecardValues.forEach((element: { createdOn: number, value: number }) => {
const item = {} as { surveyName: string, createdby: string, date: number, score: number };
item.surveyName = ele.surveyName;
item.createdby = ele.username;
item.date = element.createdOn;
item.score = element.value;
surveys.push(item);
constructSurveys(data: any) {
let surveys: any[] = [];
data.forEach((entry: any) => {
const scoreCards: any[] = entry.scorecardValues.map((element: any) => {
return {
surveyName: entry.surveyName,
createdBy: entry.username,
date: element.createdOn,
score: element.value
};
});
surveys = surveys.concat(scoreCards);
});
this.dataSource = new MatTableDataSource(surveys);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;