Refactor EQPage component to enhance PEQ preset management by introducing a local cache for presets, improving frequency normalization and display functions, and updating related state handling methods. Add real-time slider preview for better user experience.

client/src/pages/eq/eqFormatters.ts

@@ -18,10 +18,40 @@ export function eqInterp(template: string | undefined, vars: Record<string, stri
   return s;
 }
 
-export function formatBandFreqDisplay(freq: number) {
-  return freq >= 1000
-    ? `${(freq / 1000).toFixed(2).replace(/\.?0+$/, "")} kHz`
-    : `${freq} Hz`;
+/** 将设备/表单中的频率统一为 Hz 数值；无法解析时返回 null */
+export function normalizeBandFreqHz(freq: unknown): number | null {
+  if (typeof freq === "number" && Number.isFinite(freq)) return freq;
+  if (typeof freq === "string") {
+    const trimmed = freq.trim().replace(/,/g, "");
+    if (!trimmed) return null;
+    let s = trimmed.toLowerCase().replace(/hz$/, "");
+    const kHz = /k(hz)?$/.test(s);
+    if (kHz) s = s.replace(/k(hz)?$/, "");
+    const num = Number.parseFloat(s);
+    return Number.isFinite(num) ? (kHz ? num * 1000 : num) : null;
+  }
+  return null;
+}
+
+export function formatBandGainDisplay(gain: unknown) {
+  const db = typeof gain === "number" && Number.isFinite(gain) ? gain : Number(gain);
+  if (!Number.isFinite(db)) return "0.0 dB";
+  const text = db.toFixed(1);
+  return `${db >= 0 ? `+${text}` : text} dB`;
+}
+
+export function formatBandQDisplay(q: unknown) {
+  const n = typeof q === "number" && Number.isFinite(q) ? q : Number(q);
+  return Number.isFinite(n) ? n.toFixed(2) : "—";
+}
+
+export function formatBandFreqDisplay(freq: unknown) {
+  const hz = normalizeBandFreqHz(freq);
+  if (hz === null) return "—";
+  if (hz >= 1000) {
+    return `${(hz / 1000).toFixed(2).replace(/\.?0+$/, "")} kHz`;
+  }
+  return `${Math.round(hz)} Hz`;
 }
 
 export function formatBandParamForInput(
@@ -106,6 +136,14 @@ export function normalizeFilterType(type: string | number | undefined): string {
   return getFilterShortName(type);
 }
 
-export function freqLabel(f: number) {
-  return f >= 1000 ? `${(f / 1000).toFixed(1)}K` : `${f}`;
+/** 10 段滤波器按钮上的紧凑频率标签（始终为数字，避免被翻译插件改成英文单词） */
+export function freqLabel(freq: unknown) {
+  const hz = normalizeBandFreqHz(freq);
+  if (hz === null) return "—";
+  if (hz >= 1000) {
+    const k = hz / 1000;
+    const text = k >= 10 ? String(Math.round(k)) : k.toFixed(1).replace(/\.0$/, "");
+    return `${text}K`;
+  }
+  return String(Math.round(hz));
 }