RunasSudo/DrCr
1
Fork 0
Code Issues 1 Pull Requests Releases Activity

Add print/save to PDF menu to dynamic reports

Browse Source
This commit is contained in:
RunasSudo 2025-06-12 23:14:05 +10:00
parent a13098a4a7
commit c7116c71d1
Signed by: RunasSudo
GPG Key ID: 7234E476BF21C61A
5 changed files with 74 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/components/DynamicReportMenu.vue Normal file
View File

@ -0,0 +1,41 @@
<!--
DrCr: Double-entry bookkeeping framework
Copyright (C) 2022-2025 Lee Yingtong Li (RunasSudo)
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/>.
-->
<template>
<div class="relative print:hidden">
<button class="text-gray-400 align-middle hover:text-gray-500" @click="isMenuOpen = !isMenuOpen"><EllipsisHorizontalCircleIcon class="size-6" /></button>
<ul class="absolute top-8 right-0 bg-white w-[11rem] shadow-lg ring-1 ring-black/5 focus:outline-hidden" :class="isMenuOpen ? 'block' : 'hidden'">
<li class="group cursor-pointer select-none py-1 px-3 text-gray-900 hover:text-white hover:bg-emerald-600" @click="menuPrint">
<PrinterIcon class="inline size-5 text-gray-500 group-hover:text-white" />
Print/Save as PDF
</li>
</ul>
</div>
</template>
<script setup type="ts">
import { EllipsisHorizontalCircleIcon, PrinterIcon } from '@heroicons/vue/24/outline';
import { ref } from 'vue';
const isMenuOpen = ref(false);
function menuPrint() {
window.print();
isMenuOpen.value = false;
}
</script>

11
src/plugins/austax/TaxSummaryReport.vue
View File

@ -1,5 +1,5 @@
<!--
DrCr: Web-based double-entry bookkeeping framework
DrCr: Double-entry bookkeeping framework
Copyright (C) 2022-2025 Lee Yingtong Li (RunasSudo)
This program is free software: you can redistribute it and/or modify
@ -17,7 +17,13 @@
-->
<template>
<DynamicReportComponent :report="report" />
<DynamicReportComponent :report="report">
<div class="relative">
<div class="absolute -top-10 right-0">
<DynamicReportMenu />
</div>
</div>
</DynamicReportComponent>
</template>
<script setup lang="ts">
@ -25,6 +31,7 @@
import { ref } from 'vue';
import DynamicReportComponent from '../../components/DynamicReportComponent.vue';
import DynamicReportMenu from '../../components/DynamicReportMenu.vue';
import { DynamicReport } from '../../reports/base.ts';
const report = ref(null as DynamicReport | null);

4
src/reports/BalanceSheetReport.vue
View File

@ -1,5 +1,5 @@
<!--
DrCr: Web-based double-entry bookkeeping framework
DrCr: Double-entry bookkeeping framework
Copyright (C) 2022-2025 Lee Yingtong Li (RunasSudo)
This program is free software: you can redistribute it and/or modify
@ -32,6 +32,7 @@
</select>
</div>
</div>
<DynamicReportMenu />
</div>
</div>
<div class="rounded-md bg-red-50 mt-4 p-4 col-span-2" v-if="!doesBalance">
@ -57,6 +58,7 @@
import { DynamicReport, Row, reportEntryById } from './base.ts';
import { db } from '../db.ts';
import DynamicReportComponent from '../components/DynamicReportComponent.vue';
import DynamicReportMenu from '../components/DynamicReportMenu.vue';
const report = ref(null as DynamicReport | null);
const reportColumns = ref([] as string[]);

8
src/reports/IncomeStatementReport.vue
View File

@ -1,5 +1,5 @@
<!--
DrCr: Web-based double-entry bookkeeping framework
DrCr: Double-entry bookkeeping framework
Copyright (C) 2022-2025 Lee Yingtong Li (RunasSudo)
This program is free software: you can redistribute it and/or modify
@ -18,8 +18,7 @@
<template>
<DynamicReportComponent :report="report" :columns="reportColumns">
<div class="my-2 py-2 flex">
<div class="grow flex gap-x-2 items-baseline">
<div class="my-2 py-2 flex gap-x-2 items-baseline">
<input type="date" class="bordered-field" v-model.lazy="dtStart">
<span>to</span>
<input type="date" class="bordered-field" v-model.lazy="dt">
@ -33,7 +32,7 @@
</select>
</div>
</div>
</div>
<DynamicReportMenu />
</div>
</DynamicReportComponent>
</template>
@ -46,6 +45,7 @@
import { DynamicReport } from './base.ts';
import { db } from '../db.ts';
import DynamicReportComponent from '../components/DynamicReportComponent.vue';
import DynamicReportMenu from '../components/DynamicReportMenu.vue';
const report = ref(null as DynamicReport | null);
const reportColumns = ref([] as string[]);

8
src/reports/TrialBalanceReport.vue
View File

@ -1,5 +1,5 @@
<!--
DrCr: Web-based double-entry bookkeeping framework
DrCr: Double-entry bookkeeping framework
Copyright (C) 2022-2025 Lee Yingtong Li (RunasSudo)
This program is free software: you can redistribute it and/or modify
@ -18,11 +18,10 @@
<template>
<DynamicReportComponent :report="report">
<div class="my-2 py-2 flex">
<div class="grow flex gap-x-2 items-baseline">
<div class="my-2 py-2 flex gap-x-2 items-baseline">
<span class="whitespace-nowrap">As at</span>
<input type="date" class="bordered-field" v-model.lazy="dt">
</div>
<DynamicReportMenu />
</div>
</DynamicReportComponent>
</template>
@ -35,6 +34,7 @@
import { DynamicReport } from './base.ts';
import { db } from '../db.ts';
import DynamicReportComponent from '../components/DynamicReportComponent.vue';
import DynamicReportMenu from '../components/DynamicReportMenu.vue';
const report = ref(null as DynamicReport | null);