poi-plugin-koushu-rate 2.0.0 → 2.0.8

package/index.js

@@ -2,7 +2,7 @@ const React = require("react");
 const fs = require("fs");
 const path = require("path");
 const { WindowEnv } = require("views/components/etc/window-env");
-const { SlotitemIcon } = require("views/components/etc/icon");
+const { SlotitemIcon, MaterialIcon } = require("views/components/etc/icon");
 
 const LEVEL_ONE_ROWS = [
   { range: "★0→1", p: 1.0 },
@@ -21,6 +21,21 @@ const LEVEL_TWO_ROWS = [
   { range: "MAX→进化", label: "62%", p: 0.62, source: "upgrade" },
 ];
 
+const PLAN_LEVELS_6 = [
+  { from: 0, p: 1, source: "phase0" },
+  { from: 1, p: 1, source: "phase0" },
+  { from: 2, p: 1, source: "phase0" },
+  { from: 3, p: 1, source: "phase0" },
+  { from: 4, p: 1, source: "phase0" },
+  { from: 5, p: 0.95, source: "phase0" },
+];
+const PLAN_LEVELS_MAX = PLAN_LEVELS_6.concat([
+  { from: 6, p: 0.9, source: "phase1" },
+  { from: 7, p: 0.82, source: "phase1" },
+  { from: 8, p: 0.77, source: "phase1" },
+  { from: 9, p: 0.67, source: "phase1" },
+]);
+
 const WEEKDAY_KEYS = ["monday", "tuesday", "wednesday", "thursday", "friday", "saturday", "sunday"];
 const WEEKDAY_LABELS = { monday: "周一", tuesday: "周二", wednesday: "周三", thursday: "周四", friday: "周五", saturday: "周六", sunday: "周日" };
 const ALL_DAYS_KEY = "all";
@@ -140,7 +155,7 @@ const CSS = `
   font-size: 14px;
 }
 .kr2-header {
-  padding: 12px 14px;
+  padding: 12px 14px 20px;
   border-bottom: 1px solid rgba(255, 255, 255, 0.12);
 }
 .kr2-title-row {
@@ -187,7 +202,7 @@ const CSS = `
   display: flex;
   gap: 6px;
   flex-wrap: wrap;
-  margin-top: 10px;
+  margin-top: 0;
 }
 .kr2-day {
   padding: 5px 12px;
@@ -206,6 +221,219 @@ const CSS = `
   color: #fff;
   border-color: #2d72d2;
 }
+.kr2-nav {
+  display: flex;
+  gap: 6px;
+  margin-top: 12px;
+  margin-bottom: 20px;
+}
+.kr2-nav-btn {
+  padding: 7px 18px;
+  border: 1px solid #5f6b7c;
+  border-radius: 6px;
+  background: #2f343c;
+  color: #f6f7f9;
+  cursor: pointer;
+  font-size: 13px;
+}
+.kr2-nav-btn:hover {
+  background: #383e47;
+}
+.kr2-nav-active {
+  background: #2d72d2;
+  border-color: #2d72d2;
+  color: #fff;
+}
+.kr2-plan {
+  margin-top: 12px;
+  flex: 1;
+  min-height: 0;
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
+.kr2-plan-bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+  flex-wrap: wrap;
+  margin-bottom: 10px;
+}
+.kr2-plan-chips {
+  display: flex;
+  gap: 8px;
+}
+.kr2-plan-chip {
+  padding: 4px 12px;
+  border-radius: 12px;
+  font-size: 12px;
+  background: #232a33;
+  border: 1px solid #3a4450;
+  color: #c8d0da;
+  cursor: pointer;
+}
+.kr2-plan-chip:hover {
+  background: #1d3048;
+  border-color: #4f9dcc;
+}
+.kr2-plan-summary {
+  display: grid;
+  grid-template-columns: repeat(6, 1fr);
+  border: 1px solid #343c46;
+  border-radius: 8px;
+  overflow: hidden;
+  background: #1c2127;
+  margin-bottom: 12px;
+}
+.kr2-plan-sum-cell {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  padding: 8px 10px;
+  border-right: 1px solid #2a313a;
+  font-size: 13px;
+  min-width: 0;
+}
+.kr2-plan-sum-cell:last-child {
+  border-right: 0;
+}
+.kr2-plan-sum-icon {
+  font-size: 15px;
+  line-height: 1;
+}
+.kr2-plan-mat-icon {
+  width: 20px;
+  height: 20px;
+  object-fit: contain;
+}
+.kr2-plan-sum-num {
+  font-weight: 700;
+  color: #f6f7f9;
+  white-space: nowrap;
+}
+.kr2-plan-table {
+  border-collapse: separate;
+  border-spacing: 0;
+}
+.kr2-plan-table td {
+  border-top: 0;
+}
+.kr2-plan-table thead th {
+  text-align: center;
+}
+.kr2-plan-table thead th.kr2-plan-mat-th {
+  text-align: left;
+}
+.kr2-plan-table th,
+.kr2-plan-table td {
+  text-align: center;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
+}
+.kr2-plan-table tbody tr:last-child td {
+  border-bottom: 0;
+}
+.kr2-plan-current {
+  font-size: 12px;
+}
+.kr2-plan-current-stock {
+  font-size: 11px;
+}
+.kr2-plan-bar-left {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+.kr2-plan-total-label {
+  font-size: 12px;
+  color: #abb3bf;
+}
+.kr2-plan-table td.kr2-plan-mat-col,
+.kr2-plan-table td.kr2-plan-consumed {
+  text-align: left;
+}
+.kr2-plan-table td.kr2-plan-name {
+  text-align: left;
+  vertical-align: middle;
+}
+.kr2-plan-table .kr2-plan-name-inner {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.kr2-plan-table .kr2-icon {
+  width: 24px;
+  height: 24px;
+  object-fit: contain;
+  flex: 0 0 24px;
+}
+.kr2-plan-qty {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+.kr2-plan-qty-btn {
+  width: 22px;
+  height: 22px;
+  border: 1px solid #46515e;
+  background: #2f343c;
+  color: #e8ebef;
+  border-radius: 4px;
+  cursor: pointer;
+  font-size: 14px;
+  line-height: 1;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+.kr2-plan-qty-btn:hover {
+  background: #1d3048;
+  border-color: #4f9dcc;
+}
+.kr2-plan-qty-input {
+  width: 42px;
+  height: 24px;
+  border: 1px solid #46515e;
+  border-radius: 4px;
+  background: #1c2127;
+  color: #f6f7f9;
+  text-align: center;
+  font-size: 13px;
+}
+.kr2-plan-mat-btn {
+  display: inline-block;
+  padding: 3px 10px;
+  border: 1px solid #5f6b7c;
+  border-radius: 4px;
+  background: #2f343c;
+  color: #f6f7f9;
+  font-size: 12px;
+  cursor: pointer;
+}
+.kr2-plan-mat-btn:hover {
+  background: #1d3048;
+  border-color: #4f9dcc;
+  color: #d6e4f5;
+}
+.kr2-plan-stock-default {
+  color: #f6f7f9;
+}
+.kr2-plan-stock-low {
+  color: #ff6b6b;
+  font-weight: 700;
+}
+.kr2-plan-stock-enough {
+  color: #009900;
+  font-weight: 700;
+}
+.kr2-plan-sec {
+  margin-top: 16px;
+}
+.kr2-plan-sec h3 {
+  font-size: 14px;
+  color: #d6dce3;
+  margin-bottom: 8px;
+}
 .kr2-search {
   width: 240px;
   padding: 6px 10px;
@@ -268,8 +496,28 @@ const CSS = `
 .kr2-list {
   flex: 1;
   min-height: 0;
-  overflow-y: auto;
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
+.kr2-plan::-webkit-scrollbar,
+.kr2-list::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
 }
+.kr2-plan::-webkit-scrollbar-track,
+.kr2-list::-webkit-scrollbar-track {
+  background: #1c2127;
+}
+.kr2-plan::-webkit-scrollbar-thumb,
+.kr2-list::-webkit-scrollbar-thumb {
+  background: #5f6b7c;
+  border-radius: 5px;
+}
+.kr2-plan::-webkit-scrollbar-thumb:hover,
+.kr2-list::-webkit-scrollbar-thumb:hover {
+  background: #8b95a1;
+}
+
 .kr2-dropdown {
   position: relative;
 }
@@ -1542,17 +1790,18 @@ function getInventoryEquips(envWindow) {
   try {
     const state = getReduxState(envWindow)
     const info = state && state.info
-    if (info && info.equips) return info.equips
+    const infoEquips = (info && (info.equips || info.slotitems)) || (state && (state.equips || state.slotitems))
+    if (infoEquips) return infoEquips
     const candidates = []
     if (envWindow) candidates.push(envWindow)
     if (typeof window !== "undefined" && window) candidates.push(window)
     for (const w of candidates) {
       if (w && typeof w.getStore === "function") {
-        const direct = w.getStore("info.equips")
+        const direct = w.getStore("info.equips") || w.getStore("info.slotitems")
         if (direct) return direct
       }
     }
-    return (info && info.equips) || {}
+    return infoEquips || {}
   } catch (_) {
     return {}
   }
@@ -1562,14 +1811,16 @@ function getUseItemCounts(envWindow) {
   try {
     const state = getReduxState(envWindow)
     const info = state && state.info
-    const useItems = (info && info.useitems) || {}
-    const $useItems = (state && state.const && state.const.$useitems) || {}
+    const constData = (state && state.const) || {}
+    const useItems = (info && (info.useitems || info.items)) || {}
+    const $useItems = (constData.$useitems || constData.useitems) || {}
     const byName = {}
     for (const id of Object.keys(useItems)) {
       const item = useItems[id] || {}
       const master = $useItems[id] || (item.api_id != null ? $useItems[String(item.api_id)] : null) || {}
       const name = master.api_name || item.api_name
-      if (name && item.api_count != null) byName[String(name)] = item.api_count
+      const count = item.api_count != null ? item.api_count : item.count
+      if (name && count != null) byName[String(name)] = count
     }
     return byName
   } catch (_) {
@@ -1829,6 +2080,285 @@ function InventoryModal({ equipId, name, inventory, onClose }) {
   )
 }
 
+function planCurrentLevel(row, inventoryByEquip) {
+  const inv = (inventoryByEquip || {})[row.id]
+  if (inv && inv.levels) {
+    const keys = Object.keys(inv.levels).map(Number)
+    if (keys.length) return Math.max(0, Math.min(10, Math.max.apply(null, keys)))
+  }
+  return 0
+}
+
+function planInventoryLevels(row, inventoryByEquip) {
+  const inv = (inventoryByEquip || {})[row.id]
+  const out = []
+  if (inv && inv.levels) {
+    for (const level of Object.keys(inv.levels)) {
+      const lv = Number(level)
+      const count = Math.max(0, Math.round(Number(inv.levels[level]) || 0))
+      for (let i = 0; i < count; i += 1) out.push(lv)
+    }
+  }
+  out.sort((a, b) => b - a)
+  return out
+}
+
+function planCopyCosts(row, target, current) {
+  const levels = target === "max" ? PLAN_LEVELS_MAX : PLAN_LEVELS_6
+  const out = { screws: 0, dev: 0, fuel: 0, ammo: 0, steel: 0, bauxite: 0, materials: [] }
+  for (const lv of levels) {
+    if (lv.from < current) continue
+    const step = lv.source === "phase0" ? row.phase0 : row.phase1
+    if (!step) continue
+    const rec = buildRecommendation(step.consume_improvement_min, step.consume_improvement_max, lv.p)
+    const ensure = rec.tone === "ensure"
+    const expected = Number.isFinite(rec.expected) ? rec.expected : step.consume_improvement_min / lv.p
+    const screws = ensure ? step.consume_improvement_max : expected
+    const attempts = ensure ? 1 : expected
+    const dev = ensure ? step.consume_development_max : step.consume_development_min * attempts
+    out.screws += screws
+    out.dev += dev
+    const base = row.base || {}
+    out.fuel += (base.consume_fuel || 0) * attempts
+    out.ammo += (base.consume_ammo || 0) * attempts
+    out.steel += (base.consume_steel || 0) * attempts
+    out.bauxite += (base.consume_bauxite || 0) * attempts
+    for (const m of step.materials || []) {
+      out.materials.push({ item: m, count: m.count || 1 })
+    }
+  }
+  return out
+}
+
+function planRowCosts(row, target, qty, inventoryByEquip) {
+  const count = Math.max(1, Math.min(99, Math.round(Number(qty) || 1)))
+  let starts = []
+  if (count === 1) {
+    starts = [planCurrentLevel(row, inventoryByEquip)]
+  } else {
+    const levels = planInventoryLevels(row, inventoryByEquip)
+    for (let i = 0; i < count; i += 1) starts.push(i < levels.length ? levels[i] : 0)
+  }
+  const out = { screws: 0, dev: 0, fuel: 0, ammo: 0, steel: 0, bauxite: 0, materials: [] }
+  for (const current of starts) {
+    const c = planCopyCosts(row, target, current)
+    out.screws += c.screws
+    out.dev += c.dev
+    out.fuel += c.fuel
+    out.ammo += c.ammo
+    out.steel += c.steel
+    out.bauxite += c.bauxite
+    for (const m of c.materials) out.materials.push(m)
+  }
+  out.materials = planAggregateMaterials(out.materials)
+  return out
+}
+
+function planCurrentDisplay(row, sel, inventoryByEquip) {
+  if (Math.round(Number(sel.qty || 1)) === 1) return "★ " + String(planCurrentLevel(row, inventoryByEquip))
+  const inv = (inventoryByEquip || {})[row.id]
+  return "库存 " + String(inv && Number.isFinite(inv.total) ? inv.total : 0)
+}
+
+function planMaterialKey(m) {
+  return m.item_equipment_id != null ? "equip:" + String(m.item_equipment_id) : "material:" + String(m.item_material_key || m.item_name || "")
+}
+
+function planAggregateMaterials(materials) {
+  const byKey = {}
+  const out = []
+  for (const m of materials || []) {
+    const key = planMaterialKey(m.item)
+    const target = byKey[key] || (byKey[key] = { item: m.item, count: 0 })
+    target.count += m.count || 1
+  }
+  return Object.keys(byKey).map((k) => byKey[k])
+}
+
+function planStockValue(m, inventoryByEquip, useItemCounts) {
+  if (m.item_equipment_id != null) {
+    const inv = (inventoryByEquip || {})[String(m.item_equipment_id)]
+    if (inv) return Number.isFinite(inv.stock) ? inv.stock : 0
+    const inventoryLoaded = inventoryByEquip && Object.keys(inventoryByEquip).length > 0
+    return inventoryLoaded ? 0 : null
+  }
+  const name = String(m.item_name || m.item_material_key || "")
+  const v = (useItemCounts || {})[name]
+  return v == null ? null : Number(v)
+}
+
+function planFormatNumber(n) {
+  const v = Number(n) || 0
+  return String(Math.max(0, Math.ceil(v - 1e-9)).toLocaleString())
+}
+
+function planFormatScrews(n) {
+  const v = Number(n) || 0
+  if (Math.abs(v - Math.round(v)) < 0.05) return String(Math.round(v).toLocaleString())
+  return v.toFixed(1)
+}
+
+function PlanningPage({ rows, inventoryByEquip, useItemCounts, selection, onToggle, onTarget, onQty, onSelectAll, onMaterialClick }) {
+  const planRows = rows.map((row) => {
+    const sel = (selection || {})[row.id] || { selected: true, target: "max", qty: 1 }
+    return { row, sel, costs: planRowCosts(row, sel.target, sel.qty, inventoryByEquip), display: planCurrentDisplay(row, sel, inventoryByEquip) }
+  })
+  const selected = planRows.filter((p) => p.sel.selected)
+  const totals = { screws: 0, dev: 0, fuel: 0, ammo: 0, steel: 0, bauxite: 0 }
+  const materialMap = {}
+  for (const p of selected) {
+    totals.screws += p.costs.screws
+    totals.dev += p.costs.dev
+    totals.fuel += p.costs.fuel
+    totals.ammo += p.costs.ammo
+    totals.steel += p.costs.steel
+    totals.bauxite += p.costs.bauxite
+    for (const m of p.costs.materials) {
+      const key = planMaterialKey(m.item)
+      const entry = materialMap[key] || (materialMap[key] = { name: String(m.item.item_name || m.item.item_material_key || ("装备 " + m.item.item_equipment_id)), item: m.item, required: 0, stock: null, equips: [] })
+      entry.required += m.count
+      if (entry.stock == null) entry.stock = planStockValue(m.item, inventoryByEquip, useItemCounts)
+      if (entry.equips.indexOf(p.row.name) < 0) entry.equips.push(p.row.name)
+    }
+  }
+  const materialList = Object.keys(materialMap).map((k) => materialMap[k]).sort((a, b) => a.name.localeCompare(b.name, "zh-Hans-CN"))
+  const stockClass = (stock, required) => stock == null ? "kr2-plan-stock-default" : stock < required ? "kr2-plan-stock-low" : "kr2-plan-stock-enough"
+  const summaryItems = [
+    { materialId: 8, title: "螺丝", value: totals.screws },
+    { materialId: 7, title: "资材", value: totals.dev },
+    { materialId: 1, title: "油", value: totals.fuel },
+    { materialId: 2, title: "弹", value: totals.ammo },
+    { materialId: 3, title: "钢", value: totals.steel },
+    { materialId: 4, title: "铝", value: totals.bauxite },
+  ]
+  return React.createElement(
+    "div",
+    { className: "kr2-plan" },
+    React.createElement(
+      "div",
+      { className: "kr2-plan-bar" },
+      React.createElement(
+        "div",
+        { className: "kr2-plan-bar-left" },
+        React.createElement("span", { className: "kr2-plan-total-label" }, "总资源消耗"),
+        React.createElement("span", { className: "kr2-status" }, "已选 " + selected.length + " / " + planRows.length + " 件收藏装备")
+      ),
+      React.createElement(
+        "div",
+        { className: "kr2-plan-chips" },
+        React.createElement("button", { className: "kr2-plan-chip", onClick: () => onSelectAll(true) }, "全选"),
+        React.createElement("button", { className: "kr2-plan-chip", onClick: () => onSelectAll(false) }, "全不选")
+      )
+    ),
+    React.createElement(
+      "div",
+      { className: "kr2-plan-summary" },
+      summaryItems.map((item) =>
+        React.createElement(
+          "div",
+          { key: item.title, className: "kr2-plan-sum-cell", title: item.title },
+          React.createElement(MaterialIcon, { materialId: item.materialId, className: "kr2-plan-mat-icon", alt: item.title }),
+          React.createElement("span", { className: "kr2-plan-sum-num" }, item.materialId === 8 ? planFormatScrews(item.value) : planFormatNumber(item.value))
+        )
+      )
+    ),
+    React.createElement(
+      "table",
+      { className: "kr2-table kr2-plan-table" },
+      React.createElement(
+        "thead",
+        null,
+        React.createElement(
+          "tr",
+          null,
+          React.createElement("th", { style: { width: 36 } }, "选用"),
+          React.createElement("th", null, "装备"),
+          React.createElement("th", null, "当前"),
+          React.createElement("th", null, "目标"),
+          React.createElement("th", null, "目标数量"),
+          React.createElement("th", null, "资材"),
+          React.createElement("th", null, "螺丝"),
+          React.createElement("th", null, "素材")
+        )
+      ),
+      React.createElement(
+        "tbody",
+        null,
+        planRows.map((p) => {
+          const matText = p.costs.materials.map((m) => String(m.item.item_name || m.item.item_material_key || ("装备 " + m.item.item_equipment_id)) + " ×" + String(m.count)).join(" / ") || "无"
+          return React.createElement(
+            "tr",
+            { key: p.row.id },
+            React.createElement("td", null, React.createElement("input", { type: "checkbox", checked: !!p.sel.selected, onChange: () => onToggle(p.row.id) })),
+            React.createElement("td", { className: "kr2-plan-name" }, React.createElement("span", { className: "kr2-plan-name-inner" }, React.createElement(SlotitemIcon, { slotitemId: p.row.icon, className: "kr2-icon" }), " ", p.row.name)),
+            React.createElement("td", { className: Math.round(Number(p.sel.qty || 1)) === 1 ? "kr2-plan-current" : "kr2-plan-current-stock" }, p.display),
+            React.createElement(
+              "td",
+              null,
+              React.createElement(
+                "label",
+                { style: { marginRight: 8 } },
+                React.createElement("input", { type: "radio", name: "plan-" + p.row.id, checked: p.sel.target !== "max", onChange: () => onTarget(p.row.id, "6") }),
+                "+6"
+              ),
+              React.createElement(
+                "label",
+                null,
+                React.createElement("input", { type: "radio", name: "plan-" + p.row.id, checked: p.sel.target === "max", onChange: () => onTarget(p.row.id, "max") }),
+                "MAX"
+              )
+            ),
+            React.createElement(
+              "td",
+              null,
+              React.createElement(
+                "span",
+                { className: "kr2-plan-qty" },
+                React.createElement("button", { type: "button", className: "kr2-plan-qty-btn", onClick: () => onQty(p.row.id, Number(p.sel.qty || 1) - 1) }, "−"),
+                React.createElement("input", { className: "kr2-plan-qty-input", value: String(p.sel.qty || 1), onChange: (e) => onQty(p.row.id, e.target.value) }),
+                React.createElement("button", { type: "button", className: "kr2-plan-qty-btn", onClick: () => onQty(p.row.id, Number(p.sel.qty || 1) + 1) }, "+")
+              )
+            ),
+            React.createElement("td", null, planFormatNumber(p.costs.dev)),
+            React.createElement("td", null, planFormatScrews(p.costs.screws)),
+            React.createElement("td", { className: "kr2-plan-mat-col" }, matText)
+          )
+        })
+      )
+    ),
+    React.createElement(
+      "div",
+      { className: "kr2-plan-sec" },
+      React.createElement("h3", null, "素材需求汇总（按素材分别统计）"),
+      React.createElement(
+        "table",
+        { className: "kr2-table kr2-plan-table" },
+        React.createElement(
+          "thead",
+          null,
+          React.createElement("tr", null, React.createElement("th", { className: "kr2-plan-mat-th" }, "素材名称"), React.createElement("th", null, "需求"), React.createElement("th", null, "库存"), React.createElement("th", { className: "kr2-plan-mat-th" }, "消耗于装备"))
+        ),
+        React.createElement(
+          "tbody",
+          null,
+          materialList.length === 0
+            ? React.createElement("tr", null, React.createElement("td", { colSpan: 4 }, "暂无素材需求"))
+            : materialList.map((m) =>
+                React.createElement(
+                  "tr",
+                  { key: m.name },
+                  React.createElement("td", { className: "kr2-plan-name" }, React.createElement("button", { className: "kr2-plan-mat-btn", onClick: () => onMaterialClick && onMaterialClick(m.item) }, m.name)),
+                  React.createElement("td", null, String(m.required)),
+                  React.createElement("td", { className: stockClass(m.stock, m.required) }, m.stock == null ? "--" : String(m.stock)),
+                  React.createElement("td", { className: "kr2-plan-consumed" }, m.equips.join("、"))
+                )
+              )
+        )
+      )
+    )
+  )
+}
+
 function RateCell({ range, open, onToggle, tone }) {
   return React.createElement(
     "span",
@@ -2119,6 +2649,8 @@ class KoushuRateApp extends React.Component {
     favorites: readFavorites(),
     favoritesOnly: false,
     starSort: null,
+    activeTab: "list",
+    planSelection: {},
   }
 
   componentDidMount() {
@@ -2276,6 +2808,46 @@ class KoushuRateApp extends React.Component {
     this.setState({ inventoryPopup: null })
   }
 
+  setActiveTab = (tab) => {
+    this.setState({ activeTab: tab })
+  }
+
+  planDefaultSel = (id) => ({ selected: true, target: "max", qty: 1 })
+
+  togglePlanRow = (id) => {
+    this.setState((prev) => {
+      const cur = prev.planSelection[id] || this.planDefaultSel(id)
+      return { planSelection: Object.assign({}, prev.planSelection, { [id]: Object.assign({}, cur, { selected: !cur.selected }) }) }
+    })
+  }
+
+  setPlanTarget = (id, target) => {
+    this.setState((prev) => {
+      const cur = prev.planSelection[id] || this.planDefaultSel(id)
+      return { planSelection: Object.assign({}, prev.planSelection, { [id]: Object.assign({}, cur, { target }) }) }
+    })
+  }
+
+  setPlanQty = (id, qty) => {
+    const n = Math.max(1, Math.min(99, Math.round(Number(qty) || 1)))
+    this.setState((prev) => {
+      const cur = prev.planSelection[id] || this.planDefaultSel(id)
+      return { planSelection: Object.assign({}, prev.planSelection, { [id]: Object.assign({}, cur, { qty: n }) }) }
+    })
+  }
+
+  selectAllPlan = (selected) => {
+    this.setState((prev) => {
+      const planSelection = Object.assign({}, prev.planSelection)
+      for (const row of prev.rows) {
+        if (!prev.favorites[row.id]) continue
+        const cur = planSelection[row.id] || this.planDefaultSel(row.id)
+        planSelection[row.id] = Object.assign({}, cur, { selected })
+      }
+      return { planSelection }
+    })
+  }
+
   setKcDevSort = (key) => {
     this.setState((prev) => {
       const popup = prev.kcDevPopup
@@ -2390,7 +2962,7 @@ class KoushuRateApp extends React.Component {
           ),
           React.createElement(
             "div",
-            { className: "kr2-toolbar" },
+            { className: "kr2-toolbar", style: this.state.activeTab === "plan" ? { display: "none" } : null },
             React.createElement("input", {
               className: "kr2-search",
               value: this.state.query,
@@ -2434,7 +3006,13 @@ class KoushuRateApp extends React.Component {
         ),
         React.createElement(
           "div",
-          { className: "kr2-days" },
+          { className: "kr2-nav" },
+          React.createElement("button", { className: "kr2-nav-btn" + (this.state.activeTab === "list" ? " kr2-nav-active" : ""), onClick: () => this.setActiveTab("list") }, "改修列表"),
+          React.createElement("button", { className: "kr2-nav-btn" + (this.state.activeTab === "plan" ? " kr2-nav-active" : ""), onClick: () => this.setActiveTab("plan") }, "素材计算")
+        ),
+        React.createElement(
+          "div",
+          { className: "kr2-days", style: this.state.activeTab === "plan" ? { display: "none" } : null },
           React.createElement(
             "button",
             { className: "kr2-day" + (day === ALL_DAYS_KEY ? " kr2-day-active" : ""), onClick: () => this.setState({ day: ALL_DAYS_KEY }) },
@@ -2459,7 +3037,7 @@ class KoushuRateApp extends React.Component {
         : null,
       React.createElement(
         "div",
-        { className: "kr2-list-head" },
+        { className: "kr2-list-head", style: this.state.activeTab === "plan" ? { display: "none" } : null },
         React.createElement("span", { className: "kr2-head-name" }, "装备"),
         React.createElement("span", { className: "kr2-head-secretary" }, "秘书舰"),
         React.createElement("span", { className: "kr2-head-meta" }, "可改修日期"),
@@ -2476,7 +3054,7 @@ class KoushuRateApp extends React.Component {
       ),
       React.createElement(
         "div",
-        { className: "kr2-list" },
+        { className: "kr2-list", style: this.state.activeTab === "plan" ? { display: "none" } : null },
         rows.length === 0
           ? React.createElement("div", { className: "kr2-empty" }, favoritesOnly ? "还没有收藏装备" : "没有匹配的装备")
           : rows.map((row) =>
@@ -2495,6 +3073,19 @@ class KoushuRateApp extends React.Component {
               })
             )
       ),
+      this.state.activeTab === "plan"
+        ? React.createElement(PlanningPage, {
+            rows: this.state.rows.filter((row) => !!this.state.favorites[row.id]),
+            inventoryByEquip,
+            useItemCounts,
+            selection: this.state.planSelection || {},
+            onToggle: this.togglePlanRow,
+            onTarget: this.setPlanTarget,
+            onQty: this.setPlanQty,
+            onSelectAll: this.selectAllPlan,
+            onMaterialClick: this.openKcDevPopup,
+          })
+        : null,
       kcDevPopup
         ? React.createElement(
             "div",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "poi-plugin-koushu-rate",
-  "version": "2.0.0",
+  "version": "2.0.8",
   "description": "全装备改修资材计算与推荐",
   "main": "index.js",
   "files": [