style(display): refine overview line layout [CI]

web/display/src/LineStrips.tsx

@@ -62,9 +62,12 @@ export function LineStrips({ lineId, range, m }: Props) {
   const retransValue = m['tcp.retrans']
   const retransTone = levelOf(retransValue)
   const retransText = retransValue === null || retransValue === undefined ? '重传 —' : `${fmtPct(retransValue)} 重传`
+  const hasMeasurements = Object.values(s?.values ?? {}).some((values) => values.some((value) => value !== null && value !== undefined))
   return (
     <div className="strips" ref={box} onMouseMove={onMove} onMouseLeave={() => setHover(null)}>
-      <div className="line-mini-stack">
+      {s && !hasMeasurements ? (
+        <div className="line-no-data">近 {info.hours} 小时暂无测量数据</div>
+      ) : <div className="line-mini-stack">
         <div className="line-mini-quic-head" title={`QUIC RTT p50 ${fmtMs(m['rtt.p50'])} · p95 ${fmtMs(m['rtt.p95'])} · p99 ${fmtMs(m['rtt.p99'])}`}>
           <span>QUIC</span><strong className="num">{fmtMs(m['rtt.p50'])}</strong><small>悬停看 p95 / p99</small>
         </div>
@@ -101,7 +104,7 @@ export function LineStrips({ lineId, range, m }: Props) {
             ))}
           </div>
         </div>
-      </div>
+      </div>}
       <div className={`pop num${hover !== null && at !== null ? ' open' : ''}`} role="tooltip" aria-hidden={hover === null}>
         {at !== null ? (
           <>