diff --git a/app/Http/Controllers/Account/ShowController.php b/app/Http/Controllers/Account/ShowController.php index 52f36a8d32..500c263b24 100644 --- a/app/Http/Controllers/Account/ShowController.php +++ b/app/Http/Controllers/Account/ShowController.php @@ -116,6 +116,12 @@ class ShowController extends Controller $firstTransaction = $this->repository->oldestJournalDate($account) ?? $start; $periods = $this->getAccountPeriodOverview($account, $firstTransaction, $end); + // if layout = v2, overrule the page title. + if('v1'!==config('firefly.layout')) { + $subTitle = (string)trans('firefly.all_journals_for_account', ['name' => $account->name]); + } + + /** @var GroupCollectorInterface $collector */ $collector = app(GroupCollectorInterface::class); $collector diff --git a/frontend/src/components/accounts/Show.vue b/frontend/src/components/accounts/Show.vue index 61045ab72f..66210b7a3e 100644 --- a/frontend/src/components/accounts/Show.vue +++ b/frontend/src/components/accounts/Show.vue @@ -106,6 +106,7 @@ export default { perPage: 51, locale: 'en-US', api: null, + nameLoading:false } }, created() { @@ -117,11 +118,30 @@ export default { let params = new URLSearchParams(window.location.search); this.currentPage = params.get('page') ? parseInt(params.get('page')) : 1; this.getTransactions(); + this.updatePageTitle(); }, components: {TransactionListLarge}, methods: { + updatePageTitle: function () { + if (this.showReady && !this.nameLoading) { + // update page title. + this.nameLoading = true; + configureAxios().then(async (api) => { + let url = './api/v1/accounts/' + this.accountId; + api.get(url) + .then(response => { + let start = new Intl.DateTimeFormat(this.locale, {year: 'numeric', month: 'long', day: 'numeric'}).format(this.start); + let end = new Intl.DateTimeFormat(this.locale, {year: 'numeric', month: 'long', day: 'numeric'}).format(this.end); + document.getElementById('page-subTitle').innerText = this.$t('firefly.journals_in_period_for_account_js', {start: start, end: end, title: response.data.data.attributes.name}); + }); + }); + + } + }, getTransactions: function () { if (this.showReady && !this.loading) { + + this.loading = true; configureAxios().then(async (api) => { // console.log('Now getTransactions() x Start'); @@ -153,9 +173,11 @@ export default { watch: { start: function () { this.getTransactions(); + this.updatePageTitle(); }, end: function () { this.getTransactions(); + this.updatePageTitle(); }, } diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json index edb6e51662..267b35fbce 100644 --- a/frontend/src/locales/en.json +++ b/frontend/src/locales/en.json @@ -70,6 +70,7 @@ "daily_budgets": "Daily budgets", "weekly_budgets": "Weekly budgets", "monthly_budgets": "Monthly budgets", + "journals_in_period_for_account_js": "All transactions for account {title} between {start} and {end}", "quarterly_budgets": "Quarterly budgets", "create_new_expense": "Create new expense account", "create_new_revenue": "Create new revenue account", diff --git a/resources/views/v2/layout/default.twig b/resources/views/v2/layout/default.twig index 21cb1f65da..7ffd5d14ae 100644 --- a/resources/views/v2/layout/default.twig +++ b/resources/views/v2/layout/default.twig @@ -51,7 +51,7 @@ {{ title }} {% if subTitleIcon|default(false) %}{% endif %} - {{ subTitle|default('') }} + {{ subTitle|default('') }}
{% block breadcrumbs %}{% endblock %}