286 lines
6.4 KiB
Vue
286 lines
6.4 KiB
Vue
<script setup>
|
|
|
|
import FullScreenModal from "../../../../../Views/Components/FullScreenModal.vue";
|
|
import {ref} from "vue";
|
|
import Modal from "../../../../../Views/Components/Modal.vue";
|
|
import { useAjax } from "../../../../../../resources/js/components/ajaxHandler.js";
|
|
import ShowInvoicePartial from "./ShowInvoice.vue";
|
|
import EditInvoicePartial from "./EditInvoice.vue";
|
|
import Header from "./Header.vue";
|
|
import {toast} from "vue3-toastify";
|
|
|
|
const props = defineProps({
|
|
data: {
|
|
type: Object,
|
|
default: () => ({})
|
|
}, showInvoice: Boolean
|
|
})
|
|
const showInvoice = ref(props.showInvoice)
|
|
const emit = defineEmits(["close"])
|
|
const denyInvoiceDialog = ref(false)
|
|
const { data, loading, error, request } = useAjax()
|
|
const modeShow = ref(true)
|
|
const costUnits = ref(null)
|
|
const newInvoice = ref(null)
|
|
|
|
async function acceptInvoice() {
|
|
const data = await request("/api/v1/invoice/details/" + props.data.id + "/change-state/approved", {
|
|
method: "POST",
|
|
});
|
|
|
|
if (data.status === 'success') {
|
|
toast.success('Abrechnung wurde freigegeben.');
|
|
} else {
|
|
toast.error('Bei der Bearbeitung ist ein Fehler aufgetreten.');
|
|
|
|
}
|
|
|
|
close();
|
|
}
|
|
|
|
|
|
function close() {
|
|
emit('reload')
|
|
emit('close')
|
|
}
|
|
|
|
async function updateInvoice(formData) {
|
|
const data = await request("/api/v1/invoice/details/" + props.data.id + "/update", {
|
|
method: "POST",
|
|
body: {
|
|
invoiceData: formData
|
|
}
|
|
});
|
|
|
|
if (!data.do_copy) {
|
|
modeShow.value = true;
|
|
toast.success('Die Koreektur der Abrechnung wurde gespeichert.');
|
|
close();
|
|
} else {
|
|
modeShow.value = true;
|
|
newInvoice.value = data.invoice;
|
|
props.data.id = data.invoice.id;
|
|
reloadInvoiceFixDialog()
|
|
}
|
|
}
|
|
|
|
async function reloadInvoiceFixDialog() {
|
|
const data = await request("api/v1/invoice/details/" + props.data.id, {
|
|
method: "GET",
|
|
});
|
|
|
|
newInvoice.value = data.invoice;
|
|
props.data.id = data.invoice.id;
|
|
costUnits.value = data.costUnits;
|
|
props.data.id = data.invoice.id;
|
|
|
|
modeShow.value = false;
|
|
toast.success('Die Abrechnung wurde gespeichert und eine neue Abrechnung wurde erstellt.');
|
|
|
|
}
|
|
|
|
|
|
|
|
async function openInvoiceFixDialog() {
|
|
const data = await request("/api/v1/invoice/details/" + props.data.id + "/copy", {
|
|
method: "POST",
|
|
body: {
|
|
}
|
|
});
|
|
|
|
if (data.status === 'success') {
|
|
costUnits.value = data.costUnits;
|
|
newInvoice.value = data.invoice;
|
|
props.data.id = data.invoice.id;
|
|
modeShow.value = false;
|
|
}
|
|
}
|
|
|
|
|
|
function openDenyInvoiceDialog() {
|
|
denyInvoiceDialog.value = true;
|
|
}
|
|
|
|
async function denyInvoice() {
|
|
const data = await request("/api/v1/invoice/details/" + props.data.id + "/change-state/denied", {
|
|
method: "POST",
|
|
body: {
|
|
reason: document.getElementById('deny_invoice_reason').value
|
|
}
|
|
});
|
|
|
|
if (data.status === 'success') {
|
|
toast.success('Abrechnung wurde abgelehnt.');
|
|
} else {
|
|
toast.error('Bei der Bearbeitung ist ein Fehler aufgetreten.');
|
|
|
|
}
|
|
|
|
denyInvoiceDialog.value = false;
|
|
close();
|
|
}
|
|
|
|
async function reopenInvoice() {
|
|
const data = await request("/api/v1/invoice/details/" + props.data.id + "/change-state/new", {
|
|
method: "POST",
|
|
|
|
});
|
|
|
|
if (data.status === 'success') {
|
|
toast.success('Die Abrechnung wurde zur erneuten Bearbeitung vorgelegt');
|
|
} else {
|
|
toast.error('Beim Bearbeiten ist ein Fehler aufgetreten.');
|
|
}
|
|
close();
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
|
|
<FullScreenModal
|
|
:show="showInvoice"
|
|
title="Abrechnungsdetails"
|
|
@close="emit('close')"
|
|
>
|
|
|
|
<Header :data="props.data"
|
|
@accept="acceptInvoice"
|
|
@deny="openDenyInvoiceDialog"
|
|
@fix="openInvoiceFixDialog"
|
|
@reopen="reopenInvoice"
|
|
:modeShow="modeShow"
|
|
/>
|
|
|
|
<ShowInvoicePartial
|
|
v-if="modeShow"
|
|
:data="props.data"
|
|
@accept="acceptInvoice"
|
|
@deny="openDenyInvoiceDialog"
|
|
@fix="openInvoiceFixDialog"
|
|
/>
|
|
|
|
<EditInvoicePartial
|
|
v-else
|
|
:newInvoice="newInvoice"
|
|
:costUnits="costUnits"
|
|
@accept="acceptInvoice"
|
|
@deny="openDenyInvoiceDialog"
|
|
@fix="openInvoiceFixDialog"
|
|
@update="updateInvoice"
|
|
@submit="updateInvoice"
|
|
/>
|
|
|
|
|
|
</FullScreenModal>
|
|
|
|
<Modal title="Abrechnung ablehnen" :show="denyInvoiceDialog" @close="denyInvoiceDialog = false" >
|
|
Begründung:
|
|
<textarea class="mareike-textarea" style="width: 100%; height: 100px; margin-top: 10px;" id="deny_invoice_reason" />
|
|
<input type="button" class="mareike-button mareike-deny-invoice-button" value="Abrechnung ablehnen" @click="denyInvoice" />
|
|
</Modal>
|
|
|
|
</template>
|
|
|
|
<style>
|
|
.mareike-deny-invoice-button {
|
|
width: 150px !important;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
#invoice_details_header{
|
|
font-weight: bold;
|
|
font-size: 12pt;
|
|
line-height: 1.8em;
|
|
width: 100%;
|
|
|
|
}
|
|
#invoice_details_header table {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-radius: 10px !important;
|
|
width: 98%;
|
|
border-color: #c0c0c0;
|
|
box-shadow: 5px 5px 10px #c0c0c0;
|
|
margin-bottom: 75px;
|
|
font-weight: normal;
|
|
}
|
|
#invoice_details_header table tr td:first-child {
|
|
padding-right: 50px;
|
|
width: 175px;
|
|
}
|
|
|
|
#invoice_details_header table tr td:nth-child(2) {
|
|
padding-right: 25px;
|
|
}
|
|
|
|
#invoice_details_header table tr td:nth-child(3) {
|
|
padding-right: 50px;
|
|
width: 100px;
|
|
vertical-align: top;
|
|
}
|
|
|
|
#invoice_details_body {
|
|
height: 400px;
|
|
overflow: auto;
|
|
|
|
}
|
|
|
|
|
|
#invoice_details_body table tr:nth-child(1) td,
|
|
#invoice_details_body table tr:nth-child(2) td,
|
|
#invoice_details_body table tr:nth-child(3) td,
|
|
#invoice_details_body table tr:nth-child(4) td,
|
|
#invoice_details_body table tr:nth-child(6) td{
|
|
vertical-align: top;
|
|
height: 20px;
|
|
}
|
|
|
|
#invoice_details_body table tr:nth-child(5) td {
|
|
height: 50px;
|
|
}
|
|
|
|
|
|
#invoice_details_body table {
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
#invoice_details_body table tr:nth-child(1) td:first-child {
|
|
padding-right: 50px;
|
|
|
|
}
|
|
|
|
#invoice_details_body table tr:nth-child(1) td:nth-child(2),
|
|
#invoice_details_body table tr:nth-child(1) td:nth-child(3)
|
|
{
|
|
width: 250px;
|
|
|
|
}
|
|
|
|
.mareike-accept-button {
|
|
background-color: #36c054 !important;
|
|
color: #ffffff !important;
|
|
}
|
|
|
|
.mareike-deny-button {
|
|
background-color: #ee4b5c !important;
|
|
color: #ffffff !important;
|
|
}
|
|
|
|
.mareike-fix-button {
|
|
background-color: #d3d669 !important;
|
|
color: #67683c !important;
|
|
}
|
|
|
|
.mareike-button {
|
|
padding: 5px 25px !important;
|
|
font-size: 11pt !important;
|
|
margin-bottom: 10px;
|
|
width: 100%;
|
|
padding-right: 2px;
|
|
}
|
|
|
|
|
|
</style>
|