Improved subscription overview

This commit is contained in:
James Cole
2025-07-30 18:57:32 +02:00
parent 01181ceea9
commit 671ff95f22
4 changed files with 24 additions and 20 deletions

View File

@@ -163,8 +163,8 @@ function downloadSubscriptions(params) {
currency_code: bill.currency_code, currency_code: bill.currency_code,
paid: 0, paid: 0,
unpaid: 0, unpaid: 0,
native_currency_code: bill.native_currency_code, // native_currency_code: bill.native_currency_code,
native_paid: 0, // native_paid: 0,
//native_unpaid: 0, //native_unpaid: 0,
}; };
} }
@@ -218,6 +218,9 @@ export default () => ({
loading: false, loading: false,
convertToNative: false, convertToNative: false,
subscriptions: [], subscriptions: [],
formatMoney(amount, currencyCode) {
return formatMoney(amount, currencyCode);
},
startSubscriptions() { startSubscriptions() {
this.loading = true; this.loading = true;
let start = new Date(window.store.get('start')); let start = new Date(window.store.get('start'));
@@ -256,6 +259,7 @@ export default () => ({
//console.log(group); //console.log(group);
} }
} }
console.log('Subscriptions: ', this.subscriptions);
// then assign to this.subscriptions. // then assign to this.subscriptions.
this.loading = false; this.loading = false;

View File

@@ -1864,6 +1864,7 @@ return [
'remove_budgeted_amount' => 'Remove budgeted amount in :currency', 'remove_budgeted_amount' => 'Remove budgeted amount in :currency',
// bills: // bills:
'left_to_pay_lc' => 'left to pay',
'skip_help_text' => 'Use the skip field to create bi-monthly (skip = 1) or other custom intervals.', 'skip_help_text' => 'Use the skip field to create bi-monthly (skip = 1) or other custom intervals.',
'subscription' => 'Subscription', 'subscription' => 'Subscription',
'not_expected_period' => 'Not expected this period', 'not_expected_period' => 'Not expected this period',

View File

@@ -3,10 +3,8 @@
<template x-for="group in piggies"> <template x-for="group in piggies">
<div class="card mb-2"> <div class="card mb-2">
<div class="card-header"> <div class="card-header">
<h3 class="card-title"><a href="{{ route('piggy-banks.index') }}" <h3 class="card-title"><a href="{{ route('piggy-banks.index') }}" title="{{ __('firefly.go_to_piggies') }}">{{ __('firefly.piggy_banks') }}
title="{{ __('firefly.go_to_piggies') }}">{{ __('firefly.piggy_banks') }} (<span x-text="group.title"></span>)</a></h3>
(<span
x-text="group.title"></span>)</a></h3>
</div> </div>
<ul class="list-group list-group-flush"> <ul class="list-group list-group-flush">
<template x-for="piggy in group.piggies"> <template x-for="piggy in group.piggies">

View File

@@ -9,18 +9,21 @@
</h3> </h3>
</div> </div>
<div class="card-body"> <div class="card-body">
<template x-for="pi in group.payment_info">
<div class="row mb-2"> <div class="row mb-2">
<!-- <div class="col">
<template x-for="pie in group.payment_info"> <div class="progress" role="progressbar" aria-label="Example with label"
<div :class='group.col_size'> :aria-valuenow="(pi.paid*-1/pi.unpaid)*100" aria-valuemin="0" aria-valuemax="100">
<canvas :id='"pie_" + group.id + "_" + pie.currency_code' <div class="progress-bar progress-bar-striped" :style="'width: ' + (pi.paid*-1/pi.unpaid)*100 + '%'">
:width="group.width" <span x-text="formatMoney(pi.paid*-1,pi.currency_code)"></span>
x-init="drawPieChart(group.id, group.title, pie)"></canvas> </div>
</div> </div>
</template> <p>
--> <small>~ <span x-text="formatMoney(pi.unpaid, pi.currency_code)"></span> {{ __('firefly.left_to_pay_lc') }}</small>
Here was chart. </p>
</div>
</div> </div>
</template>
<div class="row mb-2"> <div class="row mb-2">
<table class="table table-striped table-hover"> <table class="table table-striped table-hover">
<thead> <thead>
@@ -33,9 +36,7 @@
<template x-for="bill in group.bills"> <template x-for="bill in group.bills">
<tr> <tr>
<td> <td>
<a :href="'{{ route('subscriptions.show',['']) }}/' + bill.id" :title="bill.name"> <a :href="'{{ route('subscriptions.show',['']) }}/' + bill.id" :title="bill.name"><span x-text="bill.name"></span></a>
<span x-text="bill.name"></span>
</a>
<template x-if="bill.paid"> <template x-if="bill.paid">
<small class="text-muted"><br>{{ __('firefly.paid') }}</small> <small class="text-muted"><br>{{ __('firefly.paid') }}</small>
</template> </template>
@@ -60,8 +61,8 @@
<ul class="list-unstyled"> <ul class="list-unstyled">
<template x-for="transaction in bill.transactions"> <template x-for="transaction in bill.transactions">
<li> <li>
<span x-text="transaction.amount"></span> <span :title="transaction.amount" x-text="transaction.amount"></span>
(<span x-text="transaction.percentage"></span>%) (<span title="Less or more than expected." x-text="transaction.percentage"></span>%)
</li> </li>
</template> </template>
</ul> </ul>