Sineedge/sparqsineedge
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

question master add changes : kdk

Browse Source
This commit is contained in:
dineshkumarkannan 2018-11-04 10:38:44 +05:30
parent 229bebcb57
commit e5d4a00505
4 changed files with 181 additions and 121 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

111
ng6-seed/src/app/template/questions/add/add.component.html
View File

@ -1,78 +1,89 @@
<div style="max-height: 580px;">
<mat-card style="width: 580px; padding: 6px;">
<div class="ml-xs mr-xs" style="width: 100%;" fxLayout="row" fxLayoutAlign="center">
<h2 mat-dialog-title style="width: 50%;">{{pageTitle}}</h2>
<div style="width: 20%;"></div>
<div style="width: 30%;text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Close" matTooltipPosition="above" (click)="onNoClick()"><mat-icon>close</mat-icon></button>
</div>
</div>
<form [formGroup]="_addQuesFrom" (submit)="onSubmit()">
<!--<div class="form-group">-->
<div fxLayout="row" fxLayoutAlign="start none">
<mat-form-field class="ml-xs example-full-width">
<!--<pre> {{ m_group | json}}</pre>-->
<h2 mat-dialog-title>{{pageTitle}}</h2>
<mat-dialog-content class="mat-typography">
<mat-card style="width: 580px; padding: 6px;">
<form [formGroup]="_addQuesFrom" (submit)="onSubmit()" novalidate>
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="50">
<mat-form-field>
<mat-select placeholder="Select Category" formControlName="fk_question_category">
<mat-option *ngFor="let ct of categories" [value]="ct.question_category_id">{{ ct.category_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_question_category.hasError('required')" class="mat-text-warn">You must Select Category.</mat-error>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<mat-form-field class="ml-xs example-full-width">
<div fxFlex="50">
<mat-form-field>
<mat-select placeholder="Select Group" formControlName="fk_question_group_id">
<mat-option *ngFor="let gp of m_group" [value]="gp.question_group_id">{{ gp.group_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_question_group_id.hasError('required')" class="mat-text-warn">You must Select Group.</mat-error>
</mat-form-field>
</div>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div class="example-full-width">
<mat-form-field fxFill>
<textarea matInput placeholder="Question" formControlName="question"></textarea>
<mat-error *ngIf="submitted && f.question.hasError('required')" class="mat-text-warn">You must Include Question.</mat-error>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<mat-form-field class="ml-xs example-full-width">
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div class="example-full-width">
<mat-form-field fxFill>
<textarea matInput placeholder="Description" formControlName="description"></textarea>
<mat-error *ngIf="submitted && f.description.hasError('required')" class="mat-text-warn">You must Include Description.</mat-error>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<mat-form-field class="ml-xs example-full-width">
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div>
<mat-form-field>
<mat-select placeholder="Select Answer Type" formControlName="fk_question_answertype">
<mat-option *ngFor="let ans of questionsOptions" [value]="ans.question_answer_type_id">{{ ans.answer_type_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_question_answertype.hasError('required')" class="mat-text-warn">You must Select Answer Type.</mat-error>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div formArrayName="answers" class="example-full-width">
<div *ngFor="let answ of _addQuesFrom.controls.answers['controls']; let i=index">
<div [formGroupName]="i">
<div fxLayout="row" style="width: 100%">
<div style="width: 80%">
<mat-form-field class="ml-xs example-full-width">
<!--<span>Answer {{i + 1}}</span>-->
<textarea matInput placeholder="Answer" formControlName="answer"></textarea>
<!--<mat-error *ngIf="submitted && answer.hasError('required')" class="mat-text-warn">You must Include Question.</mat-error>-->
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div formArrayName="answers" fxFill>
<div *ngFor="let answ of _addQuesFrom.controls.answers['controls']; let i=index">
<div [formGroupName]="i">
<div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
<div fxFlex="80">
<mat-form-field class="ml-xs example-full-width">
<textarea matInput placeholder="Answer" formControlName="answer"></textarea>
</mat-form-field>
</div>
<div fxFlex="30">
<mat-form-field>
<mat-select placeholder="Select Group" formControlName="fk_question_group_id">
<mat-option *ngFor="let gp of m_group" [value]="gp.question_group_id">{{ gp.group_name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div style="width:20%">
<span *ngIf="_addQuesFrom.controls.answers.controls.length > 1" (click)="removeLanguage(i)">
</div>
<div fxFlex="20">
<span *ngIf="_addQuesFrom.controls.answers.controls.length > 1" (click)="removeLanguage(i)">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span>
</div>
</div>
</div>
</div>
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" (click)="addLanguage($event); false"><mat-icon>add</mat-icon></button>
<!-- <button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above" (click)="addLanguage($event); false">Add More</button> -->
<!--<a (click)="addLanguage()" style="cursor: default">Add another Answer </a>-->
</div>
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addLanguage($event); false"><mat-icon>add</mat-icon></button>
</div>
<!--Error List Shown Here-->
<!--<ul>
<li *ngFor="let err of errorMessage">
<mat-error>{{err.err}}</mat-error>
</li>
</ul>-->
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><mat-icon>settings_backup_restore</mat-icon></button>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
<!--</div>-->
</form>
</mat-card>
</div>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><mat-icon>settings_backup_restore</mat-icon></button>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
</form>
</mat-card>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-button mat-dialog-close>Cancel</button>
</mat-dialog-actions>

19
ng6-seed/src/app/template/questions/add/add.component.ts
View File

@ -39,6 +39,7 @@ export class AddComponent implements OnInit {
public submitted = false;
public categories: any = [];
public questionsOptions: any = [];
public m_group: any = [];
errorMessage: string;
/**
@ -62,6 +63,7 @@ export class AddComponent implements OnInit {
question: [null, Validators.compose([Validators.required])],
description: [null, Validators.compose([Validators.required])],
fk_question_category: [null, Validators.compose([Validators.required])],
fk_question_group_id: [null, Validators.compose([Validators.required])],
fk_question_answertype: [null, Validators.compose([Validators.required])],
answers: this._formBuilder.array([
this.initAnswers(),
@ -70,6 +72,7 @@ export class AddComponent implements OnInit {
// OnInit Load Category and Question Type Masters
this.getCategoryListMaster();
this.getQuestionOptionsMaster();
this.getQuestionGroupMaster();
}
// convenience getter for easy access to form fields
@ -78,7 +81,8 @@ export class AddComponent implements OnInit {
// Dynamic Form field creation Functionality : START ===>
initAnswers() {
return this._formBuilder.group({
answer: ['', Validators.compose([Validators.required])]
answer: ['', Validators.compose([Validators.required])],
fk_question_group_id: ['']
});
}
addLanguage(e) {
@ -103,6 +107,19 @@ export class AddComponent implements OnInit {
}
)
}
getQuestionGroupMaster() {
this.masterService.getAllMasterData('QUESTIONGROUP').subscribe(
data => {
this.m_group = data.records;
},
error => {
this.notifier.notify('warning', 'No Question Group Records Found.!');
this.errorMessage = "No Question Group Records Found.";
}
)
}
getQuestionOptionsMaster() {
this.masterService.getAllMasterData('QUESTIONANSWERTYPE').subscribe(
data => {

134
ng6-seed/src/app/template/questions/edit/edit.component.html
View File

@ -1,92 +1,108 @@
<div style="max-height: 480px;">
<mat-card style="width: 580px; padding: 6px;">
<div class="ml-xs mr-xs" style="width: 100%;" fxLayout="row" fxLayoutAlign="center">
<h2 mat-dialog-title style="width: 50%;">{{pageTitle}}</h2>
<div style="width: 20%;"></div>
<div style="width: 30%;text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Close" matTooltipPosition="above" (click)="onNoClick()"><mat-icon>close</mat-icon></button>
</div>
</div>
<form [formGroup]="_addQuesFrom" (submit)="onSubmit()">
<!--<div class="form-group">-->
<div fxLayout="row" fxLayoutAlign="start none">
<mat-form-field class="ml-xs example-full-width">
<h2 mat-dialog-title>{{pageTitle}}</h2>
<mat-dialog-content class="mat-typography">
<mat-card style="width: 580px; padding: 6px;">
<form [formGroup]="_addQuesFrom" (submit)="onSubmit()">
<!--<div class="form-group">-->
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="50">
<mat-form-field>
<mat-select placeholder="Select Category" formControlName="fk_question_category">
<mat-option *ngFor="let ct of categories" [value]="ct.question_category_id">{{ ct.category_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_question_category.hasError('required')" class="mat-text-warn">You must Select Category.</mat-error>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<mat-form-field class="ml-xs example-full-width">
<div fxFlex="50">
<mat-form-field>
<mat-select placeholder="Select Group" formControlName="fk_question_group_id">
<mat-option *ngFor="let gp of m_group" [value]="gp.question_group_id">{{ gp.group_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_question_group_id.hasError('required')" class="mat-text-warn">You must Select Group.</mat-error>
</mat-form-field>
</div>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div class="example-full-width">
<mat-form-field fxFill>
<textarea matInput placeholder="Question" formControlName="question"></textarea>
<mat-error *ngIf="submitted && f.question.hasError('required')" class="mat-text-warn">You must Include Question.</mat-error>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<mat-form-field class="ml-xs example-full-width">
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div class="example-full-width">
<mat-form-field fxFill>
<textarea matInput placeholder="Description" formControlName="description"></textarea>
<mat-error *ngIf="submitted && f.description.hasError('required')" class="mat-text-warn">You must Include Description.</mat-error>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<mat-form-field class="ml-xs example-full-width">
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div>
<mat-form-field>
<mat-select placeholder="Select Answer Type" formControlName="fk_question_answertype">
<mat-option *ngFor="let ans of questionsOptions" [value]="ans.question_answer_type_id">{{ ans.answer_type_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_question_answertype.hasError('required')" class="mat-text-warn">You must Select Answer Type.</mat-error>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<!--<mat-checkbox formControlName="isactive" [ngModel]="f.isactive.value === 1 ? true : false"
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<!--<mat-checkbox formControlName="isactive" [ngModel]="f.isactive.value === 1 ? true : false"
(ngModelChange)="f.isactive.value = $event ? 1 : 0">Active/InActive</mat-checkbox>
-->
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div formArrayName="answers" class="example-full-width">
<div *ngFor="let answ of f_ans.controls; let i=index">
<div [formGroupName]="i">
<div fxLayout="row" style="width: 100%">
<div style="width: 80%">
<mat-form-field class="ml-xs example-full-width">
<!--<span>Answer {{i + 1}} </span>-->
<textarea matInput placeholder="Answer" formControlName="answer"></textarea>
<!--<mat-error *ngIf="submitted && answer.hasError('required')" class="mat-text-warn">You must Include Question.</mat-error>-->
</mat-form-field>
</div>
<div style="width:20%">
<mat-checkbox *ngIf="answ.get('question_answer_id').value != null" formControlName="isactive" [ngModel]="answ.get('isactive').value == 1 ? true : answ.get('isactive').value == 0 ? false : null"
(ngModelChange)="answ.get('isactive').value = $event ? 1 : 0"></mat-checkbox>
<span *ngIf="_addQuesFrom.controls.answers.controls.length > 1" (click)="removeLanguage(i)">
</div>
<div fxLayout="row" fxLayoutAlign="start none">
<div formArrayName="answers" fxFill>
<div *ngFor="let answ of f_ans.controls; let i=index">
<div [formGroupName]="i">
<div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
<div fxFlex="80">
<mat-form-field class="ml-xs example-full-width">
<!--<span>Answer {{i + 1}} </span>-->
<textarea matInput placeholder="Answer" formControlName="answer"></textarea>
<!--<mat-error *ngIf="submitted && answer.hasError('required')" class="mat-text-warn">You must Include Question.</mat-error>-->
</mat-form-field>
</div>
<div fxFlex="30">
<mat-form-field>
<mat-select placeholder="Select Group" formControlName="fk_question_group_id">
<mat-option *ngFor="let gp of m_group" [value]="gp.question_group_id">{{ gp.group_name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div fxFlex="20">
<mat-checkbox *ngIf="answ.get('question_answer_id').value != null" formControlName="isactive" [ngModel]="answ.get('isactive').value == 1 ? true : answ.get('isactive').value == 0 ? false : null"
(ngModelChange)="answ.get('isactive').value = $event ? 1 : 0"></mat-checkbox>
<span *ngIf="_addQuesFrom.controls.answers.controls.length > 1" (click)="removeLanguage(i)">
<button *ngIf="answ.get('question_answer_id').value == null" mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span>
</div>
</div>
</div>
</div>
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" (click)="addLanguage(null, null, null, $event); false"><mat-icon>add</mat-icon></button>
<!-- <button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above" (click)="addLanguage(null, null, null, $event); false">Add More</button> -->
<!--<a (click)="addLanguage()" style="cursor: default">Add another Answer </a>-->
</div>
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addLanguage(null, null, null, $event); false"><mat-icon>add</mat-icon></button>
<!-- <button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above" (click)="addLanguage(null, null, null, $event); false">Add More</button> -->
<!--<a (click)="addLanguage()" style="cursor: default">Add another Answer </a>-->
</div>
<!--Error List Shown Here-->
<!--<ul>
</div>
<!--Error List Shown Here-->
<!--<ul>
<li *ngFor="let err of errorMessage">
<mat-error>{{err.err}}</mat-error>
</li>
</ul>-->
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="button"
(click)="onReset()"><mat-icon>settings_backup_restore</mat-icon></button>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
<!--</div>-->
</form>
</mat-card>
</div>
<notifier-container></notifier-container>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="button"
(click)="onReset()"><mat-icon>settings_backup_restore</mat-icon></button>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
<!--</div>-->
</form>
</mat-card>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-button mat-dialog-close>Cancel</button>
</mat-dialog-actions>
<notifier-container></notifier-container>

38
ng6-seed/src/app/template/questions/edit/edit.component.ts
View File

@ -39,6 +39,7 @@ export class EditComponent implements OnInit {
public _addQuesFrom: FormGroup;
public submitted = false;
public categories: any = [];
public m_group: any = [];
public questionsOptions: any = [];
errorMessage: string;
@ -60,15 +61,16 @@ export class EditComponent implements OnInit {
ngOnInit() {
this.loadFormData();
if (this.data["0"].length > 0) {
for (let val of this.data["0"]) {
// alert(JSON.stringify(val));
let vals = val;
this.addLanguage(vals['answer'], vals['question_answer_id'], vals['isactive'], null);
}
}
// if (this.data["0"].length > 0) {
// for (let val of this.data["0"]) {
// // alert(JSON.stringify(val));
// let vals = val;
// this.addLanguage(vals['answer'], vals['question_answer_id'], vals['isactive'], null);
// }
// }
// OnInit Load Category and Question Type Masters
this.getCategoryListMaster();
this.getQuestionGroupMaster();
this.getQuestionOptionsMaster();
}
@ -78,7 +80,7 @@ export class EditComponent implements OnInit {
for (let val of this.data["0"]) {
// alert(JSON.stringify(val));
let vals = val;
this.addLanguage(vals['answer'], vals['question_answer_id'], vals['isactive'], null);
this.addLanguage(vals['answer'], vals['question_answer_id'], vals['fk_question_group_id'], vals['isactive'], null);
}
}
}
@ -91,6 +93,7 @@ export class EditComponent implements OnInit {
question: [this.data.question, Validators.compose([Validators.required])],
description: [this.data.description, Validators.compose([Validators.required])],
fk_question_category: [this.data.fk_question_category, Validators.compose([Validators.required])],
fk_question_group_id: [this.data.fk_question_group_id, Validators.compose([Validators.required])],
fk_question_answertype: [this.data.fk_question_answertype, Validators.compose([Validators.required])],
isactive: [this.data.isactive],
answers: this._formBuilder.array([
@ -107,17 +110,18 @@ export class EditComponent implements OnInit {
// Dynamic Form field creation Functionality : START ===>
initAnswers(ans, fk_id, isAct) {
initAnswers(ans, fk_id, fk_question_group_id, isAct) {
isAct = isAct == null ? 1 : isAct;
return this._formBuilder.group({
answer: [ans, Validators.compose([Validators.required])],
question_answer_id: [fk_id],
fk_question_group_id: [fk_question_group_id],
isactive: [isAct]
});
}
addLanguage(ans, fk_id, isAct, e) {
addLanguage(ans, fk_id, fk_question_group_id, isAct, e) {
const control = <FormArray>this._addQuesFrom.controls['answers'];
control.push(this.initAnswers(ans, fk_id, isAct));
control.push(this.initAnswers(ans, fk_id, fk_question_group_id, isAct));
}
removeLanguage(i: number) {
const control = <FormArray>this._addQuesFrom.controls['answers'];
@ -137,6 +141,18 @@ export class EditComponent implements OnInit {
}
)
}
getQuestionGroupMaster() {
this.masterService.getAllMasterData('QUESTIONGROUP').subscribe(
data => {
this.m_group = data.records;
},
error => {
this.notifier.notify('warning', 'No Question Group Records Found.!');
this.errorMessage = "No Question Group Records Found.";
}
)
}
getQuestionOptionsMaster() {
this.masterService.getAllMasterData('QUESTIONANSWERTYPE').subscribe(
data => {