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

Dashboard changes and length issues fixes : ps

Browse Source
This commit is contained in:
venbatechnologies@gmail.com 2018-11-14 13:35:50 +05:30
parent f3dfdf654a
commit 7c8f3c7d7d
4 changed files with 538 additions and 210 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
ng6-seed/src/app/dashboard/dashboard.component.html
View File

@ -17,35 +17,51 @@
{{doughnutChartDataForTelePD.length}} --> {{doughnutChartDataForTelePD.length}} -->
<mat-card-content> <mat-card-content>
<div fxFlex.gt-sm="33.33" fxFlex.gt-xs="40" fxFlex="90"> <div fxFlex.gt-sm="33.33" fxFlex.gt-xs="40" fxFlex="90">
<div *ngIf="doughnutChartDataForFullPD.length != 0" style="text-align: center"><strong>Full - {{total1}}</strong></div> <!--<div *ngIf="doughnutChartDataForFullPD.length != 0" style="text-align: center"><strong>Full - {{total1}}</strong></div>-->
<!-- <div *ngIf="doughnutChartDataForFullPD" style="text-align: center"><strong>Full</strong></div> -->
<canvas baseChart class="chart "
<canvas baseChart class="chart" [data]="doughnutChartDataForFullPD"
[data]="doughnutChartDataForFullPD" [labels]="doughnutChartLabels"
[labels]="doughnutChartLabels" [options]="doughnutOptionsFullPD"
[options]="doughnutOptionsFullPD" [colors]="doughnutChartColors"
[colors]="doughnutChartColors" [legend]="false"
[chartType]="doughnutChartType"></canvas> [chartType]="doughnutChartType"></canvas>
</div> <div *ngIf="total1 != 0" class="donut-inner"><span>{{total1}}</span></div>
</div>
<div fxFlex.gt-sm="33.33" fxFlex.gt-xs="40" fxFlex="90"> <div fxFlex.gt-sm="33.33" fxFlex.gt-xs="40" fxFlex="90">
<div *ngIf="doughnutChartDataForSmartPD.length != 0" style="text-align: center"><strong>Smart - {{total2}}</strong></div> <!--<div *ngIf="doughnutChartDataForSmartPD.length != 0" style="text-align: center"><strong>Smart - {{total2}}</strong></div>-->
<canvas baseChart class="chart" <canvas baseChart class="chart"
[data]="doughnutChartDataForSmartPD" [data]="doughnutChartDataForSmartPD"
[labels]="doughnutChartLabels" [labels]="doughnutChartLabels"
[options]="doughnutOptionsSmartPD" [options]="doughnutOptionsSmartPD"
[colors]="doughnutChartColors" [colors]="doughnutChartColors"
[legend]="false"
[chartType]="doughnutChartType"></canvas> [chartType]="doughnutChartType"></canvas>
<div *ngIf="total2 != 0" class="donut-inner"><span>{{total2}}</span></div>
</div> </div>
<div fxFlex.gt-sm="33.33" fxFlex.gt-xs="40" fxFlex="90"> <div fxFlex.gt-sm="33.33" fxFlex.gt-xs="40" fxFlex="90">
<div *ngIf="doughnutChartDataForTelePD.length != 0" style="text-align: center"> <strong>Tele - {{total3}}</strong></div> <!--<div *ngIf="doughnutChartDataForTelePD.length != 0" style="text-align: center"> <strong>Tele - {{total3}}</strong></div>-->
<canvas baseChart class="chart" <canvas baseChart class="chart"
[data]="doughnutChartDataForTelePD" [data]="doughnutChartDataForTelePD"
[labels]="doughnutChartLabels" [labels]="doughnutChartLabels"
[options]="doughnutOptionsTelePD" [options]="doughnutOptionsTelePD"
[colors]="doughnutChartColors" [colors]="doughnutChartColors"
[legend]="false"
[chartType]="doughnutChartType"></canvas> [chartType]="doughnutChartType"></canvas>
<div *ngIf="total3 != 0" class="donut-inner"><span>{{total3}}</span></div>
</div> </div>
<div *ngIf="legendArr">
<ul class="clas">
<li class="cla"><div class="oval" style="background-color:#c1c1c1"></div>Draft</li>
<li class="cla"><div class="oval" style="background-color:#f44336"></div>Triggered</li>
<li class="cla"><div class="oval" style="background-color:#ffa500"></div>Allocated</li>
<li class="cla"><div class="oval" style="background-color:#ffeb3b"></div>Scheduled</li>
<li class="cla"><div class="oval" style="background-color:#3f51b5"></div>InProgress</li>
<li class="cla"><div class="oval" style="background-color:#00ff00"></div>Completed</li>
<li class="cla"><div class="oval" style="background-color:#4caf50"></div>QC Completed</li>
</ul>
</div>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
</div> </div>

54
ng6-seed/src/app/dashboard/dashboard.component.scss
View File

@ -8,10 +8,58 @@ mat-card-title{
padding-bottom: 1rem; padding-bottom: 1rem;
margin-bottom: 0px; margin-bottom: 0px;
} }
.oval {
height: 13px;
width: 25px;
border-radius: 50%;
}
.clas {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}
.cla {
font-size: 1rem;
}
.cla a {
display: block;
color: white;
text-align: center;
padding: 16px;
text-decoration: none;
}
.cla a:hover {
background-color: #111111;
}
.donut-inner{
//c - with chart lender
//c margin-bottom: 154px;
//c margin-top: -187px;
//c margin-left: 145px;
margin-bottom: 154px;
margin-top: -152px;
margin-left: 142px;
//margin-bottom: 154px;
//margin-top: -221px;
//margin-left: 145px;
//margin-bottom: 197px;
//margin-top: -251px;
//margin-left: 188px;
}
.donut-inner h5 { .donut-inner h5 {
margin-bottom: 5px; margin-bottom: 5px;
margin-top: 0; margin-top: 0;
} }
.donut-inner span{
font-size:1rems;
}
.chart{
padding: 0rem !important;
}
// .profile { // .profile {
// position: relative; // position: relative;
// width: 100%; // width: 100%;
@ -549,6 +597,6 @@ mat-card-title{
// } // }
.chart{ //.chart{
padding: 2rem; // padding: 2rem;
} //}

649
ng6-seed/src/app/dashboard/dashboard.component.ts
View File

@ -11,26 +11,48 @@ import { BaseChartDirective } from 'ng2-charts/ng2-charts';
templateUrl: './dashboard.component.html', templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.scss'] styleUrls: ['./dashboard.component.scss']
}) })
export class DashboardComponent { export class DashboardComponent {
dashboardTitle = 'Monthly Status'; dashboardTitle = 'Monthly Status';
@ViewChild('mycanvas') @ViewChild('mycanvas')
myChart: BaseChartDirective;
canvas:ElementRef;
doughnutChartType = 'doughnut';
doughnutChartLabels: string[] = ['Draft','Triggered','Allocated','Scheduled','InProgress','Completed','QC Completed'];
doughnutChartDataForFullPD:any[]=[]; doughnutChartDataForFullPD:any[]=[];
doughnutChartDataForSmartPD:any[]=[]; doughnutChartDataForSmartPD:any[]=[];
doughnutChartDataForTelePD:any[]=[]; doughnutChartDataForTelePD:any[]=[];
TempDataFullPD :number[]=[];
TempDataSmartPD :number[]=[]; tempDataFullPD :number[]=[];
TempDataTelePD :number[]=[]; tempDataSmartPD :number[]=[];
tempDataTelePD :number[]=[];
total1: number = 0; total1: number = 0;
total2: number = 0; total2: number = 0;
total3: number = 0; total3: number = 0;
doughnutChartName:any;
citywisepd : any[]; cityWisePD : any[];
lenderpd :any[]; lenderWisePD :any[];
message : any[]; alertMessage : any[];
Status = false; legendArr : any[] = [];
legendData: any;
// doughnutChartColors: any[] = [{
// backgroundColor: ['#f44336', '#3f51b5', '#ffeb3b', '#4caf50', '#2196f3','#673ab7']
// }];
doughnutChartColors: any[] = [{
//backgroundColor: ['#c1c1c1','#f44336','#3f51b5','#ffeb3b','#4caf50','#2196f3','#673ab7']
backgroundColor: ['#c1c1c1','#f44336','#ffa500','#ffeb3b','#3f51b5','#00ff00','#4caf50']
}];
// globalChartOptionsFullPD: any = { // globalChartOptionsFullPD: any = {
// responsive: false, // responsive: false,
@ -46,17 +68,47 @@ export class DashboardComponent {
// position: 'bottom' // position: 'bottom'
// } // }
// }; // };
globalChartOptions: any = {
responsive: false, // title: {
legend: { // display: true,
display: true, // position: "bottom",
position: 'bottom' // text: 'Upcoming Meetings'
} // },
}; // legend: {
// display: false
TodayFullPD:any = []; // },
MonthlyFullPD:any = []; // centertext: "123"
globalChartOptions: any = {
responsive: false,
//legendCallback: this.getLegendCallback
//legendCallback: function (chart) {
// console.log(chart);
// return 'a';
// }
legend: {
display: true,
position: 'bottom'
}
};
//getColor(color) {
//switch (country) {
//case "#c1c1c1":
//return '#c1c1c1';
//case "#f44336":
//return "#f44336";
//case "#ffa500":
//return "#ffa500";
//case "#ffeb3b":
//return "#ffeb3b";
//case "#3f51b5":
//return "#3f51b5";
//case "#00ff00":
//return "#00ff00";
//case "#4caf50":
//return "#4caf50";
//}
//}
constructor(private _dashboardService: DashboardService) { constructor(private _dashboardService: DashboardService) {
} }
@ -65,126 +117,174 @@ export class DashboardComponent {
//name: "DoughnutTextInside" //name: "DoughnutTextInside"
ngOnInit(){ ngOnInit(){
this.getPDSubCardData();
this.GetData(); this.getDoughnutChartData();
this.getDoNUT(); let arr1 = this.doughnutChartLabels;
let arr2 = this.doughnutChartColors["0"].backgroundColor;
} //console.log(arr1.length);
//console.log(arr2.length);
if(arr1.length == arr2.length){
for(let i=0;i<arr1.length;i++ )
{
this.legendArr[i] = {'labelcolor':arr2[i],'labelname':arr1[i] };
}
}
//console.log(this.legendArr);
}
GetData(){
// var DoughnutTextInsideChart = new Chart($('#myChart')[0].getContext('2d'));
/**
* To Get and Display PD Details As Per
* 1) LenderWise PD Details,
* 2) Citywise PD Details,
* 3) Alert Message of PD Details.
**/
getPDSubCardData(){
/** 1) Getting Lenderwise PD Details - Daily , Weekly and Monthly Data **/
this._dashboardService.getLenderDetail().subscribe(data => { this._dashboardService.getLenderDetail().subscribe(data => {
//console.log('Lender');console.log(data);
this.TodayFullPD = data.records; console.log(' ***** Lender Wise *****');
console.log('Lender Wise Whole Data',data);
// console.log(this.TodayFullPD);
// console.log(this.TodayFullPD.current_day); /** Daily Lender Datas */
// console.log(this.TodayFullPD.current_week); if(data.records.current_day.length != '0'){
// console.log(this.TodayFullPD.current_month);
if(this.TodayFullPD.current_day.length != '0'){
//console.log('If Condition day');
}
else{
//console.log('Else Condition day');
}
if(this.TodayFullPD.current_week.length != '0'){
//console.log('If Condition week');
}
else{
//console.log('Else Condition week');
}
if(this.TodayFullPD.current_month.length != '0'){
this.lenderpd = this.TodayFullPD.current_month;
console.log('******************** lender');
console.log(this.lenderpd);
// for(let contact of this.TodayFullPD.current_month) {
// let message = contact;
// }
}
else{
//console.log('Else Condition month');
}
});
this._dashboardService.getAlertDetail().subscribe(data => {
console.log('Alert*********************************');console.log(data);
this.message = data.records;
console.log(this.message);
});
this._dashboardService.getCityDetail().subscribe(data => {console.log('City');console.log(data);
this.TodayFullPD = data.records;
// console.log(this.TodayFullPD);
// console.log(this.TodayFullPD.current_day);
// console.log(this.TodayFullPD.current_week);
// console.log(this.TodayFullPD.current_month);
console.log('Whole',this.TodayFullPD);
console.log('Today only',this.TodayFullPD.current_day);
console.log('This week',this.TodayFullPD.current_week);
console.log('This month',this.TodayFullPD.current_month);
if(this.TodayFullPD.current_day.length != '0'){
//console.log('If Condition day'); //console.log('If Condition day');
} }
else{ else{
//console.log('Else Condition day'); //console.log('Else Condition day');
} }
if(this.TodayFullPD.current_week.length != '0'){
/** Weekly Lender Datas */
if(data.records.current_week.length != '0'){
//console.log('If Condition week'); //console.log('If Condition week');
} }
else{ else{
//console.log('Else Condition week'); //console.log('Else Condition week');
} }
if(this.TodayFullPD.current_month.length != '0'){
this.citywisepd = this.TodayFullPD.current_month;
//console.log('citywisepd'); /** Monthly Lender Datas */
//console.log(this.citywisepd); if(data.records.current_month.length != '0'){
//for(let contact of this.TodayFullPD.current_month) {
// let message = contact;
//}
this.lenderWisePD = Object.keys(data.records.current_month).map(function(key) {
return data.records.current_month[key];
});
console.log('Monthly Status Lenderwise PD',this.lenderWisePD);
} }
else{ else{
//console.log('Else Condition month'); //console.log('Else Condition month');
} }
}); });
/** 2) Getting Citywise PD Details - Daily , Weekly and Monthly Data **/
this._dashboardService.getCityDetail().subscribe(data => {
console.log(' ***** City Wise *****');
console.log('City Wise Whole Data',data);
/** Daily City Datas */
if(data.records.current_day.length != '0'){
//console.log('If Condition day');
}
else{
//console.log('Else Condition day');
}
/** Weekly City Datas */
if(data.records.current_week.length != '0'){
//console.log('If Condition week');
}
else{
//console.log('Else Condition week');
}
/** Monthly City Datas */
if(data.records.current_month.length != '0'){
//this.cityWisePD = this.TodayFullPD.current_month;
this.cityWisePD = Object.keys(data.records.current_month).map(function(key) {
return data.records.current_month[key];
});
console.log('Monthly Status Citywise PD',this.cityWisePD);
}
else{
//console.log('Else Condition month');
}
});
/** 3) Getting Alert Message of PD Details */
this._dashboardService.getAlertDetail().subscribe(data => {
console.log(' ***** Alert Message *****');
console.log('Alert Message Whole Data',data);
this.alertMessage = data.records;
console.log('Alert Message',this.alertMessage);
});
} }
getDoNUT(){
/**
* To Get and Display Doughnut Chart Data Based on PDType
**/
getDoughnutChartData(){
this._dashboardService.getPDDetailForDoughnut().subscribe(data => { this._dashboardService.getPDDetailForDoughnut().subscribe(data => {
this.MonthlyFullPD = data.records;
console.log(' ***** Doughnut Chart Data *****');
console.log('whole',this.MonthlyFullPD); console.log('Whole Data',data);
console.log('Today',this.MonthlyFullPD.current_day);
console.log('week',this.MonthlyFullPD.current_week); let DraftIndexvalue = this.doughnutChartLabels.indexOf('Draft');
console.log('month',this.MonthlyFullPD.current_month); let TriggedIndexvalue = this.doughnutChartLabels.indexOf('Triggered');
if(this.MonthlyFullPD.current_day.length != '0'){ let AllocatedIndexvalue = this.doughnutChartLabels.indexOf('Allocated');
let ScheduledIndexvalue = this.doughnutChartLabels.indexOf('Scheduled');
let InProgressIndexvalue = this.doughnutChartLabels.indexOf('InProgress');
let CompletedIndexvalue = this.doughnutChartLabels.indexOf('Completed');
let QCCompletedIndexvalue = this.doughnutChartLabels.indexOf('QC Completed');
if(data.records.current_day.length != '0'){
//console.log('If Condition day'); //console.log('If Condition day');
console.log('Today Status ',data.records.current_day);
} }
else{ else{
//console.log('Else Condition day'); //console.log('Else Condition day');
} }
if(this.MonthlyFullPD.current_week.length != '0'){
if(data.records.current_week.length != '0'){
//console.log('If Condition week'); //console.log('If Condition week');
console.log('Weekly Status',data.records.current_week);
} }
else{ else{
//console.log('Else Condition week'); //console.log('Else Condition week');
} }
if(this.MonthlyFullPD.current_month.length != '0'){
if(data.records.current_month.length != '0'){
//console.log('If Condition monthLY'); //console.log('If Condition monthLY');
//this.citydatas = this.citydatas.filter(city=>city.isactive == 1 ); console.log('Monthly Status',data.records.current_month);
let Monthly = this.MonthlyFullPD.current_month;
let MonthlyFullPDArr = Monthly.filter(arr=>arr.PDTYPE == 'FULL' );
let MonthlySmartPDArr = Monthly.filter(arr=>arr.PDTYPE == 'SMART' );
let MonthlyTelePDArr = Monthly.filter(arr=>arr.PDTYPE == 'TELE' );
let MonthlyFullPDArr = data.records.current_month.filter(arr=>arr.PDTYPE == 'FULL' );
let MonthlySmartPDArr = data.records.current_month.filter(arr=>arr.PDTYPE == 'SMART' );
let MonthlyTelePDArr = data.records.current_month.filter(arr=>arr.PDTYPE == 'TELE' );
let TriggedIndexvalue = this.doughnutChartLabels.indexOf('Triggered'); let DraftFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'DRAFT');
let AllocatedIndexvalue = this.doughnutChartLabels.indexOf('Allocated'); if(DraftFullPDvalue.length != '0'){
let ScheduledIndexvalue = this.doughnutChartLabels.indexOf('Scheduled'); //console.log('console triggered value',TriggerFullPDvalue);
let InProgressIndexvalue = this.doughnutChartLabels.indexOf('InProgress'); for(let FPD of DraftFullPDvalue){
let CompletedIndexvalue = this.doughnutChartLabels.indexOf('Completed'); let y = +FPD.count;
let QCCompletedIndexvalue = this.doughnutChartLabels.indexOf('QC Completed'); this.total1 = this.total1+y;
this.tempDataFullPD[DraftIndexvalue] = y;
}
}
else{
this.tempDataFullPD[DraftIndexvalue] = 0;
}
let TriggerFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'TRIGGERED'); let TriggerFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'TRIGGERED');
if(TriggerFullPDvalue.length != '0'){ if(TriggerFullPDvalue.length != '0'){
@ -192,11 +292,11 @@ getDoNUT(){
for(let FPD of TriggerFullPDvalue){ for(let FPD of TriggerFullPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total1 = this.total1+y; this.total1 = this.total1+y;
this.TempDataFullPD[TriggedIndexvalue] = y; this.tempDataFullPD[TriggedIndexvalue] = y;
} }
} }
else{ else{
this.TempDataFullPD[TriggedIndexvalue] = 0; this.tempDataFullPD[TriggedIndexvalue] = 0;
} }
let AllocatedFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'ALLOCATED'); let AllocatedFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'ALLOCATED');
@ -204,11 +304,11 @@ getDoNUT(){
for(let FPD of AllocatedFullPDvalue){ for(let FPD of AllocatedFullPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total1 = this.total1+y; this.total1 = this.total1+y;
this.TempDataFullPD[AllocatedIndexvalue] = y; this.tempDataFullPD[AllocatedIndexvalue] = y;
} }
} }
else{ else{
this.TempDataFullPD[AllocatedIndexvalue] = 0; this.tempDataFullPD[AllocatedIndexvalue] = 0;
} }
let ScheduledFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'SCHEDULED'); let ScheduledFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'SCHEDULED');
@ -216,13 +316,13 @@ getDoNUT(){
for(let FPD of ScheduledFullPDvalue){ for(let FPD of ScheduledFullPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total1 = this.total1+y; this.total1 = this.total1+y;
this.TempDataFullPD[ScheduledIndexvalue] = y; this.tempDataFullPD[ScheduledIndexvalue] = y;
} }
//let y = +ScheduledFullPDvalue.count; //let y = +ScheduledFullPDvalue.count;
} }
else{ else{
this.TempDataFullPD[ScheduledIndexvalue] = 0; this.tempDataFullPD[ScheduledIndexvalue] = 0;
} }
let InProgressFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'INPROGRESS'); let InProgressFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'INPROGRESS');
@ -230,13 +330,13 @@ getDoNUT(){
for(let FPD of InProgressFullPDvalue){ for(let FPD of InProgressFullPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total1 = this.total1+y; this.total1 = this.total1+y;
this.TempDataFullPD[InProgressIndexvalue] = y; this.tempDataFullPD[InProgressIndexvalue] = y;
} }
//let y = +InProgressFullPDvalue.count; //let y = +InProgressFullPDvalue.count;
} }
else{ else{
this.TempDataFullPD[InProgressIndexvalue] = 0; this.tempDataFullPD[InProgressIndexvalue] = 0;
} }
let CompletedFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'COMPLETED'); let CompletedFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == 'COMPLETED');
@ -244,13 +344,13 @@ getDoNUT(){
for(let FPD of CompletedFullPDvalue){ for(let FPD of CompletedFullPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total1 = this.total1+y; this.total1 = this.total1+y;
this.TempDataFullPD[CompletedIndexvalue] = y; this.tempDataFullPD[CompletedIndexvalue] = y;
} }
//let y = +CompletedFullPDvalue.count; //let y = +CompletedFullPDvalue.count;
} }
else{ else{
this.TempDataFullPD[CompletedIndexvalue] = 0; this.tempDataFullPD[CompletedIndexvalue] = 0;
} }
let QCCompletedFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == "QC_COMPLETED"); let QCCompletedFullPDvalue = MonthlyFullPDArr.filter(arr=>arr.pd_status == "QC_COMPLETED");
@ -258,13 +358,26 @@ getDoNUT(){
for(let FPD of QCCompletedFullPDvalue){ for(let FPD of QCCompletedFullPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total1 = this.total1+y; this.total1 = this.total1+y;
this.TempDataFullPD[QCCompletedIndexvalue] = y; this.tempDataFullPD[QCCompletedIndexvalue] = y;
} }
//let y = +QCCompletedFullPDvalue.count; //let y = +QCCompletedFullPDvalue.count;
} }
else{ else{
this.TempDataFullPD[QCCompletedIndexvalue] = 0; this.tempDataFullPD[QCCompletedIndexvalue] = 0;
}
let DraftSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'DRAFT');
if(DraftSmartPDvalue.length != '0'){
//console.log('console triggered value',TriggerFullPDvalue);
for(let FPD of DraftSmartPDvalue){
let y = +FPD.count;
this.total2 = this.total2+y;
this.tempDataSmartPD[DraftIndexvalue] = y;
}
}
else{
this.tempDataSmartPD[DraftIndexvalue] = 0;
} }
let TriggerSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'TRIGGERED'); let TriggerSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'TRIGGERED');
@ -273,11 +386,11 @@ getDoNUT(){
for(let FPD of TriggerSmartPDvalue){ for(let FPD of TriggerSmartPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total2 = this.total2+y; this.total2 = this.total2+y;
this.TempDataSmartPD[TriggedIndexvalue] = y; this.tempDataSmartPD[TriggedIndexvalue] = y;
} }
} }
else{ else{
this.TempDataSmartPD[TriggedIndexvalue] = 0; this.tempDataSmartPD[TriggedIndexvalue] = 0;
} }
let AllocatedSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'ALLOCATED'); let AllocatedSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'ALLOCATED');
@ -285,11 +398,11 @@ getDoNUT(){
for(let FPD of AllocatedSmartPDvalue){ for(let FPD of AllocatedSmartPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total2 = this.total2+y; this.total2 = this.total2+y;
this.TempDataSmartPD[AllocatedIndexvalue] = y; this.tempDataSmartPD[AllocatedIndexvalue] = y;
} }
} }
else{ else{
this.TempDataSmartPD[AllocatedIndexvalue] = 0; this.tempDataSmartPD[AllocatedIndexvalue] = 0;
} }
let ScheduledSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'SCHEDULED'); let ScheduledSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'SCHEDULED');
@ -297,13 +410,13 @@ getDoNUT(){
for(let FPD of ScheduledSmartPDvalue){ for(let FPD of ScheduledSmartPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total2 = this.total2+y; this.total2 = this.total2+y;
this.TempDataSmartPD[ScheduledIndexvalue] = y; this.tempDataSmartPD[ScheduledIndexvalue] = y;
} }
//let y = +ScheduledFullPDvalue.count; //let y = +ScheduledFullPDvalue.count;
} }
else{ else{
this.TempDataSmartPD[ScheduledIndexvalue] = 0; this.tempDataSmartPD[ScheduledIndexvalue] = 0;
} }
let InProgressSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'INPROGRESS'); let InProgressSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'INPROGRESS');
@ -311,13 +424,13 @@ getDoNUT(){
for(let FPD of InProgressSmartPDvalue){ for(let FPD of InProgressSmartPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total2 = this.total2+y; this.total2 = this.total2+y;
this.TempDataSmartPD[InProgressIndexvalue] = y; this.tempDataSmartPD[InProgressIndexvalue] = y;
} }
//let y = +InProgressFullPDvalue.count; //let y = +InProgressFullPDvalue.count;
} }
else{ else{
this.TempDataSmartPD[InProgressIndexvalue] = 0; this.tempDataSmartPD[InProgressIndexvalue] = 0;
} }
let CompletedSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'COMPLETED'); let CompletedSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == 'COMPLETED');
@ -325,13 +438,13 @@ getDoNUT(){
for(let FPD of CompletedSmartPDvalue){ for(let FPD of CompletedSmartPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total2 = this.total2+y; this.total2 = this.total2+y;
this.TempDataSmartPD[CompletedIndexvalue] = y; this.tempDataSmartPD[CompletedIndexvalue] = y;
} }
//let y = +CompletedFullPDvalue.count; //let y = +CompletedFullPDvalue.count;
} }
else{ else{
this.TempDataSmartPD[CompletedIndexvalue] = 0; this.tempDataSmartPD[CompletedIndexvalue] = 0;
} }
let QCCompletedSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == "QC_COMPLETED"); let QCCompletedSmartPDvalue = MonthlySmartPDArr.filter(arr=>arr.pd_status == "QC_COMPLETED");
@ -339,26 +452,40 @@ getDoNUT(){
for(let FPD of QCCompletedSmartPDvalue){ for(let FPD of QCCompletedSmartPDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total2 = this.total2+y; this.total2 = this.total2+y;
this.TempDataSmartPD[QCCompletedIndexvalue] = y; this.tempDataSmartPD[QCCompletedIndexvalue] = y;
} }
//let y = +QCCompletedFullPDvalue.count; //let y = +QCCompletedFullPDvalue.count;
} }
else{ else{
this.TempDataSmartPD[QCCompletedIndexvalue] = 0; this.tempDataSmartPD[QCCompletedIndexvalue] = 0;
} }
let DraftTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'DRAFT');
if(DraftTelePDvalue.length != '0'){
for(let FPD of DraftTelePDvalue){
let y = +FPD.count;
this.total1 = this.total3+y;
this.tempDataTelePD[DraftIndexvalue] = y;
}
}
else{
this.tempDataTelePD[DraftIndexvalue] = 0;
}
let TriggerTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'TRIGGERED'); let TriggerTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'TRIGGERED');
if(TriggerTelePDvalue.length != '0'){ if(TriggerTelePDvalue.length != '0'){
//console.log('console triggered value',TriggerTelePDvalue); //console.log('console triggered value',TriggerTelePDvalue);
for(let FPD of TriggerTelePDvalue){ for(let FPD of TriggerTelePDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total3 = this.total3+y; this.total3 = this.total3+y;
this.TempDataTelePD[TriggedIndexvalue] = y; this.tempDataTelePD[TriggedIndexvalue] = y;
} }
} }
else{ else{
this.TempDataTelePD[TriggedIndexvalue] = 0; this.tempDataTelePD[TriggedIndexvalue] = 0;
} }
let AllocatedTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'ALLOCATED'); let AllocatedTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'ALLOCATED');
@ -366,11 +493,11 @@ getDoNUT(){
for(let FPD of AllocatedTelePDvalue){ for(let FPD of AllocatedTelePDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total3 = this.total3+y; this.total3 = this.total3+y;
this.TempDataTelePD[AllocatedIndexvalue] = y; this.tempDataTelePD[AllocatedIndexvalue] = y;
} }
} }
else{ else{
this.TempDataTelePD[AllocatedIndexvalue] = 0; this.tempDataTelePD[AllocatedIndexvalue] = 0;
} }
let ScheduledTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'SCHEDULED'); let ScheduledTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'SCHEDULED');
@ -378,13 +505,13 @@ getDoNUT(){
for(let FPD of ScheduledTelePDvalue){ for(let FPD of ScheduledTelePDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total3 = this.total3+y; this.total3 = this.total3+y;
this.TempDataTelePD[ScheduledIndexvalue] = y; this.tempDataTelePD[ScheduledIndexvalue] = y;
} }
//let y = +ScheduledFullPDvalue.count; //let y = +ScheduledFullPDvalue.count;
} }
else{ else{
this.TempDataTelePD[ScheduledIndexvalue] = 0; this.tempDataTelePD[ScheduledIndexvalue] = 0;
} }
let InProgressTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'INPROGRESS'); let InProgressTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'INPROGRESS');
@ -392,13 +519,13 @@ getDoNUT(){
for(let FPD of InProgressTelePDvalue){ for(let FPD of InProgressTelePDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total3 = this.total3+y; this.total3 = this.total3+y;
this.TempDataTelePD[InProgressIndexvalue] = y; this.tempDataTelePD[InProgressIndexvalue] = y;
} }
//let y = +InProgressFullPDvalue.count; //let y = +InProgressFullPDvalue.count;
} }
else{ else{
this.TempDataTelePD[InProgressIndexvalue] = 0; this.tempDataTelePD[InProgressIndexvalue] = 0;
} }
let CompletedTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'COMPLETED'); let CompletedTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == 'COMPLETED');
@ -406,13 +533,13 @@ getDoNUT(){
for(let FPD of CompletedTelePDvalue){ for(let FPD of CompletedTelePDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total3 = this.total3+y; this.total3 = this.total3+y;
this.TempDataTelePD[CompletedIndexvalue] = y; this.tempDataTelePD[CompletedIndexvalue] = y;
} }
//let y = +CompletedFullPDvalue.count; //let y = +CompletedFullPDvalue.count;
} }
else{ else{
this.TempDataTelePD[CompletedIndexvalue] = 0; this.tempDataTelePD[CompletedIndexvalue] = 0;
} }
let QCCompletedTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == "QC_COMPLETED"); let QCCompletedTelePDvalue = MonthlyTelePDArr.filter(arr=>arr.pd_status == "QC_COMPLETED");
@ -420,101 +547,101 @@ getDoNUT(){
for(let FPD of QCCompletedTelePDvalue){ for(let FPD of QCCompletedTelePDvalue){
let y = +FPD.count; let y = +FPD.count;
this.total3 = this.total3+y; this.total3 = this.total3+y;
this.TempDataTelePD[QCCompletedIndexvalue] = y; this.tempDataTelePD[QCCompletedIndexvalue] = y;
} }
//let y = +QCCompletedFullPDvalue.count; //let y = +QCCompletedFullPDvalue.count;
} }
else{ else{
this.TempDataTelePD[QCCompletedIndexvalue] = 0; this.tempDataTelePD[QCCompletedIndexvalue] = 0;
} }
// y: number // y: number
//console.log(MonthlyFullPDArr.pd_status); //console.log(monthlyFullPDArr.pd_status);
// for(let FPD of MonthlyFullPDArr){ // for(let FPD of monthlyFullPDArr){
// if(FPD.pd_status == 'TRIGGERED'){ // if(FPD.pd_status == 'TRIGGERED'){
// console.log('PD Status'); // console.log('PD Status');
// let Indexvalue = this.doughnutChartLabels.indexOf('Triggered'); // let Indexvalue = this.doughnutChartLabels.indexOf('Triggered');
// let y = +FPD.count; // y: number // let y = +FPD.count; // y: number
// console.log('Initial',this.TempDataFullPD); // console.log('Initial',this.tempDataFullPD);
// this.TempDataFullPD[Indexvalue] = y; // this.tempDataFullPD[Indexvalue] = y;
// console.log(this.TempDataFullPD); // console.log(this.tempDataFullPD);
// } // }
// else{ // else{
// let Indexvalue = this.doughnutChartLabels.indexOf('Triggered'); // let Indexvalue = this.doughnutChartLabels.indexOf('Triggered');
// this.TempDataFullPD[Indexvalue] = 0; // this.tempDataFullPD[Indexvalue] = 0;
// } // }
// // if(contact.pd_status == 'TRIGGERED' && contact.PDTYPE == 'FULL'){ // // if(contact.pd_status == 'TRIGGERED' && contact.PDTYPE == 'FULL'){
// // let Indexvalue = this.doughnutChartLabels.indexOf('Triggered'); // // let Indexvalue = this.doughnutChartLabels.indexOf('Triggered');
// // var y = +contact.count; // y: number // // var y = +contact.count; // y: number
// // console.log('Initial',this.TempDataFullPD); // // console.log('Initial',this.tempDataFullPD);
// // this.TempDataFullPD[Indexvalue] = y; // // this.tempDataFullPD[Indexvalue] = y;
// // console.log(this.TempDataFullPD); // // console.log(this.tempDataFullPD);
// // } // // }
// // else{ // // else{
// // let Indexvalue = this.doughnutChartLabels.indexOf('Triggered'); // // let Indexvalue = this.doughnutChartLabels.indexOf('Triggered');
// // this.TempDataFullPD[Indexvalue] = 0; // // this.tempDataFullPD[Indexvalue] = 0;
// // } // // }
// if(FPD.pd_status == 'ALLOCATED'){ // if(FPD.pd_status == 'ALLOCATED'){
// let Indexvalue = this.doughnutChartLabels.indexOf('Allocated'); // let Indexvalue = this.doughnutChartLabels.indexOf('Allocated');
// var y = +FPD.count; // y: number // var y = +FPD.count; // y: number
// // console.log(this.TempDataFullPD); // // console.log(this.tempDataFullPD);
// this.TempDataFullPD[Indexvalue] = y; // this.tempDataFullPD[Indexvalue] = y;
// //console.log('allocated b4',TempDataFullPD); // //console.log('allocated b4',tempDataFullPD);
// } // }
// else{ // else{
// let Indexvalue = this.doughnutChartLabels.indexOf('Allocated'); // let Indexvalue = this.doughnutChartLabels.indexOf('Allocated');
// this.TempDataFullPD[Indexvalue] = 0; // this.tempDataFullPD[Indexvalue] = 0;
// } // }
// if(FPD.pd_status == 'INPROGRESS'){ // if(FPD.pd_status == 'INPROGRESS'){
// let Indexvalue = this.doughnutChartLabels.indexOf('InProgress'); // let Indexvalue = this.doughnutChartLabels.indexOf('InProgress');
// var y = +FPD.count; // y: number // var y = +FPD.count; // y: number
// this.TempDataFullPD[Indexvalue] = y; // this.tempDataFullPD[Indexvalue] = y;
// //console.log('b4',TempDataFullPD); // //console.log('b4',tempDataFullPD);
// } // }
// else{ // else{
// let Indexvalue = this.doughnutChartLabels.indexOf('InProgress'); // let Indexvalue = this.doughnutChartLabels.indexOf('InProgress');
// this.TempDataFullPD[Indexvalue] = 0; // this.tempDataFullPD[Indexvalue] = 0;
// } // }
// if(FPD.pd_status == 'SCHEDULED'){ // if(FPD.pd_status == 'SCHEDULED'){
// let Indexvalue = this.doughnutChartLabels.indexOf('Scheduled'); // let Indexvalue = this.doughnutChartLabels.indexOf('Scheduled');
// var y = +FPD.count; // y: number // var y = +FPD.count; // y: number
// this.TempDataFullPD[Indexvalue] = y; // this.tempDataFullPD[Indexvalue] = y;
// //console.log('b4',TempDataFullPD); // //console.log('b4',tempDataFullPD);
// } // }
// else{ // else{
// let Indexvalue = this.doughnutChartLabels.indexOf('Scheduled'); // let Indexvalue = this.doughnutChartLabels.indexOf('Scheduled');
// this.TempDataFullPD[Indexvalue] = 0; // this.tempDataFullPD[Indexvalue] = 0;
// //console.log('d',TempDataFullPD); // //console.log('d',tempDataFullPD);
// } // }
// if(FPD.pd_status == 'COMPLETED'){ // if(FPD.pd_status == 'COMPLETED'){
// let Indexvalue = this.doughnutChartLabels.indexOf('Completed'); // let Indexvalue = this.doughnutChartLabels.indexOf('Completed');
// var y = +FPD.count; // y: number // var y = +FPD.count; // y: number
// this.TempDataFullPD[Indexvalue] = y; // this.tempDataFullPD[Indexvalue] = y;
// //console.log('allocated',TempDataFullPD); // //console.log('allocated',tempDataFullPD);
// } // }
// else{ // else{
// let Indexvalue = this.doughnutChartLabels.indexOf('Completed'); // let Indexvalue = this.doughnutChartLabels.indexOf('Completed');
// this.TempDataFullPD[Indexvalue] = 0; // this.tempDataFullPD[Indexvalue] = 0;
// } // }
// //return TempDataFullPD; // //return tempDataFullPD;
// if(FPD.pd_status == 'QC COMPLETED'){ // if(FPD.pd_status == 'QC COMPLETED'){
// let Indexvalue = this.doughnutChartLabels.indexOf('QC Completed'); // let Indexvalue = this.doughnutChartLabels.indexOf('QC Completed');
// var y = +FPD.count; // y: number // var y = +FPD.count; // y: number
// this.TempDataFullPD[Indexvalue] = y; // this.tempDataFullPD[Indexvalue] = y;
// //console.log('allocated',TempDataFullPD); // //console.log('allocated',tempDataFullPD);
// } // }
// else{ // else{
// let Indexvalue = this.doughnutChartLabels.indexOf('QC Completed'); // let Indexvalue = this.doughnutChartLabels.indexOf('QC Completed');
// this.TempDataFullPD[Indexvalue] = 0; // this.tempDataFullPD[Indexvalue] = 0;
// //console.log('Final Data',TempDataFullPD); // //console.log('Final Data',tempDataFullPD);
// } // }
// //console.log('inside',this.TempDataFullPD); // //console.log('inside',this.tempDataFullPD);
// } // }
//this.doughnutChartDataForFullPD = [3,4,5,6,7,8]; //this.doughnutChartDataForFullPD = [3,4,5,6,7,8];
} }
@ -522,16 +649,62 @@ getDoNUT(){
else{ else{
//console.log('Else Condition month'); //console.log('Else Condition month');
} }
this.doughnutChartDataForFullPD = this.TempDataFullPD; this.doughnutChartDataForFullPD = this.tempDataFullPD;
this.doughnutChartDataForSmartPD = this.TempDataSmartPD; this.doughnutChartDataForSmartPD = this.tempDataSmartPD;
this.doughnutChartDataForTelePD = this.TempDataTelePD; this.doughnutChartDataForTelePD = this.tempDataTelePD;
console.log('Final full Data Completed',this.doughnutChartDataForFullPD); console.log('Final full Data Completed',this.doughnutChartDataForFullPD);
console.log('Temp full Data',this.TempDataFullPD); console.log('temp full Data',this.tempDataFullPD);
console.log('Final Smart Data Completed',this.doughnutChartDataForSmartPD); console.log('Final Smart Data Completed',this.doughnutChartDataForSmartPD);
console.log('Temp Smart Data',this.TempDataSmartPD); console.log('temp Smart Data',this.tempDataSmartPD);
console.log('Final Tele Data Completed',this.doughnutChartDataForTelePD); console.log('Final Tele Data Completed',this.doughnutChartDataForTelePD);
console.log('Temp Tele Data',this.TempDataTelePD); console.log('temp Tele Data',this.tempDataTelePD);
//console.log(this.tempDataTelePD.__proto__);
//console.log(this.tempDataTelePD._chartjs);
//console.log(this.doughnutChartDataForTelePD['event'].listeners["0"].chart.boxes["0"].legendItems);
//chart.chart.ctx;
/*beforeDraw: function (this.doughnutChartDataForTelePD.chart) {
if (chart.config.options.elements.center) {
//Get ctx from string
var ctx = chart.chart.ctx;
//Get options from the center object in options
var centerConfig = chart.config.options.elements.center;
var fontStyle = centerConfig.fontStyle || 'Arial';
var txt = centerConfig.text;
var color = centerConfig.color || '#000';
var sidePadding = centerConfig.sidePadding || 20;
var sidePaddingCalculated = (sidePadding/100) * (chart.innerRadius * 2)
//Start with a base font of 30px
ctx.font = "30px " + fontStyle;
//Get the width of the string and also the width of the element minus 10 to give it 5px side padding
var stringWidth = ctx.measureText(txt).width;
var elementWidth = (chart.innerRadius * 2) - sidePaddingCalculated;
// Find out how much the font can grow in width.
var widthRatio = elementWidth / stringWidth;
var newFontSize = Math.floor(30 * widthRatio);
var elementHeight = (chart.innerRadius * 2);
// Pick a new font size so it will not be larger than the height of label.
var fontSizeToUse = Math.min(newFontSize, elementHeight);
//Set font settings to draw it correctly.
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
var centerX = ((chart.chartArea.left + chart.chartArea.right) / 2);
var centerY = ((chart.chartArea.top + chart.chartArea.bottom) / 2);
ctx.font = fontSizeToUse+"px " + fontStyle;
ctx.fillStyle = color;
//Draw text in center
ctx.fillText(txt, centerX, centerY);
}
}*/
}) })
} }
@ -542,36 +715,124 @@ getDoNUT(){
// }]; // }];
// }, 100); // }, 100);
doughnutChartColors: any[] = [{
backgroundColor: ['#f44336', '#3f51b5', '#ffeb3b', '#4caf50', '#2196f3','#673ab7']
}];
doughnutChartType = 'doughnut';
doughnutChartLabels: string[] = ['Triggered', 'Allocated','Scheduled','InProgress','Completed','QC Completed'];
doughnutOptionsFullPD: any = Object.assign({ doughnutOptionsFullPD: any = Object.assign({
elements: { elements: {
arc: { arc: {
borderWidth: 0.2 borderWidth: 0.2
} }
} },
}, this.globalChartOptions); title: {
display: true,
position: "top",
text: 'Full',
fontSize: 15,
},
centertext:'One'
},this.globalChartOptions);
doughnutOptionsSmartPD: any = Object.assign({ doughnutOptionsSmartPD: any = Object.assign({
elements: { elements: {
arc: { arc: {
borderWidth: 0.2 borderWidth: 0.2
} }
} },
}, this.globalChartOptions); title: {
display: true,
position: "top",
text: 'Smart',
fontSize: 15
},
centertext:'Two'
},
this.globalChartOptions);
doughnutOptionsTelePD: any = Object.assign({ doughnutOptionsTelePD: any = Object.assign({
elements: { elements: {
arc: { arc: {
borderWidth: 0.2 borderWidth: 0.2
} }
} },
title: {
display: true,
position: "top",
text: 'Tele',
fontSize: 15
},
centertext:'Three'
}, this.globalChartOptions); }, this.globalChartOptions);
chartfunction(){ this.Status = true; }
}
// Chart.pluginService.register({
// beforeDraw: function(chart) {
// var width = chart.chart.width,
// height = chart.chart.height,
// ctx = chart.chart.ctx;
// ctx.restore();
// var fontSize = (height / 114).toFixed(2);
// ctx.font = fontSize + "em sans-serif";
// ctx.textBaseline = "middle";
// var text = "75%",
// textX = Math.round((width - ctx.measureText(text).width) / 2),
// textY = height / 2;
// ctx.fillText(text, textX, textY);
// ctx.save();
// }
// });
}
// import {Component, NgModule, ElementRef, Inject, ViewChild} from '@angular/core'
// import {BrowserModule} from '@angular/platform-browser'
// import {ChartsModule, Color} from 'ng2-charts';
// @Component({
// selector: 'app-dashboard',
// templateUrl: './dashboard.component.html',
// styleUrls: ['./dashboard.component.scss']
// })
// export class DashboardComponent {
// @ViewChild('mycanvas')
// canvas:ElementRef;
// doughnutChartDataForTelePD:number[]=[1,2,3,4,5,6];
// options: { circumference: number; rotation: number; animation: { onComplete: () => void; }; };
// ngOnInit(){
// var ctx = this.canvas.nativeElement.getContext("2d");
// let me = this;
// this.options = {
// circumference: Math.PI,
// rotation : Math.PI,
// animation:{ onComplete: function() {
// me.doit(ctx);
// }}
// }
// }
// doit(ctx) {
// // Chart.types.Doughnut.prototype.draw.apply(this, arguments);
// var width = this.canvas.nativeElement.clientWidth,
// height = this.canvas.nativeElement.clientHeight;
// var fontSize = (height / 250).toFixed(2);
// ctx.font = fontSize + "em Verdana";
// ctx.textBaseline = "middle";
// ctx.fillStyle = "blue";
// var text = "Pass Rate 82%",
// textX = Math.round((width - ctx.measureText(text).width) / 2),
// textY = height -10;
// ctx.fillText(text, textX, textY);
// ctx.restore();
// }
// }

5
ng6-seed/src/app/dashboard/dashboard.service.ts
View File

@ -14,7 +14,10 @@ import { environment } from 'environments/environment';
/** Consant Value For Created Date And Updated Date */ /** Consant Value For Created Date And Updated Date */
const currentdate = new Date().toJSON().slice(0,19).replace('T',' '); const currentdate = new Date().toJSON().slice(0,19).replace('T',' ');
@Injectable()
@Injectable({
providedIn: 'root'
})
export class DashboardService { export class DashboardService {