Dashboard, PD UI

This commit is contained in:
saravanakumarkandasami 2018-10-29 13:38:58 +05:30
parent b91772291a
commit 408f09fb1b
10 changed files with 629 additions and 591 deletions

View File

@ -16,8 +16,8 @@
</mat-card>
</div>
</div> -->
<div fxLayout="row wrap">
<div fxFlex.gt-sm="60%" fxFlex="100" class="m-gap">
<div fxLayout="row">
<div fxFlex="77%">
<mat-card>
<mat-card-title>Today's Details</mat-card-title>
<mat-card-subtitle></mat-card-subtitle>
@ -43,9 +43,8 @@
</mat-card>
</div>
<div fxFlex.gt-sm="40%" fxFlex="100" class="m-gap">
<mat-card class="p-2">
<!---<h4>Profile Settings</h4>-->
<div fxFlex="23%" >
<mat-card>
<mat-tab-group >
<mat-tab>
<ng-template mat-tab-label>Lenderwise</ng-template>
@ -62,6 +61,7 @@
</mat-tab>
<mat-tab>
<ng-template mat-tab-label>CityWise</ng-template>
<mat-card-content>
<mat-list>
<ng-template let-item let-last="last" ngFor [ngForOf]="citywisepd">
<mat-list-item>
@ -70,8 +70,6 @@
</mat-list-item>
</ng-template>
</mat-list>
<mat-card-content>
</mat-card-content>
</mat-tab>
<mat-tab>

View File

@ -18,7 +18,7 @@ export class DashboardComponent {
public showYAxisLabel = true;
public yAxisLabel = 'PD';
view: any[];
width =600;
width =900;
height= 250;
public colorScheme = {
domain: ['#673ab7', '#f44336', '#009688 ', '#2196f3', '#234278 ', '#2a1653']

View File

@ -1,4 +1,5 @@
<mat-card>
<mat-card-content>
<form [formGroup]="_PDtriggerForm" (submit)="submitPdDetails(_PDtriggerForm.value,PDTriggerStatus)">
<mat-card-content>
@ -272,6 +273,9 @@
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="submit" matTooltip="PD Process" matTooltipPosition="above" [disabled]="!enablePDButton || !_PDtriggerForm.valid "><mat-icon>save</mat-icon></button>
</mat-card-actions>
</form>
</mat-card-content>
</mat-card>

View File

@ -1,3 +1,5 @@
<mat-card>
<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">
<button _ngcontent-c21="" class="compose-btn mat-warn mat-raised-button mb-1" (click)="changePDStatus(PDStatus);"> <span>Complete</span></button>
@ -360,6 +362,9 @@
</div>
</mat-sidenav-container>
</mat-card-content>
</mat-card>
<notifier-container></notifier-container>

View File

@ -1,3 +1,5 @@
<mat-card>
<mat-card-content>
<div class="mb-2" >
<div fxLayout="row" fxLayoutAlign="start center" class="filter-header">
<div *ngFor="let master of pdMasterData" class="ml-xs mr-xs" fxFlex="75">
@ -136,5 +138,8 @@
</div>
</mat-card-content>
</div>
</mat-card-content>
</mat-card>
<!-- <notifier-container></notifier-container> -->

View File

@ -1,15 +1,15 @@
<div>
<mat-card>
<div fxLayout="row" fxLayoutAlign="start center" class="mb-1">
<div class="ml-xs mr-xs" style="width: 30%;">
<mat-card-title><span> Questions Master</span></mat-card-title>
</div>
</div>
<div fxLayout="row" fxLayout.xs="column" fxLayoutWrap fxLayoutAlign="center none">
<div fxLayout="row" fxLayout.xs="column">
<div fxflexoffset="30%" fxFlex="40%">
<div fxFlexOffset="2%" fxFlex="40%">
<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">
<!--<ngx-mat-select-search [formControl]="masterFilterCtrl" ></ngx-mat-select-search>-->
@ -17,25 +17,47 @@
{{cat.category_name}}
</mat-option>
</mat-select>
</div>
</form>
</div>
<div fxFlex="30%" style="text-align:right">
<button mat-fab class="mr-1 mb-1" color="primary" (click)="addNewQuestion()" matTooltip="Add Questions" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
<div fxFlexOffset="24%" fxFlex="30%" style="text-align:right">
<button mat-fab class="mr-1" color="primary" (click)="addNewQuestion()" matTooltip="Add Questions" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
</div>
</div>
<!--</mat-card-content>-->
<mat-card-content>
<mat-table [dataSource]="dataSource" matSort *ngIf="productList.length > 0" >
<ng-container matColumnDef="category_name">
<mat-cell fxFlex="25%" class="cell" *matCellDef="let product;" style="width:20% !important;">
<span *ngIf="product.category_name" mat-line>{{ product.category_name }}</span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="question">
<mat-cell fxFlex="65%" class="cell" *matCellDef="let product;" style="width:70% !important;">
<span *ngIf="product.question" mat-line>{{ product.question }}</span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="actions">
<mat-cell fxFlex="10%" class="cell" *matCellDef="let product;" style="width:10% !important;">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Edit" matTooltipPosition="above" (click)="editQuestion(product)"><mat-icon>edit</mat-icon></button>
</mat-cell>
</ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</mat-table>
<div *ngIf="productList.length > 0">
<mat-paginator #paginator class="mat-elevation-z1" [length]="productList.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25, 50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
</mat-paginator>
</div>
<ng-container *ngIf="productList.length > 0">
<!---- <ng-container *ngIf="productList.length > 0">
<div style="padding: 0 12px;">
<mat-card class="product-card" *ngFor="let product of dataSource.connect() | async">
<div fxLayout="row" fxLayoutAlign="start start" style="padding: 6px 2px;">
<div fxFlex="90%" style="padding: 12px 8px;">
<!--<div fxLayout="row" fxLayout.xs="column" fxLayoutWrap fxLayoutAlign="start none">
<div class="category-label"> {{ product.category_name }}</div>
</div>-->
<div fxLayout="row" fxLayoutWrap fxLayoutAlign="none none">
<div class="ml-xs" fxFlex="20%">
{{ product.category_name }}
@ -48,39 +70,18 @@
</div>
<div fxFlex="10%">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Edit" matTooltipPosition="above" (click)="editQuestion(product)"><mat-icon>edit</mat-icon></button>
<!--<button mat-icon-button [matMenuTriggerFor]="menu">
<mat-icon>more_vert</mat-icon>
</button>
<mat-menu #menu="matMenu">
<button mat-menu-item (click)="editQuestion(product)">
<mat-icon>create</mat-icon>
<span>Edit</span>
</button>
</mat-menu>-->
</div>
</div>
<!--<mat-card-header>
<mat-card-title>
<h4>{{ product.question }}</h4>
</mat-card-title>
</mat-card-header>
<img mat-card-image [src]="product.img_url" [alt]="product.title" [title]="product.title">
<mat-card-content>
<p>{{ product.description }}</p>
</mat-card-content>
<mat-card-actions>
<button mat-raised-button color="accent" (click)="addItemToCard(product)">Add to card</button>
</mat-card-actions>-->
</mat-card>
</div>
</ng-container>
</ng-container>-->
<mat-card *ngIf="noQuesMasterRecrdFound">
<div class="no-record-found">No Record Found ... </div>
</mat-card>
<mat-paginator #paginator class="mat-elevation-z1" [length]="productList.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25, 50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
</mat-paginator>
<!--<mat-card>
<div class="example-container mat-elevation-z8">
<mat-table [dataSource]="dataSource" matSort>
@ -110,8 +111,10 @@
<mat-paginator [pageSizeOptions]="[5, 10, 25, 100]"></mat-paginator>
</div>
</mat-card>-->
</mat-card-content>
</mat-card>
</div>
<!--<div *ngIf="addView">
<app-add></app-add>
</div>-->

View File

@ -18,9 +18,9 @@
.mat-card-title{
font-size:24px !important;
}
.mat-table {
overflow: auto;
max-height: 500px;
.cell{
display:inline !important;
}
.text-line-limit {

View File

@ -16,14 +16,37 @@
</div>
</form>-->
</div>
<div fxFlex="20%" style="text-align:right;">
<button mat-fab color="primary" (click)="addNewTemplate()" matTooltip="Add Template" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
<div fxFlex="14%" style="text-align:right;">
<button mat-fab class="mr-1" color="primary" (click)="addNewTemplate()" matTooltip="Add Template" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
<!--<button mat-stroked-button color="primary" (click)="addNewQuestion()">Add Questions</button>-->
</div>
</div>
<ng-container *ngIf="templateList.length > 0">
<div style="padding: 0 12px;">
<mat-card class="product-card" *ngFor="let template of dataSource.connect() | async">
<mat-table [dataSource]="dataSource" >
<ng-container matColumnDef="template_name">
<mat-cell fxFlex="25%" *matCellDef="let template;">
<span *ngIf="template.template_name" mat-line>{{ template.template_name }}</span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="lender_details">
<mat-cell fxFlex="65%" *matCellDef="let template;">
<div *ngIf="template.lender_details.length > 0">
<span *ngFor="let lender of template.lender_details ; let last = last"> {{lender.full_name}} - {{lender.product_name}} - {{lender.customer_segment_name}} <i *ngIf="!last">,<br></i></span>
</div>
</mat-cell>
</ng-container>
<ng-container matColumnDef="actions">
<mat-cell fxFlex="10%" *matCellDef="let template;">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Edit" matTooltipPosition="above" (click)="goToEdit(template.template_id)"><mat-icon>edit</mat-icon></button>
</mat-cell>
</ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</mat-table>
<!----<mat-card class="product-card" *ngFor="let template of dataSource.connect() | async">
<div fxLayout="row" fxLayoutAlign="start start" style="padding: 6px 2px;">
<div fxFlex="90%" style="padding: 12px 8px;">
@ -43,16 +66,17 @@
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Edit" matTooltipPosition="above" (click)="goToEdit(template.template_id)"><mat-icon>edit</mat-icon></button>
</div>
</div>
</mat-card>
</mat-card>-->
</div>
</ng-container>
<mat-card *ngIf="noQuesMasterRecrdFound">
<div class="no-record-found">No Record Found ... </div>
</mat-card>
<div *ngIf="templateList.length > 0">
<mat-paginator #paginator class="mat-elevation-z1" [length]="templateList.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25, 50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
</mat-paginator>
</div>
</mat-card>
</div>

View File

@ -16,9 +16,8 @@
// width: 100%;
}
.mat-table {
overflow: auto;
max-height: 500px;
.cell{
display:inline !important;
}
.text-line-limit {

View File

@ -36,7 +36,7 @@ export class TemplateListComponent implements OnInit, OnDestroy {
templateListData = null;
public dataLength: number;
public dataSource = new MatTableDataSource();
displayedColumns = ['categroy_name', 'question', 'actions'];
displayedColumns = ['template_name', 'lender_details', 'actions'];
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;