WS 实例放进 state 会发生什么：
  1. Devtools 序列化它 → 循环引用 / 崩溃或巨慢
  2. 时间旅行回放时"状态"里混着活连接 → 回放语义错乱
  3. reactive 深层代理包装实例 → 内部 this 指向错乱，心跳定时器行为异常

┌──────────────────────────────────────────────┐
│ 数据源服务（普通模块，非响应式）                │
│   WsDataSource + ReconnectingWebSocket +      │
│   SessionManager —— 原样服役（Day 58-63 功劳） │
│   职责：连接、重连、补传、原始分发              │
├──────────────────────────────────────────────┤
│ Pinia store（响应式状态树）                    │
│   state：latest/alarms/tempWindows/connState │
│   actions：setSnapshot 等纯状态变更（Day 80）  │
│   新增：startDataLink() —— 接线动作           │
└──────────────────────────────────────────────┘

// src/services/data-link.ts
import { WsDataSource } from "../core/ws-data-source";
import type { PanelSnapshot, Alarm } from "../core/types";

/**
 * 数据链路服务（模块单例，非响应式）
 * Day 63 的 WsDataSource 原样服役——重连/心跳/补传能力零改动
 * 唯一变化：订阅回调从"喂 ScreenStore"改为"喂 Pinia actions"（由调用方注入）
 */

/** 桥接协议：数据链路 → store 的注入接口（store 提供，服务不认识 store） */
export interface DataLinkSink {
  onSnapshot(snap: PanelSnapshot): void;
  onAlarms(alarms: Alarm[]): void;
  onConnState(s: "connected" | "connecting" | "closed"): void;
}

let source: WsDataSource | null = null;

/** 启动链路：注入回调（依赖倒置——服务定义协议，store 实现） */
export function startDataLink(sink: DataLinkSink): void {
  if (source) return;                    // 防重复启动（HMR 保护）
  source = new WsDataSource();
  source.subscribe((snap) => sink.onSnapshot(snap));
  (source as { onState?: (s: DataLinkSink["onConnState"]) => void }).onState?.(
    (s) => sink.onConnState(s)
  );
  source.start();
}

/** 停止链路（测试/卸载用；大屏常驻场景一般不调） */
export function stopDataLink(): void {
  source?.stop();
  source = null;
}

// src/stores/dashboard.ts（在 Day 80 基础上追加接线 action）

export const useDashboardStore = defineStore("dashboard", {
  state: () => ({ /* Day 80 原样 */ }),
  getters: { /* Day 80 原样 */ },
  actions: {
    /* Day 80 的 setSnapshot / pushAlarms / ackAlarm / setConnState 原样 */

    /**
     * 启动数据链路：全应用只调一次（App.vue onMounted 里）
     * 实现数据源协议：把链路数据翻译成 actions 调用
     */
    startDataLink(): void {
      startDataLinkService({
        onSnapshot: (snap) => {
          this.setSnapshot(snap);
          // 告警内嵌在快照里的场景：抽取并累积（Day 63 协议）
          if (snap.alarms?.length) this.pushAlarms(snap.alarms);
        },
        onAlarms: (alarms) => this.pushAlarms(alarms),
        onConnState: (s) => this.setConnState(s),
      });
    },
  },
});

<!-- App.vue -->
<script setup lang="ts">
import { onMounted } from "vue";
import { useDashboardStore } from "./stores/dashboard";

const store = useDashboardStore();

onMounted(() => {
  store.startDataLink();   // 挂载后开闸——首帧渲染不被数据等待阻塞
});
</script>

// 屏 B 的消费端分频（ScreenB.vue）
import { watch } from "vue";
import { storeToRefs } from "pinia";

const store = useDashboardStore();
const { latest } = storeToRefs(store);

// KPI 类：1 秒一更（节流 watch——迁移 Day 65 的 minIntervalMs 语义）
let lastKpi = 0;
watch(latest, (snap) => {
  const now = performance.now();
  if (now - lastKpi < 1000) return;
  lastKpi = now;
  kpiTiles.forEach((t) => t.update(snap));
});

// 曲线类：每帧推（不节流——窗口天然受 WS 节奏限制，Day 65 同结论）
const { tempWindows } = storeToRefs(store);
watch(tempWindows, () => lineOption.value = buildOption(tempWindows.value));

1. 全局搜索 useScreenStore / screen-store —— 替换为 dashboard store 消费
2. 删除 src/composables/useScreenStore.ts 与 src/core/screen-store.ts
3. npm run build 绿
4. 回归：Day 69 联调清单全量跑
   □ 数据五断点追踪（温度值 → state.latest → 三屏呈现）
   □ 容错三场景（杀服务器/断网 30s/告警跨屏）
   □ subs 泄漏检查退役（无订阅数组了）→ 换成：切屏 50 次后 Devtools
     Pinia 面板状态正常、组件树无膨胀