feat(test7): 添加队列积压仪表盘组件

- 新增 QueueGauge 组件，用于显示队列积压情况
-组件使用 ECharts 实现仪表盘效果
- 可根据 backlog 和 throughput 数据动态显示积压率

app/(other)/test7/components/queue-gauge.tsx

@@ -0,0 +1,37 @@
+"use client"
+import ReactECharts from "echarts-for-react"
+import type {FC} from "react"
+
+const QueueGauge: FC<{ backlog: number; throughput: number }> = ({ backlog = 0, throughput = 120 }) => {
+  const lvl = Math.min(100, Math.round((backlog / 50) * 100))
+  const option = {
+    tooltip: { formatter: "{a}<br/>{b}: {c}%" },
+    series: [
+      {
+        name: "队列积压",
+        type: "gauge",
+        radius: "90%",
+        startAngle: 210,
+        endAngle: -30,
+        min: 0,
+        max: 100,
+        progress: { show: true, width: 16 },
+        axisLine: { lineStyle: { width: 16 } },
+        pointer: { show: true, length: "60%" },
+        detail: { valueAnimation: true, formatter: "{value}%" },
+        data: [{ value: lvl, name: "积压率" }],
+      },
+    ],
+  }
+  return (
+    <div>
+      <ReactECharts option={option as any} style={{ height: 220, width: "100%" }} notMerge />
+      <div style={{ display: "flex", justifyContent: "space-between" }}>
+        <div>Backlog: {backlog} 条</div>
+        <div>吞吐: {throughput}/s</div>
+      </div>
+    </div>
+  )
+}
+
+export default QueueGauge