177 lines
6.8 KiB
HTML
177 lines
6.8 KiB
HTML
@include 'header.html'
|
|
|
|
<div class="container mt-5">
|
|
<div class="row">
|
|
<div class="col-md-8 mx-auto">
|
|
<div class="card">
|
|
<div class="card-header bg-primary text-white">
|
|
<h3>My Profile</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<h4>@{user.first_name} @{user.last_name}</h4>
|
|
<p><i class="bi bi-envelope"></i> @{user.email}</p>
|
|
<p>
|
|
<i class="bi bi-gender-ambiguous"></i>
|
|
@{user.gender}
|
|
</p>
|
|
</div>
|
|
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5>Update Profile</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<form
|
|
action="/controller/user/update"
|
|
method="post"
|
|
>
|
|
<input
|
|
type="hidden"
|
|
name="id"
|
|
value="@{user.id}"
|
|
/>
|
|
|
|
<div class="mb-3">
|
|
<label for="first_name" class="form-label"
|
|
>First Name</label
|
|
>
|
|
<input
|
|
type="text"
|
|
class="form-control"
|
|
id="first_name"
|
|
name="first_name"
|
|
value="@{user.first_name}"
|
|
/>
|
|
<div
|
|
class="text-danger first_name-error field-error"
|
|
></div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="last_name" class="form-label"
|
|
>Last Name</label
|
|
>
|
|
<input
|
|
type="text"
|
|
class="form-control"
|
|
id="last_name"
|
|
name="last_name"
|
|
value="@{user.last_name}"
|
|
/>
|
|
<div
|
|
class="text-danger last_name-error field-error"
|
|
></div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="password" class="form-label"
|
|
>New Password (leave empty to keep
|
|
current)</label
|
|
>
|
|
<input
|
|
type="password"
|
|
class="form-control"
|
|
id="password"
|
|
name="password"
|
|
/>
|
|
<div
|
|
class="text-danger password-error field-error"
|
|
></div>
|
|
</div>
|
|
|
|
<div class="d-grid">
|
|
<button
|
|
type="submit"
|
|
class="btn btn-primary"
|
|
>
|
|
Update Profile
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5>Account Actions</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-grid gap-2">
|
|
<a href="/logout" class="btn btn-danger"
|
|
>Logout</a
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="response-container"></div>
|
|
|
|
<script>
|
|
document.querySelector("form").addEventListener("submit", function (e) {
|
|
e.preventDefault();
|
|
const form = e.target;
|
|
const formData = new FormData(form);
|
|
|
|
fetch(form.action, {
|
|
method: "POST",
|
|
body: formData,
|
|
})
|
|
.then((response) => response.text())
|
|
.then((html) => {
|
|
document.getElementById("response-container").innerHTML = html;
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<div class="card mt-4">
|
|
<div class="card-header">
|
|
<h5>My Bookings</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
@if bookings.len > 0
|
|
<div class="table-responsive">
|
|
<table class="table table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>From</th>
|
|
<th>To</th>
|
|
<th>Departure</th>
|
|
<th>Price</th>
|
|
<th>Status</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@for flight in flights
|
|
<tr>
|
|
<td>@{flight.from}</td>
|
|
<td>@{flight.to}</td>
|
|
<td>@{flight.departure}</td>
|
|
<td>$@{flight.price}</td>
|
|
<td>
|
|
@if flight.bookings[0].status == 'confirmed'
|
|
<span class="badge bg-success">Confirmed</span>
|
|
@else if flight.bookings[0].status == 'cancelled'
|
|
<span class="badge bg-danger">Cancelled</span>
|
|
@else
|
|
<span class="badge bg-warning">Pending</span>
|
|
@end
|
|
</td>
|
|
</tr>
|
|
@end
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
@else
|
|
<p class="text-center text-muted">No bookings found</p>
|
|
@end
|
|
</div>
|
|
</div>
|
|
|
|
@include 'footer.html'
|