227 lines
4.8 KiB
Plaintext
227 lines
4.8 KiB
Plaintext
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>Plusfit – Mitglied bearbeiten</title>
|
||
|
||
<style>
|
||
body {
|
||
font-family: Arial, sans-serif;
|
||
background: #f6f7f9;
|
||
}
|
||
|
||
.container {
|
||
max-width: 800px;
|
||
margin: 20px auto;
|
||
background: #fff;
|
||
padding: 20px;
|
||
border-radius: 6px;
|
||
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
|
||
}
|
||
|
||
h2 {
|
||
margin-top: 0;
|
||
}
|
||
|
||
h3 {
|
||
margin-top: 25px;
|
||
border-bottom: 1px solid #ddd;
|
||
padding-bottom: 5px;
|
||
}
|
||
|
||
label {
|
||
display: block;
|
||
font-weight: bold;
|
||
margin-top: 10px;
|
||
}
|
||
|
||
input {
|
||
width: 100%;
|
||
padding: 8px;
|
||
margin-top: 3px;
|
||
border-radius: 4px;
|
||
border: 1px solid #ccc;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
/* 🔶 Leere Felder */
|
||
.empty-field {
|
||
background-color: #fff8e1;
|
||
border: 1px dashed #f0ad4e;
|
||
}
|
||
|
||
/* 🔥 Fokus-Effekt */
|
||
.empty-field:focus {
|
||
background-color: #ffffff;
|
||
border-color: #ff9800;
|
||
box-shadow: 0 0 5px rgba(255,152,0,0.7);
|
||
}
|
||
|
||
/* Pflichtfelder */
|
||
.required {
|
||
border-left: 4px solid #2e7d32;
|
||
}
|
||
|
||
button {
|
||
margin-top: 25px;
|
||
padding: 10px 18px;
|
||
background: #1976d2;
|
||
color: #fff;
|
||
border: none;
|
||
border-radius: 4px;
|
||
font-size: 15px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
button:hover {
|
||
background: #1565c0;
|
||
}
|
||
|
||
.status {
|
||
margin-top: 10px;
|
||
}
|
||
</style>
|
||
</head>
|
||
|
||
<body>
|
||
<div class="container">
|
||
<%- include('partials/header') %>
|
||
<h2>Mitglied bearbeiten</h2>
|
||
|
||
<form method="POST">
|
||
|
||
<h3>Vertrag</h3>
|
||
|
||
<label>Vertragsnummer</label>
|
||
<input
|
||
value="<%= user.vertragsnummer %>"
|
||
readonly
|
||
class="form-control mb-2 bg-light">
|
||
|
||
<label>Vertragsvariante</label>
|
||
<input
|
||
type="number"
|
||
name="vertragsvariante"
|
||
value="<%= user.vertragsvariante || '' %>"
|
||
class="form-control mb-2 <%= user.vertragsvariante ? '' : 'empty-field' %>"
|
||
placeholder="z. B. 1, 2 oder 3">
|
||
|
||
|
||
<h3>Persönliche Daten</h3>
|
||
|
||
<label>Vorname</label>
|
||
<input name="vorname"
|
||
value="<%= user.vorname || '' %>"
|
||
required
|
||
class="required <%= user.vorname ? '' : 'empty-field' %>">
|
||
|
||
<label>Nachname</label>
|
||
<input name="nachname"
|
||
value="<%= user.nachname || '' %>"
|
||
required
|
||
class="required <%= user.nachname ? '' : 'empty-field' %>">
|
||
|
||
<label>Geburtsdatum</label>
|
||
<input type="date"
|
||
name="geburtsdatum"
|
||
value="<%= user.geburtsdatum || '' %>">
|
||
|
||
<h3>Adresse</h3>
|
||
|
||
<label>Straße</label>
|
||
<input name="strasse"
|
||
value="<%= user.strasse || '' %>"
|
||
placeholder="Straße fehlt"
|
||
class="<%= user.strasse ? '' : 'empty-field' %>">
|
||
|
||
<label>Hausnummer</label>
|
||
<input name="hausnummer"
|
||
value="<%= user.hausnummer || '' %>"
|
||
placeholder="Hausnummer fehlt"
|
||
class="<%= user.hausnummer ? '' : 'empty-field' %>">
|
||
|
||
<label>PLZ</label>
|
||
<input name="plz"
|
||
value="<%= user.plz || '' %>"
|
||
placeholder="PLZ fehlt"
|
||
class="<%= user.plz ? '' : 'empty-field' %>">
|
||
|
||
<label>Ort</label>
|
||
<input name="ort"
|
||
value="<%= user.ort || '' %>"
|
||
placeholder="Ort fehlt"
|
||
class="<%= user.ort ? '' : 'empty-field' %>">
|
||
|
||
<label>Land</label>
|
||
<input name="land"
|
||
value="<%= user.land || '' %>"
|
||
placeholder="Land fehlt"
|
||
class="<%= user.land ? '' : 'empty-field' %>">
|
||
|
||
<h3>Kontakt</h3>
|
||
|
||
<label>Mobilnummer</label>
|
||
<input name="mobil"
|
||
value="<%= user.mobil || '' %>"
|
||
placeholder="Mobilnummer fehlt"
|
||
class="<%= user.mobil ? '' : 'empty-field' %>">
|
||
|
||
<label>Telefonnummer</label>
|
||
<input name="telefon"
|
||
value="<%= user.telefon || '' %>"
|
||
placeholder="Telefonnummer fehlt"
|
||
class="<%= user.telefon ? '' : 'empty-field' %>">
|
||
|
||
<label>E-Mail</label>
|
||
<input name="email"
|
||
type="email"
|
||
value="<%= user.email || '' %>"
|
||
placeholder="E-Mail fehlt"
|
||
class="<%= user.email ? '' : 'empty-field' %>">
|
||
|
||
<h3>SEPA Lastschrift</h3>
|
||
|
||
<label>Kontoinhaber</label>
|
||
<input name="kontoinhaber"
|
||
value="<%= user.kontoinhaber || '' %>"
|
||
placeholder="Kontoinhaber fehlt"
|
||
class="<%= user.kontoinhaber ? '' : 'empty-field' %>">
|
||
|
||
<label>IBAN</label>
|
||
<input name="iban"
|
||
value="<%= user.iban || '' %>"
|
||
placeholder="IBAN fehlt"
|
||
class="<%= user.iban ? '' : 'empty-field' %>">
|
||
|
||
<label>BIC</label>
|
||
<input name="bic"
|
||
value="<%= user.bic || '' %>"
|
||
placeholder="BIC fehlt"
|
||
class="<%= user.bic ? '' : 'empty-field' %>">
|
||
|
||
<label>Mandatsreferenz</label>
|
||
<input name="mandatsreferenz"
|
||
value="<%= user.mandatsreferenz || '' %>"
|
||
placeholder="Mandatsreferenz fehlt"
|
||
class="<%= user.mandatsreferenz ? '' : 'empty-field' %>">
|
||
|
||
<h3>Status</h3>
|
||
|
||
<label class="status">
|
||
<input type="checkbox"
|
||
name="gesperrt"
|
||
<%= user.gesperrt ? 'checked' : '' %>>
|
||
Mitglied gesperrt
|
||
</label>
|
||
|
||
<button type="submit">💾 Änderungen speichern</button>
|
||
|
||
</form>
|
||
|
||
<br>
|
||
<a href="/users/list">⬅ Zurück zur Mitgliederübersicht</a>
|
||
<%- include('partials/footer') %>
|
||
</div>
|
||
</body>
|
||
</html>
|