poi-plugin-kai-planner 1.0.0

package/src/app/tabs/wishlist/WishlistTab.js

@@ -0,0 +1,704 @@
+/* src/app/tabs/wishlist/WishlistTab.js */
+
+const React = require("react");
+
+const { loadStaticData } = require("../../../data/loaders/loadStaticData");
+const { buildArrangementIndex } = require("../../../data/indexes/buildArrangementIndex");
+const { getReduxStateFromEnvWindow } = require("../../../services/player/getReduxStateFromEnvWindow");
+const { getPlayerEquipByApiId } = require("../../../services/player/getPlayerData");
+const {
+  buildEquipOwnerShipIndex,
+  getEquipOwnerShipByApiId,
+  buildPlanOwnerShipNameMap,
+} = require("../../../services/player/getEquipOwnerShip");
+const { getPlayerItemCountByUseitemId } = require("../../../services/player/getPlayerItemCountByUseitemId");
+const { countPlayerEquipByMasterId } = require("../../../services/player/countPlayerEquipByMasterId");
+const { resolveMaterialKeyToUseitemId } = require("../../../services/player/resolveMaterialKeyToUseitemId");
+const { buildConsumeIndexes } = require("../../../services/static/indexes/buildConsumeIndexes");
+const { buildUpgradeIndexes } = require("../../../services/static/indexes/buildUpgradeIndexes");
+const { buildPathIndexes } = require("../../../services/static/indexes/buildPathIndexes");
+const { calcRemainingPlan } = require("../../../services/planner/calcRemainingPlan");
+const { detectCurrentPosition } = require("../../../services/planner/detectCurrentPosition");
+const { toInt } = require("../../../services/utils/toInt");
+const { formatTokyoDateTimeWithWeekday, getTokyoWeekdayKey } = require("../../../services/utils/tokyoTime");
+const {
+  loadPlans,
+  createPlan,
+  deletePlan,
+  replacePlanStartApiId,
+  updatePlanPriority,
+  updatePlanTargetLevel,
+  upsertLastResult,
+} = require("../../../storage/userPlans/planStore");
+const { CreatePlanForm } = require("./CreatePlanForm");
+const { WishlistTable } = require("./components/WishlistTable");
+const { WishlistExpandedDetail } = require("./components/WishlistExpandedDetail");
+const { buildWishlistViewModel } = require("../../../services/wishlist/buildWishlistViewModel");
+const {
+  buildStartOptionsAction,
+  refreshPlansAction,
+  refreshPlanByIdAction,
+  submitCreateAction,
+  updatePlanPriorityAction,
+  updatePlanTargetLevelAction,
+} = require("../../../services/wishlist/wishlistActions");
+
+const PRIORITIES = ["P0", "P1", "P2", "P3", "P4", "P5"];
+const START_OPTIONS_DEFAULT_LIMIT = 120;
+
+function formatTokyoText() {
+  return `当前时间（GMT+9）：${formatTokyoDateTimeWithWeekday()}`;
+}
+
+function getEquipName(masterEquipsById, id) {
+  const row = masterEquipsById && masterEquipsById[String(id)];
+  if (row && row.api_name) return String(row.api_name);
+  return `UnknownEquip(${id})`;
+}
+
+function getEquipSortno(masterEquipsById, id) {
+  const row = masterEquipsById && masterEquipsById[String(id)];
+  return row && row.api_sortno != null ? toInt(row.api_sortno, 0) : 0;
+}
+
+function getPathDistance(pathByPair, fromEquipId, toEquipId) {
+  const from = toInt(fromEquipId, 0);
+  const to = toInt(toEquipId, 0);
+  if (!from || !to) return Number.POSITIVE_INFINITY;
+  if (from === to) return 0;
+  const k = `${from}|${to}`;
+  const path = pathByPair && Array.isArray(pathByPair[k]) ? pathByPair[k] : null;
+  if (!path || path.length < 2) return Number.POSITIVE_INFINITY;
+  return Math.max(0, path.length - 1);
+}
+
+function getPlanStartSnapshotText(plan) {
+  const snap = plan && plan.startSnapshot ? plan.startSnapshot : null;
+  if (!snap) return "-";
+  const name = snap.name ? String(snap.name) : `UnknownEquip(${String(snap.equipId || "")})`;
+  const level = toInt(snap.level, 0);
+  return `${name}(+${level})`;
+}
+
+function stockStatusMark(need, owned) {
+  const ok = toInt(owned, 0) >= toInt(need, 0);
+  return ok
+    ? React.createElement("span", { style: { color: "#22c55e", marginLeft: 6 } }, "✔")
+    : React.createElement("span", { style: { color: "#ef4444", marginLeft: 6 } }, "⚠");
+}
+
+class WishlistTab extends React.Component {
+  constructor(props) {
+    super(props);
+
+    this.staticData = loadStaticData();
+    this.consumeIndexes = buildConsumeIndexes(this.staticData);
+    this.upgradeIndexes = buildUpgradeIndexes(this.staticData);
+    this.pathByPair = buildPathIndexes(this.staticData).pathByPair;
+    this.arrangementIndex = buildArrangementIndex(this.staticData.improvementArrangement).index;
+    this._ownerShipIndexCache = { shipsRef: null, map: {} };
+    this._startOptionsCache = { targetEquipId: null, equipsRef: null, plansKey: "", ownerMapRef: null, options: [] };
+
+    this.state = {
+      nowText: formatTokyoText(),
+      plans: [],
+      planResults: {},
+      expandedById: {},
+      rebindInputById: {},
+      editById: {},
+      filterTargetName: "",
+      showCreateForm: false,
+      create: {
+        targetEquipId: "",
+        targetLevel: "0",
+        priority: "P0",
+        startApiId: "",
+        note: "",
+        targetQuery: "",
+        startQuery: "",
+      },
+      createError: null,
+      error: null,
+    };
+
+    this.refreshPlans = this.refreshPlans.bind(this);
+    this.refreshPlanById = this.refreshPlanById.bind(this);
+  }
+
+  componentDidMount() {
+    this._timer = setInterval(() => this.setState({ nowText: formatTokyoText() }), 1000);
+    this.refreshPlans();
+  }
+
+  componentWillUnmount() {
+    if (this._timer) clearInterval(this._timer);
+  }
+
+  getReduxState() {
+    return getReduxStateFromEnvWindow(this.props.envWindow);
+  }
+
+  runPlanForInput({ state, apiId, targetEquipId, targetLevel }) {
+    const playerEquip = getPlayerEquipByApiId(state, apiId);
+    if (!playerEquip) return { ok: false, error: `player equip api_id not found: ${apiId}` };
+
+    return calcRemainingPlan({
+      staticData: this.staticData,
+      state,
+      apiId,
+      targetEquipId,
+      targetLevel,
+      consumeIndexes: this.consumeIndexes,
+      upgradeIndexes: this.upgradeIndexes,
+      pathByPair: this.pathByPair,
+      masterEquipsById: state.const.$equips || {},
+      masterUseitemsById: state.const.$useitems || {},
+      playerEquip,
+      playerHelpers: {
+        countPlayerEquipByMasterId,
+        resolveMaterialKeyToUseitemId,
+        getPlayerItemCountByUseitemId,
+      },
+    });
+  }
+
+  runPlanForSnapshotInput({ state, apiId, startEquipId, startLevel, targetEquipId, targetLevel }) {
+    const equipId = toInt(startEquipId, 0);
+    if (!equipId) return { ok: false, error: `invalid start equip id: ${startEquipId}` };
+
+    const pseudoPlayerEquip = {
+      api_id: toInt(apiId, 0) || 0,
+      api_slotitem_id: equipId,
+      api_level: Math.max(0, toInt(startLevel, 0)),
+    };
+
+    return calcRemainingPlan({
+      staticData: this.staticData,
+      state,
+      apiId,
+      targetEquipId,
+      targetLevel,
+      consumeIndexes: this.consumeIndexes,
+      upgradeIndexes: this.upgradeIndexes,
+      pathByPair: this.pathByPair,
+      masterEquipsById: state.const.$equips || {},
+      masterUseitemsById: state.const.$useitems || {},
+      playerEquip: pseudoPlayerEquip,
+      playerHelpers: {
+        countPlayerEquipByMasterId,
+        resolveMaterialKeyToUseitemId,
+        getPlayerItemCountByUseitemId,
+      },
+    });
+  }
+
+  isTargetImprovable(targetEquipId) {
+    const id = toInt(targetEquipId, 0);
+    if (!id) return false;
+    const steps = this.consumeIndexes.stepById || {};
+    return !!(steps[`${id}_0`] || steps[`${id}_1`]);
+  }
+
+  getTargetCandidates(masterEquipsById) {
+    const improvable = new Set();
+    for (const k of Object.keys(this.consumeIndexes.stepById || {})) {
+      const equipId = String(k).split("_")[0];
+      if (equipId) improvable.add(String(toInt(equipId, 0)));
+    }
+
+    const pathTerminals = new Set();
+    for (const row of this.staticData.equipmentUpgradePath || []) {
+      if (!row || row.to_equipment_id == null || row.is_deleted === true) continue;
+      pathTerminals.add(String(toInt(row.to_equipment_id, 0)));
+    }
+
+    const all = new Set([...improvable, ...pathTerminals]);
+    return Array.from(all)
+      .map((idStr) => toInt(idStr, 0))
+      .filter((x) => x > 0 && masterEquipsById[String(x)])
+      .sort((a, b) => {
+        const sa = getEquipSortno(masterEquipsById, a);
+        const sb = getEquipSortno(masterEquipsById, b);
+        if (sa !== sb) return sa - sb;
+        return a - b;
+      });
+  }
+
+  getEquipOwnerShipIndex(state) {
+    const shipsRef = state && state.info ? state.info.ships : null;
+    if (this._ownerShipIndexCache.shipsRef === shipsRef) {
+      return this._ownerShipIndexCache.map || {};
+    }
+    const map = buildEquipOwnerShipIndex(state);
+    this._ownerShipIndexCache = { shipsRef, map };
+    return map;
+  }
+
+  buildStartOptions(state, plans, targetEquipId, equipOwnerShipIndex) {
+    const res = buildStartOptionsAction({
+      state,
+      plans,
+      targetEquipId,
+      equipOwnerShipIndex,
+      pathByPair: this.pathByPair,
+      getEquipSortno,
+      getEquipName,
+      getPathDistance,
+      cache: this._startOptionsCache,
+      getEquipOwnerShipByApiId,
+    });
+    this._startOptionsCache = res.cache || this._startOptionsCache;
+    return res.options || [];
+  }
+
+  refreshPlans() {
+    try {
+      const state = this.getReduxState();
+      const plans = loadPlans();
+      const equipOwnerShipIndex = this.getEquipOwnerShipIndex(state);
+      const actionRes = refreshPlansAction({
+        state,
+        plans,
+        detectCurrentPosition,
+        runPlanForInput: ({ state: s, apiId, targetEquipId, targetLevel }) =>
+          this.runPlanForInput({ state: s, apiId, targetEquipId, targetLevel }),
+        upsertLastResult,
+        arrangementIndex: this.arrangementIndex,
+        weekdayKey: getTokyoWeekdayKey(),
+        masterShipsRaw: state && state.const ? state.const.$ships || {} : {},
+        planOwnerShipNameByPlanId: buildPlanOwnerShipNameMap(plans, equipOwnerShipIndex),
+      });
+
+      this.setState({
+        plans: actionRes.plans || plans,
+        planResults: actionRes.planResults || {},
+        error: actionRes.error || null,
+      });
+    } catch (e) {
+      this.setState({ error: String(e && (e.stack || e)) });
+    }
+  }
+
+  startEditPlan(plan) {
+    if (!plan || !plan.id) return;
+    this.setState((prev) => ({
+      editById: {
+        ...(prev.editById || {}),
+        [plan.id]: {
+          isEditing: true,
+          saving: false,
+          error: null,
+          priority: String(plan.priority || "P0"),
+          targetLevel: String(plan.targetLevel == null ? "0" : plan.targetLevel),
+        },
+      },
+    }));
+  }
+
+  cancelEditPlan(planId) {
+    this.setState((prev) => {
+      const next = { ...(prev.editById || {}) };
+      delete next[planId];
+      return { editById: next };
+    });
+  }
+
+  patchEditPlan(planId, patch) {
+    this.setState((prev) => ({
+      editById: {
+        ...(prev.editById || {}),
+        [planId]: { ...((prev.editById || {})[planId] || {}), ...(patch || {}) },
+      },
+    }));
+  }
+
+  saveEditPlan(planId) {
+    const draft = (this.state.editById || {})[planId];
+    if (!draft || !draft.isEditing || draft.saving) return;
+
+    const plans = this.state.plans || [];
+    const plan = plans.find((p) => String(p.id) === String(planId));
+    if (!plan) return;
+
+    this.patchEditPlan(planId, { saving: true, error: null });
+    try {
+      const nextPriority = String(draft.priority || "P0");
+      const nextTargetLevel = String(draft.targetLevel == null ? "0" : draft.targetLevel);
+
+      if (nextPriority !== String(plan.priority || "P0")) {
+        const pRes = updatePlanPriorityAction({
+          planId,
+          priority: nextPriority,
+          priorities: PRIORITIES,
+          loadPlans,
+          updatePlanPriority,
+        });
+        if (!pRes || !pRes.ok) {
+          this.patchEditPlan(planId, {
+            saving: false,
+            error: pRes && pRes.error ? pRes.error : "更新优先级失败。",
+          });
+          return;
+        }
+      }
+
+      if (nextTargetLevel !== String(plan.targetLevel == null ? "0" : plan.targetLevel)) {
+        const tRes = updatePlanTargetLevelAction({
+          state: this.getReduxState(),
+          planId,
+          targetLevel: nextTargetLevel,
+          isTargetImprovable: (targetEquipId) => this.isTargetImprovable(targetEquipId),
+          loadPlans,
+          runPlanForInput: ({ state, apiId, targetEquipId, targetLevel }) =>
+            this.runPlanForInput({ state, apiId, targetEquipId, targetLevel }),
+          runPlanForSnapshotInput: ({ state, apiId, startEquipId, startLevel, targetEquipId, targetLevel }) =>
+            this.runPlanForSnapshotInput({ state, apiId, startEquipId, startLevel, targetEquipId, targetLevel }),
+          updatePlanTargetLevel,
+          getPlayerEquipByApiId,
+          getEquipSortno,
+        });
+        if (!tRes || !tRes.ok) {
+          this.patchEditPlan(planId, {
+            saving: false,
+            error: tRes && tRes.error ? tRes.error : "更新目标星数失败。",
+          });
+          return;
+        }
+      }
+
+      this.cancelEditPlan(planId);
+      this.refreshPlans();
+    } catch (e) {
+      this.patchEditPlan(planId, {
+        saving: false,
+        error: String(e && (e.stack || e)),
+      });
+    }
+  }
+
+  refreshPlanById(planId) {
+    try {
+      const state = this.getReduxState();
+      if (!state || !state.const || !state.info) return;
+      const target = loadPlans().find((p) => String(p.id) === String(planId));
+      if (!target) return;
+      const equipOwnerShipIndex = this.getEquipOwnerShipIndex(state);
+      const wrap = refreshPlanByIdAction({
+        state,
+        targetPlan: target,
+        detectCurrentPosition,
+        runPlanForInput: ({ state: s, apiId, targetEquipId, targetLevel }) =>
+          this.runPlanForInput({ state: s, apiId, targetEquipId, targetLevel }),
+        upsertLastResult,
+        arrangementIndex: this.arrangementIndex,
+        weekdayKey: getTokyoWeekdayKey(),
+        masterShipsRaw: state.const.$ships || {},
+        planOwnerShipNameByPlanId: buildPlanOwnerShipNameMap([target], equipOwnerShipIndex),
+      });
+      if (!wrap) return;
+
+      this.setState((prev) => ({
+        plans: loadPlans(),
+        planResults: { ...(prev.planResults || {}), [target.id]: wrap },
+      }));
+    } catch {}
+  }
+
+  submitCreate() {
+    try {
+      const actionRes = submitCreateAction({
+        state: this.getReduxState(),
+        createState: this.state.create,
+        priorities: PRIORITIES,
+        isTargetImprovable: (targetEquipId) => this.isTargetImprovable(targetEquipId),
+        pathByPair: this.pathByPair,
+        getPlayerEquipByApiId,
+        loadPlans,
+        runPlanForInput: ({ state, apiId, targetEquipId, targetLevel }) =>
+          this.runPlanForInput({ state, apiId, targetEquipId, targetLevel }),
+        createPlan,
+        getEquipName,
+      });
+      if (!actionRes || !actionRes.ok) {
+        this.setState({ createError: actionRes && actionRes.error ? actionRes.error : "创建失败。" });
+        return;
+      }
+
+      this.setState({
+        showCreateForm: false,
+        createError: null,
+        create: { targetEquipId: "", targetLevel: "0", priority: "P0", startApiId: "", note: "", targetQuery: "", startQuery: "" },
+      });
+      this.refreshPlans();
+    } catch (e) {
+      this.setState({ createError: String(e && (e.stack || e)) });
+    }
+  }
+
+  renderCreateForm(state, plans) {
+    if (!this.state.showCreateForm) return null;
+    const masterEquipsById = state.const.$equips || {};
+    const targetCandidatesAll = this.getTargetCandidates(masterEquipsById);
+    const c = this.state.create;
+    const improvable = this.isTargetImprovable(c.targetEquipId);
+    const targetQuery = String(c.targetQuery || "").trim().toLowerCase();
+    const targetCandidates = targetCandidatesAll.filter((id) => {
+      if (!targetQuery) return true;
+      const name = getEquipName(masterEquipsById, id).toLowerCase();
+      const idText = String(id);
+      return name.includes(targetQuery) || idText.includes(targetQuery);
+    });
+    const equipOwnerShipIndex = this.getEquipOwnerShipIndex(state);
+    const startOptionsAll = c.targetEquipId ? this.buildStartOptions(state, plans, c.targetEquipId, equipOwnerShipIndex) : [];
+    const startQuery = String(c.startQuery || "").trim().toLowerCase();
+    const startFiltered = startOptionsAll.filter((o) => {
+      if (!startQuery) return true;
+      return `${o.name} ${o.apiId} ${o.ownerShipName || ""}`.toLowerCase().includes(startQuery);
+    });
+    const isStartUnsearched = !startQuery;
+    const startRenderList = isStartUnsearched ? startFiltered.slice(0, START_OPTIONS_DEFAULT_LIMIT) : startFiltered;
+    const startOptionsTip =
+      isStartUnsearched && startFiltered.length > START_OPTIONS_DEFAULT_LIMIT
+        ? `仅显示前 ${START_OPTIONS_DEFAULT_LIMIT} 条起点装备，请输入更准确关键词继续筛选。`
+        : "";
+
+    const targetOptions = targetCandidates.map((id) => ({
+      value: String(id),
+      label: `${getEquipName(masterEquipsById, id)} (equipId:${id})`,
+      inputText: `${getEquipName(masterEquipsById, id)} (equipId:${id})`,
+      disabled: false,
+    }));
+    const startOptions = startRenderList.map((o) => ({
+      value: o.apiId,
+      label: `[api:${o.apiId}] ${o.name} +${o.level}${o.ownerShipName ? `（${o.ownerShipName}）` : ""}${
+        o.isLocked ? " [锁定]" : " [未锁定]"
+      } (${o.disabled ? o.disabledReason : "可选"})`,
+      inputText: `[api:${o.apiId}] ${o.name} +${o.level}${o.ownerShipName ? `（${o.ownerShipName}）` : ""}${
+        o.isLocked ? " [锁定]" : " [未锁定]"
+      }`,
+      disabled: o.disabled,
+    }));
+    const targetInputValue = c.targetQuery || "";
+    const startInputValue = c.startQuery || "";
+    const selectedTargetText = c.targetEquipId
+      ? `${getEquipName(masterEquipsById, c.targetEquipId)} (equipId:${c.targetEquipId})`
+      : "";
+    const selectedStart = startOptionsAll.find((o) => String(o.apiId) === String(c.startApiId));
+    const selectedStartText = selectedStart
+      ? `[api:${selectedStart.apiId}] ${selectedStart.name} +${selectedStart.level}${
+          selectedStart.ownerShipName ? `（${selectedStart.ownerShipName}）` : ""
+        }${selectedStart.isLocked ? " [锁定]" : " [未锁定]"}`
+      : "";
+
+    return React.createElement(CreatePlanForm, {
+      visible: this.state.showCreateForm,
+      create: c,
+      createError: this.state.createError,
+      improvable,
+      priorities: PRIORITIES,
+      targetOptions,
+      startOptions,
+      startOptionsTip,
+      targetInputValue,
+      startInputValue,
+      selectedTargetText,
+      selectedStartText,
+      onPatchCreate: (patch) =>
+        this.setState((prev) => ({
+          create: { ...(prev.create || {}), ...(patch || {}) },
+        })),
+      onSelectTarget: (targetEquipId, option) => {
+        const canImprove = this.isTargetImprovable(targetEquipId);
+        this.setState((prev) => ({
+          create: {
+            ...(prev.create || {}),
+            targetEquipId,
+            targetQuery: option && option.inputText ? option.inputText : "",
+            targetLevel: canImprove ? (prev.create && prev.create.targetLevel ? prev.create.targetLevel : "0") : "0",
+            startApiId: "",
+            startQuery: "",
+          },
+        }));
+      },
+      onSelectStart: (startApiId, option) =>
+        this.setState((prev) => ({
+          create: {
+            ...(prev.create || {}),
+            startApiId: String(startApiId || ""),
+            startQuery: option && option.inputText ? option.inputText : "",
+          },
+        })),
+      onClearTarget: () =>
+        this.setState((prev) => ({
+          create: {
+            ...(prev.create || {}),
+            targetEquipId: "",
+            targetQuery: "",
+            targetLevel: "0",
+            startApiId: "",
+            startQuery: "",
+          },
+        })),
+      onClearStart: () =>
+        this.setState((prev) => ({
+          create: {
+            ...(prev.create || {}),
+            startApiId: "",
+            startQuery: "",
+          },
+        })),
+      onSubmit: () => this.submitCreate(),
+      onCancel: () => this.setState({ showCreateForm: false, createError: null }),
+    });
+  }
+
+  renderExpandedRow(plan, planWrap) {
+    const masterEquipsById = ((this.getReduxState() || {}).const || {}).$equips || {};
+    return React.createElement(WishlistExpandedDetail, {
+      plan,
+      planWrap,
+      masterEquipsById,
+      getEquipName,
+      toInt,
+      stockStatusMark,
+    });
+  }
+
+  render() {
+    const state = this.getReduxState();
+    const plans = this.state.plans || [];
+
+    const wrapper = {
+      height: "calc(100vh - 140px)",
+      display: "flex",
+      flexDirection: "column",
+      color: "#e5e7eb",
+      fontFamily: "system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial",
+      fontSize: 12,
+    };
+    const top = {
+      padding: 12,
+      border: "1px solid rgba(255,255,255,0.12)",
+      borderRadius: 10,
+      background: "rgba(16,24,40,0.92)",
+      flexShrink: 0,
+    };
+    const bottom = {
+      marginTop: 10,
+      flex: 1,
+      overflowY: "auto",
+      border: "1px solid rgba(255,255,255,0.12)",
+      borderRadius: 10,
+      background: "rgba(0,0,0,0.08)",
+    };
+    const row = { display: "flex", gap: 8, alignItems: "center", flexWrap: "wrap" };
+    const input = {
+      padding: "6px 10px",
+      borderRadius: 8,
+      border: "1px solid rgba(255,255,255,0.12)",
+      background: "rgba(0,0,0,0.15)",
+      color: "#e5e7eb",
+      outline: "none",
+      width: 240,
+    };
+    const th = { textAlign: "left", padding: "10px 10px", borderBottom: "1px solid rgba(255,255,255,0.12)" };
+    const td = { padding: "10px 10px", borderBottom: "1px solid rgba(255,255,255,0.08)", verticalAlign: "top" };
+
+    if (!state || !state.const || !state.info) {
+      return React.createElement("pre", null, this.state.error || "Redux state unavailable.");
+    }
+
+    const masterEquipsById = state.const.$equips || {};
+    const vm = buildWishlistViewModel({
+      plans,
+      planResults: this.state.planResults,
+      filterTargetName: this.state.filterTargetName,
+      getEquipName,
+      getEquipSortno,
+      masterEquipsById,
+    });
+
+    return React.createElement(
+      "div",
+      { style: wrapper },
+      React.createElement(
+        "div",
+        { style: top },
+        React.createElement("div", { style: { fontSize: 16, fontWeight: 900 } }, "改修心愿清单"),
+        React.createElement(
+          "div",
+          { style: { marginTop: 4, opacity: 0.8 } },
+          "创建与管理改修计划，可查看计划进度、剩余消耗缺口等信息"
+        ),
+        React.createElement("div", { style: { marginTop: 4, opacity: 0.75 } }, this.state.nowText),
+        React.createElement(
+          "div",
+          { style: { ...row, marginTop: 10 } },
+          React.createElement("input", {
+            style: input,
+            placeholder: "按目标装备名称筛选",
+            value: this.state.filterTargetName,
+            onChange: (e) => this.setState({ filterTargetName: e.target.value }),
+          }),
+          React.createElement("button", { onClick: () => this.setState({ showCreateForm: true }) }, "新增改修计划"),
+          React.createElement("button", { onClick: this.refreshPlans }, "刷新")
+        ),
+        this.renderCreateForm(state, plans),
+        Object.values(this.state.editById || {}).some((x) => x && x.error)
+          ? React.createElement(
+              "div",
+              { style: { marginTop: 8, color: "#fca5a5" } },
+              Object.values(this.state.editById || {})
+                .map((x) => (x && x.error ? x.error : ""))
+                .filter(Boolean)[0]
+            )
+          : null,
+        this.state.error ? React.createElement("div", { style: { marginTop: 8, color: "#fca5a5" } }, this.state.error) : null
+      ),
+
+      React.createElement(
+        "div",
+        { style: bottom },
+        React.createElement(WishlistTable, {
+          rows: vm.rows,
+          expandedById: this.state.expandedById,
+          rebindInputById: this.state.rebindInputById,
+          editById: this.state.editById,
+          priorities: PRIORITIES,
+          styles: { row, input, th, td },
+          getPlanStartSnapshotText,
+          isTargetImprovable: (targetEquipId) => this.isTargetImprovable(targetEquipId),
+          onToggleExpand: (planId, isExp) =>
+            this.setState((prev) => ({
+              expandedById: { ...(prev.expandedById || {}), [planId]: !isExp },
+            })),
+          onRefreshPlan: (planId) => this.refreshPlanById(planId),
+          onDeletePlan: (planId) => {
+            deletePlan(planId);
+            this.refreshPlans();
+          },
+          onRebindInputChange: (planId, value) =>
+            this.setState((prev) => ({
+              rebindInputById: { ...(prev.rebindInputById || {}), [planId]: value },
+            })),
+          onRebindConfirm: (planId, rawValue) => {
+            const newApiId = String(rawValue || "").trim();
+            if (!newApiId) return;
+            replacePlanStartApiId(planId, newApiId);
+            this.setState((prev) => ({
+              rebindInputById: { ...(prev.rebindInputById || {}), [planId]: "" },
+            }));
+            this.refreshPlans();
+          },
+          onStartEdit: (plan) => this.startEditPlan(plan),
+          onCancelEdit: (planId) => this.cancelEditPlan(planId),
+          onPatchEdit: (planId, patch) => this.patchEditPlan(planId, patch),
+          onSaveEdit: (planId) => this.saveEditPlan(planId),
+          renderExpandedRow: (plan, wrap) => this.renderExpandedRow(plan, wrap),
+        })
+      )
+    );
+  }
+}
+
+module.exports = WishlistTab;