Filter semi ladder to 2 OTM/ITM or 1 ATM by moneyness selection.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-08 14:18:03 +08:00
parent 58c12aa160
commit ebd88718a7
1 changed files with 90 additions and 43 deletions
@@ -915,49 +915,96 @@ export default function PlanPage() {
                    </tr>
                  </thead>
                  <tbody>
-                    {(ladder.rows || []).map((r) => {
-                      const tagZh =
-                        r.tag === "atm"
-                          ? "平值"
-                          : r.tag === "itm"
-                            ? "实值"
-                            : "虚值";
-                      const hi =
-                        (semiMny === "otm" &&
-                          r.tag === "otm" &&
-                          Math.abs(r.offset) <= Number(semiOtmOff) + 1e-9) ||
-                        (semiMny === "atm" && r.tag === "atm") ||
-                        (semiMny === "itm" &&
-                          (r.tag === "itm" || r.tag === "atm"));
-                      return (
-                        <tr
-                          key={r.strike}
-                          className={
-                            r.tag === "atm"
-                              ? "plan-t-atm"
-                              : hi
-                                ? "plan-t-pick"
-                                : undefined
-                          }
-                        >
-                          <td className="mono plan-t-k">
-                            {Math.round(r.strike)}
-                            <span className="meta">
-                              {" "}
-                              ({r.offset >= 0 ? "+" : ""}
-                              {fmt(r.offset, 0)})
-                            </span>
-                          </td>
-                          <td>{tagZh}</td>
-                          <td className="mono">
-                            {fmtTopEx("option", r.ask, r.ask_sz)}
-                          </td>
-                          <td className="mono">
-                            {r.lev != null ? `${r.lev.toFixed(0)}x` : "—"}
-                          </td>
-                        </tr>
-                      );
-                    })}
+                    {(() => {
+                      const all = ladder.rows || [];
+                      let shown = all;
+                      if (semiMny === "atm") {
+                        shown = all.filter((r) => r.tag === "atm").slice(0, 1);
+                      } else if (semiMny === "otm") {
+                        shown = all
+                          .filter(
+                            (r) =>
+                              r.tag === "otm" &&
+                              Math.abs(r.offset) <=
+                                Number(semiOtmOff) + 1e-9,
+                          )
+                          .sort(
+                            (a, b) =>
+                              Math.abs(a.offset) - Math.abs(b.offset),
+                          )
+                          .slice(0, 2);
+                        // Call：虚值高行权在上；Put：虚值低行权在上
+                        shown.sort((a, b) =>
+                          semiView === "short"
+                            ? a.strike - b.strike
+                            : b.strike - a.strike,
+                        );
+                      } else {
+                        // 实值：最接近现价的 2 档
+                        shown = all
+                          .filter((r) => r.tag === "itm")
+                          .sort(
+                            (a, b) =>
+                              Math.abs(a.offset) - Math.abs(b.offset),
+                          )
+                          .slice(0, 2);
+                        shown.sort((a, b) =>
+                          semiView === "short"
+                            ? a.strike - b.strike
+                            : b.strike - a.strike,
+                        );
+                      }
+                      if (shown.length === 0) {
+                        return (
+                          <tr>
+                            <td colSpan={4} className="meta">
+                              当前无符合「
+                              {semiMny === "itm"
+                                ? "实值"
+                                : semiMny === "atm"
+                                  ? "平值"
+                                  : "虚值"}
+                              」的报价档
+                              {semiMny === "otm"
+                                ? `（偏离≤${fmt(semiOtmOff, 0)}）`
+                                : ""}
+                            </td>
+                          </tr>
+                        );
+                      }
+                      return shown.map((r) => {
+                        const tagZh =
+                          r.tag === "atm"
+                            ? "平值"
+                            : r.tag === "itm"
+                              ? "实值"
+                              : "虚值";
+                        return (
+                          <tr
+                            key={r.strike}
+                            className={
+                              r.tag === "atm" ? "plan-t-atm" : "plan-t-pick"
+                            }
+                          >
+                            <td className="mono plan-t-k">
+                              {Math.round(r.strike)}
+                              <span className="meta">
+                                {" "}
+                                ({r.offset >= 0 ? "+" : ""}
+                                {fmt(r.offset, 0)})
+                              </span>
+                            </td>
+                            <td>{tagZh}</td>
+                            <td className="mono">
+                              {fmtTopEx("option", r.ask, r.ask_sz)}
+                            </td>
+                            <td className="mono">
+                              {r.lev != null ? `${r.lev.toFixed(0)}x` : "—"}
+                            </td>
+                          </tr>
+                        );
+                      });
+                    })()}
                  </tbody>
                </table>
              </div>