th.guenther/mareike
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Handling ICAL import

Browse Source
This commit is contained in:
Thomas Günther
2026-04-25 16:50:32 +02:00
parent 6f8be58943
commit 1ee6b9968f
22 changed files with 510 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
app/Domains/Dashboard/Views/Dashboard.vue
View File

@@ -2,9 +2,11 @@
import AppLayout from '../../../../resources/js/layouts/AppLayout.vue'
import ShadowedBox from "../../../Views/Components/ShadowedBox.vue";
import MyInvoices from "./Partials/Widgets/MyInvoices.vue";
import MyParticipations from "./Partials/Widgets/MyParticipations.vue";
const props = defineProps({
myInvoices: Object,
myParticipations: Object,
})
@@ -18,10 +20,10 @@ function newInvoice() {
<AppLayout title='Dashboard'>
<diV class="dashboard-widget-container">
<shadowed-box class="dashboard-widget-box" style="width: 60%;">
Meine Anmeldungen
<MyParticipations />
</shadowed-box>
<shadowed-box class="dashboard-widget-box">
<shadowed-box class="dashboard-widget-box" style="height: 275px;">
<MyInvoices />
<input type="button" value="Neue Abrechnung" @click="newInvoice" style="margin-top: 20px;">
@@ -45,4 +47,15 @@ function newInvoice() {
flex-grow: 1; display: inline-block;
margin: 0 10px;
}
.dashboard-widget-box h2 {
border-color: #c0c0c0;
border-left-width: 40px;
border-left-style: solid;
border-bottom-style: solid;
border-bottom-width: 1px;
padding: 5px 10px;
font-size: 13pt;
}
</style>

1
app/Domains/Dashboard/Views/Partials/Widgets/MyInvoices.vue
View File

@@ -16,6 +16,7 @@ onMounted(async () => {
</script>
<template>
<h2>Meine Abrechnungen</h2>
<p v-for="invoice in myInvoices.myInvoices" class="widget-content-item">
<a :href="'/invoice/my-invoices/' + invoice.slug" class="link">{{invoice.title}} ({{invoice.count}})</a>
<label>

68
app/Domains/Dashboard/Views/Partials/Widgets/MyParticipations.vue Normal file
View File

@@ -0,0 +1,68 @@
<script setup>
import {onMounted, reactive} from "vue";
import Icon from "../../../../../Views/Components/Icon.vue";
const myParticipations = reactive({
'myParticipations': '',
})
onMounted(async () => {
const response = await fetch('/api/v1/dashboard/my-participations');
const data = await response.json();
Object.assign(myParticipations, data);
});
</script>
<template>
<h2>Meine Anmeldungen</h2>
<p v-for="participation in myParticipations.myParticipations" class="widget-content-item">
<table>
<tr>
<td style="width: 40%; font-weight: bold;">{{participation.eventName}}</td>
<td style="width: 30%; font-weight: bold;">{{participation.arrivalDateReadable}} - {{participation.departureDateReadable}}</td>
<td style="width: 30%;">
<Icon name="euro-sign" style="padding: 5px; font-size: 11pt; color: #ffffff; margin-right: 5px;" :class="participation.needs_payment ? 'bg-red' : 'bg-green'" />
<Icon name="award" style="padding: 5px; font-size: 11pt; color: #ffffff; margin-right: 5px;" :class="participation.cocColor" />
</td>
</tr>
<tr>
<td>
{{participation.event.postal_code}} {{participation.event.location}}<br />
</td>
<td>
<a class="link" :href="`/api/v1/event/participant/${participation.identifier}/ical`">In Kalender importieren</a>
</td>
<td>
{{participation.amountPaid.readable}} / {{participation.amountExpected.readable}}
</td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
<td>eFZ-Status: {{participation.efzStatusReadable}}</td>
</tr>
</table>
</p>
<p v-if="myParticipations.myParticipations.length === 0">Du bist aktuelle für keine Veranstaltung angemeldet.</p>
<p>
<input type="button" value="Für weitere Veranstaltung anmelden" class="button" />
</p>
</template>
<style scoped>
.bg-red {
background-color: red;
}
.bg-green {
background-color: green;
}
.bg-yellow {
background-color: #f3f353;
}
</style>