Customer, Order, Map: add image upload feature

public_html/assets/internal_api.php

@@ -955,6 +955,7 @@ class API extends CONF {
   	
         try {
             $sqShortInfo = qry("SELECT
+                                    c_uid,
                                     c_name,
                                     c_paymenttype,
                                     c_comment_ri,
@@ -965,6 +966,23 @@ class API extends CONF {
                                     c_uid = ".(int)$_POST['id']);
             $rstShortInfo = fetch_array($sqShortInfo);
 
+            // 설치 이미지 조회 추가
+            $query_img = "
+                SELECT i_filepath, i_filename 
+                FROM tbl_customer_image
+                WHERE i_customeruid = '".(int)$_POST['id']."'
+                AND i_type = 'install'
+                AND i_status = 'A'
+                ORDER BY i_createddate DESC
+                LIMIT 1
+            ";
+            $imgRow = qry($query_img);
+            $installImgUrl = "";
+
+            if ($row = fetch_array($imgRow)) {
+                $installImgUrl = $row['i_filepath'] . $row['i_filename'];
+            }
+
 						if ($rstShortInfo['c_paymenttype'] == "CA") {
 
 								$sqShortDaily = qry("SELECT 
@@ -1001,7 +1019,8 @@ class API extends CONF {
                 "payment_type" => $rstShortInfo['c_paymenttype'],
                 "paymentstring" => $d_paystatusSTR,
                 "comment" => $rstShortInfo['c_comment_ri'],
-                "location" => $rstShortInfo['c_location']
+                "location" => $rstShortInfo['c_location'],
+                "install_img" => $installImgUrl
             );
             
             $this->response($this->json(array("result"=>$result)), 200);

public_html/doc/customer_detail.php

@@ -1533,24 +1533,17 @@ if( $total_count < 1 ) {
     });
 </SCRIPT>
 
-
     <section class="page">
-
-
       <div class="container customer-info" data-aos="fade-up">
-
-
-
         <div class="wrap-border">
-          <div class="h3-title-section"> 
+          <div class="h3-title-section" style="display:flex; justify-content:space-between; align-items:center;">
-               <h3><span style="color:var(--color-primary);">Note</span> </h3>
+               <h3><span style="color:var(--color-primary);">Note</span></h3>
-          </div>
+               <? if ($mode == "update" && $_SESSION['ss_LEVEL'] != 7) { ?>          
-
-<? if ($mode == "update" && $_SESSION['ss_LEVEL'] != 7) { ?>          
                   <div class="btn-box">
                     <button type="button" class="btn-save text-center" data-bs-toggle="modal" data-bs-target="#add-note-modal" data-add-note-type="standard-access">ADD</button>
-          </div><!--btn-box Ends-->
+                  </div>
-<? } ?>
+               <? } ?>
+          </div>
 
          <p style="clear: both;"></p>
 
@@ -1620,13 +1613,6 @@ if( $total_count < 1 ) {
 
       </div>
       <!--Note Ends-->
-
-        <div class="row text-center">
-          <div class="col-sm-4 item-inner">
-          <a class="btn-sub text-center" href="/index_intranet.php?view=customer_list&<?=$goStr?>">LIST</a>
-         </div>
-        </div>
-
       <!--div class="grid-layout-col-3">
         <div class="grid-col-3">
           <a class="btn-sub-white text-center" href="#">LIST</a>
@@ -1639,12 +1625,436 @@ if( $total_count < 1 ) {
         </div>
 			</div-->
 			
+    </section>
+
+    <section class="page">
+      <div class="container customer-info" data-aos="fade-up">
+        <div class="wrap-border">
+          <div class="h3-title-section" style="display:flex; justify-content:space-between; align-items:center;">
+               <h3><span style="color:var(--color-primary);">Image</span></h3>
+                  <div class="btn-box">
+                    <button type="button" class="btn-save text-center" onclick="imagepopup();">ADD</button>
+                  </div>
+          </div>
+
+        <p style="clear: both;"></p>
+        <?php
+        // 이미지 가져오기
+        $qry_img = "
+            SELECT * 
+            FROM tbl_customer_image tci
+            LEFT OUTER JOIN tbl_member tm ON tci.i_createdby = tm.m_uid
+            WHERE tci.i_customeruid = '$c_uid' 
+              AND tci.i_status = 'A'
+            ORDER BY tci.i_uid DESC
+        ";
+        $rt_img = $jdb->nQuery($qry_img, "image list error");
+
+        // 분류 배열
+        $install = [];
+        $container = [];
+
+        while ($img = mysqli_fetch_array($rt_img, MYSQLI_ASSOC)) {
+            if ($img['i_type'] == "install") $install[] = $img;
+            else $container[] = $img;
+        }
+
+        if (count($install) + count($container) == 0) {
+            echo "<p>No images found.</p>";
+        } else {
+
+            // ===========================
+            // INSTALL
+            // ===========================
+            if (count($install) > 0) {
+                echo "<h4 style='margin-top:20px;'>Install</h4>";
+
+                foreach ($install as $img) {
+
+                    echo '<div style="
+                            border:1px solid #ddd;
+                            padding:15px;
+                            border-radius:8px;
+                            margin-bottom:20px;
+                            background:#fafafa;
+                        ">';
+
+                    echo '<div style="display:flex; gap:15px; flex-wrap:wrap;">';
+
+                    $files = explode(",", $img['i_filename']);
+                    foreach ($files as $f) {
+                        $imgPath = $img['i_filepath'] . trim($f);
+                        echo '
+                            <div style="width:150px; text-align:center;">
+                                <img src="'.$imgPath.'" 
+                                    class="preview-img"
+                                    data-img="'.$imgPath.'"
+                                    data-filename="'.$f.'"
+                                    data-uid="'.$img['i_uid'].'"
+                                    data-customeruid="'.$c_uid.'"
+                                    data-type="'.$img['i_type'].'"
+                                    style="width:100%; height:120px; 
+                                            object-fit:cover; border-radius:5px; 
+                                            cursor:pointer; border:1px solid #ccc;">
+                            </div>
+                        ';
+                    }
+
+                    echo '</div>';
+
+                    echo '<div style="margin-top:10px; font-size:14px; line-height:20px;">
+                            <b>Note:</b> '.nl2br($img['i_note']).'<br>';
+                    echo "<b>Created:</b> " . date("Y-m-d H:i:s", strtotime($img['i_createddate'])).'<br>';
+                    echo "<b>Created by:</b> " . $img['m_firstname']. ' ' . $img['m_lastname']. ' (' . $img['m_initial']. ')';
+                    echo '</div></div>';
+                }
+            }
+
+            // ===========================
+            // CONTAINER
+            // ===========================
+            // if (count($container) > 0) {
+            //     echo "<h4 style='margin-top:30px;'>Container</h4>";
+
+            //     foreach ($container as $img) {
+
+            //         echo '<div style="
+            //                 border:1px solid #ddd;
+            //                 padding:15px;
+            //                 border-radius:8px;
+            //                 margin-bottom:20px;
+            //                 background:#fafafa;
+            //             ">';
+
+            //         echo '<div style="display:flex; gap:15px; flex-wrap:wrap;">';
+
+            //         $files = explode(",", $img['i_filename']);
+            //         foreach ($files as $f) {
+            //             $imgPath = $img['i_filepath'] . trim($f);
+            //             echo '
+            //                 <div style="width:150px; text-align:center;">
+            //                     <img src="'.$imgPath.'" 
+            //                         class="preview-img"
+            //                         data-img="'.$imgPath.'"
+            //                         data-filename="'.$f.'"
+            //                         data-uid="'.$img['i_uid'].'"
+            //                         data-customeruid="'.$c_uid.'"
+            //                         data-type="'.$img['i_type'].'"
+            //                         style="width:100%; height:120px; 
+            //                                 object-fit:cover; border-radius:5px; 
+            //                                 cursor:pointer; border:1px solid #ccc;">
+            //                 </div>
+            //             ';
+            //         }
+
+            //         echo '</div>';
+
+            //         echo '<div style="margin-top:10px; font-size:14px; line-height:20px;">
+            //                 <b>Note:</b> '.nl2br($img['i_note']).'<br>';
+            //         echo "<b>Created:</b> " . date("Y-m-d H:i:s", strtotime($img['i_createddate'])).'<br>';
+            //         echo '
+            //         </div>
+            //           <button onclick="openEditModal(
+            //                   \''.$img['i_uid'].'\',
+            //                   \''.htmlspecialchars($img['i_note'], ENT_QUOTES).'\',
+            //                   \''.$c_uid.'\',
+            //                   \''.htmlspecialchars($img['i_filename'], ENT_QUOTES).'\',
+            //                   \''.$img['i_filepath'].'\',
+            //                   \''.$img['i_type'].'\'
+            //               )"
+            //               style="margin-top:10px; padding:4px 10px; background:#007bff; color:white; border:none; border-radius:4px;">
+            //               Edit
+            //           </button>';
+
+            //         echo '</div>';
+            //     }
+            // }
+        }
+        ?>
+
+        </div>
+      </div>
       
     </section>
 
+    <div class="row text-center">
+      <div class="col-sm-4 item-inner">
+        <a class="btn-sub text-center" href="/index_intranet.php?view=customer_list&<?=$goStr?>">LIST</a>
+      </div>
+    </div>
 
   </main><!-- End #main -->
 
+<!-- Image Popup Modal -->
+<div id="imagePreviewModal" class="modal fade">
+  <div class="modal-dialog modal-lg">
+    <div class="modal-content" style="background:#000;">
+      <div class="modal-body" style="text-align:center;">
+        
+        <img id="previewLargeImg" src="" style="width:100%; max-height:80vh; object-fit:contain;">
+
+        <br><br>
+
+        <form id="deleteImageForm" method="POST" action="/lib/user_process.php">
+            <input type="hidden" name="actionStr" value="DELETEIMAGE">
+            <input type="hidden" name="i_uid" id="delete_i_uid">
+            <input type="hidden" name="i_customeruid" id="delete_i_customeruid">
+            <input type="hidden" name="fileName" id="delete_fileName">
+            <input type="hidden" name="goStr" value="<?=$goStr?>">
+        </form>
+
+        <button id="btnDeleteImage" class="btn btn-danger" style="padding:8px 20px; font-size:16px;">DELETE</button>
+
+        <input type="hidden" id="currentImageUid">
+
+      </div>
+    </div>
+  </div>
+</div>
+
+<!-- Delete Confirm Modal -->
+<div id="deleteConfirmModal" class="modal fade">
+  <div class="modal-dialog">
+    <div class="modal-content">
+
+      <div class="modal-header">
+        <h4 class="modal-title">Confirm Delete</h4>
+        <button type="button" class="btn" data-bs-dismiss="modal" aria-label="Close">
+          <i class="bi bi-x"></i>
+        </button>
+      </div>
+
+      <div class="modal-body">
+        <p>Are you sure you want to delete this image?</p>
+      </div>
+
+      <div class="modal-footer text-center grid-layout-col-2" style="border: none;">
+        <button type="button" id="confirmDeleteBtn" class="btn-sub btn-danger">Delete</button>
+        <button type="button" class="btn-gray" data-bs-dismiss="modal">Cancel</button>
+      </div>
+
+    </div>
+  </div>
+</div>
+
+<!-- CONTAINER EDIT IMAGE MODAL -->
+<div class="modal fade" id="editModal" tabindex="-1" aria-hidden="true">
+  <div class="modal-dialog modal-lg">
+    <div class="modal-content">
+
+      <div class="modal-header">
+        <h4 class="modal-title">Edit Image</h4>
+        <button type="button" class="btn" data-bs-dismiss="modal" aria-label="Close" style="color:#fff;">
+          <i class="bi bi-x"></i>
+        </button>
+      </div>
+
+      <div class="modal-body">
+
+        <form method="post" action="/lib/user_process.php" enctype="multipart/form-data">
+
+            <input type="hidden" name="actionStr" value="UPDATEIMAGEFULL">
+            <input type="hidden" name="i_uid" id="edit_i_uid">
+            <input type="hidden" name="i_customeruid" id="edit_c_uid">
+            <input type="hidden" name="i_type" id="edit_i_type">
+            <input type="hidden" name="goStr" value="<?=$goStr?>">
+
+            <!-- 기존 이미지 목록 -->
+            <div id="edit_image_list" style="margin-top:15px;"></div>
+
+            <!-- 새 이미지 업로드 -->
+            <label style="display:block; margin-top:15px;"><b>Upload New Images</b></label>
+            <input type="file" name="upload_file[]" multiple accept="image/*">
+
+            <!-- Note 수정 -->
+            <label style="display:block; margin-top:15px;"><b>Note</b></label>
+            <textarea id="edit_i_note" name="i_note" style="width:100%; height:80px;"></textarea>
+
+            <div class="text-center grid-layout-col-2" style="margin-top:20px;">
+              <button type="submit" class="btn-sub">Save Changes</button>
+              <button type="button" class="btn-gray" data-bs-dismiss="modal">Close</button>
+            </div>
+
+        </form>
+      </div>
+    </div>
+  </div>
+</div>
+
+<script>
+document.addEventListener("DOMContentLoaded", function () {
+
+    const typeSelect = document.querySelector("select[name='i_type']");
+    const fileInput = document.getElementById("uploadFileInput");
+    const previewImg = document.getElementById("imgPreview");
+    const previewContainer = document.getElementById("previewContainer");
+
+    // ---- 타입 변경 시 multiple 적용 ----
+    typeSelect.addEventListener("change", function () {
+        if (this.value === "container") {
+            fileInput.setAttribute("multiple", "multiple");
+        } else {
+            fileInput.removeAttribute("multiple");
+        }
+
+        // 타입 바뀌면 기존 프리뷰 초기화
+        previewImg.style.display = "none";
+        previewContainer.innerHTML = "";
+    });
+
+    // ---- 이미지 미리보기 ----
+    fileInput.addEventListener("change", function () {
+
+        previewContainer.innerHTML = ""; // 초기화
+
+        // INSTALL: 한 개만
+        if (fileInput.files.length === 1) {
+            const file = fileInput.files[0];
+            const reader = new FileReader();
+
+            reader.onload = function (e) {
+                const img = document.createElement("img");
+                img.src = e.target.result;
+                img.style.width = "150px";
+                img.style.border = "1px solid #ccc";
+                img.style.padding = "3px";
+                previewContainer.appendChild(img);
+            };
+
+            reader.readAsDataURL(file);
+        } else {
+            // CONTAINER: 여러개 출력
+            Array.from(fileInput.files).forEach(file => {
+                const reader = new FileReader();
+
+                reader.onload = function (e) {
+                    const img = document.createElement("img");
+                    img.src = e.target.result;
+                    img.style.width = "120px";
+                    img.style.marginRight = "8px";
+                    img.style.marginBottom = "8px";
+                    img.style.border = "1px solid #ccc";
+                    img.style.padding = "3px";
+                    previewContainer.appendChild(img);
+                };
+
+                reader.readAsDataURL(file);
+            });
+        }
+    });
+});
+
+// Image add form 전체 초기화
+document.addEventListener("DOMContentLoaded", function () {
+
+    const modalEl = document.getElementById("image-upload-modal");
+
+    modalEl.addEventListener("hidden.bs.modal", function () {
+        document.getElementById("uploadImageForm").reset();
+        const previewContainer = document.getElementById("previewContainer");
+
+        if (previewContainer) {
+            previewContainer.innerHTML = "";
+        }
+
+        const fileInput = document.getElementById("uploadFileInput");
+        if (fileInput) {
+            fileInput.value = "";
+        }
+
+        const typeSelect = document.querySelector("select[name='i_type']");
+        if (typeSelect) {
+            typeSelect.value = "install";
+        }
+    });
+
+});
+
+// Image popup
+document.addEventListener("DOMContentLoaded", function () {
+    const images = document.querySelectorAll(".preview-img");
+    const modal = new bootstrap.Modal(document.getElementById("imagePreviewModal"));
+    const largeImg = document.getElementById("previewLargeImg");
+
+    images.forEach(img => {
+    img.addEventListener("click", function () {
+        largeImg.src = this.dataset.img;
+
+        document.getElementById("currentImageUid").value = this.dataset.uid;
+        document.getElementById("delete_i_customeruid").value = this.dataset.customeruid;
+        document.getElementById("delete_fileName").value = this.dataset.filename;
+
+        const deleteBtn = document.getElementById("btnDeleteImage");
+        if (this.dataset.type == "install") {
+            deleteBtn.style.display = "inline-block";
+        } else {
+            deleteBtn.style.display = "none";
+        }
+
+        modal.show();
+    });
+  });
+});
+
+// Delete image
+document.addEventListener("DOMContentLoaded", function () {
+
+    const deleteBtn = document.getElementById("btnDeleteImage");
+    const confirmModalObj = new bootstrap.Modal(document.getElementById("deleteConfirmModal"));
+
+    if (deleteBtn) {
+        deleteBtn.addEventListener("click", function () {
+            confirmModalObj.show();
+        });
+    }
+
+    document.getElementById("confirmDeleteBtn").addEventListener("click", function () {
+        const uid = document.getElementById("currentImageUid").value;
+        if (!uid) return;
+
+        document.getElementById("delete_i_uid").value = uid;
+        document.getElementById("deleteImageForm").submit();
+    });
+});
+
+function openEditModal(uid, note, customeruid, filesString, filepath, type) {
+
+    document.getElementById("edit_i_uid").value = uid;
+    document.getElementById("edit_c_uid").value = customeruid;
+    document.getElementById("edit_i_note").value = note;
+    document.getElementById("edit_i_type").value = type;
+
+    const files = filesString.split(",");
+    let html = "<b>Existing Images</b><div>";
+
+    files.forEach(f => {
+        let fullPath = filepath + f.trim();
+        html += `
+            <div style='margin-top:10px; display:flex; align-items:center; gap:10px;'>
+                <img src="${fullPath}" style="width:80px; height:70px; object-fit:cover; border:1px solid #ccc; border-radius:5px;">
+                <label><input type="checkbox" name="delete_files[]" value="${f.trim()}"> Delete</label>
+            </div>
+        `;
+    });
+
+    html += "</div>";
+    document.getElementById("edit_image_list").innerHTML = html;
+
+    let modal = new bootstrap.Modal(document.getElementById('editModal'));
+    modal.show();
+}
+
+function closeEditModal() {
+    let modalEl = document.getElementById('editModal');
+    let modal = bootstrap.Modal.getInstance(modalEl);
+    modal.hide();
+}
+
+function imagepopup() {
+    const url = `/lib/customer_image_upload_popup.php?c_uid=<?=$c_uid?>&goStr=<?=$goStr?>`;
+    window.open(url, "uploadImage", "width=600,height=750,scrollbars=yes");
+}
+</script>
 
 <!-- Modal delete Form -->
 <div class="container">

public_html/doc/map.php

@@ -615,28 +615,39 @@ function popup(){
               <tbody>
                 <tr>
                   <td class="td-title-info">Restaurant Name</td>
-                  <td class="td-text-info shortinfo-store-name">Name</td>
+                  <td colspan="2" class="td-text-info shortinfo-store-name">Name</td>
                 </tr>
                 <tr>
                   <td class="td-title-info">Payment Type</td>
-                  <td class="td-text-info shortinfo-payment-type">Cheque</td>
+                  <td colspan="2" class="td-text-info shortinfo-payment-type">Cheque</td>
                 </tr>
                 <tr>
                   <td class="td-title-info">Pay Status</td>
-                  <td class="td-text-info shortinfo-payment-string">Paid</td>
+                  <td colspan="2" class="td-text-info shortinfo-payment-string">Paid</td>
                 </tr>                
                 <tr>
                   <td class="td-title-info">Comment</td>
-                  <td class="td-text-info">
+                  <td colspan="2" class="td-text-info">
                     <textarea id="c_comment_ri" class="textarea shortinfo-comment" name="c_comment_ri" rows="4" cols="20">매주 수요일 정기 픽업, 11시 이후 방문</textarea>
                   </td>
                 </tr>
                 <tr>
                   <td class="td-title-info">Container Location</td>
-                  <td class="td-text-info">
+                  <td colspan="2" class="td-text-info">
                     <textarea id="c_location" class="textarea shortinfo-container-location" name="c_location" rows="2" cols="20">Inside Rest</textarea>
                   </td>
                 </tr>
+                <tr>
+                  <td class="td-title-info">Installation Image</td>
+                  <td class="td-text-info" id="installImgArea" style="border-right:none;">
+                    <span>Loading...</span>
+                  </td>
+                  <td style="text-align: right; border-right: 1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;">
+                    <span style="border:1px solid #72A864; border-radius:5px; padding:3px;">
+                      <a href="#" onclick="imagepopup(jQuery('#customerShortInfo .c_uid').val());">ADD</a>
+                    </span>
+                  </td>
+                </tr>
               </tbody>
             </table>
             <br>
@@ -2201,6 +2212,14 @@ function popup(){
     jQuery("#customerShortInfo #c_comment_ri").val(json.result['comment']).attr("disabled",false);
     jQuery("#customerShortInfo #c_location").val(json.result['location']).attr("disabled",false);
     jQuery("#customerShortInfo .btn-sub").attr("disabled",false);
+
+    if (json.result.install_img && json.result.install_img !== "") {
+        jQuery("#installImgArea").html(
+            '<a href="'+ json.result.install_img +'" target="_blank">View Image</a>'
+        );
+    } else {
+        jQuery("#installImgArea").html('<span>No image</span>');
+    }
   }
 
   function updtShortInfo(){
@@ -2485,6 +2504,11 @@ function popup(){
     jQuery(".loading-overlay").css("display","none");
   }
 
+  function imagepopup(c_uid) {
+    const url = `/lib/customer_image_upload_popup.php?c_uid=${c_uid}`;
+    window.open(url, "uploadImage", "width=600,height=750,scrollbars=yes");
+  }
+  
 </script>
 
 <script>

public_html/lib/customer_image_upload_popup.php

@@ -0,0 +1,211 @@
+<?php 
+include getenv("DOCUMENT_ROOT")."/include/session_include.php";
+require_once getenv("DOCUMENT_ROOT")."/assets/dbCon.php";
+
+$c_uid = $_GET['c_uid'];
+$goStr = $_GET['goStr'];
+
+//Load driver list
+if ($_SESSION['ss_LEVEL'] == 9) {
+    $qrySTR = " AND (m_uid = '".$_SESSION['ss_UID']."') ";
+} else {
+    $qrySTR = "";
+}
+
+$drivers = array();
+$sqDriver = qry("SELECT
+                    *
+                FROM
+                    tbl_member
+                WHERE 
+                    m_level = 9 AND m_status = 'A' ".$qrySTR."
+                ORDER BY 
+                    m_initial ASC ");
+while($rstDriver = fetch_array($sqDriver)){
+    $drivers[] = array(
+        "id" => $rstDriver['m_uid'],
+        "name" => $rstDriver['m_initial']
+    );
+}
+
+?>
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<title>Upload Image</title>
+</head>
+<body>
+
+<div class="upload-box">
+
+    <div class="title-row">
+        <span>UPLOAD IMAGE</span>
+    </div>
+
+    <form method="POST" action="/lib/user_process.php" enctype="multipart/form-data">
+
+        <input type="hidden" name="actionStr" value="ADDIMAGE">
+        <input type="hidden" name="i_customeruid" value="<?=$c_uid?>">
+        <input type="hidden" name="i_memberuid" value="<?=$_SESSION['ss_UID']?>">
+        <input type="hidden" name="goStr" value="<?=$goStr?>">
+        <input type="hidden" name="mode" value="create">
+
+        <div class="tb-info">
+
+            <label>Created By</label>
+            <select name="i_createdby" id="driver" class="custom-select-map-orderby" required>
+                <option value="">Select</option>
+                <?php
+                    $defaultValue = 43; // E.X
+                    foreach($drivers as $driver) {
+                        $selected = ($driver['id'] == $defaultValue) ? 'selected' : '';
+                        echo '<option value="'.$driver['id'].'" '.$selected.'>'.$driver['name'].'</option>';
+                    }
+                ?>
+            </select>
+
+
+            <label>Type</label>
+            <select name="i_type" id="i_type" required>
+                <option value="install">Install</option>
+                <!-- <option value="container">Container</option> -->
+            </select>
+
+            <label>Image</label>
+            <p style="font-size:12px; color:#666; margin-top:4px;">※ 기존 이미지가 있을 경우 삭제됩니다.</p>
+            <p style="font-size:12px; color:#666; margin-top:-6px;">※ Install 이미지는 1개만 업로드 가능합니다.</p>
+            <input type="file" id="uploadFileInput" name="upload_file[]" accept="image/*" required>
+
+            <img id="previewImg" class="preview-img">
+
+            <label>Note</label>
+            <textarea name="i_note" rows="3"></textarea>
+
+        </div>
+
+        <button type="submit" class="btn-save">UPLOAD</button>
+
+    </form>
+
+</div>
+
+<script>
+$(window).ready(function() {
+
+<?php if ($_SESSION['ss_LEVEL'] == 9) { ?>
+    $("#driver").val("<?= $_SESSION['ss_UID'] ?>").change();
+<?php } ?>
+
+});
+
+document.getElementById("uploadFileInput").addEventListener("change", function () {
+    const preview = document.getElementById("previewImg");
+    const file = this.files[0];
+
+    if (!file) return;
+
+    const reader = new FileReader();
+    reader.onload = () => {
+        preview.src = reader.result;
+        preview.style.display = "block";
+    };
+    reader.readAsDataURL(file);
+});
+</script>
+
+</body>
+</html>
+
+
+<style>
+    body {
+        background: #f5f7fb;
+        font-family: Arial, Helvetica, sans-serif;
+        padding: 40px;
+    }
+
+    .upload-box {
+        width: 450px;
+        margin: 0 auto;
+        background: #fff;
+        border-radius: 12px;
+        box-shadow: 0 6px 18px rgba(0,0,0,0.1);
+        padding: 25px 30px;
+    }
+
+    .title-row {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-size: 17px;
+        font-weight: bold;
+        margin-bottom: 10px;
+    }
+
+    .clear-btn {
+        background: #ccc;
+        border: none;
+        padding: 4px 12px;
+        border-radius: 6px;
+        cursor: pointer;
+        font-size: 13px;
+        color: #333;
+    }
+
+    .tb-info label {
+        display: block;
+        font-size: 14px;
+        margin-top: 12px;
+        font-weight: bold;
+    }
+
+    .tb-info select, 
+    .tb-info input[type=file],
+    .tb-info textarea {
+        width: 100%;
+        padding: 8px;
+        border: 1px solid #ccc;
+        border-radius: 6px;
+        margin-top: 6px;
+        font-size: 14px;
+    }
+
+    .preview-img {
+        margin-top: 12px;
+        width: 200px;
+        border: 1px solid #ccc;
+        border-radius: 6px;
+        display: none;
+    }
+
+    .btn-save {
+        background: #76c06b;
+        color: #fff;
+        width: 100%;
+        padding: 14px 0;
+        margin-top: 18px;
+        border: none;
+        border-radius: 8px;
+        font-size: 16px;
+        font-weight: bold;
+        cursor: pointer;
+    }
+
+    .btn-save:hover {
+        background: #69ad60;
+    }
+
+    .btn-close {
+        width: 100%;
+        margin-top: 10px;
+        padding: 12px 0;
+        background: #8e8e8e;
+        color: #fff;
+        border: none;
+        border-radius: 8px;
+        font-size: 15px;
+        cursor: pointer;
+    }
+</style>

public_html/lib/shortInfo_lib.php

@@ -65,11 +65,27 @@ if ($c_paymenttype =="CA") {
 		else $d_paystatusSTR = "-";
 }
 
+	$query_img = "
+		SELECT i_filepath, i_filename 
+		FROM tbl_customer_image
+		WHERE i_customeruid = '$c_uid' 
+		AND i_type = 'install'
+		AND i_status = 'A'
+		ORDER BY i_createddate DESC
+		LIMIT 1
+	";
+	$imgResult = $jdb->fQuery($query_img, "fetch image error");
+
+	$installImgUrl = "";
+	if (!empty($imgResult)) {
+		$installImgUrl = $imgResult['i_filepath'] . $imgResult['i_filename'];
+	}
+
 ?>
 
 
       <div class="modal-header">
-        <h4 class="modal-title">CUSTOMER INFORMATION</h4>
+        <h4 class="modal-title">CUSTOMER NOTE</h4>
         <button type="button" class="btn" data-dismiss="modal" aria-label="Close" style="color:#fff;"><i class="bi bi-x"></i></button>
       </div>
       <div class="modal-body">
@@ -83,9 +99,16 @@ if ($c_paymenttype =="CA") {
 
           <table class="tb-info-box">
 
+            <tr>
+              <td class="td-title-info">Restaurant Name</td>
+              <td colspan="2" class="td-text-info">
+                <?=$c_name?>
+              </td>
+            </tr>
+
             <tr>
               <td class="td-title-info">Payment Type</td>
-              <td class="td-text-info">
+              <td colspan="2" class="td-text-info">
                 <?=$c_paymenttypeSTR?>
               </td>
             </tr>
@@ -93,7 +116,7 @@ if ($c_paymenttype =="CA") {
 <? if ($c_paymenttype =="CA") { ?>
             <tr>
               <td class="td-title-info">Pay Status</td>
-              <td class="td-text-info">
+              <td colspan="2" class="td-text-info">
 								<?=$d_paystatusSTR?>
               </td>
             </tr>
@@ -101,18 +124,32 @@ if ($c_paymenttype =="CA") {
               
             <tr>
               <td class="td-title-info">Comment</td>
-              <td class="td-text-info">
+              <td colspan="2" class="td-text-info">
                 <textarea id="c_comment_ri" class="textarea" name="c_comment_ri" rows="4" cols="20"><?=htmlspecialchars($c_comment_riSTR, ENT_QUOTES)?></textarea>
               </td>
             </tr>
 
             <tr>
               <td class="td-title-info">Container Location</td>
-              <td class="td-text-info">
+              <td colspan="2" class="td-text-info">
               	<textarea id="c_location" class="textarea" name="c_location" rows="2" cols="20"><?=htmlspecialchars($c_locationSTR, ENT_QUOTES)?></textarea>
               </td>
             </tr>
 
+			<tr>
+				<td class="td-title-info">Installation Image</td>
+				<td class="td-text-info" style="border-right: none;">
+					<?php if ($installImgUrl != "") { ?>
+						<a href="<?=$installImgUrl?>" target="_blank">View Image</a>
+					<?php } else { ?>
+						<span>No image</span>
+					<?php } ?>
+				</td>
+				<td style="text-align: right; border-right: 1px solid #dcdcdc; border-bottom:1px solid #dcdcdc;">
+					<span style="border: 1px solid #72A864; border-radius: 5px; padding: 3px;"><a href="#" onclick="popup();">ADD</a></span>
+				</td>
+			</tr>
+
           </table>
           <br>
           <div class="text-center grid-layout-col-2">
@@ -237,6 +274,11 @@ $(document).ready(function(){
 	});
   
 });
+
+function popup() {
+    const url = `/lib/customer_image_upload_popup.php?c_uid=<?=$c_uid?>&goStr=<?=$goStr?>`;
+    window.open(url, "uploadImage", "width=600,height=750,scrollbars=yes");
+}
 </script>
 
 

public_html/lib/user_process.php

@@ -950,6 +950,317 @@ if ($actionStr == "DELETENOTE" && $mode == "delete") {
 }
 
 
+//////////////////////////////////////////////
+// ADD IMAGE (Customer Detail - Image Upload)
+//////////////////////////////////////////////
+if ($actionStr == "ADDIMAGE") {
+
+	$i_note = isset($_POST['i_note']) ? trim($_POST['i_note']) : "";
+	$i_createddate = date("YmdHis");
+
+    if ($i_customeruid == "" || $i_memberuid == "") {
+        $msg = "Invalid data. Please try again. [Err - i_customeruid, i_memberuid]";
+        $func->modalMsg($msg, "");
+        exit();
+    }
+
+    // 기존 이미지 비활성화
+    if ($i_type == "install") {
+        $qry_update = "
+            UPDATE tbl_customer_image
+            SET i_status = 'I'
+            WHERE i_customeruid = '$i_customeruid'
+              AND i_type = 'install'
+              AND i_status = 'A'
+        ";
+        $jdb->nQuery($qry_update, "update error");
+    }
+
+	if ($i_type == "container") {
+		$qry_update2 = "
+			UPDATE tbl_customer_image
+			SET i_status = 'I'
+			WHERE i_customeruid = '$i_customeruid'
+			AND i_type = 'container'
+			AND i_status = 'A'
+		";
+		$jdb->nQuery($qry_update2, "update error");
+	}
+
+	// 이미지 최대 6개 제한 체크
+	if ($i_type == "container") {
+		// 기존 이미지 수 조회
+		$qry_cnt = "
+			SELECT i_filename 
+			FROM tbl_customer_image 
+			WHERE i_customeruid = '$i_customeruid'
+			AND i_type = 'container'
+			AND i_status = 'A'
+			ORDER BY i_uid DESC LIMIT 1
+		";
+		$rt_cnt = $jdb->fQuery($qry_cnt, "error");
+
+		$existingCount = 0;
+		if (!empty($rt_cnt['i_filename'])) {
+			$existingFiles = explode(",", $rt_cnt['i_filename']);
+			$existingCount = count($existingFiles);
+		}
+
+		// 이번에 업로드할 파일 개수
+		$newCount = is_array($_FILES['upload_file']['name'])
+					? count($_FILES['upload_file']['name'])
+					: 1;
+
+		if ($existingCount + $newCount > 6) {
+			$msg = "Container 이미지는 최대 6개까지 업로드할 수 있습니다.";
+			$func->modalMsg($msg, "/index_intranet.php?view=customer_detail&mode=update&c_uid=$i_customeruid&$goStr");
+			exit();
+		}
+	}
+
+    // 업로드 파일 체크
+    if (!isset($_FILES['upload_file'])) {
+        $msg = "Upload failed. Please try again.";
+        $func->modalMsg($msg, "/index_intranet.php?view=customer_detail&mode=update&c_uid=$i_customeruid&$goStr");
+        exit();
+    }
+
+    // 저장 폴더 생성
+    $upload_folder = getenv("DOCUMENT_ROOT")."/upload/customer_image/".$i_customeruid;
+    if (!is_dir($upload_folder)) {
+        mkdir($upload_folder, 0777, true);
+    }
+
+    // 파일 개수
+    $fileCount = is_array($_FILES['upload_file']['name'])
+                ? count($_FILES['upload_file']['name'])
+                : 1;
+
+    $uploadedFileNames = array(); // 콤마로 합쳐서 넣을 리스트
+
+    for ($i = 0; $i < $fileCount; $i++) {
+
+        $fileTmp  = is_array($_FILES['upload_file']['tmp_name'])
+                    ? $_FILES['upload_file']['tmp_name'][$i]
+                    : $_FILES['upload_file']['tmp_name'];
+
+        $fileName = is_array($_FILES['upload_file']['name'])
+                    ? $_FILES['upload_file']['name'][$i]
+                    : $_FILES['upload_file']['name'];
+
+        $fileError = is_array($_FILES['upload_file']['error'])
+                     ? $_FILES['upload_file']['error'][$i]
+                     : $_FILES['upload_file']['error'];
+
+        if ($fileError != 0) continue;
+
+        // 확장자
+        $ext = pathinfo($fileName, PATHINFO_EXTENSION);
+
+        // 새 파일명 생성
+        $newFileName = "IMG_".$i_customeruid."_".time().rand(1000,9999)."_".$i.".".$ext;
+
+        // 저장 경로
+        $savePath = $upload_folder . "/" . $newFileName;
+
+        if (!move_uploaded_file($fileTmp, $savePath)) {
+            continue;
+        }
+
+        // 업로드된 파일명 저장 (DB에 콤마로 넣을 배열)
+        $uploadedFileNames[] = $newFileName;
+    }
+
+    // 한 개도 업로드되지 않으면 종료
+    if (count($uploadedFileNames) == 0) {
+        $msg = "No files uploaded.";
+        $func->modalMsg($msg, "/index_intranet.php?view=customer_detail&mode=update&c_uid=$i_customeruid&$goStr");
+        exit();
+    }
+
+    $fileNameString = implode(",", $uploadedFileNames);
+    $dbFilePath = "/upload/customer_image/".$i_customeruid."/";
+
+    // DB INSERT
+    $columns = array(
+        "i_customeruid",
+        "i_memberuid",
+        "i_createdby",
+        "i_createddate",
+        "i_type",
+        "i_filename",
+        "i_filepath",
+        "i_status",
+        "i_note"
+    );
+
+    $values  = array(
+        $i_customeruid,
+        $i_memberuid,
+        $i_createdby,
+        $i_createddate,
+        $i_type,
+        $fileNameString,
+        $dbFilePath,
+        "A",
+        $i_note
+    );
+
+    $jdb->iQuery("tbl_customer_image", $columns, $values);
+
+    // 완료 후 이동
+    // $msg = "Image uploaded successfully.";
+    // $urlSTR = "/index_intranet.php?view=customer_detail&mode=update&c_uid=$i_customeruid&$goStr";
+    // $func->modalMsg($msg, $urlSTR);
+	echo "
+	<script>
+		alert('Image uploaded successfully!');
+		if (window.opener) {
+			window.opener.location.reload();
+		}
+		window.close();
+	</script>
+	";
+    exit();
+}
+
+
+//////////////////////////////////////////////
+// UPDATE IMAGE
+//////////////////////////////////////////////
+if ($actionStr == "UPDATEIMAGEFULL") {
+
+    $i_uid = $_POST['i_uid'] ?? "";
+    $i_customeruid = $_POST['i_customeruid'] ?? "";
+    $i_note = trim($_POST['i_note'] ?? "");
+    $goStr = $_POST['goStr'] ?? "";
+
+    if ($i_uid == "" || $i_customeruid == "") {
+        $msg = "Invalid data.";
+        $func->modalMsg($msg, "");
+        exit();
+    }
+
+	// 이미지 최대 6개 제한 체크
+	if ($i_type == "container") {
+		// 기존 이미지 수 조회
+		$qry_cnt = "
+			SELECT i_filename 
+			FROM tbl_customer_image 
+			WHERE i_customeruid = '$i_customeruid'
+			AND i_type = 'container'
+			AND i_status = 'A'
+			ORDER BY i_uid DESC LIMIT 1
+		";
+		$rt_cnt = $jdb->fQuery($qry_cnt, "error");
+
+		$existingCount = 0;
+		if (!empty($rt_cnt['i_filename'])) {
+			$existingFiles = explode(",", $rt_cnt['i_filename']);
+			$existingCount = count($existingFiles);
+		}
+
+		// 이번에 업로드할 파일 개수
+		$newCount = is_array($_FILES['upload_file']['name'])
+					? count($_FILES['upload_file']['name'])
+					: 1;
+
+		if ($existingCount + $newCount > 6) {
+			$msg = "Container 이미지는 최대 6개까지 업로드할 수 있습니다.";
+			$func->modalMsg($msg, "/index_intranet.php?view=customer_detail&mode=update&c_uid=$i_customeruid&$goStr");
+			exit();
+		}
+	}
+
+    // 기존 데이터 가져오기
+    $qry = "SELECT * FROM tbl_customer_image WHERE i_uid = '$i_uid'";
+    $rt = $jdb->fQuery($qry, "Image read error");
+
+    $oldFiles = explode(",", $rt['i_filename']);
+    $filepath = $rt['i_filepath'];
+
+    // 이미지 삭제 처리
+    $deleteFiles = $_POST['delete_files'] ?? [];
+    $newList = [];
+
+    foreach ($oldFiles as $f) {
+        $f = trim($f);
+        if (in_array($f, $deleteFiles)) {
+            $full = getenv("DOCUMENT_ROOT") . $filepath . $f;
+            if (file_exists($full)) unlink($full);
+        } else {
+            $newList[] = $f; // 삭제되지 않은 파일 유지
+        }
+    }
+
+    // 새 이미지 업로드 처리
+    if (isset($_FILES['upload_file'])) {
+
+        $upload_folder = getenv("DOCUMENT_ROOT") . $filepath;
+
+        if (!is_dir($upload_folder)) mkdir($upload_folder, 0777, true);
+
+        $fileCount = count($_FILES['upload_file']['name']);
+
+        for ($i = 0; $i < $fileCount; $i++) {
+
+            if ($_FILES['upload_file']['error'][$i] != 0) continue;
+
+            $ext = pathinfo($_FILES['upload_file']['name'][$i], PATHINFO_EXTENSION);
+            $newName = "IMG_".$i_customeruid."_".time().rand(1000,9999)."_".$i.".".$ext;
+
+            $savePath = $upload_folder . $newName;
+
+            if (move_uploaded_file($_FILES['upload_file']['tmp_name'][$i], $savePath)) {
+                $newList[] = $newName;
+            }
+        }
+    }
+
+    // 콤마 문자열 재정리
+    $finalFiles = implode(",", $newList);
+
+    // DB 업데이트
+    $columns = ["i_filename", "i_note"];
+    $values = [$finalFiles, $i_note];
+
+    $jdb->uQuery("tbl_customer_image", $columns, $values, "WHERE i_uid = '$i_uid'");
+
+    $msg = "Updated successfully.";
+    $url = "/index_intranet.php?view=customer_detail&mode=update&c_uid=$i_customeruid&$goStr";
+
+    $func->modalMsg($msg, $url);
+    exit();
+}
+
+
+//////////////////////////////////////////////
+// DELETE IMAGE (i_status = 'I')
+//////////////////////////////////////////////
+if ($actionStr == "DELETEIMAGE") {
+
+    $i_uid = $_POST['i_uid'] ?? "";
+    $i_customeruid = $_POST['i_customeruid'] ?? "";
+
+    if ($i_uid == "" || $i_customeruid == "") {
+        $msg = "Invalid image data.";
+        $func->modalMsg($msg, "");
+        exit();
+    }
+
+    $columns = array("i_status");
+    $values  = array("I");
+    $where = "WHERE i_uid = '$i_uid'";
+
+    $jdb->uQuery("tbl_customer_image", $columns, $values, $where);
+
+    // 완료 후 이동
+    $msg = "Image deleted successfully.";
+    $urlSTR = "/index_intranet.php?view=customer_detail&mode=update&c_uid=$i_customeruid&$goStr";
+
+    $func->modalMsg($msg, $urlSTR);
+    exit();
+}
 
 
 //////////////////////////////////////////////