fix

2023-08-04 20:10:57 +03:00
parent 70edf34cf6
commit 0d45061d81
14 changed files with 866 additions and 35 deletions
@@ -37,7 +37,7 @@
 					</div>
 					<div class="body">
 						<div id="chart">
-							<apx-chart #chart *ngIf="chartOptions" class="apex-pie-center"
+							<apx-chart #chart *ngIf="chartOptions" class="apex-pie-center" (contextmenu)="onRightClick($event)"
 									   [series]="chartOptions.series!"
 									   [chart]="chartOptions.chart!"
 									   [dataLabels]="chartOptions.dataLabels!"
@@ -90,10 +90,22 @@ export class DashboardIncomeComponent implements OnInit {
 						color: this.colors[this.colors.length - i - 1],
 					});
 				}
-				this.setChartOptions(series, ranges);
+
+				if (update) {
+					this.chart.updateSeries([{
+						data: series
+					}]);
+				} else {
+					this.setChartOptions(series, ranges);
+				}
 			});
 	}

+	onRightClick(event?: Event) {
+		event?.preventDefault();
+		this.loadData(true);
+	}
+
 	private setChartOptions(data: any[], ranges: any[]) {
 		var self = this;

@@ -105,6 +117,12 @@ export class DashboardIncomeComponent implements OnInit {
 				type: 'treemap',
 				width: 600,
 				height: 600,
+				events: {
+					click: function (event, chartContext, config) {
+						var data = self.dashboardModel!.data[config.dataPointIndex];
+						self.loadData(true, data.id);
+					}
+				}
 			},
 			plotOptions: {
 				treemap: {
@@ -38,7 +38,7 @@
 						-->
 					</div>
 					<div class="body">
-						<apx-chart #chart *ngIf="chartOptions" class="apex-pie-center"
+						<apx-chart #chart *ngIf="chartOptions" class="apex-pie-center" (contextmenu)="onRightClick($event)"
 								   [series]="chartOptions.series!"
 								   [chart]="chartOptions.chart!"
 								   [dataLabels]="chartOptions.dataLabels!"
@@ -46,12 +46,12 @@
 								   [title]="chartOptions.title!"
 								   [legend]="chartOptions.legend!">
 						</apx-chart>
-						<div class="table-responsive m-t-15" *ngIf="dashboardModel!.details">
+						<div class="table-responsive m-t-15" *ngIf="dashboardModel">
 							<table class="table align-items-center">
 								<tbody>
-								<tr *ngFor="let item of dashboardModel!.details!">
-									<td><i class="fa fa-circle col-cyan msr-2"></i> {{item.name}}</td>
-									<td [ngClass]="{ 'col-green': item.value != 0, 'col-red': item.value == 0}" style="text-align: right;">{{item.value | number: '1.2'}} ({{item.currency}})</td>
+								<tr *ngFor="let item of dashboardModel!.details">
+									<td><i class="fa fa-circle col-cyan msr-2"></i> {{item.currency}}</td>
+									<td [ngClass]="{ 'col-green': item.value != 0, 'col-red': item.value == 0}" style="text-align: right;">{{item.value | number: '1.2'}} ({{item.valueRaw}})</td>
 								</tr>
 								</tbody>
 							</table>
@@ -64,6 +64,11 @@ export class DashboardOutcomeComponent implements OnInit {
 		this.loadData();
 	}

+	onRightClick(event?: Event) {
+		event?.preventDefault();
+		this.loadData(true);
+	}
+
 	private loadData(update?: boolean, category?: string) {
 		let params = new HttpParams()
 			.set('from', moment(this.dateFrom).format('YYYY-MM-DD'))
@@ -91,6 +96,7 @@ export class DashboardOutcomeComponent implements OnInit {
 						color: this.colors[this.colors.length - i - 1],
 					});
 				}
+
 				if (update) {
 					this.chart.updateSeries([{
 						data: series