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

select dropdown changes : ps

Browse Source
This commit is contained in:
venbatechnologies@gmail.com 2018-10-15 09:35:47 +05:30
parent cb24654ccb
commit 98b689c3af
8 changed files with 199 additions and 136 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
ng6-seed/package-lock.json generated
View File

@ -4294,12 +4294,14 @@
"balanced-match": { "balanced-match": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^1.0.0", "balanced-match": "^1.0.0",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@ -4314,17 +4316,20 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
@ -4441,7 +4446,8 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
@ -4453,6 +4459,7 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@ -4467,6 +4474,7 @@
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
@ -4474,12 +4482,14 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.2.4", "version": "2.2.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.1.1", "safe-buffer": "^5.1.1",
"yallist": "^3.0.0" "yallist": "^3.0.0"
@ -4498,6 +4508,7 @@
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@ -4578,7 +4589,8 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
@ -4590,6 +4602,7 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@ -4711,6 +4724,7 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",

1
ng6-seed/package.json
View File

@ -88,4 +88,3 @@
"typescript": "^2.7.2" "typescript": "^2.7.2"
} }
} }

2
ng6-seed/src/app/settings/masters/component/branch/branch-dialog/branch-dialog.component.ts
View File

@ -58,7 +58,7 @@ export class BranchDialogComponent implements OnInit {
} }
}, error => this.errorMessage = <any> error); }, error => this.errorMessage = <any> error);
} }
/** Branch Form Datas*/ /** Branch Form Datas*/

8
ng6-seed/src/app/settings/masters/component/industry_classification/industry_classification-list/industry_classification-list.component.html
View File

@ -43,7 +43,7 @@
<mat-cell *matCellDef="let row"><!--{{row.isactive}}--> <mat-cell *matCellDef="let row"><!--{{row.isactive}}-->
<!-- <mat-icon *ngIf="row.isactive == 1;else notactive;" class="hover-icon" matTooltip="Active" matTooltipPosition="above">done</mat-icon> <!-- <mat-icon *ngIf="row.isactive == 1;else notactive;" class="hover-icon" matTooltip="Active" matTooltipPosition="above">done</mat-icon>
<ng-template #notactive ><mat-icon class="hover-icon" matTooltip="Inactive" matTooltipPosition="above">clear</mat-icon></ng-template> --> <ng-template #notactive ><mat-icon class="hover-icon" matTooltip="Inactive" matTooltipPosition="above">clear</mat-icon></ng-template> -->
<mat-slide-toggle *ngIf="row.isactive == 1;else notactive;" <mat-slide-toggle *ngIf="row.isactive == 1;else notactive;"
class="example-margin" class="example-margin"
matTooltip="Active" matTooltipPosition="above" matTooltip="Active" matTooltipPosition="above"
checked="true" [color]="color" checked="true" [color]="color"
@ -57,6 +57,12 @@
(change)="isactiveIndustryClassification(row.industry_classification_id,row.isactive)" (change)="isactiveIndustryClassification(row.industry_classification_id,row.isactive)"
(click)="active()"> (click)="active()">
</mat-slide-toggle></ng-template> </mat-slide-toggle></ng-template>
<!-- <mat-slide-toggle
class="example-margin"
[matTooltip] = "row.isactive == 1 ? Inactive : Active"
matTooltipPosition="above"
(change)="isactiveIndustryClassification(row.industry_classification_id,row.isactive)"
(click)="active()"></mat-slide-toggle> -->
</mat-cell> </mat-cell>
</ng-container> </ng-container>

120
ng6-seed/src/app/settings/masters/masters.component.html
View File

@ -11,87 +11,91 @@
[placeholderLabel]="'Find Masters...'" [placeholderLabel]="'Find Masters...'"
[noEntriesFoundLabel]="'no matching found'"> [noEntriesFoundLabel]="'no matching found'">
</ngx-mat-select-search> </ngx-mat-select-search>
<mat-option *ngFor="let master of filteredMasters | async" [value]="master.id"> <!-- <mat-option *ngFor="let master of filteredMasters | async" [value]="master.id">
{{master.name}} {{master.name}}
</mat-option> -->
<mat-option *ngFor="let master of filteredMasters | async" [value]="master.master_id">
{{master.master_name}}
</mat-option> </mat-option>
<mat-error *ngIf="masterCtrl.value ==''" class="mat-text-warn">You must Pickup Master Name.</mat-error> <!-- <mat-error *ngIf="masterCtrl.value ==''" class="mat-text-warn">You must Pickup Master Name.</mat-error> -->
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
<div *ngIf="masterCtrl.value =='master-1'" > <div *ngIf="masterCtrl.value =='1'">
<app-industry_classification-list></app-industry_classification-list> <app-industry_classification-list></app-industry_classification-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-2'"> <div *ngIf="masterCtrl.value =='2'">
<app-branch-list></app-branch-list> <app-product-list></app-product-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-3'"> <div *ngIf="masterCtrl.value =='3'">
<app-title-list></app-title-list> <app-sub-product-list></app-sub-product-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-4'"> <div *ngIf="masterCtrl.value =='4'">
<app-city-list></app-city-list> <app-branch-list></app-branch-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-5'"> <div *ngIf="masterCtrl.value =='5'">
<app-states-list></app-states-list> <app-city-list></app-city-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-6'"> <div *ngIf="masterCtrl.value =='6'">
<app-regions-list></app-regions-list> <app-states-list></app-states-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-7'"> <div *ngIf="masterCtrl.value =='7'">
<app-relation-ship-list></app-relation-ship-list> <app-regions-list></app-regions-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-8'"> <div *ngIf="masterCtrl.value =='8'">
<app-product-list></app-product-list> <app-title-list></app-title-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-9'"> <div *ngIf="masterCtrl.value =='9'">
<app-sub-product-list></app-sub-product-list> <app-relation-ship-list></app-relation-ship-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-10'" > <div *ngIf="masterCtrl.value =='10'" >
<app-members-occupation-list></app-members-occupation-list> <app-members-occupation-list></app-members-occupation-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-11'"> <div *ngIf="masterCtrl.value =='11'">
<app-activity-list></app-activity-list> <app-activity-list></app-activity-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-12'"> <div *ngIf="masterCtrl.value =='12'">
<app-uom-list></app-uom-list> <app-uom-list></app-uom-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-13'"> <div *ngIf="masterCtrl.value =='13'">
<app-frequency-list></app-frequency-list> <app-pd-type-list></app-pd-type-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-14'"> <div *ngIf="masterCtrl.value =='14'">
<app-comments-on-locality-list></app-comments-on-locality-list> <app-pd-allocation-type-list>
</app-pd-allocation-type-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-15'"> <div *ngIf="masterCtrl.value =='15'">
<app-customer-behaviour-list></app-customer-behaviour-list>
</div>
<div *ngIf="masterCtrl.value =='master-16'">
<app-customer-segment-list></app-customer-segment-list>
</div>
<div *ngIf="masterCtrl.value =='master-17'">
<app-designation-list></app-designation-list>
</div>
<div *ngIf="masterCtrl.value =='master-18'">
<app-lender-hierarchy-list></app-lender-hierarchy-list>
</div>
<div *ngIf="masterCtrl.value =='master-19'">
<!-- <app-company-list></app-company-list> -->
<app-company></app-company>
</div>
<div *ngIf="masterCtrl.value =='master-20'">
<app-question-category-list></app-question-category-list>
</div>
<div *ngIf="masterCtrl.value =='master-21'">
<app-pd-type-list></app-pd-type-list>
</div>
<div *ngIf="masterCtrl.value =='master-22'">
<app-pd-location-approach-list></app-pd-location-approach-list> <app-pd-location-approach-list></app-pd-location-approach-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-23'"> <div *ngIf="masterCtrl.value =='17'">
<app-pd-allocation-type-list> <app-comments-on-locality-list></app-comments-on-locality-list>
</app-pd-allocation-type-list>
</div> </div>
<div *ngIf="masterCtrl.value =='master-24'"> <div *ngIf="masterCtrl.value =='18'">
<app-pd-notification-list></app-pd-notification-list> <app-customer-behaviour-list></app-customer-behaviour-list>
</div>
<div *ngIf="masterCtrl.value =='19'">
<app-customer-segment-list></app-customer-segment-list>
</div>
<div *ngIf="masterCtrl.value =='20'">
<app-frequency-list></app-frequency-list>
</div>
<div *ngIf="masterCtrl.value =='21'">
<app-designation-list></app-designation-list>
</div>
<div *ngIf="masterCtrl.value =='22'">
<!-- <app-company-list></app-company-list> -->
<app-company></app-company>
</div>
<div *ngIf="masterCtrl.value =='23'">
<app-lender-hierarchy-list></app-lender-hierarchy-list>
</div>
<div *ngIf="masterCtrl.value =='26'">
<app-pd-notification-list></app-pd-notification-list>
</div>
<div *ngIf="masterCtrl.value =='27'">
<app-question-category-list></app-question-category-list>
</div> </div>
<!--<div *ngIf="masterCtrl.value =='master-25'"> <!--<div *ngIf="masterCtrl.value =='master-25'">
<app-pd-office-lender-list></app-pd-office-lender-list> <app-pd-office-lender-list></app-pd-office-lender-list>
@ -99,6 +103,4 @@
<div *ngIf="masterCtrl.value =='master-26'"> <div *ngIf="masterCtrl.value =='master-26'">
<app-pd-team-list></app-pd-team-list> <app-pd-team-list></app-pd-team-list>
</div>--> </div>-->
</mat-card> </mat-card>

155
ng6-seed/src/app/settings/masters/masters.component.ts
View File

@ -11,33 +11,26 @@
import { take, takeUntil } from 'rxjs/operators'; import { take, takeUntil } from 'rxjs/operators';
import { MastersService } from './../service/masters/masters.service' import { MastersService } from './../service/masters/masters.service'
import {Dbmaster } from './model/Dbmaster';
export interface Master { export interface Master {
id: string; id: string;
name: string; name: string;
} }
// export interface Master {
// master_id: string;
// master_name: string;
// }
// export interface masterArray {
// value: string;
// viewValue: string;
// }
@Component({ @Component({
selector: 'app-masters', selector: 'app-masters',
templateUrl: './masters.component.html', templateUrl: './masters.component.html',
styleUrls: ['./masters.component.scss'] styleUrls: ['./masters.component.scss']
}) })
export class MastersComponent implements OnInit { export class MastersComponent implements OnInit {
//public dbmasters: Dbmaster = new Dbmaster();
private dbmasters: Dbmaster[];
//public arr: Array<{master_id: number, master_name: string}>;
/* Normal Search Code /* Normal Search Code
pickUpMasterData : string; pickUpMasterData : string
constructor() {} constructor() {}
@ -86,7 +79,7 @@ export class MastersComponent implements OnInit {
/** control for the MatSelect filter keyword */ /** control for the MatSelect filter keyword */
public masterFilterCtrl: FormControl = new FormControl(); public masterFilterCtrl: FormControl = new FormControl();
//masters: Master[]; //masters: Master[];
constructor(private _MastersService: MastersService) constructor(private _MastersService: MastersService)
@ -98,38 +91,38 @@ export class MastersComponent implements OnInit {
} }
/** list of masters */ /** list of masters */
private masters: Master[] = [ // private masters: Master[] = [
{id: 'master-1',name: 'Industry Classfication'}, // {id: 'master-1',name: 'Industry Classfication'},
{id: 'master-2',name: 'Branch'}, // {id: 'master-2',name: 'Branch'},
{id: 'master-3',name: 'Title'}, // {id: 'master-3',name: 'Title'},
{id: 'master-4',name: 'City'}, // {id: 'master-4',name: 'City'},
{id: 'master-5',name: 'States'}, // {id: 'master-5',name: 'States'},
{id: 'master-6',name: 'Regions'}, // {id: 'master-6',name: 'Regions'},
{id: 'master-7',name: 'Relation Ship'}, // {id: 'master-7',name: 'Relation Ship'},
{id: 'master-8',name: 'Product'}, // {id: 'master-8',name: 'Product'},
{id: 'master-9',name: 'Sub Product'}, // {id: 'master-9',name: 'Sub Product'},
{id: 'master-10',name: 'Occupation of Non earning members'}, // {id: 'master-10',name: 'Occupation of Non earning members'},
{id: 'master-11',name: 'Type of activity'}, // {id: 'master-11',name: 'Type of activity'},
{id: 'master-12',name: 'Unit of Measurement'}, // {id: 'master-12',name: 'Unit of Measurement'},
{id: 'master-13',name: 'Frequency'}, // {id: 'master-13',name: 'Frequency'},
{id: 'master-14',name: 'Comments on locality'}, // {id: 'master-14',name: 'Comments on locality'},
{id: 'master-15',name: 'Customer Behaviour'}, // {id: 'master-15',name: 'Customer Behaviour'},
{id: 'master-16',name: 'Customer Segment'}, // {id: 'master-16',name: 'Customer Segment'},
{id: 'master-17',name: 'Designation'}, // {id: 'master-17',name: 'Designation'},
{id: 'master-18',name: 'Lender Hierarchy'}, // {id: 'master-18',name: 'Lender Hierarchy'},
{id: 'master-19',name: 'Company Details'}, // {id: 'master-19',name: 'Company Details'},
{id: 'master-20',name: 'Question Category'}, // {id: 'master-20',name: 'Question Category'},
{id: 'master-21',name: 'PD Type'}, // {id: 'master-21',name: 'PD Type'},
{id: 'master-22',name: 'Approach to PD location'}, // {id: 'master-22',name: 'Approach to PD location'},
{id: 'master-23',name: 'PD Allocation Type'}, // {id: 'master-23',name: 'PD Allocation Type'},
{id: 'master-24',name: 'PD Notification'}, // {id: 'master-24',name: 'PD Notification'},
// {id: 'master-25',name: 'PD Office Lender'}, // // {id: 'master-25',name: 'PD Office Lender'},
// {id: 'master-25',name: 'PD Team'}, // // {id: 'master-25',name: 'PD Team'},
]; // ];
/** list of masters filtered by search keyword */ /** list of masters filtered by search keyword */
public filteredMasters: ReplaySubject<Master[]> = new ReplaySubject<Master[]>(1); public filteredMasters: ReplaySubject<Dbmaster[]> = new ReplaySubject<Dbmaster[]>(1);
@ViewChild('singleSelect') singleSelect: MatSelect; @ViewChild('singleSelect') singleSelect: MatSelect;
@ -139,13 +132,24 @@ export class MastersComponent implements OnInit {
ngOnInit() { ngOnInit() {
// this._MastersService.getAllMasterData('LISTOFMASTERS').subscribe((data:Master[]) => { this._MastersService.getAllMasterData('LISTOFMASTERS').subscribe(data => {
// this.masters = data; this.dbmasters = data.records;
// console.log(this.masters); this.dbmasters = this.dbmasters.sort((a, b) => {
// }); if (a.master_name > b.master_name) {
console.log(this.masters); return 1;
}
if (a.master_name < b.master_name) {
return -1;
}
return 0;
});
this.filteredMasters.next(this.dbmasters.slice());
});
//console.log(this.dbmasters.master_id);
// load the initial master list // load the initial master list
this.filteredMasters.next(this.masters.slice());
// listen for search field value changes // listen for search field value changes
this.masterFilterCtrl.valueChanges this.masterFilterCtrl.valueChanges
@ -158,6 +162,7 @@ export class MastersComponent implements OnInit {
ngAfterViewInit() { ngAfterViewInit() {
//this.setInitialValue(); //this.setInitialValue();
//console.log('ngafterViewInit',this.dbmasters);
} }
ngOnDestroy() { ngOnDestroy() {
@ -182,21 +187,57 @@ export class MastersComponent implements OnInit {
// } // }
private filterMasters() { private filterMasters() {
if (!this.masters) { // this._MastersService.getAllMasterData('LISTOFMASTERS').subscribe(data => {
return; // this.dbmasters = data.records;
// if (!this.dbmasters) {
// return;
// }
//console.log(this.dbmasters);
if(!this.dbmasters){
return;
} }
// get the search keyword // get the search keyword
let search = this.masterFilterCtrl.value; let search = this.masterFilterCtrl.value;
if (!search) { if (!search) {
this.filteredMasters.next(this.masters.slice()); this._MastersService.getAllMasterData('LISTOFMASTERS').subscribe(data => {
this.dbmasters = data.records;
this.dbmasters = this.dbmasters.sort((a, b) => {
if (a.master_name > b.master_name) {
return 1;
}
if (a.master_name < b.master_name) {
return -1;
}
return 0;
});
this.filteredMasters.next(this.dbmasters.slice());
});
//this.filteredMasters.next(this.masters.slice());
return; return;
} else { } else {
search = search.toLowerCase(); search = search.toLowerCase();
} }
// filter the masters // filter the masters
this.filteredMasters.next( this._MastersService.getAllMasterData('LISTOFMASTERS').subscribe(data => {
this.masters.filter(master => master.name.toLowerCase().indexOf(search) > -1) this.dbmasters = data.records;
); this.dbmasters = this.dbmasters.sort((a, b) => {
if (a.master_name > b.master_name) {
return 1;
}
if (a.master_name < b.master_name) {
return -1;
}
return 0;
});
//this.filteredMasters.next(this.dbmasters.slice());
this.filteredMasters.next(
this.dbmasters.filter(master => master.master_name.toLowerCase().indexOf(search) > -1)
);
});
} }
} }

7
ng6-seed/src/app/settings/masters/model/Dbmaster.ts Normal file
View File

@ -0,0 +1,7 @@
export class Dbmaster {
master_id: any;
master_name: any;
constant_name: any;
}

14
ng6-seed/src/app/settings/pd-team/pd-team-list/pd-team-list.component.html
View File

@ -12,22 +12,16 @@
<div class="filter-container mat-elevation-z8"> <div class="filter-container mat-elevation-z8">
<div fxLayout="row" fxLayoutAlign="start center" class="filter-header"> <div fxLayout="row" fxLayoutAlign="start center" class="filter-header">
<div *ngIf="!noRecordFound" class="ml-xs mr-xs" style="width: 90%;"> <div *ngIf="!noRecordFound" class="ml-xs mr-xs" style="width: 80%;">
<mat-form-field dividerColor="primary" class="ml-xs mr-xs" style="width: 30%;"> <mat-form-field dividerColor="primary" class="ml-xs mr-xs" style="width: 30%;">
<input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter"> <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter">
</mat-form-field> </mat-form-field>
</div> </div>
<div *ngIf="noRecordFound" class="nocontent ml-xs mr-xs" style="width: 90%;">No records found</div> <div *ngIf="noRecordFound" class="nocontent ml-xs mr-xs" style="width: 80%;">No records found</div>
<div class="ml-xs mr-xs" style="width: 10%; text-align: right;"> <div class="ml-xs mr-xs" style="width: 20%; text-align: right;">
<<<<<<< HEAD
<button mat-fab class="mr-1 mb-1" style="margin-top: 7px;" [color]="color" matTooltip="Add PD Team" matTooltipPosition="above" [routerLink]="['/setting/pdteam/addpdteam']" ><mat-icon>add</mat-icon></button>
=======
<button mat-fab class="mr-1 mb-1" style="margin-top: 7px;" [color]="color" (click)="managepdteam()" matTooltip="Manage PD Team" matTooltipPosition="above"><mat-icon>people</mat-icon></button> <button mat-fab class="mr-1 mb-1" style="margin-top: 7px;" [color]="color" (click)="managepdteam()" matTooltip="Manage PD Team" matTooltipPosition="above"><mat-icon>people</mat-icon></button>
<button mat-fab class="mr-1 mb-1" style="margin-top: 7px;" [color]="color" (click)="addPdTeam()" matTooltip="Add PD Team" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
</div> </div>
<div class="ml-xs mr-xs" style="width: 10%; text-align: right;">
<button mat-fab class="mr-1 mb-1" style="margin-top: 7px;" [color]="color" (click)="addPdTeam()" matTooltip="Add PD Team" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
>>>>>>> 3ad6314e0e602cb2c232acb142715009dca646f9
</div>
</div> </div>
<mat-table *ngIf="!noRecordFound" [dataSource]="dataSource" matSort > <mat-table *ngIf="!noRecordFound" [dataSource]="dataSource" matSort >