kenmirrors/firefly-iii
1
0
Fork 0
mirror of https://github.com/firefly-iii/firefly-iii.git synced 2025-10-12 23:45:10 +00:00
Code Issues Projects Releases Wiki Activity

Expand views

Browse Source
This commit is contained in:
James Cole
2023-08-11 06:03:31 +02:00
parent f010ffefc1
commit 27d07d5807
9 changed files with 175 additions and 767 deletions
Download Patch File Download Diff File Expand all files Collapse all files

716
public/build/assets/dashboard-3896887c.js
View File

File diff suppressed because one or more lines are too long

40
public/build/assets/dashboard-9172f6d4.js Normal file
View File

File diff suppressed because one or more lines are too long

2
public/build/manifest.json
View File

@@ -24,7 +24,7 @@
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.woff2" "src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.woff2"
}, },
"resources/assets/v2/dashboard.js": { "resources/assets/v2/dashboard.js": {
"file": "assets/dashboard-3896887c.js", "file": "assets/dashboard-9172f6d4.js",
"isEntry": true, "isEntry": true,
"src": "resources/assets/v2/dashboard.js" "src": "resources/assets/v2/dashboard.js"
}, },

49
resources/assets/v2/api/v2/model/account/get.js Normal file
View File

@@ -0,0 +1,49 @@
/*
* list.js
* Copyright (c) 2022 james@firefly-iii.org
*
* This file is part of Firefly III (https://github.com/firefly-iii).
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import {api} from "../../../../boot/axios";
import format from "date-fns/format";
export default class Get {
/**
*
* @param identifier
* @param date
* @returns {Promise<AxiosResponse<any>>}
*/
get(identifier, date) {
let params = {date: format(date, 'y-MM-d').slice(0, 10)};
if (!date) {
return api.get('/api/v2/accounts/' + identifier);
}
return api.get('/api/v2/accounts/' + identifier, {params: params});
}
/**
*
* @param identifier
* @param page
* @returns {Promise<AxiosResponse<any>>}
*/
transactions(identifier, page) {
return api.get('/api/v2/accounts/' + identifier + '/transactions', {params: {page: page}});
}
}

60
resources/assets/v2/pages/dashboard/accounts.js
View File

@@ -23,16 +23,15 @@ import {getVariable} from "../../store/get-variable.js";
import {setVariable} from "../../store/set-variable.js"; import {setVariable} from "../../store/set-variable.js";
import Dashboard from "../../api/v2/chart/account/dashboard.js"; import Dashboard from "../../api/v2/chart/account/dashboard.js";
import formatMoney from "../../util/format-money.js"; import formatMoney from "../../util/format-money.js";
import Get from "../../api/v1/accounts/get.js"; import Get from "../../api/v2/model/account/get.js";
//import Chart from "chart.js/auto"; //import Chart from "chart.js/auto";
import {Chart, LineController, LineElement, PointElement, CategoryScale, LinearScale} from "chart.js"; import {Chart} from "chart.js";
// this is very ugly, but I have no better ideas at the moment to save the currency info // this is very ugly, but I have no better ideas at the moment to save the currency info
// for each series. // for each series.
let currencies = []; let currencies = [];
let chart = null; let chart = null;
let chartData = null; let chartData = null;
export default () => ({ export default () => ({
loading: false, loading: false,
loadingAccounts: false, loadingAccounts: false,
@@ -51,7 +50,7 @@ export default () => ({
}); });
}, },
generateOptions(data) { generateOptions(data) {
currencies = []; currencies = [];
let options = { let options = {
type: 'line', type: 'line',
data: { data: {
@@ -62,8 +61,8 @@ export default () => ({
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
if (data.hasOwnProperty(i)) { if (data.hasOwnProperty(i)) {
let current = data[i]; let current = data[i];
let dataset = {}; let dataset = {};
let collection = []; let collection = [];
// if index = 0, push all keys as labels: // if index = 0, push all keys as labels:
@@ -116,14 +115,22 @@ export default () => ({
chart = new Chart(document.querySelector("#account-chart"), options); chart = new Chart(document.querySelector("#account-chart"), options);
}, },
loadAccounts() { loadAccounts() {
console.log('loadAccounts');
if (true === this.loadingAccounts) { if (true === this.loadingAccounts) {
console.log('loadAccounts CANCELLED');
return; return;
} }
this.loadingAccounts = true; this.loadingAccounts = true;
const max = 10; if (this.accountList.length > 0) {
console.log('NO need to load account data');
this.loadingAccounts = false;
return;
}
console.log('loadAccounts continue!');
const max = 10;
let totalAccounts = 0; let totalAccounts = 0;
let count = 0; let count = 0;
let accounts = []; let accounts = [];
Promise.all([getVariable('frontpageAccounts'),]).then((values) => { Promise.all([getVariable('frontpageAccounts'),]).then((values) => {
totalAccounts = values[0].length; totalAccounts = values[0].length;
for (let i in values[0]) { for (let i in values[0]) {
@@ -142,27 +149,31 @@ export default () => ({
break; break;
} }
let current = response.data.data[ii]; let current = response.data.data[ii];
let group = { let group = {
title: null === current.attributes.group_title ? '' : current.attributes.group_title, title: null === current.attributes.group_title ? '' : current.attributes.group_title,
id: current.id, id: current.id,
transactions: [], transactions: [],
}; };
for (let iii = 0; iii < current.attributes.transactions.length; iii++) { for (let iii = 0; iii < current.attributes.transactions.length; iii++) {
let currentTransaction = current.attributes.transactions[iii]; let currentTransaction = current.attributes.transactions[iii];
//console.log(currentTransaction);
group.transactions.push({ group.transactions.push({
description: currentTransaction.description, description: currentTransaction.description,
id: current.id, id: current.id,
amount: formatMoney(currentTransaction.amount, currentTransaction.currency_code), amount: formatMoney(currentTransaction.amount, currentTransaction.currency_code),
}); native_amount: formatMoney(currentTransaction.native_amount, currentTransaction.native_code),
});
} }
groups.push(group); groups.push(group);
} }
console.log(parent);
accounts.push({ accounts.push({
name: parent.attributes.name, name: parent.attributes.name,
id: parent.id, id: parent.id,
balance: formatMoney(parent.attributes.current_balance, parent.attributes.currency_code), balance: formatMoney(parent.attributes.current_balance, parent.attributes.currency_code),
groups: groups, native_balance: formatMoney(parent.attributes.native_current_balance, parent.attributes.native_code),
}); groups: groups,
});
count++; count++;
if (count === totalAccounts) { if (count === totalAccounts) {
this.accountList = accounts; this.accountList = accounts;
@@ -183,10 +194,15 @@ export default () => ({
this.loadAccounts(); this.loadAccounts();
}); });
window.store.observe('end', () => { window.store.observe('end', () => {
chartData = null; chartData = null;
this.accountList = [];
// main dashboard chart: // main dashboard chart:
this.loadChart(); this.loadChart();
this.loadAccounts(); this.loadAccounts();
}); });
window.store.observe('autoConversion', () => {
this.loadChart();
this.loadAccounts();
});
}, },
}); });

4
resources/assets/v2/pages/dashboard/piggies.js
View File

@@ -38,7 +38,7 @@ export default () => ({
this.downloadPiggyBanks(params); this.downloadPiggyBanks(params);
}, },
downloadPiggyBanks(params) { downloadPiggyBanks(params) {
console.log('Downloading page ' + params.page + '...'); // console.log('Downloading page ' + params.page + '...');
const getter = new Get(); const getter = new Get();
getter.get(params).then((response) => { getter.get(params).then((response) => {
apiData = [...apiData, ...response.data.data]; apiData = [...apiData, ...response.data.data];
@@ -89,7 +89,7 @@ export default () => ({
} }
} }
this.piggies = Object.values(dataSet); this.piggies = Object.values(dataSet);
console.log(this.piggies); // console.log(this.piggies);
}, },
loadPiggyBanks() { loadPiggyBanks() {

6
resources/assets/v2/pages/dashboard/subscriptions.js
View File

@@ -70,8 +70,8 @@ export default () => ({
}); });
}, },
generateOptions(data) { generateOptions(data) {
let options = getDefaultChartSettings('pie'); let options = getDefaultChartSettings('pie');
console.log(data); // console.log(data);
options.data.labels = ['TODO paid', 'TODO unpaid']; options.data.labels = ['TODO paid', 'TODO unpaid'];
options.data.datasets = []; options.data.datasets = [];
let collection = {}; let collection = {};
@@ -102,7 +102,7 @@ export default () => ({
unpaid: 0, unpaid: 0,
}; };
} }
console.log(current); // console.log(current);
// in case of paid, add to "paid": // in case of paid, add to "paid":
collection[currencyCode].unpaid += parseFloat(amount); collection[currencyCode].unpaid += parseFloat(amount);
} }

51
resources/views/v2/index.blade.php
View File

@@ -85,14 +85,17 @@
<a :href="'{{ route('accounts.show','') }}/' + account.id" <a :href="'{{ route('accounts.show','') }}/' + account.id"
x-text="account.name"></a> x-text="account.name"></a>
<span class="small text-muted">(<span <span class="small text-muted">(<template x-if="autoConversion">
x-text="account.balance"></span>)</span> <span x-text="account.native_balance"></span><br>
</template>
<template x-if="!autoConversion">
<span x-text="account.balance"></span><br>
</template>)</span>
</h3> </h3>
</div> </div>
<div class="card-body p-0"> <div class="card-body p-0">
<p class="text-center small" x-show="account.groups.length < 1"> <p class="text-center small" x-show="account.groups.length < 1">
TODO No transactions {{ __('firefly.no_transactions_period') }}
</p> </p>
<table class="table table-sm" x-show="account.groups.length > 0"> <table class="table table-sm" x-show="account.groups.length > 0">
<tbody> <tbody>
@@ -127,7 +130,12 @@
</template> </template>
<template x-for="transaction in group.transactions"> <template x-for="transaction in group.transactions">
<span> <span>
<span x-text="transaction.amount"></span><br> <template x-if="autoConversion">
<span x-text="transaction.native_amount"></span><br>
</template>
<template x-if="!autoConversion">
<span x-text="transaction.amount"></span><br>
</template>
</span> </span>
</template> </template>
</td> </td>
@@ -168,15 +176,30 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col"> <div class="col" x-data="piggies">
<div class="card">
<div class="card-header">
<h3 class="card-title"><a href="#" title="Something">Spaarpotjes</a></h3>
</div>
<div class="card-body">
<template x-for="group in piggies">
<div class="card mb-2">
<div class="card-header">
<h3 class="card-title"><a href="#" title="Something">Spaarpotjes (<span
x-text="group.title"></span>)</a></h3>
</div>
<ul class="list-group list-group-flush">
<template x-for="piggy in group.piggies">
<li class="list-group-item">
<strong x-text="piggy.name"></strong>
<div class="progress" role="progressbar" aria-label="Info example"
:aria-valuenow="piggy.percentage" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar bg-info text-dark"
:style="'width: ' + piggy.percentage +'%'">
<span x-text="piggy.percentage + '%'"></span>
</div>
</div>
</li>
</template>
</ul>
</div> </div>
</div> </template>
</div> </div>
<div class="col"> <div class="col">
<div class="card"> <div class="card">
@@ -184,7 +207,9 @@
<h3 class="card-title"><a href="#" title="Something">recurring? rules? tags?</a></h3> <h3 class="card-title"><a href="#" title="Something">recurring? rules? tags?</a></h3>
</div> </div>
<div class="card-body"> <div class="card-body">
<p>
TODO
</p>
</div> </div>
</div> </div>
</div> </div>

14
resources/views/v2/partials/layout/topbar.blade.php
View File

@@ -3,20 +3,14 @@
<i class="fa-solid fa-gears"></i> <i class="fa-solid fa-gears"></i>
</a> </a>
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end"> <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
<div class="dropdown-divider"></div>
<a href="{{ route('admin.index') }}" class="dropdown-item"> <a href="{{ route('admin.index') }}" class="dropdown-item">
<em class="fa-regular fa-user me-2"></em> <em class="fa-regular fa-user me-2 fa-fw"></em>
TODO {{ __('firefly.admin') }} {{ __('firefly.system_settings') }}
</a> </a>
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
<a href="{{ route('currencies.index') }}" class="dropdown-item"> <a href="{{ route('currencies.index') }}" class="dropdown-item">
<em class="fa-solid fa-user-gear me-2"></em> <em class="fa-solid fa-euro-sign me-2 fa-fw"></em>
TODO {{ __('firefly.currencies') }} {{ __('firefly.currencies') }}
</a>
<div class="dropdown-divider"></div>
<a href="#" class="dropdown-item">
<em class="fa-solid fa-money-bill-transfer me-2"></em>
TODO {{ __('firefly.administrations_index_menu') }}
</a> </a>
</div> </div>
</li> </li>