create search dokter API + UI

dataLaporanOperasi.php

@@ -0,0 +1,67 @@
+<?php
+require_once "lib/PostgresDb.php";
+
+header("Content-Type: application/json");
+
+$db = new PostgresDb();
+
+$action = $_GET['action'] ?? '';
+$q = '';
+if (isset($_GET['q'])) {
+    $q = $_GET['q'];
+}
+
+switch ($action) {
+    case "searchDPJP":
+        searchDPJP($db, $q);
+        break;
+    case "searchDokterAnestesi":
+        searchDokterAnestesi($db, $q);
+        break;
+    default :
+        echo json_encode([
+            "error" => "invalid action"
+        ]);
+}
+
+function searchDPJP(PostgresDb $db, string $q) {
+    $query = "SELECT kddokter, namadokter, kdsmf, kode_dpjp FROM public.m_dokter WHERE kdsmf LIKE '%BEDAH%'";
+    
+    if ($q != '') {
+        $query .= " AND (namadokter ILIKE '%$q%' OR kode_dpjp ILIKE '%$q%')";
+    }
+
+    $sql_dokter_bedah = $db->query($query);
+    
+    $arr_dokter_bedah = array();
+    foreach ($sql_dokter_bedah->fetchAll() as $ds) {
+        array_push($arr_dokter_bedah, $ds);
+    }
+
+    echo json_encode([
+        "message" => "success get dokter",
+        "data" => $arr_dokter_bedah
+    ]);
+}
+
+function searchDokterAnestesi(PostgresDb $db, string $q) {
+    $query = "SELECT kddokter, namadokter, kdsmf, kode_dpjp FROM public.m_dokter WHERE kdsmf LIKE '%ANESTHESI%'";
+    
+    if ($q != '') {
+        $query .= " AND (namadokter ILIKE '%$q%' OR kode_dpjp ILIKE '%$q%')";
+    }
+
+    $sql_dokter_anestesi = $db->query($query);
+    
+    $arr_dokter_anestesi = array();
+    foreach ($sql_dokter_anestesi->fetchAll() as $ds) {
+        array_push($arr_dokter_anestesi, $ds);
+    }
+
+    echo json_encode([
+        "message" => "success get dokter",
+        "data" => $arr_dokter_anestesi
+    ]);
+}
+
+?>

index.php

@@ -1,5 +1,27 @@
 <?php
 
+require_once "lib/PostgresDb.php";
+require "lib/functions.php";
+
+// initiate db class connection
+$db = new PostgresDb();
+
+// query dokter bedah
+$sql_dokter_bedah = $db->query(
+    "SELECT * FROM public.m_dokter WHERE kdsmf LIKE '%BEDAH%'"
+);
+$arr_dokter_bedah = array();
+foreach ($sql_dokter_bedah->fetchAll() as $ds) {
+    $arr_dokter_bedah[$ds['kddokter']] = $ds['namadokter'];
+}
+
+// query dokter anestesi
+$sql_dokter_anesthesi = $db->query("SELECT * FROM public.m_dokter WHERE kdsmf LIKE '%ANESTHESI%'");
+$arr_dokter_anesthesi = array();
+foreach ($sql_dokter_anesthesi->fetchAll() as $ds) {
+    $arr_dokter_anesthesi[$ds['kddokter']] = $ds['namadokter'];
+}
+
 $riwayat = [
     [
         "tanggal" => "28/1/2026, 2:27:04 PM",
@@ -57,13 +79,21 @@ if ($_SERVER['REQUEST_METHOD'] == "POST") {
 
             <div class="row">
 
-                <div class="col-md-4">
+                <div class="col-md-4 position-relative">
                     <label>DPJP Operator</label>
-                    <select class="form-select" name="dpjp_operator" id="dpjp_operator">
+                    <input
-                        <option>dr.SYAIFULLAH AMISRAGANI, Sp.OT</option>
+                        type="text"
-                        <option>dr.AGUS, Sp.BO</option>
+                        id="searchDPJP"
-                        <option>dr.Koernia Kusuma Wardhana, Sp.B-TKV</option>
+                        class="form-control"
-                    </select>
+                        placeholder="Cari dokter..."
+                        autocomplete="off"
+                    >
+                    <input type="hidden" name="dpjp_operator" id="dpjp_operator">
+                    <div
+                        id="resultDPJP"
+                        class="list-group position-absolute w-100"
+                        style="z-index:1000"
+                    ></div>
                 </div>
 
                 <div class="col-md-4">
@@ -82,11 +112,19 @@ if ($_SERVER['REQUEST_METHOD'] == "POST") {
 
                 <div class="col-md-4">
                     <label>DPJP Anastesi</label>
-                    <select class="form-select" name="dpjp_anastesi">
+                    <input
-                        <option>dr.FANNIYAH,Sp.An</option>
+                        type="text"
-                        <option>dr.DEWI ARUM SAWITRI, Sp.AN-TI</option>
+                        id="searchDokterAnestesi"
-                        <option>dr.MUHAMAD AKBAR SIDIQ, Sp.AN-TI</option>
+                        class="form-control"
-                    </select>
+                        placeholder="Cari dokter..."
+                        autocomplete="off"
+                    >
+                    <input type="hidden" name="dpjp_anestesi" id="dpjp_anestesi">
+                    <div
+                        id="resultDokterAnestesi"
+                        class="list-group position-absolute w-100"
+                        style="z-index:1000"
+                    ></div>
                 </div>
 
                 <div class="col-md-4">
@@ -660,6 +698,112 @@ if ($_SERVER['REQUEST_METHOD'] == "POST") {
 
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
     <script>
+        const BASEURL = "http://localhost:8080/dataLaporanOperasi.php";
+
+        /* SEARCH AND SHOW DPJP*/
+        const inputDokter = document.getElementById("searchDPJP")
+        const resultDokter = document.getElementById("resultDPJP")
+        const hiddenDokter = document.getElementById("dpjp_operator")
+
+        let timer = null
+
+        inputDokter.addEventListener("input", () => {
+
+            clearTimeout(timer)
+
+            let keyword = inputDokter.value
+
+            if (keyword.length < 2) {
+                resultDokter.innerHTML = ""
+                return
+            }
+
+            timer = setTimeout(() => {
+
+                fetch(`${BASEURL}?action=searchDPJP&q=${keyword}`)
+                .then(res => res.json())
+                .then(data => {
+
+                    resultDokter.innerHTML = ""
+                    // console.log(data)
+                    data.data.forEach(d => {
+
+                        let item = document.createElement("button")
+
+                        item.type = "button"
+                        item.className = "list-group-item list-group-item-action"
+                        item.textContent = d.namadokter
+
+                        item.onclick = () => {
+
+                            inputDokter.value = d.namadokter
+                            hiddenDokter.value = d.kddokter
+
+                            resultDokter.innerHTML = ""
+
+                        }
+
+                        resultDokter.appendChild(item)
+
+                    })
+
+                })
+
+            }, 300)
+
+        })
+
+        /* SEARCH AND SHOW Dokter Anestesi*/
+        const inputDokterAnestesi = document.getElementById("searchDokterAnestesi")
+        const resultDokterAnestesi = document.getElementById("resultDokterAnestesi")
+        const hiddenDokterAnestesi = document.getElementById("dpjp_anestesi")
+
+        inputDokterAnestesi.addEventListener("input", () => {
+
+            clearTimeout(timer)
+
+            let keyword = inputDokterAnestesi.value
+
+            if (keyword.length < 2) {
+                resultDokterAnestesi.innerHTML = ""
+                return
+            }
+
+            timer = setTimeout(() => {
+
+                fetch(`${BASEURL}?action=searchDokterAnestesi&q=${keyword}`)
+                .then(res => res.json())
+                .then(data => {
+
+                    resultDokterAnestesi.innerHTML = ""
+                    // console.log(data)
+                    data.data.forEach(d => {
+
+                        let item = document.createElement("button")
+
+                        item.type = "button"
+                        item.className = "list-group-item list-group-item-action"
+                        item.textContent = d.namadokter
+
+                        item.onclick = () => {
+
+                            inputDokterAnestesi.value = d.namadokter
+                            hiddenDokterAnestesi.value = d.kddokter
+
+                            resultDokterAnestesi.innerHTML = ""
+
+                        }
+
+                        resultDokterAnestesi.appendChild(item)
+
+                    })
+
+                })
+
+            }, 300)
+
+        })
+
         /* kalkulasi waktu */
 
         function calc(start, dur, end) {