/** Angular Imports */ import { Component , OnInit } from '@angular/core' ; import { FormGroup , FormBuilder , FormArray , Validators } from '@angular/forms' ; import { Router , ActivatedRoute } from '@angular/router' ; import { MatDialog } from '@angular/material/dialog' ; import { CdkDragDrop , moveItemInArray } from '@angular/cdk/drag-drop' ; /** Custom Services */ import { SystemService } from '../../system.service' ; /** Custom Components */ import { CancelDialogComponent } from '../../../shared/cancel-dialog/cancel-dialog.component' ; /**
 * Create survey component.
 */ @ Component ( { selector : 'mifosx-create-survey' , templateUrl : './create-survey.component.html' , styleUrls : [ './create-survey.component.scss' ] } ) export class CreateSurveyComponent implements OnInit { /** Survey form. */ surveyForm : FormGroup ; param { FormBuilder } formBuilder param { SystemService } systemService param { ActivatedRoute } route param { Router } router param { MatDialog } dialog constructor ( private formBuilder , private systemService , private route , private router , public dialog ) { } /**
     * Creates the survey form.
     */ ngOnInit ( ) { this . createSurveyForm ( ) ; } /**
     * Creates the survey form.
     */ createSurveyForm ( ) { this . surveyForm = this . formBuilder . group ( { 'key' : [ '' , Validators . required ] , 'name' : [ '' , Validators . required ] , 'countryCode' : [ '' , [ Validators . required , Validators . pattern ( '^\\s*([A-Za-z]{2})?\\s*$' ) ] ] , 'description' : [ '' ] , 'questionDatas' : this . formBuilder . array ( [ ] ) } ) ; } returns { FormArray } get questionDatas ( ) : FormArray { return this . surveyForm . get ( 'questionDatas' ) as FormArray ; } param { number } questionIndex returns { FormArray } getResponseDatas ( questionIndex ) { return this . surveyForm . get ( [ 'questionDatas' , questionIndex , 'responseDatas' ] ) as FormArray ; } returns { FormGroup } createQuestionForm ( ) { return this . formBuilder . group ( { 'key' : [ '' , Validators . required ] , 'text' : [ '' , Validators . required ] , 'description' : [ '' ] , 'responseDatas' : this . formBuilder . array ( [ this . createResponseForm ( ) ] ) , 'sequenceNo' : [ '' ] } ) ; } /**
     * Adds a question to the questions form array
     */ addQuestion ( ) { this . questionDatas . push ( this . createQuestionForm ( ) ) ; this . updateSequenceNumber ( ) ; } param { number } index removeQuestion ( index ) { this . questionDatas . removeAt ( index ) ; this . updateSequenceNumber ( ) ; } returns { FormGroup } createResponseForm ( ) { return this . formBuilder . group ( { 'text' : [ '' , Validators . required ] , 'value' : [ '' , [ Validators . required , Validators . pattern ( '^\\s*[-]?\\d{0,4}\\s*$' ) ] ] , 'sequenceNo' : [ '' ] } ) ; } param { number } questionIndex addResponse ( questionIndex ) { this . getResponseDatas ( questionIndex ) . push ( this . createResponseForm ( ) ) ; this . updateSequenceNumber ( ) ; } param { FormArray } responseFormArray param { number } index removeResponse ( responseFormArray , index ) { responseFormArray . removeAt ( index ) ; this . updateSequenceNumber ( ) ; } /**
     * Updates the sequence numbers of questions and responses
     */ updateSequenceNumber ( ) { for ( let questionIndex = 0 ; questionIndex < this . questionDatas . length ; questionIndex ++ ) { this . questionDatas . at ( questionIndex ) . get ( 'sequenceNo' ) . setValue ( questionIndex + 1 ) ; for ( let responseIndex = 0 ; responseIndex < this . getResponseDatas ( questionIndex ) . length ; responseIndex ++ ) { this . getResponseDatas ( questionIndex ) . at ( responseIndex ) . get ( 'sequenceNo' ) . setValue ( responseIndex + 1 ) ; } } } /**
     * Cancels the survey and redirects to surveys.
     */ cancelSurvey ( ) { const cancelSurveyDialogRef = this . dialog . open ( CancelDialogComponent ) ; cancelSurveyDialogRef . afterClosed ( ) . subscribe ( ( response ) => { if ( response . cancel ) { this . router . navigate ( [ '../' ] , { relativeTo : this . route } ) ; } } ) ; } /**
     * Reorders the question order according to the user drop
     */ dropQuestion ( event ) { moveItemInArray ( this . questionDatas . controls , event . previousIndex , event . currentIndex ) ; this . updateSequenceNumber ( ) ; } /**
     * Reorders the response order according to the user drop
     */ dropResponse ( event , questionIndex ) { moveItemInArray ( this . getResponseDatas ( questionIndex ) . controls , event . previousIndex , event . currentIndex ) ; this . updateSequenceNumber ( ) ; } /**
     * Submits the survey form and creates survey,
     * if successful redirects to surveys.
     */ submit ( ) { this . surveyForm . patchValue ( { countryCode : this . surveyForm . value . countryCode . toUpperCase ( ) } ) ; this . systemService . createSurvey ( this . surveyForm . value ) . subscribe ( ( response ) => { this . router . navigate ( [ '../' ] , { relativeTo : this . route } ) ; } ) ; } }