fix commitment, do not send duplicate invites, disable buttons on working

This commit is contained in:
2025-09-19 23:00:54 +02:00
parent 1f9f2dc21c
commit 6c10027122
7 changed files with 139 additions and 101 deletions
@@ -25,6 +25,10 @@ public class ContactDataManager {
return contactDataRepository.findByContactAndReportedBy(contact, reportedBy).orElse(null);
}
public ContactData findByContactAndEmail(Long contact, String email) {
return contactDataRepository.findByContactAndEmail(contact, email).orElse(null);
}
public ContactData findByinviteToken(String inviteToken) {
return contactDataRepository.findByinviteToken(inviteToken).orElse(null);
}
@@ -65,7 +65,11 @@ public class ContactDataController {
inviteToken = ContactManager.generateToken();
}
contactData.setInviteToken(inviteToken);
contactDataManager.sendInviteMail(contact, contactData, reportedBy);
if (contactDataManager.findByContactAndEmail(contact.getId(), contactData.getEmail()) == null) {
contactDataManager.sendInviteMail(contact, contactData, reportedBy);
}
sendToken = false;
}
contactDataManager.save(contactData);
@@ -33,7 +33,7 @@ public class FrontendController {
model.addAttribute("token", token);
model.addAttribute("userName", contact.getName());
model.addAttribute("altName", contact.getUpdatedName());
model.addAttribute("altName", contact.getUpdatedName());
model.addAttribute("committed", contact.getCommitted());
ContactData contactData = contactDataManager.findByContactAndReportedBy(contact.getId(),
contact.getId());
@@ -12,5 +12,7 @@ public interface ContactDataRepository extends JpaRepository<ContactData, Long>
Optional<ContactData> findByContactAndReportedBy(Long contact, Long reportedBy);
Optional<ContactData> findByContactAndEmail(Long contact, String email);
Optional<ContactData> findByinviteToken(String inviteToken);
}
@@ -9,7 +9,7 @@
<h1>Hallo <span th:text="${contact.updatedName != null ? contact.updatedName : contact.name}"></span>!</h1>
<div>
<p th:if="${contact.committed != null and contact.committed.name() == 'YES'}">
Super, dass du für unser 20-Jahres-Abitreffen am 13.11.2027 zugesagt hast - wir freuen uns sehr, dich dort wiederzusehen!
Super, dass du für unser 20-Jahres-Abitreffen am 13.11.2027 in Gevelsberg zugesagt hast - wir freuen uns sehr, dich dort wiederzusehen!
</p>
<p th:if="${contact.committed != null and contact.committed.name() == 'NO'}">
Schade, dass du im Moment nicht dabei bist. Du kannst deine Meinung aber jederzeit ändern.
+126 -98
View File
@@ -8,7 +8,7 @@
<script src="/lib/axios.min.js"></script>
<script defer src="/lib/alpinejs.min.js"></script>
<link rel="stylesheet" href="/lib/bootstrap.min.css">
<link rel="stylesheet" href="/css/style.css" />
<link rel="stylesheet" href="/style.css" />
</head>
<body>
@@ -94,11 +94,12 @@
<input type="text" x-model="yourName" required autocomplete="off"
class="form-control" autofocus />
</div>
<button type="submit" class="btn btn-primary flex-fill">Suchen</button>
<button type="submit" class="btn btn-primary flex-fill"
:class="{'disabled': working}">Suchen</button>
</form>
</div>
<div id="step1Msg" class="alert py-2" :class="'alert-' + step1MsgType" x-text="step1Msg"
x-show="step1Msg"></div>
<div id="stepMsg" class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg"
x-show="stepMsg"></div>
<div x-show="userName">
<form @submit.prevent="continueStep1">
<p>
@@ -123,7 +124,7 @@
<div id="step1ContinueDiv" class="d-flex gap-2 mt-3 justify-content-center"
:class="userName ? '' : 'd-none'" x-transition>
<button id="step1ContinueBtn" type="submit" class="btn btn-primary flex-fill"
x-ref="continueBtn">
:class="{'disabled': working}" x-ref="continueBtn">
Weiter <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
@@ -144,8 +145,8 @@
<rect x="2" y="4" width="20" height="16" rx="2"></rect>
</svg> Schritt 2: Deine Kontaktdaten
</h2>
<div id="step2Msg" class="alert py-2" :class="'alert-' + step2MsgType" x-text="step2Msg"
x-show="step2Msg"></div>
<div id="stepMsg" class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg"
x-show="stepMsg"></div>
<form @submit.prevent="submitContactData" class="mb-3" autocomplete="off">
<div class="mb-3">
<label class="form-label">E-Mail:</label>
@@ -157,13 +158,14 @@
<input type="text" x-model="phone" autocomplete="off" class="form-control" />
</div>
<div class="d-flex gap-2">
<button type="button" class="btn btn-outline-secondary flex-fill" @click="step = 1">
<button type="button" class="btn btn-outline-secondary flex-fill"
:class="{'disabled': working}" @click="setStep(1)">
Zurück
</button>
<button type="submit" class="btn btn-primary flex-fill" autofocus>Weiter <svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" aria-hidden="true">
<button type="submit" class="btn btn-primary flex-fill" :class="{'disabled': working}"
autofocus>Weiter <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="m9 18 6-6-6-6"></path>
</svg></button>
</div>
@@ -187,11 +189,12 @@
class="form-control" autofocus />
</div>
<div class="d-flex gap-2">
<button type="submit" class="btn btn-outline-dark flex-fill" autofocus>Suchen</button>
<button type="submit" class="btn btn-outline-dark flex-fill"
:class="{'disabled': working}" autofocus>Suchen</button>
</div>
</form>
<div id="step3Msg" class="alert py-2" :class="'alert-' + step3MsgType" x-text="step3Msg"
x-show="step3Msg"></div>
<div id="stepMsg" class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg"
x-show="stepMsg"></div>
<div id="knownContactDataDiv" x-show="showKnownContactData" x-transition>
<form @submit.prevent="submitKnownContactData" class="mb-3">
<div class="mb-3">
@@ -205,7 +208,7 @@
class="form-control" />
</div>
<button type="submit" class="btn btn-outline-success flex-fill"
autofocus>Speichern</button>
:class="{'disabled': working}" autofocus>Speichern</button>
</form>
</div>
<ul class="list-group mb-3" id="enteredContacts">
@@ -215,13 +218,14 @@
</template>
</ul>
<div class="d-flex gap-2 mt-3 justify-content-center">
<button type="button" class="btn btn-outline-secondary flex-fill" @click="step = 2">
<button type="button" class="btn btn-outline-secondary flex-fill"
:class="{'disabled': working}" @click="setStep(2)">
Zurück
</button>
<button id="step3NextBtn" class="btn btn-primary flex-fill" @click="step = 4">Weiter <svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" aria-hidden="true">
<button id="step3NextBtn" class="btn btn-primary flex-fill" :class="{'disabled': working}"
@click="setStep(4)">Weiter <svg xmlns="http://www.w3.org/2000/svg" width="24"
height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="m9 18 6-6-6-6"></path>
</svg></button>
</div>
@@ -236,22 +240,27 @@
<line x1="16" y1="2" x2="16" y2="6"></line>
<line x1="8" y1="2" x2="8" y2="6"></line>
<line x1="3" y1="10" x2="21" y2="10"></line>
</svg> Schritt 4: Bist du beim 20-Jahrestreffen am 13.11.2027 dabei?
</svg> Schritt 4: Bist du beim 20-Jahrestreffen am 13.11.2027 in Gevelsberg dabei?
</h2>
<div id="step4Msg" class="alert py-2" :class="'alert-' + step4MsgType" x-text="step4Msg"
x-show="step4Msg"></div>
<p>
Hast du Lust, am Samstag, den 13.11.2027, beim Nachtreffen dabei zu sein? Mehr Infos gibt's
dann hier und per Mail.
<div id="stepMsg" class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg"
x-show="stepMsg"></div>
<p x-show="!stepMsg">
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>
<div class="d-flex gap-2 mb-3">
<button id="commitYes" class="btn btn-success flex-fill" @click="submitCommit('YES')"
autofocus>Ja, ich bin dabei!</button>
<button id="commitNo" class="btn btn-danger flex-fill" @click="submitCommit('NO')">Nein, ich
<button x-show="!stepMsg" id="commitYes" class="btn flex-fill"
:class="{'btn-success': committed != 'NO', 'btn-outline-dark' : 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-dark' : committed == 'YES', 'disabled': working}"
@click="submitCommit('NO')">Nein,
ich
kann leider nicht</button>
</div>
<div class="d-flex mt-2">
<button type="button" class="btn btn-outline-secondary flex-fill" @click="step = 3">
<button type="button" class="btn btn-outline-secondary flex-fill"
:class="{'disabled': working}" @click="setStep(3)">
Zurück
</button>
</div>
@@ -268,10 +277,11 @@
return {
// Step state
step: 1,
stepMsg: '',
stepMsgType: '',
working: false,
// Step 1
yourName: '',
step1Msg: '',
step1MsgType: '',
altNameChecked: false,
altName: '[[${altName}]]',
showStep1Continue: false,
@@ -281,62 +291,72 @@
// Step 2
email: '[[${email}]]',
phone: '[[${phone}]]',
step2Msg: '',
step2MsgType: '',
// Step 3
knownContactName: '',
knownContactEmail: '',
knownContactPhone: '',
showKnownContactData: false,
enteredContacts: [],
step3Msg: '',
step3MsgType: '',
foundKnownContactName: null, // <-- add this line
foundKnownContactName: null,
// Step 4
step4Msg: '',
step4MsgType: '',
committed: '[[${committed}]]',
// Methods
async findSelf() {
this.step1Msg = '';
this.step1MsgType = '';
this.stepMsg = '';
this.stepMsgType = '';
this.altNameChecked = false;
this.altName = '';
this.pendingUpdatedName = null;
try {
this.working = true;
const resp = await axios.get(`/api/v1/contact`, { params: { name: this.yourName.trim() }, validateStatus: () => true });
if (resp.status === 200) {
this.userName = resp.data.name;
this.userToken = resp.data.token || null;
} else if (resp.status === 404) {
this.step1Msg = 'Sorry, wir konnten dich nicht finden. Schreib deinen Namen bitte genau so, wie er auf dem Abi-T-Shirt stand!';
this.step1MsgType = 'warning';
this.stepMsg = 'Sorry, wir konnten dich nicht finden. Schreib deinen Namen bitte genau so, wie er auf dem Abi-T-Shirt stand!';
this.stepMsgType = 'warning';
} else if (resp.status === 208) {
this.step1Msg = 'Du hast deine Daten schon eingetragen. Danke dir!';
this.step1MsgType = 'info';
this.stepMsg = 'Du hast deine Daten schon eingetragen. Danke dir!';
this.stepMsgType = 'info';
// Prevent showing greeting/alt name UI
this.userName = null;
} else {
this.step1Msg = 'Uups, da ist was schiefgelaufen. Versuch es gleich nochmal!';
this.step1MsgType = 'danger';
this.stepMsg = 'Uups, da ist was schiefgelaufen. Versuch es gleich nochmal!';
this.stepMsgType = 'danger';
}
} catch {
this.step1Msg = 'Uups, da ist was schiefgelaufen. Versuch es gleich nochmal!';
this.step1MsgType = 'danger';
this.stepMsg = 'Uups, da ist was schiefgelaufen. Versuch es gleich nochmal!';
this.stepMsgType = 'danger';
}
this.working = false;
},
setStep(step) {
this.stepMsg = '';
this.stepMsgType = '';
this.step = step;
},
async continueStep1() {
this.pendingUpdatedName = this.altNameChecked ? this.altName.trim() : null;
if (this.pendingUpdatedName && !this.userToken) {
await axios.post('/api/v1/contact', {
name: this.userName,
updatedName: this.pendingUpdatedName
});
this.working = true;
try {
await axios.post('/api/v1/contact', {
name: this.userName,
updatedName: this.pendingUpdatedName
});
} catch {
this.stepMsg = 'Uups, da ist was schiefgelaufen. Versuch es gleich nochmal!';
this.stepMsgType = 'danger';
}
this.working = false;
}
this.step = 2;
this.setStep(2);
},
async submitContactData() {
this.step2Msg = '';
this.step2MsgType = '';
this.stepMsg = '';
this.stepMsgType = '';
this.working = true;
try {
const resp = await axios.post('/api/v1/contact/data', {
name: this.userName,
@@ -345,26 +365,28 @@
phone: this.phone.trim()
}, { validateStatus: () => true });
if (resp.status === 200 || resp.status === 201) {
this.step = 3;
this.setStep(3);
} else if (resp.status === 400) {
this.step2Msg = 'Bitte schau nochmal über deine Angaben da stimmt was nicht.';
this.step2MsgType = 'warning';
this.stepMsg = 'Bitte schau nochmal über deine Angaben da stimmt was nicht.';
this.stepMsgType = 'warning';
} else {
this.step2Msg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.step2MsgType = 'danger';
this.stepMsg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.stepMsgType = 'danger';
}
} catch {
this.step2Msg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.step2MsgType = 'danger';
this.stepMsg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.stepMsgType = 'danger';
}
this.working = false;
},
async findKnownContact() {
this.step3Msg = '';
this.step3MsgType = '';
this.stepMsg = '';
this.stepMsgType = '';
this.showKnownContactData = false;
this.knownContactEmail = '';
this.knownContactPhone = '';
this.foundKnownContactName = null; // reset
this.foundKnownContactName = null;
this.working = true;
try {
const resp = await axios.get('/api/v1/contact', {
params: { name: this.knownContactName.trim() },
@@ -373,35 +395,37 @@
if (resp.status === 200) {
this.foundKnownContactName = resp.data.name.trim();
if (this.foundKnownContactName == this.yourName) {
this.step3Msg = 'Das bist du selbst deine Daten hast du ja schon eingetragen!';
this.step3MsgType = 'warning';
this.stepMsg = 'Das bist du selbst deine Daten hast du ja schon eingetragen!';
this.stepMsgType = 'warning';
this.showKnownContactData = false;
this.knownContactName = ''
return;
}
this.knownContactName = this.foundKnownContactName;
this.step3Msg = 'Super, trag bitte die Kontaktdaten ein!';
this.step3MsgType = 'success';
this.stepMsg = 'Super, trag bitte die Kontaktdaten ein!';
this.stepMsgType = 'success';
this.showKnownContactData = true;
} else if (resp.status === 404) {
this.step3Msg = 'Diesen Namen gibt es leider nicht in unserer Liste.';
this.step3MsgType = 'warning';
this.stepMsg = 'Diesen Namen gibt es leider nicht in unserer Liste.';
this.stepMsgType = 'warning';
} else if (resp.status === 208) {
this.step3Msg = 'Für diese Person haben wir schon Kontaktdaten. Danke trotzdem fürs Mitmachen!';
this.step3MsgType = 'info';
this.stepMsg = 'Für diese Person haben wir schon Kontaktdaten. Danke trotzdem fürs Mitmachen!';
this.stepMsgType = 'info';
this.showKnownContactData = false;
} else {
this.step3Msg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.step3MsgType = 'danger';
this.stepMsg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.stepMsgType = 'danger';
}
} catch {
this.step3Msg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.step3MsgType = 'danger';
this.stepMsg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.stepMsgType = 'danger';
}
this.working = false;
},
async submitKnownContactData() {
this.step3Msg = '';
this.step3MsgType = '';
this.stepMsg = '';
this.stepMsgType = '';
this.working = true;
try {
const resp = await axios.post('/api/v1/contact/data', {
name: this.foundKnownContactName,
@@ -416,45 +440,49 @@
email: this.knownContactEmail.trim(),
phone: this.knownContactPhone.trim()
});
this.step3Msg = 'Danke, die Kontaktdaten sind gespeichert! Du kannst noch mehr eintragen oder einfach weitermachen.';
this.step3MsgType = 'success';
this.stepMsg = 'Danke, die Kontaktdaten sind gespeichert! Du kannst noch mehr eintragen oder einfach weitermachen.';
this.stepMsgType = 'success';
this.showKnownContactData = false;
this.knownContactName = '';
this.foundKnownContactName = null;
} else if (resp.status === 400) {
this.step3Msg = 'Bitte prüfe die Angaben nochmal da stimmt was nicht.';
this.step3MsgType = 'warning';
this.stepMsg = 'Bitte prüfe die Angaben nochmal da stimmt was nicht.';
this.stepMsgType = 'warning';
} else {
this.step3Msg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.step3MsgType = 'danger';
this.stepMsg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.stepMsgType = 'danger';
}
} catch {
this.step3Msg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.step3MsgType = 'danger';
this.stepMsg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.stepMsgType = 'danger';
}
this.working = false;
},
async submitCommit(committed) {
this.working = true;
this.committed = committed;
try {
await axios.post('/api/v1/contact', {
name: this.userName,
updatedName: this.pendingUpdatedName,
token: this.userToken,
committed: committed
committed: this.committed
}, {
headers: this.userToken ? { 'Authorization': this.userToken } : {}
});
if (committed == 'YES') {
this.step4Msg = 'Danke für deine Rückmeldung! Schön, dass du dabei bist! Wir melden uns rechtzeitig mit allen weiteren Infos.' + (this.userToken ? '' : ' Du solltest schon automatisch eine E-Mail mit einem Link bekommen haben, über den du deine Daten jederzeit anpassen kannst.');
this.step4MsgType = 'success';
} else {
this.step4Msg = 'Danke für deine Rückmeldung! Schade, dass du nicht dabei bist.' + (this.userToken ? '' : ' Du solltest trotzdem automatisch eine E-Mail mit einem Link bekommen haben, über den du deine Daten jederzeit anpassen kannst und auch noch zusagen kannst, solltest du doch noch kommen wollen.');
this.step4MsgType = 'info';
if (this.committed == 'YES') {
this.stepMsg = 'Danke für deine Rückmeldung! Schön, dass du dabei bist! Wir melden uns rechtzeitig mit allen weiteren Infos.' + (this.userToken ? '' : ' Du solltest schon automatisch eine E-Mail mit einem Link bekommen haben, über den du deine Daten jederzeit anpassen kannst.');
this.stepMsgType = 'success';
} else if (this.committed == 'NO') {
this.stepMsg = 'Danke für deine Rückmeldung! Schade, dass du nicht dabei bist.' + (this.userToken ? '' : ' Du solltest trotzdem automatisch eine E-Mail mit einem Link bekommen haben, über den du deine Daten jederzeit anpassen kannst und auch noch zusagen kannst, solltest du doch noch kommen wollen.');
this.stepMsgType = 'info';
}
} catch {
this.step4Msg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.step4MsgType = 'danger';
this.stepMsg = 'Da ist was schiefgelaufen. Versuch es bitte nochmal!';
this.stepMsgType = 'danger';
}
this.working = false;
}
}
}