agentworkshop 0.7.23 → 0.7.27

package/app/pages/daq/index.vue

@@ -6,7 +6,7 @@
  */
 import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
 import { message } from 'ant-design-vue'
-import { useDaqStream } from '@/app/composables/workshop/useDaqStream'
+import { useDaqStream, type DaqNodeLive } from '@/app/composables/workshop/useDaqStream'
 import { useDcwStream } from '@/app/composables/workshop/useDcwStream'
 import { useWorkshopWs } from '@/app/composables/workshop/useWorkshopWs'
 import { DAQ_TEMPLATES, DAQ_DRIVERS, DAQ_TEMPLATE_ICONS, daqKeyFromRef, type DaqNodeView, type DaqNodeState, type DriverConfigField, type DriverTestResult as DaqDriverTestResult, type DaqTemplateDef, type DaqTemplateIcon } from '#shared/daq-protocol'
@@ -27,81 +27,6 @@ const ws = useWorkshopWs()
 /** 是否存在任意运行中的产线(横幅判定) */
 const anyLineActive = computed(() => dcw.lines.some(l => dcw.lineStateOf(l.id).active))
 
-/** 节点产线归属变更(挂载到产线/移出;失败 toast 后端可读原因) */
-async function setNodeLine(id: string, e: Event): Promise<void> {
-  const lineId = (e.target as HTMLSelectElement).value
-  try {
-    await daq.patchNode(id, { lineId })
-    const n = daq.nodes.find(x => x.id === id)
-    if (n) n.lineId = lineId
-  }
-  catch (err) {
-    message.error(apiErrorMessage(err))
-  }
-}
-
-/** 节点绑定设备(多对多:add 挂新设备 / remove 摘除一台;server 落库,与数字孪生同一 deviceIds 链路) */
-async function addNodeDevice(id: string, e: Event): Promise<void> {
-  const deviceId = (e.target as HTMLSelectElement).value
-  if (!deviceId) return
-  const node = daq.nodes.find(n => n.id === id)
-  if (!node) return
-  if (node.deviceIds?.includes(deviceId)) return
-  try {
-    await daq.setNodeBindings(id, [...(node.deviceIds ?? []), deviceId])
-  }
-  catch (err) {
-    message.error(apiErrorMessage(err))
-  }
-  ;(e.target as HTMLSelectElement).value = ''
-}
-
-async function removeNodeDevice(id: string, deviceId: string): Promise<void> {
-  const node = daq.nodes.find(n => n.id === id)
-  if (!node) return
-  try {
-    await daq.setNodeBindings(id, (node.deviceIds ?? []).filter(d => d !== deviceId))
-  }
-  catch (err) {
-    message.error(apiErrorMessage(err))
-  }
-}
-
-const nodeDeviceIds = (n: DaqNodeView): string[] =>
-  n.deviceIds ?? (n.deviceBindingId ? [n.deviceBindingId] : [])
-const deviceNameById = (id: string): string =>
-  nodeDevices.get(id) ?? deviceTwins.twins.find(t => t.id === id)?.name ?? id
-
-/** 单节点独立 启动/停止采集(PATCH enabled;server 权威,本地乐观翻转 + WS/轮询收敛) */
-async function toggleNodeEnabled(n: { id: string, enabled: boolean, state: string }): Promise<void> {
-  const next = !n.enabled
-  try {
-    await daq.patchNode(n.id, { enabled: next })
-    n.enabled = next
-    if (!next) n.state = 'offline'
-    message.success(next ? tt('daq.k1nodestart147') : tt('daq.k1nodestop146'))
-  }
-  catch (err) {
-    message.error(apiErrorMessage(err))
-  }
-}
-
-/** 活动配方对该节点的数采监控窗口(本线活动批次;不同 Recipe 不同窗口) */
-function recipeWinOf(n: { lineId: string, id: string }): { min?: number, max?: number } | null {
-  if (!n.lineId) return null
-  const run = dcw.lineStateOf(n.lineId)
-  if (!run.active || !run.recipeId) return null
-  const r = dcw.recipes.find(x => x.id === run.recipeId)
-  return r?.daqWindows?.find(w => w.nodeId === n.id) ?? null
-}
-
-/** 配方窗口越限(与服务端 alarm 判定同源;行标红) */
-function recipeAlarm(n: DaqNodeView): boolean {
-  const w = recipeWinOf(n)
-  if (!w || n.value == null) return false
-  return (w.min != null && n.value < w.min) || (w.max != null && n.value > w.max)
-}
-
 // ---------- 运维日志(全操作统一记录):实时事件轨渲染摘要,详情在 /logs 日志管理 ----------
 const opsLog = useOpsLog()
 
@@ -117,38 +42,6 @@ function opsTime(at: string): string {
     : ''
 }
 
-// ---------- 实时趋势(行内 sparkline;hist 为 WS 读数流客户端缓冲,每帧推进) ----------
-const TREND_W = 120
-const TREND_H = 26
-
-function trendPath(hist: number[]): string {
-  const vals = hist.filter(Number.isFinite)
-  if (vals.length < 2) return ''
-  const min = Math.min(...vals)
-  const max = Math.max(...vals)
-  const span = max - min || 1
-  return vals.map((v, i) => `${((i / (vals.length - 1)) * TREND_W).toFixed(1)},${(TREND_H - ((v - min) / span) * (TREND_H - 2) - 1).toFixed(1)}`).join(' ')
-}
-
-/** 上下限参考线在趋势图内的 y 坐标(量程不可知或无数据时返回 null 不画) */
-function limitY(hist: number[], limit: number | undefined | null): number | null {
-  if (limit == null || !Number.isFinite(limit)) return null
-  const vals = hist.filter(Number.isFinite)
-  if (vals.length < 2) return null
-  const min = Math.min(...vals, limit)
-  const max = Math.max(...vals, limit)
-  const span = max - min || 1
-  return Number((TREND_H - ((limit - min) / span) * (TREND_H - 2) - 1).toFixed(1))
-}
-
-/** 行内趋势的有效限值:活动配方窗口优先,节点预警带兜底,皆无 → 不画限值线 */
-function limitOf(n: DaqNodeView): { min: number | null | undefined, max: number | null | undefined, source: 'recipe' | 'warn' } {
-  const w = recipeWinOf(n)
-  if (w && (w.min != null || w.max != null)) return { min: w.min, max: w.max, source: 'recipe' }
-  if (n.warnLow != null || n.warnHigh != null) return { min: n.warnLow, max: n.warnHigh, source: 'warn' }
-  return { min: null, max: null, source: 'warn' }
-}
-
 /** 未确认报警确认(失败 toast 后端可读原因;成功后 fetchAlarms 已由 store 内部刷新) */
 async function ackOne(id: string): Promise<void> {
   try {
@@ -337,7 +230,7 @@ const filteredLine = computed(() => dcw.lines.find(l => l.id === filters.lineId)
 const filteredLineState = computed(() =>
   filteredLine.value ? dcw.lineStateOf(filteredLine.value.id) : null)
 
-// ---------- 行级展示状态(真实场景语义):人为停用/未分配/产线未运行 与 故障离线 分离 ----------
+// ---------- 行级展示状态(真实场景语义;筛选用,pill 呈现在 DaqNodeRow 行组件) ----------
 // 状态机:disabled(人为停用) → unassigned(未挂产线,永不采集) → idle(产线未开跑,采集门控)
 // → offline(网关暂停,或产线运行中却采不到新数据) → ok/warn/alarm(新鲜数据按量程/预警带/配方窗口派生)
 type RowState = DaqNodeState | 'idle' | 'disabled' | 'unassigned'
@@ -357,42 +250,7 @@ function rowStateOf(n: DaqNodeView): RowState {
   return n.state
 }
 
-/** 数据是否在线(实时值列据此区分「实时值」与「最后值」) */
-function isLive(n: DaqNodeView): boolean {
-  const s = rowStateOf(n)
-  return s === 'ok' || s === 'warn' || s === 'alarm'
-}
-
-const rowLabel: Record<RowState, string> = {
-  ok: tt('daq.k41k5c062'),
-  warn: tt('daq.k49z8v063'),
-  alarm: tt('daq.k3xmid064'),
-  offline: tt('daq.k44c2n065'),
-  idle: tt('daq.k3ozyqz117'),
-  disabled: tt('daq.k1disabl130'),
-  unassigned: tt('daq.k3ootr6053'),
-}
-
-/** 状态 pill(含诚实的原因提示;配方越限标签仅在数据新鲜时展示) */
-function statePillOf(n: DaqNodeView): { key: RowState, label: string, tip: string } {
-  const s = rowStateOf(n)
-  if (s === 'offline') {
-    // 采样失败优先透出分类错误(连接/超时/PLC 异常 + 处理提示);无错误才给通用提示
-    if (n.lastError) return { key: s, label: rowLabel.offline, tip: n.lastError }
-    const tip = !daq.controller.running
-      ? tt('daq.k1gateoff140')
-      : tt('daq.k1staled129', { p0: Math.round(Math.max((n.intervalMs ?? daq.controller.defaultIntervalMs) * 4, 12_000) / 1000) })
-    return { key: s, label: rowLabel.offline, tip }
-  }
-  if (s === 'idle') return { key: s, label: rowLabel.idle, tip: tt('daq.k1idlehin139') }
-  if ((s === 'ok' || s === 'warn' || s === 'alarm') && recipeAlarm(n)) {
-    const w = recipeWinOf(n)
-    return { key: 'alarm', label: tt('daq.k1l3pt51104'), tip: tt('daq.k1hrrqa1122', { p0: w?.min ?? '-∞', p1: w?.max ?? '+∞', p2: '' }) }
-  }
-  return { key: s, label: rowLabel[s], tip: '' }
-}
-
-const filteredNodes = computed<DaqNodeView[]>(() => daq.nodes.filter((n) => {
+const filteredNodes = computed<DaqNodeLive[]>(() => daq.nodes.filter((n) => {
   if (filters.lineId && (filters.lineId === 'none' ? !!n.lineId : (n.lineId ?? '') !== filters.lineId)) return false
   const nodeDevIds = n.deviceIds ?? (n.deviceBindingId ? [n.deviceBindingId] : [])
   if (filters.deviceId && (filters.deviceId === 'none' ? nodeDevIds.length > 0 : !nodeDevIds.includes(filters.deviceId))) return false
@@ -405,48 +263,13 @@ const filteredNodes = computed<DaqNodeView[]>(() => daq.nodes.filter((n) => {
   return true
 }))
 
-/** 行渲染上下文预计算:状态 pill/配方越限/在离线/模板名 每行只算一次,
- *  模板里 11 次函数调用/行(102 行 = 1100+ 次/渲染,含多次 .find)收敛为 1 次查表 */
-const rowCtx = computed(() => {
-  const m = new Map<string, { pill: { key: RowState, label: string, tip: string }, alarm: boolean, live: boolean, tpl: string }>()
-  for (const n of filteredNodes.value) {
-    m.set(n.id, {
-      pill: statePillOf(n),
-      alarm: recipeAlarm(n),
-      live: isLive(n),
-      tpl: daqTemplateRefCh(n.templateRef),
-    })
-  }
-  return m
-})
-const EMPTY_CTX = { pill: { key: 'offline' as RowState, label: '', tip: '' }, alarm: false, live: false, tpl: '-' }
-/** 行渲染视图:节点 + 预计算上下文成对交付,模板零函数调用 */
-const filteredRows = computed(() =>
-  filteredNodes.value.map(n => ({ n, c: rowCtx.value.get(n.id) ?? EMPTY_CTX })))
-
-// 设备名映射(device-twins 注册表;绑定列展示用)
+// 设备名映射(device-twins 注册表;绑定筛选下拉展示用)
 const deviceTwins = useDeviceTwins()
 const nodeDevices = new Map<string, string>()
 watch(() => deviceTwins.twins, (list) => {
   for (const t of list) nodeDevices.set(t.id, t.name)
 }, { immediate: true, deep: true })
 
-/** 绑定设备下拉选项:全部真实设备孪生(剔除 daq/dcw 伪孪生) */
-const bindableDeviceTwins = computed(() =>
-  deviceTwins.twins.filter(t => t.kind !== 'daq' && !(t.modelRef ?? '').startsWith('daq-') && !(t.modelRef ?? '').startsWith('dcw-')))
-
-const intervalOf = (intervalMs: number | null): string => {
-  if (intervalMs == null) return tt('daq.k9vnp9h124', { p0: daq.controller.defaultIntervalMs })
-  return `${intervalMs}ms`
-}
-
-/** WS 下发节拍展示(null=跟随全局;0=每帧;>0 独立间隔) */
-const publishOf = (v: number | null): string => {
-  if (v == null) return tt('daq.k9vnp9h124', { p0: daq.controller.defaultPublishIntervalMs })
-  if (v === 0) return tt('daq.k41mvv078')
-  return `${v}ms`
-}
-
 // ---------- 添加节点向导(mock / 真实场景 + 动态参数表单 + 测试连接) ----------
 const addOpen = ref(false)
 const addScenario = ref<'mock' | 'real'>('mock')
@@ -640,10 +463,6 @@ async function askDelTpl(t: DaqTemplateDef): Promise<void> {
   }
 }
 
-/** 驱动是否为预留协议(meta status=planned) */
-const driverPlanned = (kind: string): boolean =>
-  daq.meta.drivers.find(d => d.kind === kind)?.status === 'planned'
-
 const reconnecting = ref(false)
 async function doReconnect(): Promise<void> {
   reconnecting.value = true
@@ -1677,177 +1496,11 @@ async function doReconnect(): Promise<void> {
             </tr>
           </thead>
           <tbody>
-            <tr
-              v-for="{ n, c } in filteredRows"
+            <WorkshopDaqNodeRow
+              v-for="n in filteredNodes"
               :key="n.id"
-              :class="{ 'row-recipe-alarm': c.alarm }"
-            >
-              <td>
-                <span class="mono dim">{{ n.id.slice(0, 8) }}</span>
-                <b>{{ n.name }}</b>
-                <small class="mono ch">{{ c.tpl }}</small>
-              </td>
-              <td>
-                <span
-                  class="st-pill"
-                  :class="[c.pill.key]"
-                  :title="c.pill.tip"
-                >{{ c.pill.label }}</span>
-              </td>
-              <td
-                class="mono val"
-                :class="{ 'stale': !c.live, 'val-alarm': n.state === 'alarm' || c.alarm }"
-                :title="c.live ? undefined : c.pill.tip"
-              >
-                {{ n.value != null ? n.value.toFixed(n.decimals) : '--' }}
-                <small>{{ n.unit }}</small>
-              </td>
-              <td class="trend-cell">
-                <svg
-                  class="trend"
-                  viewBox="0 0 120 26"
-                  preserveAspectRatio="none"
-                  :title="$t('daq.k1trnd002')"
-                >
-                  <line
-                    v-if="limitY(n.hist, limitOf(n).min) != null"
-                    class="lim"
-                    x1="0"
-                    :y1="limitY(n.hist, limitOf(n).min)"
-                    x2="120"
-                    :y2="limitY(n.hist, limitOf(n).min)"
-                  />
-                  <line
-                    v-if="limitY(n.hist, limitOf(n).max) != null"
-                    class="lim max"
-                    x1="0"
-                    :y1="limitY(n.hist, limitOf(n).max)"
-                    x2="120"
-                    :y2="limitY(n.hist, limitOf(n).max)"
-                  />
-                  <polyline
-                    class="trace"
-                    :class="{ alarm: n.state === 'alarm' || c.alarm }"
-                    :points="trendPath(n.hist)"
-                  />
-                </svg>
-              </td>
-              <td class="mono">
-                {{ intervalOf(n.intervalMs) }}
-              </td>
-              <td class="mono">
-                {{ publishOf(n.publishIntervalMs) }}
-              </td>
-              <td>
-                <span
-                  class="drv-tag"
-                  :class="{ planned: driverPlanned(n.driver) }"
-                  :title="driverPlanned(n.driver) ? $t('daq.k1plndrv138') : ''"
-                >{{ n.driver }}</span>
-              </td>
-              <td>
-                <select
-                  class="line-sel"
-                  :value="n.lineId"
-                  :title="$t('daq.k3q23v3010')"
-                  @change="setNodeLine(n.id, $event)"
-                >
-                  <option value="">
-                    {{ $t('daq.k3ootr6053') }}
-                  </option>
-                  <option
-                    v-for="l in dcw.lines"
-                    :key="l.id"
-                    :value="l.id"
-                  >
-                    {{ l.name }}
-                  </option>
-                </select>
-              </td>
-              <!-- 产线运行:呼吸绿点=运行中 / 空心点=未运行(与产线状态带同一套点语义) -->
-              <td>
-                <span
-                  v-if="n.lineId"
-                  class="run-pill"
-                  :class="{ on: dcw.lineStateOf(n.lineId).active }"
-                  :title="$t('daq.k1runtipc131')"
-                >
-                  <span class="rp-dot" />
-                  {{ dcw.lineStateOf(n.lineId).active ? $t('daq.k3vp67i096') : $t('daq.k3ozyqz117') }}
-                </span>
-                <span
-                  v-else
-                  class="run-pill na"
-                >{{ $t('daq.k3ootr6053') }}</span>
-              </td>
-              <!-- 产品 / Recipe:本线活动批次(运行中才携带;停线/未分配 → --) -->
-              <td class="prod-cell">
-                <template v-if="n.lineId && dcw.lineStateOf(n.lineId).active">
-                  <b :title="$t('daq.k1prdrtip132')">{{ dcw.lineStateOf(n.lineId).productName || '--' }}</b>
-                  <small
-                    class="mono"
-                    :title="$t('daq.k1prdrtip132')"
-                  >{{ dcw.lineStateOf(n.lineId).recipeName || '--' }}</small>
-                </template>
-                <span
-                  v-else
-                  class="dim"
-                >--</span>
-              </td>
-              <td>
-                <div class="dev-binds">
-                  <span
-                    v-for="did in nodeDeviceIds(n)"
-                    :key="did"
-                    class="dev-bind-chip"
-                    :title="$t('daq.k2bindtip137')"
-                  >
-                    {{ deviceNameById(did) }}
-                    <span
-                      class="dev-unbind"
-                      title="unbind"
-                      @click="removeNodeDevice(n.id, did)"
-                    >✕</span>
-                  </span>
-                  <select
-                    class="line-sel dev-add"
-                    :value="''"
-                    :title="$t('daq.k2bindtip137')"
-                    @change="addNodeDevice(n.id, $event)"
-                  >
-                    <option value="">
-                      {{ $t('daq.k3own4q056') }}
-                    </option>
-                    <option
-                      v-for="d in bindableDeviceTwins"
-                      :key="d.id"
-                      :value="d.id"
-                      :disabled="(n.deviceIds ?? []).includes(d.id)"
-                    >
-                      {{ nodeDevices.get(d.id) ?? d.name }}
-                    </option>
-                  </select>
-                </div>
-              </td>
-              <td class="right">
-                <button
-                  class="node-toggle"
-                  :class="{ off: !n.enabled }"
-                  :title="n.enabled ? $t('daq.k1nodestop146') : $t('daq.k1nodestart147')"
-                  @click="toggleNodeEnabled(n)"
-                >
-                  <span :class="n.enabled ? 'i-tabler-player-pause' : 'i-tabler-player-play'" />
-                  {{ n.enabled ? $t('daq.k1nodestop146') : $t('daq.k1nodestart147') }}
-                </button>
-                <NuxtLink
-                  class="console-link"
-                  :to="`/daq/${n.id}`"
-                >
-                  <span class="i-tabler-dashboard" />
-                  {{ $t('daq.k3o3jg2074') }}
-                </NuxtLink>
-              </td>
-            </tr>
+              :n="n"
+            />
             <tr v-if="daq.loaded && daq.nodes.length === 0">
               <td colspan="11">
                 <div

package/app/pages/monitor.vue

@@ -293,73 +293,50 @@ const processColumns = computed(() => [
     </a-card>
 
     <template v-else>
-      <!-- 概要统计 -->
-      <a-row
-        :gutter="[16, 16]"
-        class="summary"
-      >
-        <a-col
-          :xs="12"
-          :md="6"
-        >
-          <a-card class="aw-panel stat">
-            <p class="stat-label">
-              {{ t('monitor.channels') }}
-            </p>
-            <p class="stat-value aw-mono">
-              {{ snapshot?.counts.channels ?? '–' }}
-            </p>
-          </a-card>
-        </a-col>
-        <a-col
-          :xs="12"
-          :md="6"
-        >
-          <a-card class="aw-panel stat">
-            <p class="stat-label">
-              {{ t('monitor.agents') }}
-            </p>
-            <p class="stat-value aw-mono">
-              {{ snapshot?.counts.agents ?? '–' }}
-            </p>
-          </a-card>
-        </a-col>
-        <a-col
-          :xs="12"
-          :md="6"
-        >
-          <a-card class="aw-panel stat">
-            <p class="stat-label">
-              {{ t('monitor.aliveProcesses') }}
-            </p>
-            <p class="stat-value aw-mono">
-              {{ snapshot?.counts.aliveProcesses ?? '–' }}
-              <span
-                v-if="(snapshot?.counts.orphanProcesses ?? 0) > 0"
-                class="orphan-badge"
-              >
-                +{{ snapshot?.counts.orphanProcesses }} {{ t('monitor.orphan') }}
-              </span>
-            </p>
-          </a-card>
-        </a-col>
-        <a-col
-          :xs="12"
-          :md="6"
-        >
-          <a-card class="aw-panel stat">
-            <p class="stat-label">
-              {{ t('monitor.server') }}
-            </p>
-            <p class="stat-value aw-mono small">
-              PID {{ snapshot?.serverPid ?? '–' }} · {{ snapshot ? uptimeText(snapshot.uptimeMs) : '' }}
-            </p>
-            <p class="stat-updated">
-              {{ lastUpdated }} · {{ t('monitor.updated') }} {{ snapshot?.generatedAt ?? '' }}
-            </p>
-          </a-card>
-        </a-col>
-      </a-row>
+      <!-- 概要统计(CSS grid:antd Grid 样式在部分构建下缺失,col 会退化 100% 宽) -->
+      <div class="stat-grid">
+        <a-card class="aw-panel stat">
+          <p class="stat-label">
+            {{ t('monitor.channels') }}
+          </p>
+          <p class="stat-value aw-mono">
+            {{ snapshot?.counts.channels ?? '–' }}
+          </p>
+        </a-card>
+        <a-card class="aw-panel stat">
+          <p class="stat-label">
+            {{ t('monitor.agents') }}
+          </p>
+          <p class="stat-value aw-mono">
+            {{ snapshot?.counts.agents ?? '–' }}
+          </p>
+        </a-card>
+        <a-card class="aw-panel stat">
+          <p class="stat-label">
+            {{ t('monitor.aliveProcesses') }}
+          </p>
+          <p class="stat-value aw-mono">
+            {{ snapshot?.counts.aliveProcesses ?? '–' }}
+            <span
+              v-if="(snapshot?.counts.orphanProcesses ?? 0) > 0"
+              class="orphan-badge"
+            >
+              +{{ snapshot?.counts.orphanProcesses }} {{ t('monitor.orphan') }}
+            </span>
+          </p>
+        </a-card>
+        <a-card class="aw-panel stat">
+          <p class="stat-label">
+            {{ t('monitor.server') }}
+          </p>
+          <p class="stat-value aw-mono small">
+            PID {{ snapshot?.serverPid ?? '–' }} · {{ snapshot ? uptimeText(snapshot.uptimeMs) : '' }}
+          </p>
+          <p class="stat-updated">
+            {{ lastUpdated }} · {{ t('monitor.updated') }} {{ snapshot?.generatedAt ?? '' }}
+          </p>
+        </a-card>
+      </div>
 
       <!-- ChannelRuntime 表 -->
       <a-card
@@ -603,10 +580,21 @@ const processColumns = computed(() => [
   align-items: center;
 }
 
-.summary {
+.stat-grid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 14px;
   margin-bottom: 16px;
 }
 
+@media (max-width: 1100px) {
+  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+}
+
+@media (max-width: 640px) {
+  .stat-grid { grid-template-columns: 1fr; }
+}
+
 .stat {
   height: 100%;
 }