This commit is contained in:
2023-08-04 17:53:15 +03:00
parent cf89dd6a4d
commit 70edf34cf6
17 changed files with 236 additions and 86 deletions
@@ -45,7 +45,7 @@ export class LockedComponent implements OnInit {
if (this.authForm.invalid) {
return;
} else {
this.router.navigate(['/dashboard/dashboard']);
this.router.navigate(['/dashboard/rests']);
}
}
}
@@ -5,50 +5,20 @@
<app-breadcrumb [title]="'MENUITEMS.DASHBOARD.LIST.INCOME'" [items]="['HOME']" [active_item]="'MENUITEMS.DASHBOARD.LIST.INCOME'"></app-breadcrumb>
</div>
<!--
<div class="row">
<div class="col-4 col-sm-4 col-md-4">
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12">
<div class="card">
<div class="card-body">
<div class="d-flex justify-content-between">
<div>
<h5>{{'BALANCE' | translate}}</h5>
</div>
<h3 class="text-danger">{{dashboardModel?.balance | number: '0.2-2'}}</h3>
</div>
<div class="header">
<h2>{{'PERIOD' | translate}}</h2>
</div>
</div>
</div>
<div class="col-4 col-sm-4 col-md-4">
<div class="card">
<div class="card-body">
<div class="d-flex justify-content-between">
<div>
<h5>{{'DEBIT.BALANCE' | translate}}</h5>
<p class="text-muted"></p>
</div>
<h3 class="text-success">{{dashboardModel?.balanceDebit | number: '0.2-2'}}</h3>
</div>
</div>
</div>
</div>
<div class="col-4 col-sm-4 col-md-4">
<div class="card">
<div class="card-body">
<div class="d-flex justify-content-between">
<div>
<h5>{{'CREDIT.BALANCE' | translate}}</h5>
</div>
<h3 class="text-danger">{{dashboardModel?.balanceCredit | number: '0.2-2'}}</h3>
<div class="body">
<div class="example-container">
<app-date-period [from]="dateFrom" [to]="dateTo" (onChange)="onChangePeriod($event)"></app-date-period>
</div>
</div>
</div>
</div>
</div>
-->
<div class="row clearfix">
<!-- Bar chart with line -->
@@ -73,10 +43,19 @@
[dataLabels]="chartOptions.dataLabels!"
[plotOptions]="chartOptions.plotOptions!"
[title]="chartOptions.title!"
[legend]="chartOptions.legend!"
>
[legend]="chartOptions.legend!">
</apx-chart>
</div>
<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.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>
</div>
</div>
</div>
</div>
@@ -16,6 +16,7 @@ import {
ApexPlotOptions,
ApexLegend
} from "ng-apexcharts";
import * as moment from 'moment'
// app
import { ApiRoutes } from '../../api-routes';
@@ -40,6 +41,8 @@ export class DashboardIncomeComponent implements OnInit {
@ViewChild("chart") chart!: ChartComponent;
public chartOptions!: Partial<ChartOptions>;
dashboardModel?: DashboardInOutModel;
public dateFrom: Date = moment(new Date).add(-30, 'days').toDate();
public dateTo: Date = moment(new Date).add(0, 'days').toDate();
colors: string[] = ["#fd7f6f", "#7eb0d5", "#b2e061", "#bd7ebe", "#ffb55a", "#ffee65", "#beb9db", "#fdcce5", "#8bd3c7"];
@@ -51,15 +54,29 @@ export class DashboardIncomeComponent implements OnInit {
}
ngOnInit() {
this.loadData();
}
onChangePeriod(dates: Date[]) {
this.dateFrom = dates[0];
this.dateTo = dates[1];
this.loadData();
}
loadData(update?: boolean, category?: string) {
let params = new HttpParams()
.set('from', '2023-07-01')
.set('to', '2023-08-01');
.set('from', moment(this.dateFrom).format('YYYY-MM-DD'))
.set('to', moment(this.dateTo).format('YYYY-MM-DD'))
.set('category', category || '')
;
this.httpClient
.get<DashboardInOutModel>(ApiRoutes.DashboardIncome, { params: params })
.subscribe(response => {
this.dashboardModel = response;
var series = response.data.map(x => ({
x: x.name + '(' + this._decimalPipe.transform(x.value, '1.2-2') || "" + ')',
x: x.name + '(' + (this._decimalPipe.transform(x.value, '1.2-2') || "") + ')',
y: x.value
}));
var min = Math.min(...response.data.map(x => x.value));
@@ -19,6 +19,7 @@
</div>
</div>
</div>
<div class="row clearfix">
<!-- Bar chart with line -->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12">
@@ -45,9 +46,21 @@
[title]="chartOptions.title!"
[legend]="chartOptions.legend!">
</apx-chart>
<div class="table-responsive m-t-15" *ngIf="dashboardModel!.details">
<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>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
@@ -6,8 +6,6 @@ import { HttpClient } from '@angular/common/http';
import { HttpParams } from '@angular/common/http';
import { DecimalPipe } from '@angular/common';
import { UntypedFormBuilder } from '@angular/forms';
import { UntypedFormGroup } from '@angular/forms';
import { Validators } from '@angular/forms';
// libs
import {
@@ -44,7 +42,6 @@ export class DashboardOutcomeComponent implements OnInit {
@ViewChild("chart") chart!: ChartComponent;
public chartOptions!: Partial<ChartOptions>;
dashboardModel?: DashboardInOutModel;
public form!: UntypedFormGroup;
public dateFrom: Date = moment(new Date).add(-30, 'days').toDate();
public dateTo: Date = moment(new Date).add(0, 'days').toDate();
@@ -58,8 +55,6 @@ export class DashboardOutcomeComponent implements OnInit {
}
ngOnInit() {
this.form = this.fb.group({
});
this.loadData();
}
@@ -126,7 +126,7 @@ export class HeaderComponent extends UnsubscribeOnDestroyAdapter implements OnIn
this.setUser();
this.homePage = 'dashboard/dashboard';
this.homePage = 'dashboard/rests';
this.langStoreValue = localStorage.getItem('lang') as string;
const val = this.listLang.filter((x) => x.lang === this.langStoreValue);
@@ -4,7 +4,7 @@
<div class="navbar-header">
<ul class="nav navbar-nav flex-row">
<li class="nav-item logo">
<a class="navbar-brand" routerLink="dashboard/dashboard">
<a class="navbar-brand" routerLink="dashboard/rests">
<img src="assets/images/logo.png" alt=""/>
<span class="logo-name">ase.com.ua</span>
</a>
@@ -26,10 +26,13 @@ export interface DashboardRestModel {
export interface DashboardInOutModel {
data: DashboardInOutItemModel[];
details: DashboardInOutItemModel[];
}
export interface DashboardInOutItemModel {
id: string;
currency: string;
name: string;
value: number;
valueRaw: number;
}
@@ -44,6 +44,9 @@
<button class="btn-space" (click)="setRate(item)" mat-raised-button color="primary">
Edit
</button>
<button class="btn-space" (click)="delete(item)" mat-raised-button color="warn">
Delete
</button>
</td>
</tr>
</tbody>
@@ -4,6 +4,7 @@ import { HttpClient } from '@angular/common/http';
// libs
import { MatDialog } from '@angular/material/dialog';
import Swal from 'sweetalert2';
// app
import { ApiRoutes } from '../../../api-routes';
@@ -60,6 +61,33 @@ export class SettingsCurrencyComponent {
});
}
delete(currency: CurrencyModel) {
Swal.fire({
title: 'Delete currency ' + currency.name,
showCancelButton: true,
confirmButtonText: 'Delete',
showLoaderOnConfirm: true,
preConfirm: (name) => {
return new Promise((resolve, reject) => {
this.httpClient.delete(ApiRoutes.SettingsCurrency.replace(':id', currency.id!))
.subscribe(data => {
resolve(data);
}, error => {
Swal.showValidationMessage(error.detail);
reject();
});
}).catch(x => {
return false;
});
},
allowOutsideClick: () => !Swal.isLoading(),
}).then((result) => {
this.load();
});
}
private load() {
this.httpClient
.get<CurrencyModel[]>(ApiRoutes.GeneralCurrencies)
@@ -73,21 +101,23 @@ export class SettingsCurrencyComponent {
this.httpClient
.get<CurrencyModel[]>(ApiRoutes.SettingsCurrencies)
.subscribe(data => {
this.myCurrencies = data.map(myCurrency => {
var globalCurrency = this.currencies?.find(x => x.id === myCurrency.code);
this.myCurrencies = data
.sort((a, b) => a.code!.localeCompare(b.code!))
.map(myCurrency => {
var globalCurrency = this.currencies?.find(x => x.id === myCurrency.code);
return {
id: myCurrency.id,
code: myCurrency.code,
name: myCurrency.name,
quantity: myCurrency.quantity,
rate: myCurrency.rate,
rateDate: myCurrency.rateDate,
shortName: myCurrency.shortName,
symbol: globalCurrency?.symbol,
isPrimary: myCurrency.isPrimary,
};
});
return {
id: myCurrency.id,
code: myCurrency.code,
name: myCurrency.name,
quantity: myCurrency.quantity,
rate: myCurrency.rate,
rateDate: myCurrency.rateDate,
shortName: myCurrency.shortName,
symbol: globalCurrency?.symbol,
isPrimary: myCurrency.isPrimary,
};
});
});
}
}