improve final

This commit is contained in:
2025-11-15 20:43:18 +01:00
parent 5378ebce43
commit 9c125db92d
2 changed files with 48 additions and 33 deletions
+1 -1
View File
@@ -4,7 +4,7 @@
<modelVersion>4.0.0</modelVersion>
<groupId>de.champonthis</groupId>
<artifactId>abi</artifactId>
<version>0.3.2</version>
<version>0.3.3</version>
<name>abi</name>
<parent>
+40 -25
View File
@@ -201,12 +201,13 @@
</div>
</form>
<div class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg" x-show="stepMsg"></div>
<ul class="list-group mb-3" id="enteredContacts" x-show="enteredContacts && enteredContacts.length > 0">
<ul class="list-group mb-3" id="enteredContacts"
x-show="enteredContacts && enteredContacts.length > 0">
<template x-for="(c, index) in enteredContacts || []" :key="c.name + '_' + index">
<li class="list-group-item">
<!-- Normal view -->
<div x-show="editingContactIndex !== index"
:class="editingContactIndex === index ? 'd-none' : 'd-flex justify-content-between align-items-center'">
:class="editingContactIndex === index ? 'd-none' : 'd-flex justify-content-between align-items-center'">
<div>
<strong x-text="c.name"></strong><br>
<small class="text-muted">
@@ -214,35 +215,46 @@
<span x-show="c.phone" x-text="', ' + c.phone"></span>
</small>
</div>
<button class="btn btn-sm btn-outline-primary" @click="startEdit(index)" :disabled="working">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708L4.707 14.707a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168L12.146.146zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293L12.793 5.5z"/>
<button class="btn btn-sm btn-outline-primary" @click="startEdit(index)"
:disabled="working">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="currentColor" viewBox="0 0 16 16">
<path
d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708L4.707 14.707a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168L12.146.146zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293L12.793 5.5z" />
</svg>
</button>
</div>
<!-- Edit view - fully inline -->
<div x-show="editingContactIndex === index"
:class="editingContactIndex === index ? 'row g-2 align-items-start' : 'd-none'">
:class="editingContactIndex === index ? 'row g-2 align-items-start' : 'd-none'">
<div class="col-12">
<strong x-text="c.name"></strong>
</div>
<div class="col-12 col-md">
<input type="email" class="form-control form-control-sm" x-model="editingContactData.email" placeholder="E-Mail" required>
<input type="email" class="form-control form-control-sm"
x-model="editingContactData.email" placeholder="E-Mail" required>
</div>
<div class="col-12 col-md">
<input type="text" class="form-control form-control-sm" x-model="editingContactData.phone" placeholder="Telefon (optional)">
<input type="text" class="form-control form-control-sm"
x-model="editingContactData.phone" placeholder="Telefon (optional)">
</div>
<div class="col-12 col-md-auto">
<div class="d-flex gap-1">
<button class="btn btn-sm btn-outline-danger" @click="cancelEdit()" :disabled="working">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
<path d="M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z"/>
<button class="btn btn-sm btn-outline-danger" @click="cancelEdit()"
:disabled="working">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14"
fill="currentColor" viewBox="0 0 16 16">
<path
d="M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z" />
</svg>
</button>
<button class="btn btn-sm btn-success" @click="saveContactData(index)" :disabled="working">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" viewBox="0 0 16 16">
<path d="M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z"/>
<button class="btn btn-sm btn-success" @click="saveContactData(index)"
:disabled="working">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18"
fill="currentColor" viewBox="0 0 16 16">
<path
d="M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z" />
</svg>
</button>
</div>
@@ -281,21 +293,24 @@
Hast du Lust, am Samstag, den 13.11.2027, beim Nachtreffen in Gevelsberg dabei zu sein?
Genauere Infos und Details gibt's dann später hier und per Mail.
</p>
<p x-show="!stepMsg && committed === 'YES'">
Du hast bereits für Samstag, den 13.11.2027, <strong>zugesagt</strong>. Genauere Infos und Details gibt's dann später hier und per Mail. Falls du deine Meinung ändern möchtest, kannst du hier nochmal wählen.
<p x-show="committed === 'YES'">
Du hast für Samstag, den 13.11.2027, <strong class="text-success">zugesagt</strong>.
Genauere Infos und
Details gibt's dann später hier und per Mail. Falls du deine Meinung ändern möchtest, kannst
du hier nochmal wählen.
</p>
<p x-show="!stepMsg && committed === 'NO'">
Du hast bereits für Samstag, den 13.11.2027, <strong>abgesagt</strong>. Falls du deine Meinung ändern möchtest, kannst du hier nochmal wählen.
<p x-show="committed === 'NO'">
Du hast für Samstag, den 13.11.2027, <strong class="text-danger">abgesagt</strong>. Falls du
deine
Meinung ändern möchtest, kannst du hier nochmal wählen.
</p>
<div class="d-flex gap-2 mb-3">
<button x-show="!stepMsg" id="commitYes" class="btn flex-fill"
:class="{'btn-success': committed != 'NO', 'btn-outline-secondary' : committed == 'NO', 'disabled': working}"
<button id="commitYes" class="btn flex-fill"
:class="{'btn-success disabled': committed != 'NO', 'btn-outline-success opacity-75' : committed == 'NO', 'disabled': working}"
@click="submitCommit('YES')" autofocus>Ja, ich bin dabei!</button>
<button x-show="!stepMsg" id="commitNo" class="btn flex-fill"
:class="{'btn-danger' : committed != 'YES','btn-outline-secondary' : committed == 'YES', 'disabled': working}"
@click="submitCommit('NO')">Nein,
ich
kann leider nicht</button>
<button id="commitNo" class="btn flex-fill"
:class="{'btn-danger disabled' : committed != 'YES','btn-outline-danger opacity-75' : committed == 'YES', 'disabled': working}"
@click="submitCommit('NO')">Nein, ich bin nicht dabei</button>
</div>
<div class="d-flex mt-2">
<button type="button" class="btn btn-outline-secondary flex-fill"