diff --git a/src/content/admin/WorshipManagement.vue b/src/content/admin/WorshipManagement.vue
index 32be261..28ef77e 100644
--- a/src/content/admin/WorshipManagement.vue
+++ b/src/content/admin/WorshipManagement.vue
@@ -46,8 +46,27 @@
+
+
+
+
+
+
- -
+
-
{{ worship.title }} - {{ formatDate(worship.date) }}, {{ formatTime(worship.time) }}
@@ -86,9 +105,48 @@ export default {
},
selectedEventPlace: null,
editMode: false,
- editId: null
+ editId: null,
+ searchDate: '',
+ showPastWorships: false,
};
},
+ computed: {
+ filteredWorships() {
+ let filtered = this.worships;
+
+ // Filter vergangene Gottesdienste aus
+ if (!this.showPastWorships) {
+ const today = new Date();
+ today.setHours(0, 0, 0, 0);
+
+ filtered = filtered.filter(worship => {
+ if (worship.date) {
+ const worshipDate = new Date(worship.date);
+ worshipDate.setHours(0, 0, 0, 0);
+ return worshipDate >= today;
+ }
+ return true;
+ });
+ }
+
+ // Datumsfilter anwenden
+ if (this.searchDate) {
+ const searchDateObj = new Date(this.searchDate);
+ searchDateObj.setHours(0, 0, 0, 0);
+
+ filtered = filtered.filter(worship => {
+ if (worship.date) {
+ const worshipDate = new Date(worship.date);
+ worshipDate.setHours(0, 0, 0, 0);
+ return worshipDate.getTime() === searchDateObj.getTime();
+ }
+ return false;
+ });
+ }
+
+ return filtered;
+ }
+ },
async created() {
await this.fetchEventPlaces();
await this.fetchWorships();
@@ -174,6 +232,9 @@ export default {
const currentDate = new Date();
const inputDate = new Date(date);
return inputDate < currentDate;
+ },
+ clearSearch() {
+ this.searchDate = '';
}
}
};
@@ -202,6 +263,60 @@ button {
margin-top: 20px;
}
+.filter-section {
+ margin: 30px 0 20px;
+ padding: 15px;
+ background-color: #f5f5f5;
+ border-radius: 8px;
+ display: flex;
+ gap: 15px;
+ align-items: center;
+ flex-wrap: wrap;
+ border: 1px solid #ddd;
+}
+
+.search-input {
+ flex: 1;
+ min-width: 200px;
+ padding: 8px 12px;
+ border: 1px solid #ddd;
+ border-radius: 4px;
+ font-size: 14px;
+ background-color: white;
+}
+
+.search-input:focus {
+ outline: none;
+ border-color: #4CAF50;
+}
+
+.checkbox-label {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ cursor: pointer;
+ user-select: none;
+ white-space: nowrap;
+}
+
+.checkbox-label input[type="checkbox"] {
+ cursor: pointer;
+}
+
+.clear-button {
+ padding: 8px 16px;
+ background-color: #f44336;
+ color: white;
+ border: none;
+ border-radius: 4px;
+ cursor: pointer;
+ margin: 0;
+}
+
+.clear-button:hover {
+ background-color: #d32f2f;
+}
+
ul {
margin-top: 20px;
}