feat(cms): refactor page content management and implement detailed editors

Refactor the CMS page content system to use a more modular configuration-driven approach. This replaces the monolithic `pageContentConfig.js` with individual configuration files for each page and introduces a shared field utility to standardize editor components.
Key changes:
- Implement a generic `_renderSingletonPageView` helper to reduce duplication across controllers.
- Enhance `_createPageContentController` with `normalizeForEditor`, `normalizeForApi`, and `preparePayload` hooks for custom data transformation.
- Create dedicated configuration and view structures for Partnerships, History, Accreditation, Admissions, and Policies pages.
- Add a specialized section editor for Policies to manage complex nested content.
- Improve the frontend `page-content-editor.js` with support for visibility logic, auto-sequencing for arrays, and URL synchronization for active tabs.
- Update data JSON files to align with the new schema.
This commit is contained in:
Tống Thành Đạt
2026-04-20 19:43:28 +07:00
parent 8b6bf5fe6e
commit 7df3a6f6bf
58 changed files with 7501 additions and 844 deletions
+79
View File
@@ -0,0 +1,79 @@
<div class="container">
<div class="d-flex justify-content-between align-items-center mt-4 mb-4">
<div>
<h1 class="h3 mb-0" style="color: var(--primary-dark)"><%= title %></h1>
<p class="text-muted mb-0"><%= subtitle %></p>
</div>
<div>
<a href="<%= previewUrl %>" class="btn btn-outline-primary" target="_blank">
<i class="fas fa-external-link-alt me-2"></i>View Page
</a>
</div>
</div>
<div class="row">
<div class="col-12">
<form action="/admin/partnerships/update" method="POST" id="cmsEditorForm" class="content-with-fixed-buttons" novalidate>
<input type="hidden" name="pageJson" id="pageJson" />
<input type="hidden" name="activeTab" id="activeTabInput" value="<%= activeTab %>" />
<div class="card shadow-sm border-0 mb-4">
<div class="card-header bg-white border-bottom">
<ul class="nav nav-tabs card-header-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link <%= activeTab === 'hero' ? 'active' : '' %>" data-bs-toggle="tab" href="#hero" role="tab" data-tab-key="hero">
<i class="fas fa-image me-2"></i>Hero
</a>
</li>
<li class="nav-item">
<a class="nav-link <%= activeTab === 'directory' ? 'active' : '' %>" data-bs-toggle="tab" href="#directory" role="tab" data-tab-key="directory">
<i class="fas fa-handshake me-2"></i>Partner Directory
</a>
</li>
<li class="nav-item">
<a class="nav-link <%= activeTab === 'cta' ? 'active' : '' %>" data-bs-toggle="tab" href="#cta" role="tab" data-tab-key="cta">
<i class="fas fa-bullhorn me-2"></i>Call To Action
</a>
</li>
<li class="nav-item">
<a class="nav-link <%= activeTab === 'inquiryForm' ? 'active' : '' %>" data-bs-toggle="tab" href="#inquiryForm" role="tab" data-tab-key="inquiryForm">
<i class="fas fa-envelope me-2"></i>Inquiry Form
</a>
</li>
</ul>
</div>
<div class="tab-content">
<%- include("partials/hero-tab", { activeTab, data, backendUrl }) %>
<%- include("partials/directory-tab", { activeTab, data }) %>
<%- include("partials/cta-tab", { activeTab, data }) %>
<%- include("partials/inquiry-form-tab", { activeTab, data }) %>
</div>
</div>
<div class="fixed-bottom-buttons">
<button type="button" class="btn btn-secondary" id="resetPartnershipsForm">
<i class="fas fa-undo"></i>
<span>Reset</span>
</button>
<button type="submit" class="btn btn-primary">
<i class="fas fa-save"></i>
<span>Save Changes</span>
</button>
</div>
</form>
</div>
</div>
</div>
<%- include("partials/templates") %>
<script>
window.partnershipsPageData = <%- JSON.stringify(data) %>;
window.partnershipsBackendUrl = <%- JSON.stringify(backendUrl) %>;
</script>
<%- include("partials/editor-script") %>