Files
silaras-rssa/app/Views/dashboard.php
T
2026-08-03 15:44:52 +07:00

372 lines
8.8 KiB
PHP

<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<title>SiLARAS 119</title>
<link rel="icon" href="https://raw.githubusercontent.com/ambulan119/inventarisambulans119/refs/heads/main/silarass2.ico">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body{
min-height:100vh;
font-family:"Segoe UI",sans-serif;
color:#fff;
background:
linear-gradient(rgba(2,6,23,.85), rgba(2,6,23,.95)),
url("https://raw.githubusercontent.com/ambulan119/inventarisambulans119/refs/heads/main/silarasss.jpg")
center/cover no-repeat fixed;
}
.judul{text-align:center;margin-top:60px;}
.hero-logo{
width:90px;border-radius:16px;padding:6px;
background:rgba(255,255,255,.1);
box-shadow:0 0 15px rgba(34,211,238,.5);
}
.title-anim{
font-size:clamp(2.5rem,6vw,4rem);
font-weight:900;margin-top:15px;
}
.text-119{
color:#ff1e1e;
font-weight:700;
animation: blink119 0.6s infinite;
text-shadow: 0 0 8px rgba(255,30,30,.6);
}
@keyframes blink119{
0%,100% { opacity: 1; transform: scale(1); }
50% { opacity: 0.3; transform: scale(1.05); }
}
.subtitle-anim{opacity:.8;}
.menu-card{
border-radius:18px;padding:22px;text-align:center;
cursor:pointer;transition:.3s;
background:rgba(255,255,255,.06);
border:1px solid rgba(255,255,255,.1);
width:100%;height:100%;
display:flex;flex-direction:column;
justify-content:center;min-height:180px;
}
.menu-card:hover{
transform:translateY(-8px) scale(1.03);
box-shadow:0 0 25px rgba(0,255,200,.4);
}
.menu-icon{font-size:40px;margin-bottom:12px;}
.c1{color:#00d4ff;}
.c2{color:#00ff9d;}
.c3{color:#ffc107;}
.c4{color:#ff6b6b;}
.c5{color:#a29bfe;}
.c6{color:#00e5ff;}
.row-menu{margin-top:50px;}
.app-frame{
display:none;
position:fixed;
inset:0;
background:#0f172a;
z-index:9999;
}
.app-frame iframe{
width:100%;
height:100%;
border:none;
background:white;
}
.close-frame{
position:absolute;
top:10px;
right:10px;
z-index:10000;
background:Yellow;
color:black;
border:none;
padding:8px 12px;
border-radius:8px;
cursor:pointer;
}
.system-panel{
position:fixed;
inset:0;
background:rgba(0,0,0,.4);
display:none;
align-items:center;
justify-content:center;
z-index:9999;
}
.panel-box{
width:320px;
background:#fff;
border-radius:16px;
box-shadow:0 20px 60px rgba(0,0,0,.2);
overflow:hidden;
font-size:13px;
}
.panel-header{
display:flex;
justify-content:space-between;
align-items:center;
padding:12px 14px;
background:#0f172a;
color:#fff;
}
.panel-header button{
background:none;
border:none;
color:#fff;
font-size:16px;
cursor:pointer;
}
.panel-body{
padding:14px;
color:#334155;
}
.info-row{
padding:6px 0;
border-bottom:1px solid #f1f5f9;
}
.footer{
text-align:center;
font-size:12px;
color:#64748b;
padding:14px 0;
cursor:pointer;
}
.footer .version{
margin-left:8px;
font-size:11px;
font-weight:600;
color:#94a3b8;
background:#f1f5f9;
padding:2px 8px;
border-radius:999px;
border:1px solid #e2e8f0;
}
.system{
font-weight:800;
color:#ef4444;
letter-spacing:0.5px;
animation: systemPulse 2.5s ease-in-out infinite;
}
@keyframes systemPulse{
0%,100% { opacity: 1; }
50% { opacity: 0.4; }
}
</style>
</head>
<body>
<div class="container-fluid p-3 d-flex justify-content-between align-items-center">
<div class="text-white">
Selamat datang,
<strong><?= session('nama') ?></strong>
<span class="badge bg-info ms-2">
<?= strtoupper(session('role')) ?>
</span>
</div>
<a href="<?= base_url('logout') ?>" class="btn btn-danger">
Logout
</a>
</div>
<!-- HERO -->
<div class="container text-center judul">
<img src="https://raw.githubusercontent.com/ambulan119/inventarisambulans119/refs/heads/main/silarass2.ico" class="hero-logo">
<h1 class="title-anim">SiLARAS <span class="text-119">119</span></h1>
<p class="subtitle-anim">Sistem Laporan Aktivitas Respon Ambulans 119</p>
<p class="subtitle-anim">Rumah Sakit dr. Saiful Anwar</p>
</div>
<!-- MENU -->
<div class="container">
<div class="row g-4 row-menu">
<div class="col-md-4 d-flex">
<div class="menu-card" onclick="goKajaga()">
<div class="menu-icon c1">📋</div>
<h5>Laporan Kepala Jaga</h5>
</div>
</div>
<div class="col-md-4 d-flex">
<div class="menu-card" onclick="goSupervisi()">
<div class="menu-icon c7">📊</div>
<h5>Monitoring Supervisi</h5>
<h5>& Evaluasi</h5>
</div>
</div>
<div class="col-md-4 d-flex">
<div class="menu-card" onclick="window.location.href='./pasien/list'">
<div class="menu-icon c2">🧾</div>
<h5>Data E-Rekam Medik</h5>
<h5>Pasien Ambulans 119</h5>
</div>
</div>
<div class="col-md-4 d-flex">
<div class="menu-card" onclick="window.location.href='./pasien/aktif'">
<div class="menu-icon c3">🚑</div>
<h5>Data Pasien Aktif</h5>
<p><?= $total ?? 0 ?> pasien aktif</p>
<div>
🚨 True Emergency: <?= $emergency ?? 0 ?><br>
👤 Non Emergency: <?= $non ?? 0 ?><br>
⏳ Pending Order: <?= $pending ?? 0 ?>
</div>
</div>
</div>
<div class="col-md-4 d-flex">
<div class="menu-card" onclick="openFrame('https://ambulan119.github.io/inventarisambulans119/')">
<div class="menu-icon c4">📦</div>
<h5>Inventaris Ambulans</h5>
</div>
</div>
<div class="col-md-4 d-flex">
<div class="menu-card" onclick="maintenance()">
<div class="menu-icon c5">🎪</div>
<h5>Siaga Event & Bencana</h5>
</div>
</div>
<div class="col-md-4 d-flex">
<div class="menu-card" onclick="maintenance()">
<div class="menu-icon c6">🏃</div>
<h5>Endurance Exercise</h5>
</div>
</div>
<div class="col-md-4 d-flex">
<div class="menu-card" onclick="maintenance()">
<div class="menu-icon c1">💉</div>
<h5>Input Tindakan Ambulans</h5>
</div>
</div>
</div>
</div>
<div id="appFrame" class="app-frame">
<!-- LOADING -->
<div id="loadingFrame" style="
display:none;
position:absolute;
inset:0;
background:#0f172a;
color:white;
display:flex;
justify-content:center;
align-items:center;
z-index:10001;
font-size:24px;
">
⏳ Memuat Laporan...
</div>
<button class="close-frame" onclick="closeFrame()">✖ Kembali Ke Dashboard SiLaras 119</button>
<iframe id="frameContent"></iframe>
</div>
<div class="footer" onclick="toggleSystemPanel()">
© <?= date('Y') ?> SiLARAS 119 | RSSA
<span class="version">
v<?= $app['version'] ?> • <?= $app['status'] ?>
</span>
</div>
<div id="systemPanel" class="system-panel">
<div class="panel-box">
<div class="panel-header">
<h5>🖥️ System - <span class="system">SiLARAS 119</span></h5>
<button onclick="toggleSystemPanel()">✖</button>
</div>
<div class="panel-body">
<div class="info-row"><b>App Version:</b> <?= $app['version'] ?> (<?= $app['status'] ?>)</div>
<div class="info-row"><b>PHP Version:</b> <?= phpversion() ?></div>
<div class="info-row"><b>Server Time:</b> <?= date('Y-m-d H:i:s') ?></div>
<div class="info-row"><b>System:</b> SiLARAS 119 RSSA</div>
<div class="info-row"><b>Build Year:</b> <?= date('Y') ?></div>
</div>
</div>
</div>
<script>
function goExternal(url){
window.open(url, "_blank");
}
function maintenance(){
alert("Fitur masih dalam pengembangan 🚧");
}
function openFrame(url){
const loading = document.getElementById("loadingFrame");
const iframe = document.getElementById("frameContent");
loading.style.display = "flex";
iframe.src = url;
iframe.onload = function(){
loading.style.display = "none";
};
document.getElementById("appFrame").style.display = "block";
}
function closeFrame(){
document.getElementById("frameContent").src = "";
document.getElementById("appFrame").style.display = "none";
}
function toggleSystemPanel(){
const panel = document.getElementById("systemPanel");
panel.style.display = (panel.style.display === "flex") ? "none" : "flex";
}
function goKajaga(){
const url = "<?= base_url('laporan/LAPORANKAJAGA.html') ?>";
openFrame(url + "?v=" + Date.now());
}
function goSupervisi(){
const url = "<?= base_url('supervisi/input-supervisi.html') ?>";
openFrame(url + "?v=" + Date.now());
}
</script>
</body>
</html>