From 73b881db9db787fcd49e932702c263006f5e0144 Mon Sep 17 00:00:00 2001
From: Ethan-clay03 <ethanclay2017@gmail.com>
Date: Wed, 19 Feb 2025 13:12:45 +0000
Subject: [PATCH] Add listing images and link book now buttons on main page
---
app/bookings/routes.py | 16 +++++--
app/templates/bookings/listing.html | 65 ++++++++++++++++-------------
app/templates/index.html | 2 +-
3 files changed, 49 insertions(+), 34 deletions(-)
diff --git a/app/bookings/routes.py b/app/bookings/routes.py
index 21a5c45..d1629d4 100644
--- a/app/bookings/routes.py
+++ b/app/bookings/routes.py
@@ -179,8 +179,8 @@ def listing(id):
session['listing']['economy_fair_cost'] = listing.economy_fair_cost
session['listing']['business_fair_cost'] = listing.business_fair_cost
- listing.depart_time = pretty_time(listing.depart_time)
- listing.destination_time = pretty_time(listing.destination_time)
+ depart_time = pretty_time(listing.depart_time)
+ destination_time = pretty_time(listing.destination_time)
filter_data = session.pop('filter_data', None)
selected_date = filter_data['date'] if filter_data and 'date' in filter_data else None
@@ -193,6 +193,13 @@ def listing(id):
else:
base_price = listing.economy_fair_cost
+ main_image_url = None
+ for image in listing.listing_images:
+ if image.main_image == 1:
+ main_image_url = image.image_location
+ break
+
+
discounted_price = base_price * (1 - discount / 100)
total_cost = discounted_price
@@ -205,7 +212,10 @@ def listing(id):
days_away=days_away,
base_price=base_price,
discounted_price=discounted_price,
- total_cost=total_cost
+ total_cost=total_cost,
+ depart_time = depart_time,
+ destination_time = destination_time,
+ main_image_url = main_image_url
)
# This route should be used after show_listing if used internally as this clears the ajax parameters before redirecting the user
diff --git a/app/templates/bookings/listing.html b/app/templates/bookings/listing.html
index f165b55..7e41f51 100644
--- a/app/templates/bookings/listing.html
+++ b/app/templates/bookings/listing.html
@@ -4,37 +4,42 @@
<div id="discountBanner" class="alert alert-success" role="alert" style="display: {% if discount > 0 %}block{% else %}none{% endif %};">
Special Offer! Get <span id="discountPercent">{{ discount }}</span>% off on your booking as you are booking <span id="daysAway">{{ days_away }}</span> days away!
</div>
- <div class="date-container">
- <div class="col-md-6 text-start mb-3 d-flex align-items-center flex-md-nowrap flex-wrap">
- <label class="form-label me-2">Departure Date:</label>
- <div class="col-md-6">
- <input type="date" class="form-control" id="departDate" name="departDate" required value="{{ selected_date or today }}">
+ <div class="row">
+ <div class="col-md-6">
+ <div class="date-container mb-3 d-flex align-items-center flex-md-nowrap flex-wrap">
+ <label class="form-label me-2">Departure Date:</label>
+ <div class="col-md-6">
+ <input type="date" class="form-control" id="departDate" name="departDate" required value="{{ selected_date or today }}">
+ </div>
+ <button type="button" class="btn btn-warning ms-2" id="resetDate">
+ <i class="fa-solid fa-rotate-right"></i> Reset Date
+ </button>
</div>
- <button type="button" class="btn btn-warning ms-2" id="resetDate">
- <i class="fa-solid fa-rotate-right"></i> Reset Date
- </button>
- </div>
- <div class="col-md-6 text-start mb-3 d-flex align-items-center flex-md-nowrap flex-wrap">
- <label class="form-label me-2">Number of Seats:</label>
- <div class="col-md-6">
- <select class="form-select" id="numSeats" name="numSeats">
- <option value="1">1</option>
- <option value="2">2</option>
- <option value="3">3</option>
- <option value="4">4</option>
- <option value="5">5</option>
- </select>
+ <div class="mb-3 d-flex align-items-center flex-md-nowrap flex-wrap">
+ <label class="form-label me-2">Number of Seats:</label>
+ <div class="col-md-6">
+ <select class="form-select" id="numSeats" name="numSeats">
+ <option value="1">1</option>
+ <option value="2">2</option>
+ <option value="3">3</option>
+ <option value="4">4</option>
+ <option value="5">5</option>
+ </select>
+ </div>
</div>
- </div>
- <div class="col-md-6 text-start mb-3 d-flex align-items-center flex-md-nowrap flex-wrap">
- <label class="form-label me-2">Seat Type:</label>
- <div class="col-md-6">
- <select class="form-select" id="seatType" name="seatType">
- <option value="economy" {% if seat_type == 'economy' %}selected{% endif %}>Economy</option>
- <option value="business" {% if seat_type == 'business' %}selected{% endif %}>Business</option>
- </select>
+ <div class="mb-3 d-flex align-items-center flex-md-nowrap flex-wrap">
+ <label class="form-label me-2">Seat Type:</label>
+ <div class="col-md-6">
+ <select class="form-select" id="seatType" name="seatType">
+ <option value="economy" {% if seat_type == 'economy' %}selected{% endif %}>Economy</option>
+ <option value="business" {% if seat_type == 'business' %}selected{% endif %}>Business</option>
+ </select>
+ </div>
</div>
- </div>
+ </div>
+ <div class="col-md-6 d-flex justify-content-end">
+ <img src="{{ url_for('main.upload_file', filename=main_image_url) }}" class="card-img-top" style="max-width: 200px;" loading="lazy" alt="Main Image">
+ </div>
</div>
<h2 class="mb-4" style="text-align: center; margin-top: 40px;">Booking Details</h2>
<div class="row">
@@ -43,7 +48,7 @@
<div class="card-body">
<h2 class="card-title">Departure Information</h2>
<p><strong>Location:</strong> {{ listing.depart_location }}</p>
- <p><strong>Time:</strong> {{ listing.depart_time }}</p>
+ <p><strong>Time:</strong> {{ depart_time }}</p>
</div>
</div>
</div>
@@ -52,7 +57,7 @@
<div class="card-body">
<h2 class="card-title">Destination Information</h2>
<p><strong>Location:</strong> {{ listing.destination_location }}</p>
- <p><strong>Time:</strong> {{ listing.destination_time }}</p>
+ <p><strong>Time:</strong> {{ destination_time }}</p>
</div>
</div>
</div>
diff --git a/app/templates/index.html b/app/templates/index.html
index 86c348a..90315b7 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -79,7 +79,7 @@
</div>
<div class="card-body p-3 p-xl-4">
<h3 class="card-title h5">{{listing.destination_location}}</h3>
- <div><a href="#" class="btn btn-primary">Book now</a>
+ <div><a href="{{ url_for('bookings.listing', id=listing.id) }}" class="btn btn-primary">Book now</a>
</div>
</div>
</div>
--
GitLab