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

Question master UI

Browse Source
This commit is contained in:
saravanakumarkandasami 2018-11-14 18:41:51 +05:30
parent 671fb8235a
commit 69cc149b87
2 changed files with 39 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,13 +1,17 @@
<!--<pre> {{ m_group | json}}</pre>--> <!--<pre> {{ m_group | json}}</pre>-->
<h2 mat-dialog-title>{{pageTitle}}</h2> <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="80"> <span mat-dialog-title>{{pageTitle}}</span> </div>
<div fxFlex="20"><button mat-raised-button mat-icon-button mat-dialog-close class="mr-1 mb-1 hover-icon" matTooltip="Close" matTooltipPosition="above"><mat-icon>close</mat-icon></button></div>
</div>
<mat-dialog-content class="mat-typography"> <mat-dialog-content class="mat-typography">
<mat-card style="width: 580px; padding: 6px;"> <mat-card style="width: 580px; padding: 6px;">
<form [formGroup]="_addQuesFrom" (submit)="onSubmit()" novalidate> <form [formGroup]="_addQuesFrom" (submit)="onSubmit()" novalidate>
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none"> <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="50"> <div fxFlex="100">
<mat-form-field> <mat-form-field style="width: 100%">
<mat-select placeholder="Select Category" formControlName="fk_question_category"> <mat-select placeholder="Category" formControlName="fk_question_category">
<mat-option *ngFor="let ct of categories" [value]="ct.question_category_id">{{ ct.category_name }}</mat-option> <mat-option *ngFor="let ct of categories" [value]="ct.question_category_id">{{ ct.category_name }}</mat-option>
</mat-select> </mat-select>
<mat-error *ngIf="submitted && f.fk_question_category.hasError('required')" class="mat-text-warn">You must Select Category.</mat-error> <mat-error *ngIf="submitted && f.fk_question_category.hasError('required')" class="mat-text-warn">You must Select Category.</mat-error>
@ -39,14 +43,12 @@
</div> </div>
</div> </div>
<div fxLayout="row" fxLayoutAlign="start none"> <div fxLayout="row" fxLayoutAlign="start none">
<div> <mat-form-field style="width: 100%">
<mat-form-field> <mat-select placeholder="Answer Type" formControlName="fk_question_answertype">
<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-option *ngFor="let ans of questionsOptions" [value]="ans.question_answer_type_id">{{ ans.answer_type_name }}</mat-option>
</mat-select> </mat-select>
<mat-error *ngIf="submitted && f.fk_question_answertype.hasError('required')" class="mat-text-warn">You must Select Answer Type.</mat-error> <mat-error *ngIf="submitted && f.fk_question_answertype.hasError('required')" class="mat-text-warn">You must Select Answer Type.</mat-error>
</mat-form-field> </mat-form-field>
</div>
</div> </div>
<div fxLayout="row" fxLayoutAlign="start none"> <div fxLayout="row" fxLayoutAlign="start none">
<div formArrayName="answers" fxFill> <div formArrayName="answers" fxFill>
@ -65,25 +67,26 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div>--> </div>-->
<div fxFlex="20"> <div fxFlex="20" style="text-align:right;">
<span *ngIf="_addQuesFrom.controls.answers.controls.length > 1" (click)="removeLanguage(i)"> <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> <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span> </span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above" </div>
class="mr-1 mb-1 hover-icon" (click)="addLanguage($event); false"><mat-icon>add</mat-icon></button>
</div>
</div> </div>
<div class="row" style="text-align:right;"> <div class="row" style="text-align:right;">
<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-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="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> <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> </form>
</mat-card> </mat-card>
</mat-dialog-content> </mat-dialog-content>
<mat-dialog-actions align="end"> <!----<mat-dialog-actions align="end">
<button mat-button mat-dialog-close>Cancel</button> <button mat-button mat-dialog-close>Cancel</button>
</mat-dialog-actions> </mat-dialog-actions>-->

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

@ -1,12 +1,15 @@
<h2 mat-dialog-title>{{pageTitle}}</h2> <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="80"> <span mat-dialog-title>{{pageTitle}}</span> </div>
<div fxFlex="20"><button mat-raised-button mat-icon-button mat-dialog-close class="mr-1 mb-1 hover-icon" matTooltip="Close" matTooltipPosition="above"><mat-icon>close</mat-icon></button></div>
</div>
<mat-dialog-content class="mat-typography"> <mat-dialog-content class="mat-typography">
<mat-card style="width: 580px; padding: 6px;"> <mat-card style="width: 580px; padding: 6px;">
<form [formGroup]="_addQuesFrom" (submit)="onSubmit()"> <form [formGroup]="_addQuesFrom" (submit)="onSubmit()">
<!--<div class="form-group">--> <!--<div class="form-group">-->
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none"> <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="50"> <div fxFlex="100" >
<mat-form-field> <mat-form-field style="width: 100%">
<mat-select placeholder="Select Category" formControlName="fk_question_category"> <mat-select placeholder="Category" formControlName="fk_question_category">
<mat-option *ngFor="let ct of categories" [value]="ct.question_category_id">{{ ct.category_name }}</mat-option> <mat-option *ngFor="let ct of categories" [value]="ct.question_category_id">{{ ct.category_name }}</mat-option>
</mat-select> </mat-select>
<mat-error *ngIf="submitted && f.fk_question_category.hasError('required')" class="mat-text-warn">You must Select Category.</mat-error> <mat-error *ngIf="submitted && f.fk_question_category.hasError('required')" class="mat-text-warn">You must Select Category.</mat-error>
@ -37,15 +40,13 @@
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
<div fxLayout="row" fxLayoutAlign="start none"> <div fxLayout="row" fxLayoutAlign="start none">
<div> <mat-form-field style="width: 100%">
<mat-form-field> <mat-select placeholder="Answer Type" formControlName="fk_question_answertype">
<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-option *ngFor="let ans of questionsOptions" [value]="ans.question_answer_type_id">{{ ans.answer_type_name }}</mat-option>
</mat-select> </mat-select>
<mat-error *ngIf="submitted && f.fk_question_answertype.hasError('required')" class="mat-text-warn">You must Select Answer Type.</mat-error> <mat-error *ngIf="submitted && f.fk_question_answertype.hasError('required')" class="mat-text-warn">You must Select Answer Type.</mat-error>
</mat-form-field> </mat-form-field>
</div>
</div> </div>
<div fxLayout="row" fxLayoutAlign="start none"> <div fxLayout="row" fxLayoutAlign="start none">
<!--<mat-checkbox formControlName="isactive" [ngModel]="f.isactive.value === 1 ? true : false" <!--<mat-checkbox formControlName="isactive" [ngModel]="f.isactive.value === 1 ? true : false"
@ -57,7 +58,7 @@
<div *ngFor="let answ of f_ans.controls; let i=index"> <div *ngFor="let answ of f_ans.controls; let i=index">
<div [formGroupName]="i"> <div [formGroupName]="i">
<div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none"> <div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
<div fxFlex="80"> <div fxFlex="60">
<mat-form-field class="ml-xs example-full-width"> <mat-form-field class="ml-xs example-full-width">
<!--<span>Answer {{i + 1}} </span>--> <!--<span>Answer {{i + 1}} </span>-->
<textarea matInput placeholder="Answer" formControlName="answer"></textarea> <textarea matInput placeholder="Answer" formControlName="answer"></textarea>
@ -65,24 +66,22 @@
</mat-form-field> </mat-form-field>
</div> </div>
<div fxFlex="30"> <div fxFlex="30">
<mat-form-field> <mat-form-field style="margin-top: 7%;">
<mat-select placeholder="Select Group" formControlName="fk_question_group_id"> <mat-select placeholder="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-option *ngFor="let gp of m_group" [value]="gp.question_group_id">{{ gp.group_name }}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
<div fxFlex="20"> <div fxFlex="10">
<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" <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> (ngModelChange)="answ.get('isactive').value = $event ? 1 : 0"></mat-checkbox>
<span *ngIf="_addQuesFrom.controls.answers.controls.length > 1" (click)="removeLanguage(i)"> <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> <button *ngIf="answ.get('question_answer_id').value == null" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span> </span>
</div> </div>
</div> </div>
</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, 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> --> <!-- <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>--> <!--<a (click)="addLanguage()" style="cursor: default">Add another Answer </a>-->
</div> </div>
@ -94,6 +93,9 @@
</li> </li>
</ul>--> </ul>-->
<div class="row" style="text-align:right;"> <div class="row" style="text-align:right;">
<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, null, $event); false"><mat-icon>add</mat-icon></button>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="button" <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> (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> <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>
@ -102,7 +104,5 @@
</form> </form>
</mat-card> </mat-card>
</mat-dialog-content> </mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-button mat-dialog-close>Cancel</button>
</mat-dialog-actions>
<notifier-container></notifier-container> <notifier-container></notifier-container>