Update templates/edit_profile.html

#8
Files changed (1) hide show
  1. templates/edit_profile.html +44 -20
templates/edit_profile.html CHANGED
@@ -3,46 +3,70 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Edit Profile</title>
7
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8
  </head>
9
  <body>
10
  <div class="container mt-4">
11
- <h1>Edit Profile</h1>
12
- <!-- Display success or error messages -->
13
- {% with messages = get_flashed_messages(with_categories=true) %}
14
- {% if messages %}
15
- <div class="alert alert-{{ messages[0][0] }}">
16
- {{ messages[0][1] }}
17
- </div>
18
- {% endif %}
19
- {% endwith %}
20
 
21
  <form method="POST">
22
  <div class="mb-3">
23
- <label for="name" class="form-label">Full Name</label>
24
- <input type="text" class="form-control" id="name" name="name" value="{{ user_name }}" required>
 
25
  </div>
26
 
27
  <div class="mb-3">
28
- <label for="email" class="form-label">Email address</label>
29
- <input type="email" class="form-control" id="email" name="email" value="{{ user_email }}" required>
 
30
  </div>
31
 
32
  <div class="mb-3">
33
- <label for="phone" class="form-label">Phone Number</label>
34
- <input type="tel" class="form-control" id="phone" name="phone" value="{{ user_phone }}" required>
 
35
  </div>
36
 
37
  <div class="mb-3">
38
- <label for="password" class="form-label">New Password (Optional)</label>
39
- <input type="password" class="form-control" id="password" name="password" placeholder="Leave blank to keep the current password">
 
 
 
 
 
 
 
40
  </div>
41
 
42
  <button type="submit" class="btn btn-primary">Update Profile</button>
43
  </form>
44
- </div>
45
 
46
- <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
 
47
  </body>
48
  </html>
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Update Profile</title>
7
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
8
+ <style>
9
+ .back-to-menu {
10
+ display: block;
11
+ margin: 30px auto 10px auto;
12
+ padding: 10px 20px;
13
+ background-color: #ff5722;
14
+ color: #ffffff;
15
+ border: none;
16
+ border-radius: 25px;
17
+ font-size: 1rem;
18
+ font-weight: bold;
19
+ text-align: center;
20
+ text-decoration: none;
21
+ width: 100%;
22
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
23
+ transition: background-color 0.3s ease;
24
+ }
25
+ .back-to-menu:hover {
26
+ background-color: #e64a19;
27
+ text-decoration: none;
28
+ }
29
+ </style>
30
  </head>
31
  <body>
32
  <div class="container mt-4">
33
+ <h1>Update Profile</h1>
 
 
 
 
 
 
 
 
34
 
35
  <form method="POST">
36
  <div class="mb-3">
37
+ <label for="customerName" class="form-label"><strong>Name:</strong></label>
38
+ <input type="text" class="form-control" id="customerName" name="customerName" value="{{ customer['name'] }}" readonly>
39
+ <button type="button" class="btn btn-outline-secondary mt-2" onclick="enableEditField('customerName')">Change</button>
40
  </div>
41
 
42
  <div class="mb-3">
43
+ <label for="email" class="form-label"><strong>Email:</strong></label>
44
+ <input type="email" class="form-control" id="email" name="email" value="{{ customer['email'] }}" readonly>
45
+ <button type="button" class="btn btn-outline-secondary mt-2" onclick="enableEditField('email')">Change</button>
46
  </div>
47
 
48
  <div class="mb-3">
49
+ <label for="phone" class="form-label"><strong>Phone:</strong></label>
50
+ <input type="text" class="form-control" id="phone" name="phone" value="{{ customer['phone'] }}" readonly>
51
+ <button type="button" class="btn btn-outline-secondary mt-2" onclick="enableEditField('phone')">Change</button>
52
  </div>
53
 
54
  <div class="mb-3">
55
+ <label for="referralCode" class="form-label"><strong>Referral Code:</strong></label>
56
+ <input type="text" class="form-control" id="referralCode" name="referralCode" value="{{ customer['referral_code'] }}" readonly>
57
+ <button type="button" class="btn btn-outline-secondary mt-2" onclick="enableEditField('referralCode')">Change</button>
58
+ </div>
59
+
60
+ <div class="mb-3">
61
+ <label for="rewardPoints" class="form-label"><strong>Reward Points:</strong></label>
62
+ <input type="text" class="form-control" id="rewardPoints" name="rewardPoints" value="{{ customer['reward_points'] }}" readonly>
63
+ <button type="button" class="btn btn-outline-secondary mt-2" onclick="enableEditField('rewardPoints')">Change</button>
64
  </div>
65
 
66
  <button type="submit" class="btn btn-primary">Update Profile</button>
67
  </form>
 
68
 
69
+ <a href="/menu" class="back-to-menu">Back to Menu</a>
70
+ </div>
71
  </body>
72
  </html>