From c1b40185ebdca1ff8a56c2d37e4fcb28f29cda3a Mon Sep 17 00:00:00 2001
From: sky121113 <sky121113@gmail.com>
Date: Mon, 9 Mar 2026 10:17:25 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E6=94=B9=E9=80=A0=20Dashboard=20?=
 =?UTF-8?q?=E7=82=BA=E5=BE=A9=E5=8F=A4=E5=B7=A5=E6=A5=AD=E9=A2=A8=20-=20?=
 =?UTF-8?q?=E5=B0=8E=E5=85=A5=E6=93=AC=E7=89=A9=E5=8C=96=E9=9D=A2=E6=9D=BF?=
 =?UTF-8?q?=E8=88=87=20CRT=20=E6=95=B8=E6=93=9A=E7=9B=A3=E6=8E=A7=E5=8D=80?=
 =?UTF-8?q?=E5=9F=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/views/admin/dashboard.blade.php | 210 +++++++++-------------
 1 file changed, 84 insertions(+), 126 deletions(-)

diff --git a/resources/views/admin/dashboard.blade.php b/resources/views/admin/dashboard.blade.php
index a512777..1337510 100644
--- a/resources/views/admin/dashboard.blade.php
+++ b/resources/views/admin/dashboard.blade.php
@@ -5,151 +5,109 @@
   <!-- Grid -->
   <div class="grid sm:grid-cols-2 lg:grid-cols-4 gap-4 sm:gap-6">
     <!-- Card -->
-    <div class="flex flex-col bg-white border shadow-sm rounded-xl dark:bg-gray-800 dark:border-gray-700">
-      <div class="p-4 md:p-5">
-        <div class="flex items-center gap-x-2">
-          <p class="text-xs uppercase tracking-wide text-gray-500 dark:text-gray-400">
-            總銷售額
-          </p>
-          <div class="hs-tooltip">
-            <div class="hs-tooltip-toggle">
-              <svg class="flex-shrink-0 w-4 h-4 text-gray-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><path d="M12 17h.01"/></svg>
-              <span class="hs-tooltip-content hs-tooltip-shown:opacity-100 hs-tooltip-shown:visible opacity-0 transition-opacity inline-block absolute invisible z-10 py-1 px-2 bg-gray-900 text-xs font-medium text-white rounded shadow-sm dark:bg-slate-700" role="tooltip">
-                本月累計銷售總額
-              </span>
-            </div>
-          </div>
-        </div>
-
-        <div class="mt-1 flex items-center gap-x-2">
-          <h3 class="text-xl sm:text-2xl font-medium text-gray-800 dark:text-gray-200">
-            $72,540
-          </h3>
-          <span class="flex items-center gap-x-1 text-green-600">
-            <svg class="inline-block w-4 h-4 self-center" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 7 13.5 15.5 8.5 10.5 2 17"/><polyline points="16 7 22 7 22 13"/></svg>
-            <span class="inline-block text-sm">
-              1.7%
-            </span>
-          </span>
-        </div>
+    <div class="flex flex-col retro-panel p-4 md:p-5">
+      <div class="flex items-center gap-x-2">
+        <p class="text-[10px] uppercase font-bold tracking-[0.2em] text-gray-500 dark:text-gray-400">
+          TOTAL_REVENUE
+        </p>
+      </div>
+      <div class="mt-3 flex items-center gap-x-2">
+        <h3 class="text-2xl font-bold dark:text-gray-200">$72,540.00</h3>
       </div>
     </div>
-    <!-- End Card -->
-
     <!-- Card -->
-    <div class="flex flex-col bg-white border shadow-sm rounded-xl dark:bg-gray-800 dark:border-gray-700">
-      <div class="p-4 md:p-5">
-        <div class="flex items-center gap-x-2">
-          <p class="text-xs uppercase tracking-wide text-gray-500 dark:text-gray-400">
-            活躍機台
-          </p>
-        </div>
-
-        <div class="mt-1 flex items-center gap-x-2">
-          <h3 class="text-xl sm:text-2xl font-medium text-gray-800 dark:text-gray-200">
-            124
-          </h3>
-          <span class="flex items-center gap-x-1 text-red-600">
-            <svg class="inline-block w-4 h-4 self-center" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 17 13.5 8.5 8.5 13.5 2 7"/><polyline points="16 17 22 17 22 11"/></svg>
-            <span class="inline-block text-sm">
-              0.3%
-            </span>
-          </span>
-        </div>
+    <div class="flex flex-col retro-panel p-4 md:p-5">
+      <div class="flex items-center gap-x-2">
+        <p class="text-[10px] uppercase font-bold tracking-[0.2em] text-gray-500 dark:text-gray-400">
+          ACTIVE_MACHINES
+        </p>
+      </div>
+      <div class="mt-3 flex items-center gap-x-2">
+        <h3 class="text-2xl font-bold dark:text-gray-200">124_UNIT</h3>
       </div>
     </div>
-    <!-- End Card -->
-
     <!-- Card -->
-    <div class="flex flex-col bg-white border shadow-sm rounded-xl dark:bg-gray-800 dark:border-gray-700">
-      <div class="p-4 md:p-5">
-        <div class="flex items-center gap-x-2">
-          <p class="text-xs uppercase tracking-wide text-gray-500 dark:text-gray-400">
-            庫存警告
-          </p>
-        </div>
-
-        <div class="mt-1 flex items-center gap-x-2">
-          <h3 class="text-xl sm:text-2xl font-medium text-gray-800 dark:text-gray-200">
-            12
-          </h3>
-        </div>
+    <div class="flex flex-col retro-panel p-4 md:p-5">
+      <div class="flex items-center gap-x-2">
+        <p class="text-[10px] uppercase font-bold tracking-[0.2em] text-gray-500 dark:text-gray-400">
+          ALERTS_PENDING
+        </p>
+      </div>
+      <div class="mt-3 flex items-center gap-x-2">
+        <h3 class="text-2xl font-bold text-red-600 animate-pulse">12_SIGNAL</h3>
       </div>
     </div>
-    <!-- End Card -->
-
     <!-- Card -->
-    <div class="flex flex-col bg-white border shadow-sm rounded-xl dark:bg-gray-800 dark:border-gray-700">
-      <div class="p-4 md:p-5">
-        <div class="flex items-center gap-x-2">
-          <p class="text-xs uppercase tracking-wide text-gray-500 dark:text-gray-400">
-            本月新增會員
-          </p>
-        </div>
-
-        <div class="mt-1 flex items-center gap-x-2">
-          <h3 class="text-xl sm:text-2xl font-medium text-gray-800 dark:text-gray-200">
-            28
-          </h3>
-        </div>
+    <div class="flex flex-col retro-panel p-4 md:p-5">
+      <div class="flex items-center gap-x-2">
+        <p class="text-[10px] uppercase font-bold tracking-[0.2em] text-gray-500 dark:text-gray-400">
+          NEW_MEMBERS
+        </p>
+      </div>
+      <div class="mt-3 flex items-center gap-x-2">
+        <h3 class="text-2xl font-bold dark:text-gray-200">28_NODES</h3>
       </div>
     </div>
-    <!-- End Card -->
   </div>
   <!-- End Grid -->
 
-  <div class="grid lg:grid-cols-2 gap-4 sm:gap-6">
-    <!-- Card -->
-    <div class="p-4 md:p-5 min-h-[410px] flex flex-col bg-white border shadow-sm rounded-xl dark:bg-gray-800 dark:border-gray-700">
-      <!-- Header -->
-      <div class="flex justify-between items-center">
-        <div>
-          <h2 class="text-sm text-gray-500 dark:text-gray-400">
-            營收趨勢
-          </h2>
-          <p class="text-xl sm:text-2xl font-medium text-gray-800 dark:text-gray-200">
-             $123,450
-          </p>
+  <!-- Monitor Section -->
+  <div class="retro-panel p-6">
+    <div class="flex justify-between items-center mb-6">
+        <h2 class="text-lg font-bold flex items-center gap-3">
+            <span class="w-2.5 h-2.5 bg-red-600 rounded-full animate-pulse shadow-[0_0_8px_rgba(220,38,38,0.8)]"></span>
+            SYS_LIVE_MONITORING
+        </h2>
+        <div class="flex gap-4">
+            <span class="text-xs font-bold text-gray-500">SECTOR_B6</span>
+            <span class="text-xs font-bold text-gray-500">UID: SCL-99</span>
         </div>
-        
-        <div>
-          <span class="py-[5px] px-1.5 inline-flex items-center gap-x-1 text-xs font-medium rounded-md bg-teal-100 text-teal-800 dark:bg-teal-500/10 dark:text-teal-500">
-            <svg class="inline-block w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14"/><path d="m19 12-7 7-7-7"/></svg>
-            25%
-          </span>
-        </div>
-      </div>
-      <!-- End Header -->
-
-      <div id="hs-multiple-bar-charts"></div>
     </div>
-    <!-- End Card -->
-
-    <!-- Card -->
-    <div class="p-4 md:p-5 min-h-[410px] flex flex-col bg-white border shadow-sm rounded-xl dark:bg-gray-800 dark:border-gray-700">
-      <!-- Header -->
-      <div class="flex justify-between items-center">
-        <div>
-          <h2 class="text-sm text-gray-500 dark:text-gray-400">
-            訪客分析
-          </h2>
-          <p class="text-xl sm:text-2xl font-medium text-gray-800 dark:text-gray-200">
-            92,913
-          </p>
+    <div class="crt-screen">
+        <div class="flex justify-between items-center mb-4 border-b border-amber-900/40 pb-2">
+            <span class="text-amber-glow tracking-widest text-[10px] opacity-80 uppercase">Primary Data Channel: Inbound_Telemetry_v1.02</span>
+            <div class="flex gap-4 items-center">
+                <span class="text-[10px] text-amber-glow/60">SCAN_FREQ: 60Hz</span>
+                <span class="text-amber-glow animate-retro-blink font-bold text-xs">ONLINE_</span>
+            </div>
         </div>
-
-        <div>
-           <span class="py-[5px] px-1.5 inline-flex items-center gap-x-1 text-xs font-medium rounded-md bg-red-100 text-red-800 dark:bg-red-500/10 dark:text-red-500">
-            <svg class="inline-block w-3.5 h-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14"/><path d="m19 12-7 7-7-7"/></svg>
-            11%
-          </span>
+        <div class="space-y-1 h-[300px] overflow-y-auto scrollbar-hide">
+            <div class="text-[11px] font-mono opacity-80 text-amber-glow/40 border-b border-amber-900/20 mb-2">
+                &gt;&gt; BOOTING SESSION... OK<br>
+                &gt;&gt; KERNEL LOADED... OK<br>
+                &gt;&gt; CONNECTING TO SATELLITE... LINK ESTABLISHED
+            </div>
+            
+            <div class="flex gap-4 text-xs font-mono">
+                <span class="text-gray-600">[10:05:12]</span>
+                <span class="text-blue-500/80">#MAC-402</span>
+                <span class="text-amber-glow/80">INFO: TEMPERATURE_NOMINAL (23.5C)</span>
+            </div>
+             <div class="flex gap-4 text-xs font-mono">
+                <span class="text-gray-600">[10:06:45]</span>
+                <span class="text-blue-500/80">#MAC-115</span>
+                <span class="text-yellow-500 font-bold">WARN: COIN_RECEPTER_NEAR_FULL</span>
+            </div>
+             <div class="flex gap-4 text-xs font-mono">
+                <span class="text-gray-600">[10:07:33]</span>
+                <span class="text-blue-500/80">#MAC-882</span>
+                <span class="text-red-600 font-bold animate-pulse">ERR: MOTOR_STALL_SECTOR_A1</span>
+            </div>
+             <div class="flex gap-4 text-xs font-mono">
+                <span class="text-gray-600">[10:08:21]</span>
+                <span class="text-blue-500/80">#MAC-402</span>
+                <span class="text-amber-glow/80">INFO: HEARTBEAT_ACK_SUCCESS</span>
+            </div>
+            <div class="flex gap-4 text-xs font-mono">
+                <span class="text-gray-600">[10:09:12]</span>
+                <span class="text-amber-glow animate-retro-blink text-lg leading-none">█</span>
+            </div>
+        </div>
+        <div class="mt-6 border-t border-amber-900/40 pt-3 flex justify-between text-[9px] tracking-[0.3em] text-[#ffb000]/40 uppercase font-bold">
+            <span>Terminal: TTY-1 / StarCloudOS v12.53</span>
+            <span>Uptime: 14:22:11:05</span>
         </div>
-      </div>
-      <!-- End Header -->
-
-      <div id="hs-single-area-chart"></div>
     </div>
-    <!-- End Card -->
   </div>
 </div>
 @endsection