From 753eda03ab000ca73356ba2a60f74654899ae022 Mon Sep 17 00:00:00 2001
From: arieeefajar <ariefajar739@gmail.com>
Date: Mon, 10 Feb 2025 22:46:04 +0700
Subject: [PATCH] feat(assessment-history): create detail modal

---
 .../js/pages/customJs/assessment/index.js     | 75 ++++++++-----------
 resources/views/assessment/index.blade.php    | 41 ++++++++--
 2 files changed, 65 insertions(+), 51 deletions(-)

diff --git a/public/assets/js/pages/customJs/assessment/index.js b/public/assets/js/pages/customJs/assessment/index.js
index b48eec3..dddf22b 100644
--- a/public/assets/js/pages/customJs/assessment/index.js
+++ b/public/assets/js/pages/customJs/assessment/index.js
@@ -1,20 +1,35 @@
-var checkAll = document.getElementById("checkAll");
-checkAll &&
-    (checkAll.onclick = function () {
-        for (
-            var e = document.querySelectorAll(
-                    '.form-check-all input[type="checkbox"]'
-                ),
-                t = 0;
-            t < e.length;
-            t++
-        )
-            (e[t].checked = this.checked),
-                e[t].checked
-                    ? e[t].closest("tr").classList.add("table-active")
-                    : e[t].closest("tr").classList.remove("table-active");
-    });
-var perPage = 8,
+function detailData(data) {
+    console.log(data);
+
+    // Ambil elemen tbody tabel
+    let tbody = document.querySelector("#detailTable tbody");
+
+    // Kosongkan tabel sebelum menambahkan data baru
+    tbody.innerHTML = "";
+
+    // Pastikan data adalah array atau objek iterable
+    if (Array.isArray(data)) {
+        data.forEach((item) => {
+            let row = `
+                <tr class="text-center">
+                    <td>${item.indicator.name}</td>
+                    <td>${item.md_value.toFixed(4)}</td>
+                </tr>
+            `;
+            tbody.innerHTML += row;
+        });
+    } else {
+        let row = `
+            <tr class="text-center">
+                <td>${data.indicator.name}</td>
+                <td>${data.md_value.toFixed(4)}</td>
+            </tr>
+        `;
+        tbody.innerHTML += row;
+    }
+}
+
+var perPage = 10,
     options = {
         valueNames: ["id", "customer_name", "email", "date", "phone", "status"],
         page: perPage,
@@ -308,29 +323,3 @@ document
                         .querySelector(".active")
                         .previousSibling.children[0].click());
         });
-var attroptions = {
-        valueNames: [
-            "name",
-            "born",
-            { data: ["id"] },
-            { attr: "src", name: "image" },
-            { attr: "href", name: "link" },
-            { attr: "data-timestamp", name: "timestamp" },
-        ],
-    },
-    attrList = new List("users", attroptions);
-attrList.add({
-    name: "Leia",
-    born: "1954",
-    image: "assets/images/users/avatar-5.jpg",
-    id: 5,
-    timestamp: "67893",
-});
-var existOptionsList = { valueNames: ["contact-name", "contact-message"] },
-    existList = new List("contact-existing-list", existOptionsList),
-    fuzzySearchList = new List("fuzzysearch-list", { valueNames: ["name"] }),
-    paginationList = new List("pagination-list", {
-        valueNames: ["pagi-list"],
-        page: 3,
-        pagination: !0,
-    });
diff --git a/resources/views/assessment/index.blade.php b/resources/views/assessment/index.blade.php
index 115bb74..3cfb76f 100644
--- a/resources/views/assessment/index.blade.php
+++ b/resources/views/assessment/index.blade.php
@@ -83,7 +83,8 @@ class="fw-medium link-primary">#VZ2101</a>
                                                         <div class="d-flex gap-2 justify-content-center">
                                                             <div class="edit">
                                                                 <button class="btn btn-sm btn-primary edit-item-btn"
-                                                                    data-bs-toggle="modal" data-bs-target="#showModal">
+                                                                    data-bs-toggle="modal" data-bs-target="#detailModal"
+                                                                    onclick="detailData({{ $evaluation->evaluationDetails }})">
                                                                     Detail
                                                                 </button>
                                                             </div>
@@ -139,11 +140,8 @@ class="fw-medium link-primary">#VZ2101</a>
                                                 colors="primary:#25a0e2,secondary:#00bd9d"
                                                 style="width: 75px; height: 75px">
                                             </lord-icon>
-                                            <h5 class="mt-2">Sorry! No Result Found</h5>
-                                            <p class="text-muted mb-0">
-                                                We've searched more than 150+ Orders We did not
-                                                find any orders for you search.
-                                            </p>
+                                            <h5 class="mt-2">Maaf! Data Tidak Ditemukan</h5>
+                                            <p class="text-muted mb-0">Silahkan gunakan kata kunci lain</p>
                                         </div>
                                     </div>
                                 </div>
@@ -151,11 +149,11 @@ class="fw-medium link-primary">#VZ2101</a>
                                 <div class="d-flex justify-content-end">
                                     <div class="pagination-wrap hstack gap-2">
                                         <a class="page-item pagination-prev disabled" href="#">
-                                            Previous
+                                            Sebelumnya
                                         </a>
                                         <ul class="pagination listjs-pagination mb-0"></ul>
                                         <a class="page-item pagination-next" href="#">
-                                            Next
+                                            Selanjutnya
                                         </a>
                                     </div>
                                 </div>
@@ -235,6 +233,33 @@ class="fw-medium link-primary">#VZ2101</a>
                 </div>
             </div>
 
+            <div class="modal fade" id="detailModal" tabindex="-1" aria-labelledby="exampleModalLabel"
+                aria-hidden="true">
+                <div class="modal-dialog modal-dialog-centered">
+                    <div class="modal-content">
+                        <div class="modal-header bg-light p-3">
+                            <h5 class="modal-title" id="exampleModalLabel">Detail Penilaian</h5>
+                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"
+                                id="close-modal"></button>
+                        </div>
+                        <table class="table align-middle table-nowrap" id="detailTable">
+                            <thead>
+                                <tr class="text-center">
+                                    <th>Indikator</th>
+                                    <th>MD Value</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr class="text-center">
+                                    <td>pH</td>
+                                    <td>0.8</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+
             <!-- Modal -->
             <div class="modal fade zoomIn" id="deleteRecordModal" tabindex="-1" aria-hidden="true">
                 <div class="modal-dialog modal-dialog-centered">