Template Screen UI

This commit is contained in:
saravanakumarkandasami 2018-10-23 12:49:26 +05:30
parent 530efd0edb
commit 52c460ec64
7 changed files with 67 additions and 53 deletions

View File

@ -5,7 +5,7 @@
<div [formGroupName]="i">
<div fxLayout="row wrap" fxLayout.xs="column" fxLayoutGap="2%" fxLayoutAlign="center center">
<div fxFlex="30%">
<mat-form-field>
<mat-form-field style="width:275px">
<mat-select placeholder="Category *" formControlName="fk_question_category_id">
<mat-option *ngFor="let category of m_category" [value]="category.question_category_id">{{ category.category_name }}</mat-option>
</mat-select>
@ -27,10 +27,10 @@
<mat-error *ngIf="submitted && i == dublicateRerdIndex "> This Category Already Exist.!</mat-error>
</mat-card>
</div>
<div>
<button mat-fab class="mr-1 mb-1" color="primary" matTooltip="Add More Contact Person" matTooltipPosition="above" (click)="addLanguage(null, $event); false"><mat-icon>add</mat-icon></button>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Add More Contact Person" matTooltipPosition="above" (click)="addLanguage(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="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>

View File

@ -1,30 +1,38 @@
<form [formGroup]="_editTempLenderFrom" (submit)="onSubmit()">
<div formArrayName="temp_lender" class="example-full-width">
<mat-card *ngFor="let answ of _editTempLenderFrom.controls.temp_lender['controls']; let i=index">
<div [formGroupName]="i">
<div fxLayout="row wrap" fxLayout.xs="column" fxLayoutGap="2%" fxLayoutAlign="center center">
<mat-form-field fxFlex="20%">
<mat-select placeholder="Lender *" formControlName="fk_lender_id">
<mat-option *ngFor="let lend of m_lender" [value]="lend.entity_id">{{ lend.full_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && answ['controls'].fk_lender_id.hasError('required')" class="mat-text-warn">Lender Type Required.!</mat-error>
</mat-form-field>
<div class="p-1" fxLayout="row wrap" fxLayout.xs="column" fxLayoutGap="2%" fxLayoutAlign="center center">
<div fxFlex="22%">
<mat-form-field >
<mat-select placeholder="Lender *" formControlName="fk_lender_id">
<mat-option *ngFor="let lend of m_lender" [value]="lend.entity_id">{{ lend.full_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && answ['controls'].fk_lender_id.hasError('required')" class="mat-text-warn">Lender Type Required.!</mat-error>
</mat-form-field>
</div>
<div fxFlex="22%">
<mat-form-field >
<mat-select placeholder="Product *" formControlName="fk_product_id">
<mat-option *ngFor="let prcd of m_product" [value]="prcd.product_id">{{ prcd.product_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && answ['controls'].fk_product_id.hasError('required')" class="mat-text-warn">Product Required.!</mat-error>
</mat-form-field>
</div>
<mat-form-field fxFlex="20%">
<mat-select placeholder="Product *" formControlName="fk_product_id">
<mat-option *ngFor="let prcd of m_product" [value]="prcd.product_id">{{ prcd.product_name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && answ['controls'].fk_product_id.hasError('required')" class="mat-text-warn">Product Required.!</mat-error>
</mat-form-field>
<mat-form-field fxFlex="20%">
<mat-select placeholder="Customer Segment *" formControlName="fk_customer_segment">
<mat-option *ngFor="let cusSeg of m_customerSegment" [value]="cusSeg.customer_segment_id">{{ cusSeg.customer_segment }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && answ['controls'].fk_customer_segment.hasError('required')" class="mat-text-warn">Customer Segment Required.!</mat-error>
</mat-form-field>
<div fxFlex="22%">
<mat-form-field >
<mat-select placeholder="Customer Segment *" formControlName="fk_customer_segment">
<mat-option *ngFor="let cusSeg of m_customerSegment" [value]="cusSeg.customer_segment_id">{{ cusSeg.customer_segment }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && answ['controls'].fk_customer_segment.hasError('required')" class="mat-text-warn">Customer Segment Required.!</mat-error>
</mat-form-field>
</div>
<div fxFlex="20%">
<div fxFlex="22%">
<mat-checkbox *ngIf="answ.get('template_lender_map_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>
@ -36,9 +44,10 @@
</div>
</div>
</mat-card>
<button mat-fab class="mr-1 mb-1" color="primary" matTooltip="Add More Contact Person" matTooltipPosition="above" (click)="addLanguage(null, $event); false"><mat-icon>add</mat-icon></button>
</div>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Add More Contact Person" matTooltipPosition="above" (click)="addLanguage(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="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>

View File

@ -6,22 +6,22 @@
<mat-card>
<div [formGroupName]="i">
<div fxLayout="row" fxLayout.xs="column" fxLayoutWrap fxLayoutGap="5%" fxLayoutAlign="start center">
<div fxFlex="1 1 auto" class="ml-xs" fxFlex="60%">
<div fxFlex="1 1 auto" class="ml-xs" fxFlex="70%">
<span>{{i+1}}</span> ) <label>{{ques.get('question').value}}</label>
</div>
<div fxFlex="1 1 auto" class="ml-xs" fxFlex="20%">
<mat-form-field style="width: 45px; text-align: center" appearance="outline">
<mat-form-field style="width: 35%; text-align: center" appearance="outline">
<input matInput formControlName="question_weightage">
</mat-form-field> <span> % </span>
<mat-error *ngIf="submitted && ques['controls'].question_weightage.hasError('required')" class="mat-text-warn">Ques. WT is Required.!</mat-error>
</div>
<div fxFlex="0 1 auto" class="ml-xs" fxFlex="20%">
<div fxFlex="0 1 auto" class="ml-xs" fxFlex="10%">
<button (click)="removeLanguage(i)" mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"
type="button"><mat-icon>delete</mat-icon></button>
</div>
</div>
<div formArrayName="answers" class="example-full-width">
<div fxLayout="row wrap" fxLayout.xs="column" fxLayoutWrap fxLayoutGap="0.5%" fxLayoutAlign="center">
<div fxLayout.xs="column" fxLayoutWrap fxLayoutGap="0.5%" fxLayoutAlign="center">
<div fxFlex.gt-xs="50%" [fxFlex.gt-md]="regularDistribution" *ngFor="let answ of ques['controls'].answers['controls']; let i_ans = index ; let Ans_last = last;">
<div [formGroupName]="i_ans">
<div fxLayout="row" fxLayout.xs="column" fxLayoutGap="0.5%" fxLayoutAlign="start center">
@ -55,10 +55,10 @@
</tr>
</table>
</div>
<div fxLayout="row" fxLayoutAlign="start">
<button mat-fab class="mr-1 mb-1" color="primary" matTooltip="Add More Contact Person" matTooltipPosition="above" (click)="openDialog(); false"><mat-icon>add</mat-icon></button>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Add More Contact Person" matTooltipPosition="above" (click)="openDialog(); false"><mat-icon>add</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>

View File

@ -5,9 +5,9 @@
(click)="backToList()"><mat-icon>close</mat-icon></button>
</div>
<mat-card style="padding: 6px;">
<h6>Template Name</h6>
<!--<h6>Template Name</h6>
<hr>
<!---->
-->
<div *ngIf="templateNameRecord">
<form [formGroup]="_editTempNameFrom" (submit)="onSubmit()">
<div fxLayout="row" fxLayoutWrap fxLayoutGap="0.5%" fxLayoutAlign="start center">

View File

@ -1,13 +1,16 @@
<div style="width: 320px;">
<div fxLayout="row" fxLayoutAlign="end start">
<button mat-raised-button mat-icon-button color="primary" class="mr-1 mb-1 hover-icon" matTooltip="Close" matTooltipPosition="above"
(click)="onClose()"><mat-icon>close</mat-icon></button>
<div fxLayout="row">
<div style="width:100%"> <h5>Add New Template</h5>
</div>
<div > <button mat-raised-button mat-icon-button color="primary" class="mr-1 mb-1 hover-icon" matTooltip="Close" matTooltipPosition="above"
(click)="onClose()"><mat-icon>close</mat-icon></button>
</div>
</div>
<mat-card style="padding: 4px;">
<h5>Add New Template</h5>
<hr>
<form [formGroup]="_addTemplateFrom" (submit)="onSubmit()">
<div fxLayout="row" fxLayoutAlign="center">
<form [formGroup]="_addTemplateFrom" (submit)="onSubmit()">
<div fxLayout="row" >
<mat-form-field class="ml-xs example-full-width">
<textarea matInput placeholder="Template Name" formControlName="template_name"></textarea>
<mat-error *ngIf="submitted && f.template_name.hasError('required')" class="mat-text-warn">You must Include Template Name.</mat-error>
@ -18,5 +21,6 @@
<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>
</div>

View File

@ -3,13 +3,13 @@
<div>
<mat-card>
<mat-card class="mat-elevation-z1">
<div style="margin: 6px; padding: 4px;">
<div class="p_title" style="font-size: 16px; font-style: bold;">Template Master</div>
<div class="sub_title" style="font-size: 11px;">List of Templates</div>
</div>
<div fxLayout="row" fxLayout.xs="column" fxLayoutWrap fxLayoutAlign="center none">
<mat-card>
<div class="p-1" fxLayout="row" fxLayout.xs="column" fxLayoutWrap fxLayoutAlign="center none">
<div fxFlex="80%">
<mat-card-title><span style="font-size:1.2rem"> Template Master</span></mat-card-title>
<!--<form [formGroup]="filterFormGroupCtrl">
<div fxLayout="row" fxLayout.xs="column" fxLayoutWrap fxLayoutGap="0.5px" fxLayoutAlign="start none" style="padding: 6px;">
<mat-select placeholder="Category" formControlName="category">
@ -20,8 +20,8 @@
</div>
</form>-->
</div>
<div fxFlex="20%">
<button mat-stroked-button color="primary" (click)="addNewTemplate()">Add New Template</button>
<div fxFlex="20%" style="text-align:right;">
<button mat-fab color="primary" (click)="addNewTemplate()" matTooltip="Add New Template" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
<!--<button mat-stroked-button color="primary" (click)="addNewQuestion()">Add Questions</button>-->
</div>
</div>