PD- Startpd UI

This commit is contained in:
saravanakumarkandasami 2018-10-31 13:59:36 +05:30
parent b1e47083ea
commit 7ecaacaf40
2 changed files with 31 additions and 28 deletions

View File

@ -1,4 +1,4 @@
<mat-card>
<mat-card style="min-height:540px;">
<mat-card-content>
<mat-sidenav-container class="app-inner background-none shadow-none mail-db">
<mat-sidenav #mailnav [mode]="isOver() ? 'over' : 'side'" [opened]="!isOver()" class="mail-sidebar pl-xs pr-xs">
@ -8,7 +8,7 @@
<mat-expansion-panel *ngFor="let category of categoryList;let catIndex = index; ">
<mat-expansion-panel-header>
<mat-panel-title class="text-xs-left">
<h6 class="mt-0"> {{category.category_name}}</h6>
<span class="mt-0"> {{category.category_name}}</span>
</mat-panel-title>
</mat-expansion-panel-header>
@ -62,7 +62,8 @@
<form [formGroup]="optionsForm" *ngIf="answerList.length>0 ; else noanswers;">
<mat-card-content>
<h6 class="mt-0">{{optionsForm.controls.pd_question.value}}</h6>
<span class="mt-0">{{optionsForm.controls.pd_question.value}}</span>
<div fxLayout="row" >
<div fxFlex="60" class="text-xs-left">
@ -125,10 +126,10 @@
<!-- this section for questions type options button actions -->
<div fxFlex="40" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Save&Previous" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" (click)="saveNextPrevious(optionsForm.controls,previous)" matTooltipPosition="below"><mat-icon>arrow_backward</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Save&Next" (click)="saveNextPrevious(optionsForm.controls,next)" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltipPosition="below"><mat-icon>arrow_forward</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Save&Previous" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" (click)="saveNextPrevious(optionsForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Save&Next" (click)="saveNextPrevious(optionsForm.controls,next)" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
@ -140,7 +141,7 @@
<ng-template #noanswers>
<mat-card-content>
<h6 class="mt-0">{{selectedCategory.question}}</h6>
<span class="mt-0">{{selectedCategory.question}}</span>
</mat-card-content>
<mat-card-actions>
@ -148,8 +149,8 @@
<div fxFlex="100" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
@ -166,7 +167,7 @@
<form [formGroup]="textBoxForm" *ngIf="answerList.length>0 ; else noanswers;">
<mat-card-content>
<h6 class="mt-0">{{textBoxForm.controls.pd_question.value}}</h6>
<span class="mt-0">{{textBoxForm.controls.pd_question.value}}</span>
<div fxLayout="row" >
<div fxFlex="60" class="text-xs-left">
@ -228,10 +229,10 @@
<!-- this section for questions type options button actions -->
<div fxFlex="40" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Save&Previous" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" (click)="saveNextPreviousText(textBoxForm.controls,previous)" matTooltipPosition="below"><mat-icon>arrow_backward</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Next" (click)="saveNextPreviousText(textBoxForm.controls,next)" matTooltipPosition="below"><mat-icon>arrow_forward</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Save&Previous" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" (click)="saveNextPreviousText(textBoxForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Next" (click)="saveNextPreviousText(textBoxForm.controls,next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
@ -242,7 +243,7 @@
</form>
<ng-template #noanswers>
<mat-card-content>
<h6 class="mt-0">{{selectedCategory.question}}</h6>
<span class="mt-0">{{selectedCategory.question}}</span>
</mat-card-content>
<mat-card-actions>
@ -250,8 +251,8 @@
<div fxFlex="100" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
@ -266,7 +267,7 @@
<form [formGroup]="checkBoxForm" *ngIf="answerList.length>0 ; else noanswers;">
<mat-card-content>
<h6 class="mt-0">{{checkBoxForm.controls.pd_question.value}}</h6>
<span class="mt-0">{{checkBoxForm.controls.pd_question.value}}</span>
<div fxLayout="row" >
<div fxFlex="60" class="text-xs-left">
@ -324,10 +325,10 @@
<!-- this section for questions type options button actions -->
<div fxFlex="40" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltip="Save&Previous" (click)="saveNextPrevious(checkBoxForm.controls,previous)" matTooltipPosition="below"><mat-icon>arrow_backward</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Next" (click)="saveNextPrevious(checkBoxForm.controls,next)" matTooltipPosition="below"><mat-icon>arrow_forward</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltip="Save&Previous" (click)="saveNextPrevious(checkBoxForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Next" (click)="saveNextPrevious(checkBoxForm.controls,next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
@ -337,8 +338,8 @@
</mat-card-actions>
</form>
<ng-template #noanswers>
<mat-card-content>
<h6 class="mt-0">{{selectedCategory.question}}</h6>
<mat-card-content>
<span class="mt-0">{{selectedCategory.question}}</span>
</mat-card-content>
<mat-card-actions>
@ -346,8 +347,8 @@
<div fxFlex="100" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>

View File

@ -113,7 +113,9 @@ $product-bg-color-hover: rgba(103, 58, 183, 0.7);
}
}
mat-icon{
color: #ff3636;
}
.start_close_btn {
position: fixed;
right: 69px;