Cutlery/invoiceninja
1
0
Fork 0
mirror of https://github.com/invoiceninja/invoiceninja.git synced 2025-07-09 03:14:30 -04:00
Code Issues Packages Projects Releases Wiki Activity

Script to handle statments in the client portal

Browse Source
This commit is contained in:
Benjamin Beganović 2021-09-21 14:05:47 +02:00
parent 9c0559a334
commit 76804fc37b
1 changed files with 68 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
resources/views/portal/ninja2020/statement/index.blade.php
View File

@ -12,22 +12,22 @@
<div class="flex">
<label for="from" class="block w-full flex items-center mr-4">
<span class="mr-2">{{ ctrans('texts.from') }}:</span>
<input type="date" class="input w-full">
<input id="date-from" type="date" class="input w-full" data-field="startDate" value="{{ now()->startOfYear()->format('Y-m-d') }}">
</label>
<label for="to" class="block w-full flex items-center mr-4">
<span class="mr-2">{{ ctrans('texts.to') }}:</span>
<input type="date" class="input w-full">
<input id="date-to" type="date" class="input w-full" data-field="endDate" value="{{ now()->format('Y-m-d') }}">
</label>
</div> <!-- End date range -->
<label for="show_payments" class="block flex items-center mr-4 mt-4 md:mt-0">
<input type="checkbox" class="form-checkbox" autocomplete="off">
<input id="show-payments-table" type="checkbox" data-field="showPaymentsTable" class="form-checkbox" autocomplete="off">
<span class="ml-2">{{ ctrans('texts.show_payments') }}</span>
</label> <!-- End show payments checkbox -->
<label for="show_aging" class="block flex items-center">
<input type="checkbox" class="form-checkbox" autocomplete="off">
<input id="show-aging-table" type="checkbox" data-field="showAgingTable" class="form-checkbox" autocomplete="off">
<span class="ml-2">{{ ctrans('texts.show_aging') }}</span>
</label> <!-- End show aging checkbox -->
</div>
@ -39,12 +39,70 @@
@push('footer')
<script>
document.addEventListener('DOMContentLoaded', () => {
// document
// .querySelector('meta[name=pdf-url]')
// .content = 'https://google.com';
class Statement {
constructor() {
this.url = new URL(document.querySelector('meta[name=pdf-url]').content);
this.startDate = '';
this.endDate = '';
this.showPaymentsTable = false;
this.showAgingTable = false;
}
// document.querySelector('meta[name=pdf-url]').dispatchEvent(new Event('change'));
bindEventListeners() {
['#date-from', '#date-to', '#show-payments-table', '#show-aging-table'].forEach(selector => {
document
.querySelector(selector)
.addEventListener('change', (event) => this.handleValueChange(event));
});
}
handleValueChange(event) {
if (event.target.type === 'checkbox') {
console.log(1);
this[event.target.dataset.field] = event.target.checked;
} else {
this[event.target.dataset.field] = event.target.value;
}
this.updatePdf();
}
get composedUrl() {
this.url.search = '';
if (this.startDate.length > 0) {
this.url.searchParams.append('start_date', this.startDate);
}
if (this.endDate.length > 0) {
this.url.searchParams.append('end_date', this.endDate);
}
this.url.searchParams.append('show_payments_table', +this.showPaymentsTable);
this.url.searchParams.append('show_aging_table', +this.showAgingTable);
return this.url.href;
}
updatePdf() {
document
.querySelector('meta[name=pdf-url]')
.content = this.composedUrl;
let iframe = document.querySelector('#pdf-iframe');
if (iframe) {
iframe.src = this.composedUrl;
}
document.querySelector('meta[name=pdf-url]').dispatchEvent(new Event('change'));
}
handle() {
this.bindEventListeners();
}
}
new Statement().handle();
</script>
@endpush