refactor: enhance home page structure and content management

This commit is contained in:
Wini_Fy
2026-02-05 21:19:51 +07:00
parent 3ac250b6a8
commit 7ec9bccad5
11 changed files with 951 additions and 602 deletions

View File

@@ -13,114 +13,76 @@
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-medium">Heading</label>
<input
type="text"
class="form-control"
id="visaCountriesHeading"
value="<%= data.visaCountries?.heading || '' %>"
placeholder="e.g., Visa & VISAWAY Services To UK"
/>
<input type="text" class="form-control" id="visaCountriesHeading"
value="<%= data.visaCountries?.heading || '' %>" placeholder="e.g., Visa & VISAWAY Services To UK" />
</div>
<div class="col-md-6">
<label class="form-label fw-medium">Subheading</label>
<input
type="text"
class="form-control"
id="visaCountriesSubheading"
value="<%= data.visaCountries?.subheading || '' %>"
placeholder="e.g., UK. United Kingdom"
/>
<input type="text" class="form-control" id="visaCountriesSubheading"
value="<%= data.visaCountries?.subheading || '' %>" placeholder="e.g., UK. United Kingdom" />
</div>
<div class="col-md-12">
<label class="form-label fw-medium">Description</label>
<textarea
class="form-control"
id="visaCountriesDescription"
rows="3"
placeholder="Enter description"
><%= data.visaCountries?.description || '' %></textarea>
<textarea class="form-control" id="visaCountriesDescription" rows="3"
placeholder="Enter description"><%= data.visaCountries?.description || '' %></textarea>
</div>
</div>
</div>
</div>
</div>
<!-- Countries -->
<!-- Countries (Featured Country configuration) -->
<div class="col-md-12">
<div class="card border shadow-sm">
<div class="card-header bg-white">
<h6 class="mb-0">
<i class="fas fa-globe me-2"></i>Countries
<i class="fas fa-globe me-2"></i>Featured Country
</h6>
<small class="text-muted">This country is used in the home page feature section.</small>
</div>
<div class="card-body">
<% (data.visaCountries?.countries || []).forEach(function(country, index) { %>
<div class="card mb-3 bg-light border">
<div class="card-body">
<h6 class="card-title fw-bold mb-3">Country <%= index + 1 %></h6>
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-medium">Country Name</label>
<input
type="text"
class="form-control"
id="visaCountriesName_<%= index %>"
value="<%= country.name || '' %>"
placeholder="e.g., United Kingdom"
/>
</div>
<div class="col-md-6">
<label class="form-label fw-medium">Country Code</label>
<input
type="text"
class="form-control"
id="visaCountriesCode_<%= index %>"
value="<%= country.code || '' %>"
placeholder="e.g., UK"
/>
</div>
<div class="col-md-6">
<label class="form-label fw-medium">Flag Image</label>
<div class="input-group mb-2">
<input
type="text"
class="form-control"
id="visaCountriesFlag_<%= index %>"
value="<%= country.flag || '' %>"
/>
<button
type="button"
class="btn btn-outline-primary btn-upload-image"
data-target-input="visaCountriesFlag_<%= index %>"
data-image-type="home"
>
<i class="fas fa-upload me-1"></i>Upload
</button>
<% const featured=(data.visaCountries && Array.isArray(data.visaCountries.countries) &&
data.visaCountries.countries.length> 0)
? data.visaCountries.countries[0]
: {};
%>
<div class="card mb-3 bg-light border visa-country-item" data-index="0">
<div class="card-body">
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-medium">Country Name</label>
<input type="text" class="form-control" id="visaCountriesName_0" value="<%= featured.name || '' %>"
placeholder="e.g., United Kingdom" />
</div>
<div class="col-md-6">
<label class="form-label fw-medium">Country Code</label>
<input type="text" class="form-control" id="visaCountriesCode_0" value="<%= featured.code || '' %>"
placeholder="e.g., UK" />
</div>
<div class="col-md-6">
<label class="form-label fw-medium">Flag / Illustration Image</label>
<div class="input-group mb-2">
<input type="text" class="form-control" id="visaCountriesFlag_0"
value="<%= featured.flag || '' %>" placeholder="/assets/img/home-1/feature/shape.png" />
<button type="button" class="btn btn-outline-primary btn-upload-image"
data-target-input="visaCountriesFlag_0" data-image-type="home">
<i class="fas fa-upload me-1"></i>Upload
</button>
</div>
</div>
<div class="col-md-6">
<label class="form-label fw-medium">Link</label>
<input type="text" class="form-control" id="visaCountriesLink_0" value="<%= featured.link || '' %>"
placeholder="/country-details/uk" />
</div>
<div class="col-md-12">
<label class="form-label fw-medium">Visa Types (comma-separated)</label>
<textarea class="form-control" id="visaCountriesVisaTypes_0" rows="2"
placeholder="e.g., Student Visa, Work Visa, Tourist Visa"><%= (featured.visaTypes || []).join(', ') %></textarea>
</div>
</div>
<div class="col-md-6">
<label class="form-label fw-medium">Link</label>
<input
type="text"
class="form-control"
id="visaCountriesLink_<%= index %>"
value="<%= country.link || '' %>"
placeholder="/country-details/uk"
/>
</div>
<div class="col-md-12">
<label class="form-label fw-medium">Visa Types (comma-separated)</label>
<textarea
class="form-control"
id="visaCountriesVisaTypes_<%= index %>"
rows="2"
placeholder="e.g., Student Visa, Work Visa, Tourist Visa"
><%= (country.visaTypes || []).join(', ') %></textarea>
</div>
</div>
</div>
</div>
<% }); %>
</div>
</div>
</div>
@@ -137,23 +99,13 @@
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-medium">Label</label>
<input
type="text"
class="form-control"
id="visaCountriesCtaLabel"
value="<%= data.visaCountries?.ctaButton?.label || '' %>"
placeholder="e.g., Get Started"
/>
<input type="text" class="form-control" id="visaCountriesCtaLabel"
value="<%= data.visaCountries?.ctaButton?.label || '' %>" placeholder="e.g., Get Started" />
</div>
<div class="col-md-6">
<label class="form-label fw-medium">Link</label>
<input
type="text"
class="form-control"
id="visaCountriesCtaHref"
value="<%= data.visaCountries?.ctaButton?.href || '' %>"
placeholder="/contact"
/>
<input type="text" class="form-control" id="visaCountriesCtaHref"
value="<%= data.visaCountries?.ctaButton?.href || '' %>" placeholder="/contact" />
</div>
</div>
</div>
@@ -161,3 +113,33 @@
</div>
</div>
</div>
<script>
// Register scraper to collect Visa Countries data before form submit
window.homeScrapers = window.homeScrapers || {};
window.homeScrapers.visaCountries = () => {
const getVal = (id) => (document.getElementById(id)?.value || "").trim();
const visaTypesRaw = getVal("visaCountriesVisaTypes_0");
const visaTypes = visaTypesRaw ? visaTypesRaw.split(",").map((s) => s.trim()).filter(Boolean) : [];
const featuredCountry = {
name: getVal("visaCountriesName_0"),
code: getVal("visaCountriesCode_0"),
flag: getVal("visaCountriesFlag_0"),
link: getVal("visaCountriesLink_0"),
visaTypes
};
return {
heading: getVal("visaCountriesHeading"),
subheading: getVal("visaCountriesSubheading"),
description: getVal("visaCountriesDescription"),
countries: [featuredCountry],
ctaButton: {
label: getVal("visaCountriesCtaLabel"),
href: getVal("visaCountriesCtaHref")
}
};
};
</script>