hardware n monitoring

This commit is contained in:
[Valentino Heman Budiarto]
2026-06-15 17:57:30 +07:00
parent 1cf7a02ba7
commit 5e38ec30bc
3 changed files with 89 additions and 41 deletions
+31 -15
View File
@@ -1,7 +1,7 @@
"use client";
import { useState, useEffect } from "react";
import { Activity, Power, ZapOff, AlertTriangle, Lightbulb, Wind, Projector } from "lucide-react";
import { Activity, Power, ZapOff, Zap, AlertTriangle, Lightbulb, Wind, Projector } from "lucide-react";
export default function PowerMonitoringPage() {
// =========================================================================
@@ -147,27 +147,44 @@ export default function PowerMonitoringPage() {
}
};
// FUNGSI CUT OFF DAYA KHUSUS D101
const handleCutOff = async (roomName: string, roomId: number) => {
// FUNGSI GLOBAL POWER (ON/OFF KHUSUS D101)
const handleGlobalPower = async (roomName: string, roomId: number, currentRelayStatus: boolean) => {
if (roomName === "Kelas D101") {
if (!window.confirm(`PERINGATAN FATAL: Anda yakin ingin memutus 3 MCB Daya di ${roomName} secara paksa?`)) return;
const actionType = currentRelayStatus ? "off" : "on";
const confirmMessage = currentRelayStatus
? `PERINGATAN FATAL: Anda yakin ingin MEMUTUS 3 MCB Daya di ${roomName}? (Proses berurutan ~3 detik)`
: `RESTORE POWER: Anda yakin ingin MENYALAKAN KEMBALI 3 MCB Daya di ${roomName}? (Proses berurutan ~3 detik)`;
if (!window.confirm(confirmMessage)) return;
// Ubah UI seketika
setRooms(prev => prev.map(r => r.name === roomName ? { ...r, isRelayOn: !currentRelayStatus } : r));
try {
const response = await fetch("http://172.17.172.17:8080/api/cutoff", { method: "POST" });
const response = await fetch("http://172.17.172.17:8080/api/power/global", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ action: actionType }),
});
if (response.ok) {
alert(`Daya di ${roomName} berhasil diputus!`);
setRooms(prev => prev.map(r => r.name === roomName ? { ...r, isRelayOn: false, power: 0 } : r));
alert(`Daya di ${roomName} berhasil di-${actionType.toUpperCase()}!`);
fetchPowerStatus();
fetchDeviceStatus();
} else {
alert("Gagal memutus daya. Cek koneksi server.");
// Rollback UI jika gagal
setRooms(prev => prev.map(r => r.name === roomName ? { ...r, isRelayOn: currentRelayStatus } : r));
alert("Gagal mengontrol MCB utama. Cek koneksi server.");
}
} catch (error) {
alert("Terjadi kesalahan jaringan saat memutus daya.");
setRooms(prev => prev.map(r => r.name === roomName ? { ...r, isRelayOn: currentRelayStatus } : r));
alert("Terjadi kesalahan jaringan saat menghubungi server.");
}
} else {
// Dummy untuk kelas lain
if (window.confirm(`Simulasi mematikan daya di ${roomName}?`)) {
setRooms(prev => prev.map(r => r.name === roomName ? { ...r, isRelayOn: false, power: 0 } : r));
const actionType = currentRelayStatus ? "Mematikan" : "Menyalakan";
if (window.confirm(`Simulasi ${actionType} daya di ${roomName}?`)) {
setRooms(prev => prev.map(r => r.name === roomName ? { ...r, isRelayOn: !currentRelayStatus, power: 0 } : r));
}
}
};
@@ -275,14 +292,13 @@ export default function PowerMonitoringPage() {
<div className="flex items-center justify-between mt-6 pt-4 border-t border-gray-100">
<span className="text-xs text-gray-400 font-medium">Update: {room.lastUpdate}</span>
<button
onClick={() => handleCutOff(room.name, room.id)}
disabled={!room.isRelayOn}
onClick={() => handleGlobalPower(room.name, room.id, room.isRelayOn)}
className={`flex items-center gap-2 px-4 py-2 rounded-lg text-xs font-bold transition-all
${room.isRelayOn
? 'bg-red-50 text-red-600 hover:bg-red-600 hover:text-white border border-red-200 hover:border-red-600'
: 'bg-gray-100 text-gray-400 cursor-not-allowed'}`}
: 'bg-green-50 text-green-600 hover:bg-green-600 hover:text-white border border-green-200 hover:border-green-600'}`}
>
{room.isRelayOn ? <><Power size={14} /> Cut Off Power</> : <><ZapOff size={14} /> Offline</>}
{room.isRelayOn ? <><Power size={14} /> Cut Off Power</> : <><Zap size={14} /> Restore Power</>}
</button>
</div>
</div>