feat(scada): add manual monitoring timeline

2026-11-04 14:27:08 +08:00
parent 78481903d7
commit 0801e161ec
22 changed files with 1314 additions and 664 deletions
@@ -2530,3 +2530,77 @@ body:has(:is(.agent-history-dialog, .agent-topic-dialog)[data-state="open"]) [da
 .workbench-shadcn-surface .font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", "Noto Sans SC Variable", monospace;
 }
+
+
+/* SCADA tuning dial: the explicitly scoped glass surface in the peripheral panel. */
+.scada-fm-window {
+  --scada-timeline-needle: #cf453f;
+  isolation: isolate;
+  background: linear-gradient(180deg,
+    color-mix(in srgb, var(--surface-reading) 50%, transparent),
+    color-mix(in srgb, var(--surface-control) 42%, transparent) 52%,
+    color-mix(in srgb, var(--surface-reading) 76%, transparent));
+  border: 1px solid color-mix(in srgb, white 76%, var(--surface-border));
+  backdrop-filter: blur(12px) saturate(1.05);
+  box-shadow: inset 0 1px 0 rgb(255 255 255 / 95%), inset 0 -1px 0 rgb(255 255 255 / 70%), inset 0 8px 18px rgb(68 86 112 / 4%), 0 2px 7px rgb(45 60 82 / 5%);
+  cursor: grab;
+  transition: border-color 160ms ease, box-shadow 160ms ease;
+}
+.scada-fm-window:hover {
+  border-color: color-mix(in srgb, white 50%, var(--surface-border));
+}
+.scada-fm-window:focus-visible {
+  outline: 2px solid var(--action-focus-ring);
+  outline-offset: 3px;
+}
+.scada-fm-window[data-dragging="true"] {
+  cursor: grabbing;
+  box-shadow: inset 0 1px 0 rgb(255 255 255 / 95%), inset 0 2px 12px rgb(68 86 112 / 9%), 0 1px 4px rgb(45 60 82 / 4%);
+}
+.scada-fm-window::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  z-index: 2;
+  background: linear-gradient(180deg, rgb(255 255 255 / 55%), rgb(255 255 255 / 10%) 35%, transparent 36%, transparent 75%, rgb(255 255 255 / 30%));
+}
+.scada-fm-window::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  pointer-events: none;
+  background: linear-gradient(90deg,
+    color-mix(in srgb, var(--ink) 13%, transparent),
+    color-mix(in srgb, var(--ink) 5%, transparent) 10%,
+    transparent 24%,
+    transparent 76%,
+    color-mix(in srgb, var(--ink) 5%, transparent) 90%,
+    color-mix(in srgb, var(--ink) 13%, transparent));
+}
+.scada-fm-scale {
+  mask-image: linear-gradient(90deg, transparent, rgb(0 0 0 / 45%) 8%, black 22%, black 78%, rgb(0 0 0 / 45%) 92%, transparent);
+}
+.scada-fm-needle {
+  z-index: 3;
+  background: var(--scada-timeline-needle);
+  box-shadow: 0 0 0 1px rgb(255 255 255 / 45%), 0 0 7px color-mix(in srgb, var(--scada-timeline-needle) 18%, transparent);
+}
+.scada-fm-needle::before {
+  content: "";
+  position: absolute;
+  top: -5px;
+  left: -3px;
+  width: 0;
+  height: 0;
+  border-left: 4px solid transparent;
+  border-right: 4px solid transparent;
+  border-top: 6px solid var(--scada-timeline-needle);
+}
+@supports not (backdrop-filter: blur(1px)) {
+  .scada-fm-window { background: var(--surface-reading, #f7f9fc); }
+}
+@media (prefers-reduced-motion: reduce) {
+  .scada-fm-window { transition: none; }
+}