105 lines
2.8 KiB
Vue
105 lines
2.8 KiB
Vue
<script setup>
|
|
const props = defineProps({
|
|
data: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
modeShow: {
|
|
type: Boolean,
|
|
required: true,
|
|
}
|
|
})
|
|
|
|
const emit = defineEmits(["accept", "deny", "fix", "reopen"])
|
|
</script>
|
|
|
|
<template>
|
|
<span id="invoice_details_header">
|
|
<table>
|
|
<tr>
|
|
<td>Name:</td>
|
|
<td v-if="modeShow">{{props.data.contactName}}</td>
|
|
<td v-else style="width: 300px;">{{props.data.contactName}}</td>
|
|
|
|
<td v-if="modeShow" style="width: 250px;">Kostenstelle</td>
|
|
<td v-else style="width: 300px;">Kostensatelle (ursprünglich)</td>
|
|
|
|
<td>{{props.data.costUnitName}}</td>
|
|
<td
|
|
rowspan="4"
|
|
style="vertical-align: top;
|
|
padding-top: 15px;
|
|
padding-right: 25px;
|
|
text-align: right;"
|
|
>
|
|
<input type="button"
|
|
v-if="props.data.status === 'new' && modeShow"
|
|
@click="emit('reject')"
|
|
class="deny-button"
|
|
value="Abrechnung zurückziehen" />
|
|
|
|
<input type="button"
|
|
v-if="props.data.status === 'denied' && modeShow"
|
|
@click="emit('delete')"
|
|
class="deny-button"
|
|
value="Abrechnung Endgültig löschen" />
|
|
</td>
|
|
</tr>
|
|
|
|
<!-- Rest der Tabelle bleibt unverändert -->
|
|
<tr>
|
|
<td>E-Mail:</td>
|
|
<td>{{props.data.contactEmail}}</td>
|
|
<td>
|
|
Abrechnungsnummer
|
|
<label v-if="!modeShow"> (ursprünglich)</label>:
|
|
</td>
|
|
|
|
<td>{{props.data.invoiceNumber}}</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>Telefon:</td>
|
|
<td>{{props.data.contactPhone}}</td>
|
|
<td>
|
|
Abrechnungstyp
|
|
<label v-if="!modeShow"> (Ursprünglich)</label>:
|
|
</td>
|
|
<td>{{props.data.invoiceType}}</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>Kontoinhaber*in:</td>
|
|
<td>{{props.data.accountOwner}}</td>
|
|
<td>Gesamtbetrag
|
|
<label v-if="!modeShow"> (Ursprünglich)</label>:
|
|
</td>
|
|
<td><strong>{{props.data.amount}}</strong></td>
|
|
</tr>
|
|
<tr>
|
|
<td>IBAN:</td>
|
|
<td>{{props.data.accountIban}}</td>
|
|
<td>Buchungsinformationen:</td>
|
|
<td v-if="props.data.donation">Als Spende gebucht</td>
|
|
<td v-else-if="props.data.alreadyPaid">Beleg ohne Auszahlung</td>
|
|
<td v-else>Klassische Auszahlung</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Status:</td>
|
|
<td>{{props.data.readableStatus}}</td>
|
|
<td>Anmerkungen:</td>
|
|
<td>
|
|
<span v-if="props.data.status === 'denied'">
|
|
{{props.data.deniedReason}}
|
|
</span>
|
|
<span v-else>{{props.data.comment}}</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</span>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|