Build overview and handling for unpaid incoming.
This commit is contained in:
@@ -29,8 +29,8 @@
|
||||
<select name="report" id="report" x-model="data.report" class="border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600 rounded-md shadow-sm w-1/4">
|
||||
<option value="invoice">{{ __('excel.Outgoing invoices') }}</option>
|
||||
<option value="payment">{{ __('excel.Incoming payments') }}</option>
|
||||
<option value="incoming">{{ __('excel.Incoming by issue date') }}</option>
|
||||
<option value="outgoing">{{ __('excel.Outgoing by pay date') }}</option>
|
||||
<option value="incoming">{{ __('excel.Incoming invoices') }}</option>
|
||||
<option value="outgoing">{{ __('excel.Outgoing payments') }}</option>
|
||||
</select>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
77
resources/views/incoming/create-payment.blade.php
Normal file
77
resources/views/incoming/create-payment.blade.php
Normal file
@@ -0,0 +1,77 @@
|
||||
<x-app-layout>
|
||||
<x-slot name="header">
|
||||
<h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
|
||||
{{ __('incoming.Create new payment') }}
|
||||
</h2>
|
||||
</x-slot>
|
||||
|
||||
<div class="py-12" x-data="paymentForm()">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 space-y-6">
|
||||
|
||||
<!-- Invoice data -->
|
||||
<div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
|
||||
<div class="max-w">
|
||||
<section>
|
||||
<header>
|
||||
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ __('incoming.Select invoice') }}
|
||||
</h2>
|
||||
<p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
|
||||
{{ __('incoming.Select your invoice for payment') }}
|
||||
</p>
|
||||
</header>
|
||||
|
||||
<div class="mt-8" x-show="invoices.length == 0">
|
||||
{{ __('invoice.No invoices') }}
|
||||
</div>
|
||||
|
||||
<summary class="cursor-pointer flex flex-row w-full mt-4">
|
||||
<div class="w-1/3 font-bold border-b-2">{{ __('invoice.Invoice Number') }}</div>
|
||||
<div class="w-1/3 font-bold border-b-2">{{ __('supplier.Supplier') }}</div>
|
||||
<div class="w-1/6 font-bold border-b-2 text-right">{{ __('invoice.Sum') }}</div>
|
||||
<div class="w-1/6 font-bold border-b-2 text-right">{{ __('common.Created at') }}</div>
|
||||
</summary>
|
||||
|
||||
<template x-for="(invoice, index) in invoices" x-bind="invoices">
|
||||
<a class="cursor-pointer flex flex-row even:bg-gray-100 odd:bg-white hover:bg-gray-400"
|
||||
:href="'/incoming/' + invoice.id + '/edit'">
|
||||
<div class="w-1/3" x-text="invoice.invoice_number"></div>
|
||||
<div class="w-1/3" x-text="invoice.supplier.name"></div>
|
||||
<div class="w-1/6 text-right" x-text="invoice.gross + ' €'"></div>
|
||||
<div class="w-1/6 text-right" x-text="invoice.issue_date"></div>
|
||||
</a>
|
||||
</template>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</x-app-layout>
|
||||
|
||||
<script>
|
||||
function paymentForm() {
|
||||
return {
|
||||
invoices: [],
|
||||
|
||||
error: false,
|
||||
message: '',
|
||||
|
||||
init() {
|
||||
let vm = this;
|
||||
axios.get('/incoming_open')
|
||||
.then(function (response) {
|
||||
vm.invoices = response.data;
|
||||
})
|
||||
.catch(function (error) {
|
||||
vm.error = true;
|
||||
vm.message = error.response.data.message;
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
133
resources/views/incoming/payment.blade.php
Normal file
133
resources/views/incoming/payment.blade.php
Normal file
@@ -0,0 +1,133 @@
|
||||
<x-app-layout>
|
||||
<x-slot name="header">
|
||||
<div class="flex flex-row w-full items-center">
|
||||
<h2 class="grow font-semibold pr-12 text-xl text-gray-800 dark:text-gray-200 leading-tight">
|
||||
{{ __('incoming.Incoming') }}
|
||||
</h2>
|
||||
<a href="{{ route('excel') }}">
|
||||
<x-excel-icon class="text-gray-800 cursor-pointer right-0"/>
|
||||
</a>
|
||||
</div>
|
||||
</x-slot>
|
||||
|
||||
<div class="py-12">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 space-y-6">
|
||||
|
||||
<div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
|
||||
<div class="max-w-xl">
|
||||
<section>
|
||||
<header>
|
||||
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ __('incoming.Add new payment') }}
|
||||
</h2>
|
||||
<p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
|
||||
{{ __("incoming.Add new payment by clicking add") }}
|
||||
</p>
|
||||
</header>
|
||||
<a class="mt-6 inline-block" href="{{ route('incoming.create-payment') }}"><x-primary-button>{{ __('form.Add') }}</x-primary-button></a>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
|
||||
<div class="max-w" x-data="incomingForm">
|
||||
<section>
|
||||
<header>
|
||||
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ __('incoming.Existing invoices') }}
|
||||
</h2>
|
||||
<div class="flex flex-row space-x-4 items-center mt-4">
|
||||
<x-input-label for="from" :value="__('invoice.From')"/>
|
||||
<x-text-input type="date" id="from" name="from" x-model="from" x-on:change="fetchInvoices()"/>
|
||||
<x-input-label for="end" :value="__('invoice.End')"/>
|
||||
<x-text-input type="date" id="end" name="end" x-model="end" x-on:change="fetchInvoices()"/>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<summary class="cursor-pointer flex flex-row w-full mt-4">
|
||||
<div class="w-1/3 font-bold border-b-2">{{ __('invoice.Invoice Number') }}</div>
|
||||
<div class="w-1/3 font-bold border-b-2">{{ __('supplier.Supplier') }}</div>
|
||||
<div class="w-1/6 font-bold border-b-2 text-right">{{ __('invoice.Sum') }}</div>
|
||||
<div class="w-1/12 font-bold border-b-2 text-right">{{ __('common.Created at') }}</div>
|
||||
<div class="w-1/12 font-bold border-b-2 text-right">{{ __('common.Paid at') }}</div>
|
||||
</summary>
|
||||
|
||||
<template x-for="invoice in invoices">
|
||||
<details class="even:bg-gray-100 odd:bg-white hover:bg-gray-400">
|
||||
<summary class="cursor-pointer flex flex-row w-full" @click="window.location.href='/incoming/' + invoice.id + '/edit';">
|
||||
<div class="w-1/3" x-text="invoice.invoice_number"></div>
|
||||
<div class="w-1/3" x-text="invoice.supplier.name"></div>
|
||||
<div class="w-1/6 text-right" x-text="invoice.gross + ' €'"></div>
|
||||
<div class="w-1/12 text-right" x-text="invoice.created"></div>
|
||||
<div class="w-1/12 text-right" x-text="invoice.paid"></div>
|
||||
</summary>
|
||||
</details>
|
||||
</template>
|
||||
|
||||
<div class="w-full border-t-2"></div>
|
||||
|
||||
<div class="flex flex-row">
|
||||
<div class="w-1/2">{{ __('invoice.Net') }}</div>
|
||||
<div class="w-1/3 text-right" x-text="net + ' €'"></div>
|
||||
</div>
|
||||
<div class="flex flex-row">
|
||||
<div class="w-1/2">{{ __('invoice.Tax') }}</div>
|
||||
<div class="w-1/3 text-right" x-text="tax + ' €'"></div>
|
||||
</div>
|
||||
<div class="flex flex-row">
|
||||
<div class="w-1/2 font-bold">{{ __('invoice.Sum') }}</div>
|
||||
<div class="w-1/3 font-bold text-right" x-text="gross + ' €'"></div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</x-app-layout>
|
||||
|
||||
<script>
|
||||
function incomingForm() {
|
||||
return {
|
||||
net: 0,
|
||||
gross: 0,
|
||||
tax: 0,
|
||||
from: "{{ $first }}",
|
||||
end: "{{ $last }}",
|
||||
invoices: [],
|
||||
|
||||
init() {
|
||||
this.fetchInvoices();
|
||||
},
|
||||
|
||||
fetchInvoices() {
|
||||
let vm = this;
|
||||
axios.get('/incoming-payment/' + this.from + '/' + this.end)
|
||||
.then(function (response) {
|
||||
vm.invoices = response.data;
|
||||
vm.calculateSum();
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
})
|
||||
},
|
||||
|
||||
calculateSum() {
|
||||
this.net = 0;
|
||||
this.gross = 0;
|
||||
this.tax = 0;
|
||||
for (const [key, invoice] of Object.entries(this.invoices)) {
|
||||
this.net += parseFloat(invoice.net);
|
||||
this.gross += parseFloat(invoice.gross);
|
||||
this.tax += parseFloat(invoice.tax)
|
||||
}
|
||||
this.net = this.net.toFixed(2)
|
||||
this.gross = this.gross.toFixed(2);
|
||||
this.tax = this.tax.toFixed(2);
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -66,6 +66,9 @@
|
||||
<x-dropdown-link :href="route('incoming.index')">
|
||||
{{ __('incoming.Incoming invoices') }}
|
||||
</x-dropdown-link>
|
||||
<x-dropdown-link :href="route('incoming.payment')">
|
||||
{{ __('incoming.Incoming payments') }}
|
||||
</x-dropdown-link>
|
||||
<x-dropdown-link :href="route('supplier.index')">
|
||||
{{ __('supplier.Suppliers') }}
|
||||
</x-dropdown-link>
|
||||
|
||||
@@ -17,11 +17,15 @@
|
||||
{{ __('invoice.Select invoice') }}
|
||||
</h2>
|
||||
<p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
|
||||
{{ __("invoice.Select your invoice for payment") }}
|
||||
{{ __('invoice.Select your invoice for payment') }}
|
||||
</p>
|
||||
</header>
|
||||
|
||||
<div class="mt-8">
|
||||
<div class="mt-8" x-show="invoices.length == 0">
|
||||
{{ __('invoice.No invoices') }}
|
||||
</div>
|
||||
|
||||
<div class="mt-8" x-show="invoice.length != 0">
|
||||
<template x-for="(invoice, index) in invoices" x-bind="invoices">
|
||||
<div class="cursor-pointer grid grid-cols-4 even:bg-gray-100 odd:bg-white"
|
||||
:class="invoice.id == invoice_id ? 'font-bold' : ''"
|
||||
|
||||
Reference in New Issue
Block a user