torsten/harheimertc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Verbessere die Struktur des Templates in der Mitgliederliste und füge Sortieroptionen hinzu
Some checks failed
Code Analysis (JS/Vue) / analyze (push) Failing after 51s
Details

Browse Source
This commit is contained in:
Torsten Schulz (local)
2026-02-14 02:22:52 +01:00
parent 5799f97570
commit 04571e6444
1 changed files with 43 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
pages/mitgliederbereich/mitglieder.vue
View File

@@ -3,51 +3,47 @@
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between items-center mb-6"> <div class="flex justify-between items-center mb-6">
<div> <div>
<h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900 mb-2"> <div class="min-h-full py-16 bg-gray-50">
Mitgliederliste <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
</h1> <div class="flex justify-between items-center mb-6">
<div class="w-24 h-1 bg-primary-600 mb-4" /> <div>
</div> <h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900 mb-2">
<div class="flex items-center space-x-3"> Mitgliederliste
<!-- ...Buttons ... --> </h1>
</div> <div class="w-24 h-1 bg-primary-600 mb-4" />
</div> </div>
<div class="flex items-center space-x-3">
<!-- Sortieroptionen --> <!-- ...Buttons ... -->
<div class="mb-4 flex items-center space-x-2"> </div>
<label for="sortMode" class="text-sm text-gray-700">Sortieren nach:</label> </div>
<select id="sortMode" v-model="sortMode" class="px-2 py-1 border rounded"> <!-- Sortieroptionen -->
<option value="name">Name (Vorname Nachname)</option> <div class="mb-4 flex items-center space-x-2">
<option value="lastname">Nachname (Nachname Vorname)</option> <label for="sortMode" class="text-sm text-gray-700">Sortieren nach:</label>
<option value="birthday">Geburtstag</option> <select id="sortMode" v-model="sortMode" class="px-2 py-1 border rounded">
</select> <option value="name">Name (Vorname Nachname)</option>
</div> <option value="lastname">Nachname (Nachname Vorname)</option>
<div class="min-h-full py-16 bg-gray-50"> <option value="birthday">Geburtstag</option>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> </select>
<div class="flex justify-between items-center mb-6"> <div class="min-h-full py-16 bg-gray-50">
<div> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900 mb-2"> <div class="flex justify-between items-center mb-6">
Mitgliederliste <div>
</h1> <h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900 mb-2">Mitgliederliste</h1>
<div class="w-24 h-1 bg-primary-600 mb-4" /> <div class="w-24 h-1 bg-primary-600 mb-4" />
</div> </div>
<div class="flex items-center space-x-3"> <div class="flex items-center space-x-3">
<button <!-- ...Buttons ... -->
class="flex items-center px-4 py-2 bg-gray-100 hover:bg-gray-200 text-gray-700 font-semibold rounded-lg transition-colors" </div>
@click="viewMode = viewMode === 'cards' ? 'table' : 'cards'" </div>
> <!-- Sortieroptionen -->
<component <div class="mb-4 flex items-center space-x-2">
:is="viewMode === 'cards' ? Table2 : Grid3x3" <label for="sortMode" class="text-sm text-gray-700">Sortieren nach:</label>
:size="20" <select id="sortMode" v-model="sortMode" class="px-2 py-1 border rounded">
class="mr-2" <option value="name">Name (Vorname Nachname)</option>
/> <option value="lastname">Nachname (Nachname Vorname)</option>
{{ viewMode === 'cards' ? 'Tabelle' : 'Karten' }} <option value="birthday">Geburtstag</option>
</button> </select>
<button </div>
v-if="canEdit"
class="flex items-center px-4 py-2 bg-green-600 hover:bg-green-700 text-white font-semibold rounded-lg transition-colors"
@click="showBulkImportModal = true"
>
<svg <svg
class="w-5 h-5 mr-2" class="w-5 h-5 mr-2"
fill="none" fill="none"
@@ -765,6 +761,8 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
</template> </template>
<script setup> <script setup>