修复&优化听力补偿模块功能

client/src/components/HearingCompensationChart.tsx

@@ -1,8 +1,8 @@
 import { useEffect, useMemo, useRef } from "react";
 import * as echarts from "echarts";
 import {
-  HEARING_FREQ_LABELS,
   buildHearingSplineSeries,
+  resolveHearingFreqLabels,
 } from "@/lib/hearingCurve";
 
 const LEFT_COLOR = "rgb(0, 255, 246)";
@@ -29,6 +29,11 @@ export default function HearingCompensationChart({
   const leftSeries = useMemo(() => buildHearingSplineSeries(left), [left]);
   const rightSeries = useMemo(() => buildHearingSplineSeries(right), [right]);
 
+  // X axis adapts to the control-point count: 7-band (legacy) or 10-band (adds 3k/5k/6k).
+  const pointCount = Math.max(left.length, right.length);
+  const freqLabels = useMemo(() => resolveHearingFreqLabels(pointCount), [pointCount]);
+  const xMax = Math.max(0, pointCount - 1);
+
   useEffect(() => {
     const el = containerRef.current;
     if (!el) return;
@@ -76,13 +81,13 @@ export default function HearingCompensationChart({
       xAxis: {
         type: "value",
         min: 0,
-        max: HEARING_FREQ_LABELS.length - 1,
+        max: xMax,
         interval: 1,
         axisLabel: {
           formatter: (value: number) => {
             const idx = Math.round(value);
             if (Math.abs(value - idx) > 1e-6) return "";
-            return HEARING_FREQ_LABELS[idx] ?? "";
+            return freqLabels[idx] ?? "";
           },
           fontSize: 14,
           color: "#999",
@@ -98,7 +103,9 @@ export default function HearingCompensationChart({
       yAxis: {
         type: "value",
         min: -80,
-        max: 0,
+        // Top raised to +20 dB: levels above 70 map to positive dB and were
+        // clipped at the old max of 0, leaving gaps at the top of the curve.
+        max: 20,
         interval: 10,
         name: "dB",
         nameLocation: "end",
@@ -157,7 +164,7 @@ export default function HearingCompensationChart({
       ro.disconnect();
       window.removeEventListener("resize", onResize);
     };
-  }, [leftSeries, rightSeries, leftLabel, rightLabel]);
+  }, [leftSeries, rightSeries, leftLabel, rightLabel, freqLabels, xMax]);
 
   useEffect(() => {
     return () => {
@@ -171,7 +178,7 @@ export default function HearingCompensationChart({
       ref={containerRef}
       className={
         className
-        ?? "w-full h-[min(42vw,200px)] min-h-[140px] md:h-[260px] lg:h-[300px] rounded-lg bg-black/30"
+        ?? "w-full h-[min(52vw,240px)] min-h-[180px] md:h-[320px] lg:h-[380px] rounded-lg bg-black/30"
       }
       aria-hidden
     />