From 2b5341aa2c53379ca3d10ee9949c44b2394c67de Mon Sep 17 00:00:00 2001 From: Shubhankar Bhadra <42507632+shobhi1310@users.noreply.github.com> Date: Fri, 16 Oct 2020 21:09:57 +0530 Subject: [PATCH] feat: add create view survey page (#1247) Fixes: #580 --- src/app/clients/clients.component.scss | 3 + .../manage-surveys.component.html | 2 +- .../system/manage-surveys/survey.resolver.ts | 31 +++++ .../view-survey/view-survey.component.html | 111 ++++++++++++++++++ .../view-survey/view-survey.component.scss | 36 ++++++ .../view-survey/view-survey.component.spec.ts | 25 ++++ .../view-survey/view-survey.component.ts | 43 +++++++ src/app/system/system-routing.module.ts | 16 +++ src/app/system/system.module.ts | 4 +- src/app/system/system.service.ts | 9 ++ 10 files changed, 278 insertions(+), 2 deletions(-) create mode 100644 src/app/system/manage-surveys/survey.resolver.ts create mode 100644 src/app/system/manage-surveys/view-survey/view-survey.component.html create mode 100644 src/app/system/manage-surveys/view-survey/view-survey.component.scss create mode 100644 src/app/system/manage-surveys/view-survey/view-survey.component.spec.ts create mode 100644 src/app/system/manage-surveys/view-survey/view-survey.component.ts diff --git a/src/app/clients/clients.component.scss b/src/app/clients/clients.component.scss index 491574c9f..1d6a876d2 100644 --- a/src/app/clients/clients.component.scss +++ b/src/app/clients/clients.component.scss @@ -12,4 +12,7 @@ table { tr.select-row:hover { cursor: pointer; } + tr:nth-child(odd).td{ + color : black; + } } diff --git a/src/app/system/manage-surveys/manage-surveys.component.html b/src/app/system/manage-surveys/manage-surveys.component.html index 63f277807..ff3c2f6de 100644 --- a/src/app/system/manage-surveys/manage-surveys.component.html +++ b/src/app/system/manage-surveys/manage-surveys.component.html @@ -60,7 +60,7 @@ - + diff --git a/src/app/system/manage-surveys/survey.resolver.ts b/src/app/system/manage-surveys/survey.resolver.ts new file mode 100644 index 000000000..7b5909e1c --- /dev/null +++ b/src/app/system/manage-surveys/survey.resolver.ts @@ -0,0 +1,31 @@ +/** Angular Imports */ +import { Injectable } from '@angular/core'; +import { Resolve, ActivatedRouteSnapshot } from '@angular/router'; + +/** rxjs Imports */ +import { Observable } from 'rxjs'; + +/** Custom Services */ +import { SystemService } from '../system.service'; + +/** + * System data resolver. + */ +@Injectable() +export class SurveyResolver implements Resolve { + + /** + * @param {SystemService} systemService System service. + */ + constructor(private systemService: SystemService) {} + + /** + * Returns the Survey data. + * @returns {Observable} + */ + resolve(route: ActivatedRouteSnapshot): Observable { + const surveyId = route.paramMap.get('id'); + return this.systemService.getSurvey(surveyId); + } + +} diff --git a/src/app/system/manage-surveys/view-survey/view-survey.component.html b/src/app/system/manage-surveys/view-survey/view-survey.component.html new file mode 100644 index 000000000..86412e880 --- /dev/null +++ b/src/app/system/manage-surveys/view-survey/view-survey.component.html @@ -0,0 +1,111 @@ +
+ +
+ +
+ + + Survey + + + + +
+
+ Key: +
+ +
+ {{surveyData.key}} +
+ +
+ Name: +
+ +
+ {{surveyData.name}} +
+ +
+ Country Code: +
+ +
+ {{surveyData.countryCode}} +
+ +
+ Description: +
+ +
+ {{surveyData.description}} +
+ +
+ + + + + +
+ +
+ + + Questions + + + +
+ + +
Question: {{i+1}}
+
+
+ Key: +
+ +
+ {{questionData.key}} +
+
+ Text: +
+ +
+ {{questionData.text}} +
+
+
+
+ Description: +
+ +
+ {{questionData.description}} +
+
+
+
Option:
+ + + + + + + +
{{column | titlecase}}
+ {{row[column]}} +
+
+ + +
+ + +
diff --git a/src/app/system/manage-surveys/view-survey/view-survey.component.scss b/src/app/system/manage-surveys/view-survey/view-survey.component.scss new file mode 100644 index 000000000..285c49912 --- /dev/null +++ b/src/app/system/manage-surveys/view-survey/view-survey.component.scss @@ -0,0 +1,36 @@ +.mat-card{ + margin: 5px +} + +.survey_questions{ + margin-bottom: 10px; +} + +#key_text{ + margin: 10px; +} + +#description{ + margin: 10px; +} + +#questionaire{ + margin: 10px; +} + +#response { + width: 100%; +} + +#response th,#response td{ + text-align: left; + width: 100px; +} + +#response tr:hover{ + background-color: #ddd; +} + +mat-card-header{ + margin-bottom: 12px; +} diff --git a/src/app/system/manage-surveys/view-survey/view-survey.component.spec.ts b/src/app/system/manage-surveys/view-survey/view-survey.component.spec.ts new file mode 100644 index 000000000..efd6b8094 --- /dev/null +++ b/src/app/system/manage-surveys/view-survey/view-survey.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ViewSurveyComponent } from './view-survey.component'; + +describe('ViewSurveyComponent', () => { + let component: ViewSurveyComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ViewSurveyComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ViewSurveyComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/system/manage-surveys/view-survey/view-survey.component.ts b/src/app/system/manage-surveys/view-survey/view-survey.component.ts new file mode 100644 index 000000000..e7b779256 --- /dev/null +++ b/src/app/system/manage-surveys/view-survey/view-survey.component.ts @@ -0,0 +1,43 @@ +/** Angular Imports */ +import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute, Router } from '@angular/router'; +import { MatDialog } from '@angular/material/dialog'; + +/** Custom Services */ +import { SystemService } from 'app/system/system.service'; + +/** + * View Survey Component. + */ +@Component({ + selector: 'mifosx-view-survey', + templateUrl: './view-survey.component.html', + styleUrls: ['./view-survey.component.scss'] +}) +export class ViewSurveyComponent implements OnInit { + + /** Survey Data */ + surveyData: any; + + /** Columns shown in individual survey table */ + displayedColumns: string[] = [ 'text', 'value']; + + /** + * Retrieves the survey data from `resolve`. + * @param {ActivatedRoute} route Activated Route. + * @param {SystemService} systemService System Service. + * @param {MatDialog} dialog Dialog Reference. + * @param {Router} router Router for navigation. + */ + constructor(private route: ActivatedRoute, + private systemService: SystemService, + private dialog: MatDialog, + private router: Router) { + this.route.data.subscribe((data: { survey: any }) => { + this.surveyData = data.survey; + }); + } + + ngOnInit(): void { + } +} diff --git a/src/app/system/system-routing.module.ts b/src/app/system/system-routing.module.ts index 7c06f55d9..56bc81c8d 100644 --- a/src/app/system/system-routing.module.ts +++ b/src/app/system/system-routing.module.ts @@ -24,6 +24,7 @@ import { RolesAndPermissionsComponent } from './roles-and-permissions/roles-and- import { AddRoleComponent } from './roles-and-permissions/add-role/add-role.component'; import { ManageSurveysComponent } from './manage-surveys/manage-surveys.component'; import { CreateSurveyComponent } from './manage-surveys/create-survey/create-survey.component'; +import { ViewSurveyComponent } from './manage-surveys/view-survey/view-survey.component'; import { ManageSchedulerJobsComponent } from './manage-scheduler-jobs/manage-scheduler-jobs.component'; import { GlobalConfigurationsComponent } from './global-configurations/global-configurations.component'; import { EditConfigurationComponent } from './global-configurations/edit-configuration/edit-configuration.component'; @@ -74,6 +75,7 @@ import { AuditTrailSearchTemplateResolver } from './audit-trails/audit-trail-sea import { AuditTrailResolver } from './audit-trails/view-audit/audit-trail.resolver'; import { ReportsResolver } from './manage-reports/reports.resolver'; import { ReportResolver } from './manage-reports/report.resolver'; +import { SurveyResolver } from './manage-surveys/survey.resolver'; import { ReportTemplateResolver } from './manage-reports/report-template.resolver'; import { ViewSchedulerJobComponent } from './manage-scheduler-jobs/view-scheduler-job/view-scheduler-job.component'; import { ViewSchedulerJobResolver } from './manage-scheduler-jobs/view-scheduler-job/view-scheduler-job.resolver'; @@ -388,6 +390,19 @@ const routes: Routes = [ path: 'create', component: CreateSurveyComponent, data: { title: extract('Create Survey'), breadcrumb: 'Create' }, + }, + { + path: ':id', + data: {title: extract('View Survey'), routeParamBreadcrumb: 'id'}, + children: [ + { + path: '', + component: ViewSurveyComponent, + resolve: { + survey: SurveyResolver + } + } + ] } ] }, @@ -580,6 +595,7 @@ const routes: Routes = [ HooksTemplateResolver, RolesAndPermissionsResolver, ManageSurveysResolver, + SurveyResolver, ManageSchedulerJobsResolver, GlobalConfigurationsResolver, GlobalConfigurationResolver, diff --git a/src/app/system/system.module.ts b/src/app/system/system.module.ts index 7d7013d11..0943ed778 100644 --- a/src/app/system/system.module.ts +++ b/src/app/system/system.module.ts @@ -20,6 +20,7 @@ import { ManageHooksComponent } from './manage-hooks/manage-hooks.component'; import { RolesAndPermissionsComponent } from './roles-and-permissions/roles-and-permissions.component'; import { AddRoleComponent } from './roles-and-permissions/add-role/add-role.component'; import { ManageSurveysComponent } from './manage-surveys/manage-surveys.component'; +import { ViewSurveyComponent } from './manage-surveys/view-survey/view-survey.component'; import { CreateSurveyComponent } from './manage-surveys/create-survey/create-survey.component'; import { ManageSchedulerJobsComponent } from './manage-scheduler-jobs/manage-scheduler-jobs.component'; import { GlobalConfigurationsComponent } from './global-configurations/global-configurations.component'; @@ -117,7 +118,8 @@ import { ConfigureMakerCheckerTasksComponent } from './configure-maker-checker-t ConfigureMakerCheckerTasksComponent, CreateSurveyComponent, EditSchedulerJobComponent, - ViewHistorySchedulerJobComponent + ViewHistorySchedulerJobComponent, + ViewSurveyComponent ], }) export class SystemModule { } diff --git a/src/app/system/system.service.ts b/src/app/system/system.service.ts index 19e02c4b9..b80fa4359 100644 --- a/src/app/system/system.service.ts +++ b/src/app/system/system.service.ts @@ -221,6 +221,15 @@ export class SystemService { return this.http.post('/surveys', survey); } + /** + * @param {string} reportId Survey ID. + * @returns {Observable} Survey. + */ + getSurvey(surveyId: string): Observable { + return this.http.get(`/surveys/${surveyId}?template=true`); + } + + /** * @returns {Observable} Fetches Jobs. */