04/27 Updated customer invitation allow customer to create username & password 3
This commit is contained in:
@@ -14,8 +14,9 @@
|
||||
<div class="card-body">
|
||||
|
||||
<p class="text-muted mb-4" style="font-size:.9rem;">
|
||||
Enter the customer's details and set their login credentials.
|
||||
The account will be active immediately.
|
||||
Enter the customer's name and email address. An invitation email will be
|
||||
sent automatically with a secure link where they can choose their own
|
||||
username and password. The account will be activated once they complete that step.
|
||||
</p>
|
||||
|
||||
<form method="POST">
|
||||
@@ -30,50 +31,22 @@
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<div class="mb-4">
|
||||
{{ form.email.label(class="form-label fw-semibold") }}
|
||||
{{ form.email(class="form-control" + (" is-invalid" if form.email.errors else ""),
|
||||
placeholder="jane@example.com") }}
|
||||
{% for error in form.email.errors %}
|
||||
<div class="invalid-feedback">{{ error }}</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
{{ form.username.label(class="form-label fw-semibold") }}
|
||||
{{ form.username(class="form-control" + (" is-invalid" if form.username.errors else ""),
|
||||
placeholder="e.g. jsmith") }}
|
||||
{% for error in form.username.errors %}
|
||||
<div class="invalid-feedback">{{ error }}</div>
|
||||
{% endfor %}
|
||||
<div class="form-text">
|
||||
<i class="bi bi-person me-1"></i>
|
||||
Used to log in. Lowercase letters, numbers, dots, hyphens, and underscores only.
|
||||
<i class="bi bi-envelope me-1"></i>
|
||||
An invitation email with an account setup link will be sent to this address.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
{{ form.password.label(class="form-label fw-semibold") }}
|
||||
{{ form.password(class="form-control" + (" is-invalid" if form.password.errors else ""),
|
||||
autocomplete="new-password") }}
|
||||
{% for error in form.password.errors %}
|
||||
<div class="invalid-feedback">{{ error }}</div>
|
||||
{% endfor %}
|
||||
<div class="form-text">Minimum 8 characters.</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
{{ form.confirm_password.label(class="form-label fw-semibold") }}
|
||||
{{ form.confirm_password(class="form-control" + (" is-invalid" if form.confirm_password.errors else ""),
|
||||
autocomplete="new-password") }}
|
||||
{% for error in form.confirm_password.errors %}
|
||||
<div class="invalid-feedback">{{ error }}</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="d-flex gap-2">
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<i class="bi bi-person-check me-1"></i>Create Account
|
||||
<i class="bi bi-send me-1"></i>Create & Send Invitation
|
||||
</button>
|
||||
<a href="{{ url_for('customers.index') }}" class="btn btn-outline-secondary">
|
||||
<i class="bi bi-x-circle me-1"></i>Cancel
|
||||
@@ -90,9 +63,9 @@
|
||||
<strong>What happens next:</strong>
|
||||
</p>
|
||||
<ol class="mb-0 ps-3" style="font-size:.8rem; color:#555;">
|
||||
<li>The account is created immediately and the customer can log in right away.</li>
|
||||
<li>A welcome email is sent to the customer with a link to the login page.</li>
|
||||
<li>Assign the customer to Contracts or Facilities from their profile page.</li>
|
||||
<li>An invitation email is sent to the customer with a secure 72-hour link.</li>
|
||||
<li>The customer clicks the link and chooses their own username and password.</li>
|
||||
<li>The account becomes fully active and they can log in immediately.</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -32,7 +32,7 @@
|
||||
<div class="setup-card">
|
||||
<div class="setup-header">
|
||||
<h4><i class="bi bi-shield-lock me-2"></i>Set Your Password</h4>
|
||||
<p>Welcome, {{ user.display_name }}. Choose a secure password to activate your account.</p>
|
||||
<p>Welcome, {{ user.display_name }}. Choose your username and a secure password to activate your account.</p>
|
||||
</div>
|
||||
<div class="setup-body">
|
||||
|
||||
@@ -49,14 +49,30 @@
|
||||
<form method="POST" id="setPasswordForm" novalidate>
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label fw-semibold">Choose a Username</label>
|
||||
<input type="text"
|
||||
id="username"
|
||||
name="username"
|
||||
class="form-control {{ 'is-invalid' if form.username.errors else '' }}"
|
||||
autocomplete="username"
|
||||
autofocus
|
||||
maxlength="100">
|
||||
{% for error in form.username.errors %}
|
||||
<div class="invalid-feedback">{{ error }}</div>
|
||||
{% endfor %}
|
||||
<div class="form-text" style="font-size:.78rem;">
|
||||
3–100 characters. You will use this to log in.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label fw-semibold">New Password</label>
|
||||
<input type="password"
|
||||
id="password"
|
||||
name="password"
|
||||
class="form-control {{ 'is-invalid' if form.password.errors else '' }}"
|
||||
autocomplete="new-password"
|
||||
autofocus>
|
||||
autocomplete="new-password">
|
||||
{% for error in form.password.errors %}
|
||||
<div class="invalid-feedback">{{ error }}</div>
|
||||
{% endfor %}
|
||||
@@ -96,7 +112,7 @@
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary w-100" id="submitBtn">
|
||||
<i class="bi bi-check2-circle me-1"></i>Set Password & Log In
|
||||
<i class="bi bi-check2-circle me-1"></i>Activate Account & Log In
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
@@ -160,4 +176,4 @@
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
Reference in New Issue
Block a user