NguyenThanhToan/cms.techvanguard.vn
1
0
Fork 0
forked from UKSOURCE/cms.lams
Code Pull Requests Activity

feat(cms): enhance content editors with dynamic UI configs and validation

Browse Source 
Implement a more flexible, configuration-driven approach for CMS editors across accreditation, admissions, and partnerships modules.
- Move UI labels, help texts, and field limits from hardcoded views to `editorUi` configurations in config files.
- Add server-side and client-side validation to prevent duplicate category tabs in accreditation and partnerships editors.
- Refactor partnership and admission views to dynamically render tabs and fields based on the provided configuration.
- Update field length constraints and default values across multiple content editors to better align with frontend requirements.
- Improve the admissions calculator editor with dynamic field configurations and default value fallbacks.
This commit is contained in:
Tống Thành Đạt
2026-04-22 18:06:03 +07:00
parent a44d005c13
commit a39c336dd4
19 changed files with 790 additions and 228 deletions
Download Patch File Download Diff File Expand all files Collapse all files
views/admin/partnerships/partials/hero-tab.ejs
+13 -12
View File
@@ -1,4 +1,5 @@
<div class="tab-pane fade <%= activeTab === 'hero' ? 'show active' : '' %>" id="hero" role="tabpanel">
<% const heroUi = editorUi.hero || {}; %>
<div class="card border shadow-sm">
<div class="card-header bg-white">
<h6 class="mb-0"><i class="fas fa-image me-2"></i>Hero</h6>
@@ -6,35 +7,35 @@
<div class="card-body p-4">
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-semibold">Eyebrow label</label>
<input class="form-control" id="heroBadge" maxlength="40" value="<%= data.hero?.badge || '' %>">
<label class="form-label fw-semibold"><%= heroUi.badge?.label || "Eyebrow label" %></label>
<input class="form-control" id="heroBadge" maxlength="<%= heroUi.badge?.maxLength || 40 %>" value="<%= data.hero?.badge || '' %>">
</div>
<div class="col-md-6">
<label class="form-label fw-semibold">Scroll link label</label>
<input class="form-control" id="heroLinkLabel" maxlength="40" value="<%= data.hero?.linkLabel || '' %>">
<label class="form-label fw-semibold"><%= heroUi.linkLabel?.label || "Scroll link label" %></label>
<input class="form-control" id="heroLinkLabel" maxlength="<%= heroUi.linkLabel?.maxLength || 40 %>" value="<%= data.hero?.linkLabel || '' %>">
</div>
<div class="col-12">
<label class="form-label fw-semibold">Headline</label>
<input class="form-control" id="heroTitle" maxlength="90" value="<%= data.hero?.title || '' %>">
<label class="form-label fw-semibold"><%= heroUi.title?.label || "Headline" %></label>
<input class="form-control" id="heroTitle" maxlength="<%= heroUi.title?.maxLength || 90 %>" value="<%= data.hero?.title || '' %>">
</div>
<div class="col-12">
<label class="form-label fw-semibold">Supporting text</label>
<textarea class="form-control" id="heroDescription" rows="4" maxlength="220"><%= data.hero?.description || '' %></textarea>
<label class="form-label fw-semibold"><%= heroUi.description?.label || "Supporting text" %></label>
<textarea class="form-control" id="heroDescription" rows="<%= heroUi.description?.rows || 4 %>" maxlength="<%= heroUi.description?.maxLength || 220 %>"><%= data.hero?.description || '' %></textarea>
</div>
<div class="col-12">
<label class="form-label fw-semibold">Hero image</label>
<label class="form-label fw-semibold"><%= heroUi.image?.label || "Hero image" %></label>
<div class="input-group">
<input class="form-control" id="heroImage" value="<%= data.hero?.image || '' %>">
<button class="btn btn-outline-primary" type="button" data-upload-target="heroImage" data-preview-target="heroImagePreview">
<i class="fas fa-upload me-1"></i>Upload
</button>
</div>
<div class="form-text">Recommended 720x630 px</div>
<div class="form-text"><%= [heroUi.image?.helpText, heroUi.image?.imageHint].filter(Boolean).join(" ") %></div>
<img id="heroImagePreview" src="<%= data.hero?.image ? `${backendUrl}${data.hero.image}` : '' %>" class="img-thumbnail mt-2 <%= data.hero?.image ? '' : 'd-none' %>" style="max-height: 200px;">
</div>
<div class="col-12">
<label class="form-label fw-semibold">Hero image alt text</label>
<input class="form-control" id="heroImageAlt" maxlength="120" value="<%= data.hero?.imageAlt || '' %>">
<label class="form-label fw-semibold"><%= heroUi.imageAlt?.label || "Hero image alt text" %></label>
<input class="form-control" id="heroImageAlt" maxlength="<%= heroUi.imageAlt?.maxLength || 120 %>" value="<%= data.hero?.imageAlt || '' %>">
</div>
</div>
</div>