Invoices can be uploaded

app/Domains/Invoice/Views/Partials/newInvoice/refund-data.vue

@@ -0,0 +1,157 @@
+<script setup>
+import { ref } from 'vue'
+import Modal from "../../../../../Views/Components/Modal.vue";
+import IbanInput from "../../../../../Views/Components/IbanInput.vue";
+import {useAjax} from "../../../../../../resources/js/components/ajaxHandler.js";
+import TextResource from "../../../../../Views/Components/TextResource.vue";
+import {invoiceCheckContactName} from "../../../../../../resources/js/components/InvoiceUploadChecks.js";
+import {toast} from "vue3-toastify";
+
+const { request } = useAjax();
+
+const emit = defineEmits(['close'])
+
+
+const props = defineProps({
+    eventId: Number,
+    invoiceType: String,
+    amount: [String, Number],
+    otherText: String,
+    receipt: File,
+    userName: String,
+    userEmail: String,
+    userTelephone: String,
+    userAccountOwner: String,
+    userIban: String,
+    havePassengers: Number,
+    materialTransportation: Boolean,
+})
+
+console.log(props.receipt)
+
+const finalStep = ref(true)
+const userName = ref(props.userName)
+const userEmail = ref(props.userEmail)
+const userTelephone = ref(props.userTelephone)
+const userIban = ref(props.userIban)
+const userAccountOwner = ref(props.userAccountOwner)
+const sending = ref(false)
+const success = ref(false)
+const decision = ref('')
+const errorMsg = ref('')
+const confirmation = ref(null)
+
+
+async function sendData() {
+    if (!userName.value) return
+
+    sending.value = true
+    errorMsg.value = ''
+    success.value = false
+
+    const formData = new FormData()
+
+    formData.append('name', userName.value)
+    formData.append('email', userEmail.value)
+    formData.append('telephone', userTelephone.value)
+    formData.append('amount', props.amount)
+    formData.append('otherText', props.otherText)
+    formData.append('decision', decision.value)
+    formData.append('accountOwner', userAccountOwner.value)
+    formData.append('accountIban', userIban.value)
+    formData.append('havePassengers', props.havePassengers ? 1 : 0)
+    formData.append('materialTransportation', props.materialTransportation ? 1 : 0)
+
+    if (props.receipt) {
+        formData.append('receipt', props.receipt)
+    }
+
+
+    try {
+        const response = await request('/api/v1/invoice/new/' + props.eventId + '/' + props.invoiceType, {
+            method: 'POST',
+            body: formData
+        })
+
+        if (response.status === 'success') {
+            window.location.href = '/';
+        }
+    } catch (err) {
+        toast.error(result.message);
+    } finally {
+        sending.value = false
+    }
+
+}
+
+</script>
+
+<template>
+    <Modal :show="finalStep" title='Bitte gib deine Daten ein' @close="emit('close')">
+        <label>
+            <strong>Dein Name Name (kein Pfadiname):</strong>
+        </label><br />
+        <input
+            type="text"
+            @keyup="invoiceCheckContactName();"
+            id="contact_name"
+            name="contact_name" v-model="userName"
+            style="font-size: 14pt; width: 550px;" /><br /><br />
+
+        <label>
+            <strong>E-Mail-Adresse (Für Rückfragen):</strong>
+        </label><br />
+        <input
+            type="email"
+            name="contact_email"
+            v-model="userEmail"
+            style="font-size: 14pt; width: 550px;" /><br /><br />
+
+        <label>
+            <strong>Telefonnummer (für Rückfragen):</strong>
+        </label><br />
+        <input
+            type="text"
+            id="contact_telephone"
+            name="contact_telephone" v-model="userTelephone"
+            style="font-size: 14pt; width: 550px;" /><br /><br />
+
+        <span id="decision" v-if="userName !== '' && decision === ''">
+          <label><br />
+              <strong>Möchtest du den Betrag spenden?</strong>
+          </label><br />
+
+          <input type="button" style="border-radius: 0; width: 100px;" @click="decision='donation'" value="Ja" />
+          <input type="button" style="border-radius: 0; width: 100px;" @click="decision='payout'" value="Nein" />
+        </span>
+
+        <span id="confirm_donation" v-if="decision === 'donation'">
+            <input type="radio" name="confirmation_radio" value="donation" id="confirmation_radio_donation" v-model="confirmation">
+            <TextResource belongsTo="confirmation_radio_donation" textName="CONFIRMATION_DONATE" />
+            <br /><br />
+          <input type="button" class="mareike-button" v-if="confirmation !== null && !sending" @click="sendData" value="Beleg einreichen" />
+        </span>
+
+        <span id="confirm_payment" v-if="decision === 'payout'">
+            <label>
+            <strong>Konto-Inhaber*in:</strong></label><br />
+                <input type="text" name="account_owner" id="account_owner" v-model="userAccountOwner" style="font-size: 14pt; width: 550px;" /><br /><br />
+
+            <label>
+            <strong>IBAN:</strong>
+          </label><br />
+            <IbanInput id="account_iban" name="account_iban" v-model="userIban" style="font-size: 14pt; width: 550px;" /><br /><br />
+
+            <span v-if="userAccountOwner != '' && userIban && userIban.length === 27"><br />
+                <input type="radio" name="confirmation_radio" value="payment" id="confirmation_radio_payment"  v-model="confirmation">
+                 <TextResource belongsTo="confirmation_radio_payment" textName="CONFIRMATION_PAYMENT" /><br /><br />
+              <input type="button" v-if="confirmation !== null && !sending" @click="sendData" value="Beleg einreichen" />
+            </span>
+        </span>
+    </Modal>
+</template>
+
+<style scoped>
+/* optional styling */
+</style>
+