From b3bef037c4c1d96e0585236e1db807aeaf27edf1 Mon Sep 17 00:00:00 2001
From: r2xrzh9q2z-lab <r2xrzh9q2z@privaterelay.appleid.com>
Date: Fri, 6 Feb 2026 14:53:45 +0700
Subject: [PATCH] update contact img

---
 views/admin/visa/index.ejs | 39 ++++++++++++++++++++++++++++++++++----
 1 file changed, 35 insertions(+), 4 deletions(-)

diff --git a/views/admin/visa/index.ejs b/views/admin/visa/index.ejs
index 8ebd107..efefb65 100644
--- a/views/admin/visa/index.ejs
+++ b/views/admin/visa/index.ejs
@@ -362,6 +362,19 @@
                       </div>
                       <div class="card-body">
                         <div class="row g-3">
+                           <div class="col-md-12">
+                            <label class="form-label fw-medium">Image Contact</label>
+                            <div class="input-group mb-2">
+                              <input type="text" id="contact_image_input" name="contact_image" class="form-control" placeholder="/uploads/visa/contact-image.jpg" required />
+                              <button type="button" class="btn btn-outline-secondary" onclick="document.getElementById('fileContactImageInput').click()">
+                                <i class="fas fa-upload"></i>
+                              </button>
+                            </div>
+                            <input type="file" id="fileContactImageInput" style="display:none" accept="image/*"/>
+                            <div style="margin-top: 10px;">
+                              <img id="preview_contact_image" src="" alt="Contact Image Preview" style="max-width: 200px; max-height: 150px; object-fit: cover; display: none; border-radius: 4px; border: 1px solid #ddd;">
+                            </div>
+                          </div>
                           <div class="col-md-12">
                             <label class="form-label fw-medium">Section Title</label>
                             <input type="text" name="contact_sectionTitle" class="form-control" placeholder="e.g. Visa & Immigration" required/>
@@ -452,18 +465,20 @@
 
     // Image upload handler
     function setupImageUploadHandlers() {
-        const imageInputs = ["fileFlagInput", "fileDetailMainInput", "fileGalleryInput1", "fileGalleryInput2"];
+        const imageInputs = ["fileFlagInput", "fileDetailMainInput", "fileGalleryInput1", "fileGalleryInput2", "fileContactImageInput"];
         const previewMap = {
             fileFlagInput: "preview_icon",
             fileDetailMainInput: "preview_main_detail",
             fileGalleryInput1: "preview_bannerImageGallery1",
-            fileGalleryInput2: "preview_bannerImageGallery2"
+            fileGalleryInput2: "preview_bannerImageGallery2",
+            fileContactImageInput: "preview_contact_image"
         };
         const inputMap = {
             fileFlagInput: "icon_input",
             fileDetailMainInput: "mainImage_detail",
             fileGalleryInput1: "bannerImageGallery1",
-            fileGalleryInput2: "bannerImageGallery2"
+            fileGalleryInput2: "bannerImageGallery2",
+            fileContactImageInput: "contact_image_input"
         };
 
         imageInputs.forEach((fileId) => {
@@ -758,6 +773,17 @@
 
                 const contactInfo = country.detailedView?.contactInfo;
                 if (contactInfo) {
+                    document.querySelector('input[name="contact_image"]').value = contactInfo.img || "";
+                    
+                    // Update contact image preview
+                    if (contactInfo.img) {
+                        const contactPreview = document.getElementById("preview_contact_image");
+                        if (contactPreview) {
+                            contactPreview.src = contactInfo.img;
+                            contactPreview.style.display = "block";
+                        }
+                    }
+                    document.querySelector('input[name="contact_image"]').value = contactInfo.img || "";
                     document.querySelector('input[name="contact_sectionTitle"]').value = contactInfo.sectionTitle || "";
                     document.querySelector('input[name="contact_helpText"]').value = contactInfo.helpText || "";
                     document.querySelector('input[name="contact_phone_label"]').value = contactInfo.phone?.label || "";
@@ -766,6 +792,7 @@
                     document.querySelector('input[name="contact_email"]').value = contactInfo.email?.value || "";
                     document.querySelector('input[name="contact_location_label"]').value = contactInfo.location?.label || "";
                     document.querySelector('input[name="contact_location"]').value = contactInfo.location?.address || "";
+
                 }
             }
 
@@ -843,6 +870,7 @@
         document.getElementById("preview_main_detail").style.display = "none";
         document.getElementById("preview_bannerImageGallery1").style.display = "none";
         document.getElementById("preview_bannerImageGallery2").style.display = "none";
+        document.getElementById("preview_contact_image").style.display = "none";
         
         // Clear related countries previews
         for (let i = 0; i < 7; i++) {
@@ -858,12 +886,13 @@
         relatedNameInputs.forEach(input => input.value = "");
         relatedIconInputs.forEach(input => input.value = "");
 
-        const contactFields = ["contact_sectionTitle", "contact_helpText", "contact_phone_label", "contact_phone", "contact_email_label", "contact_email", "contact_location_label", "contact_location"];
+        const contactFields = ["contact_image", "contact_sectionTitle", "contact_helpText", "contact_phone_label", "contact_phone", "contact_email_label", "contact_email", "contact_location_label", "contact_location"];
         contactFields.forEach(fieldName => {
             const field = document.querySelector(`input[name="${fieldName}"]`);
             if (field) field.value = "";
         });
 
+
         showFormView();
     });
 
@@ -954,6 +983,7 @@
                     icon: document.getElementById(`related_url_${index}`)?.value || ""
                 })),
                 contactInfo: {
+                    img: document.querySelector('input[name="contact_image"]').value,
                     sectionTitle: document.querySelector('input[name="contact_sectionTitle"]').value,
                     helpText: document.querySelector('input[name="contact_helpText"]').value,
                     phone: {
@@ -971,6 +1001,7 @@
                 }
             }
         };
+        console.log('Payload:', payload);
 
         try {
             btnSave.disabled = true;