dekun
384 lines
12 KiB
JavaScript
384 lines
12 KiB
JavaScript
/**
|
|
* 中控策略计算器：趋势回调 / 滚仓历史测算
|
|
*/
|
|
(function () {
|
|
const page = document.getElementById("page-calculator");
|
|
if (!page) return;
|
|
|
|
let inited = false;
|
|
|
|
function $(id) {
|
|
return document.getElementById(id);
|
|
}
|
|
|
|
function esc(s) {
|
|
return String(s == null ? "" : s)
|
|
.replace(/&/g, "&")
|
|
.replace(/</g, "<")
|
|
.replace(/>/g, ">")
|
|
.replace(/"/g, """);
|
|
}
|
|
|
|
function num(id) {
|
|
const el = $(id);
|
|
if (!el) return null;
|
|
const n = Number(el.value);
|
|
return Number.isFinite(n) ? n : null;
|
|
}
|
|
|
|
function fmt(v, digits) {
|
|
if (v == null || v === "") return "—";
|
|
const n = Number(v);
|
|
if (!Number.isFinite(n)) return esc(v);
|
|
if (digits != null) return n.toFixed(digits);
|
|
return String(n);
|
|
}
|
|
|
|
function fmtU(v) {
|
|
if (v == null || v === "") return "—";
|
|
const n = Number(v);
|
|
if (!Number.isFinite(n)) return "—";
|
|
return (n >= 0 ? "+" : "") + n.toFixed(2) + "U";
|
|
}
|
|
|
|
function pnlClass(v) {
|
|
const n = Number(v);
|
|
if (!Number.isFinite(n) || n === 0) return "";
|
|
return n > 0 ? "calc-pnl-profit" : "calc-pnl-loss";
|
|
}
|
|
|
|
function syncTrendAddLabel() {
|
|
const dir = ($("calc-trend-direction") && $("calc-trend-direction").value) || "long";
|
|
const lab = $("calc-trend-add-label");
|
|
if (lab) lab.textContent = dir === "short" ? "补仓下沿价" : "补仓上沿价";
|
|
}
|
|
|
|
function renderTrendTable(rows) {
|
|
if (!rows || !rows.length) {
|
|
return '<p class="calc-empty">无档位数据</p>';
|
|
}
|
|
let html =
|
|
'<div class="calc-table-wrap"><table class="calc-table"><thead><tr>' +
|
|
"<th>档位</th><th>触发价</th><th>张数</th><th>加仓后均价</th><th>止盈盈利</th><th>止损金额</th><th>盈亏比</th>" +
|
|
"</tr></thead><tbody>";
|
|
rows.forEach(function (r) {
|
|
html +=
|
|
"<tr>" +
|
|
"<td>" +
|
|
esc(r.label) +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmt(r.price, 4) +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmt(r.contracts, 4) +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmt(r.avg_entry, 4) +
|
|
"</td>" +
|
|
'<td class="' +
|
|
pnlClass(r.profit_u) +
|
|
'">' +
|
|
fmtU(r.profit_u) +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmtU(r.risk_u) +
|
|
"</td>" +
|
|
"<td>" +
|
|
(r.rr != null ? fmt(r.rr, 2) + ":1" : "—") +
|
|
"</td>" +
|
|
"</tr>";
|
|
});
|
|
html += "</tbody></table></div>";
|
|
return html;
|
|
}
|
|
|
|
function renderTrendResult(data) {
|
|
const box = $("calc-trend-result");
|
|
if (!box) return;
|
|
box.classList.remove("hidden");
|
|
box.innerHTML =
|
|
'<div class="calc-summary">' +
|
|
"<div><span>计划保证金</span><strong>" +
|
|
fmt(data.plan_margin_u, 2) +
|
|
"U</strong></div>" +
|
|
"<div><span>止损预算</span><strong>" +
|
|
fmt(data.risk_budget_u, 2) +
|
|
"U</strong></div>" +
|
|
"<div><span>总张数</span><strong>" +
|
|
fmt(data.target_contracts, 4) +
|
|
"</strong></div>" +
|
|
"<div><span>首仓张数</span><strong>" +
|
|
fmt(data.first_contracts, 4) +
|
|
"</strong></div>" +
|
|
'<div><span>首仓止盈盈利</span><strong class="' +
|
|
pnlClass(data.first_profit_u) +
|
|
'">' +
|
|
fmtU(data.first_profit_u) +
|
|
"</strong></div>" +
|
|
"<div><span>首仓盈亏比</span><strong>" +
|
|
(data.first_rr != null ? fmt(data.first_rr, 2) + ":1" : "—") +
|
|
"</strong></div>" +
|
|
"</div>" +
|
|
renderTrendTable(data.rows);
|
|
}
|
|
|
|
function renderRollResult(data) {
|
|
const box = $("calc-roll-result");
|
|
if (!box) return;
|
|
box.classList.remove("hidden");
|
|
let table =
|
|
'<div class="calc-table-wrap"><table class="calc-table"><thead><tr>' +
|
|
"<th>阶段</th><th>入场/加仓价</th><th>统一止损</th><th>本次张数</th><th>累计张数</th><th>均价</th><th>止损亏损</th><th>止盈盈利</th><th>盈亏比</th>" +
|
|
"</tr></thead><tbody>";
|
|
(data.rows || []).forEach(function (r) {
|
|
const tag = r.already_done ? ' <span class="calc-done-tag">已完成</span>' : "";
|
|
table +=
|
|
"<tr>" +
|
|
"<td>" +
|
|
esc(r.label) +
|
|
tag +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmt(r.entry_or_add_price, 4) +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmt(r.stop_loss, 4) +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmt(r.add_contracts, 4) +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmt(r.total_contracts, 4) +
|
|
"</td>" +
|
|
"<td>" +
|
|
fmt(r.avg_entry, 4) +
|
|
"</td>" +
|
|
'<td class="calc-pnl-loss">' +
|
|
fmtU(-Math.abs(Number(r.loss_at_sl_u) || 0)) +
|
|
"</td>" +
|
|
'<td class="' +
|
|
pnlClass(r.profit_at_tp_u) +
|
|
'">' +
|
|
fmtU(r.profit_at_tp_u) +
|
|
"</td>" +
|
|
"<td>" +
|
|
(r.rr != null ? fmt(r.rr, 2) + ":1" : "—") +
|
|
"</td>" +
|
|
"</tr>";
|
|
});
|
|
table += "</tbody></table></div>";
|
|
box.innerHTML =
|
|
'<div class="calc-summary">' +
|
|
"<div><span>单次风险预算</span><strong>" +
|
|
fmt(data.risk_budget_u, 2) +
|
|
"U</strong></div>" +
|
|
"<div><span>首仓张数（自动）</span><strong>" +
|
|
fmt(data.first_contracts, 4) +
|
|
"</strong></div>" +
|
|
"<div><span>最终累计张数</span><strong>" +
|
|
fmt(data.final_contracts, 4) +
|
|
"</strong></div>" +
|
|
"<div><span>最终均价</span><strong>" +
|
|
fmt(data.final_avg_entry, 4) +
|
|
"</strong></div>" +
|
|
'<div><span>最终止盈盈利</span><strong class="' +
|
|
pnlClass(data.final_profit_at_tp_u) +
|
|
'">' +
|
|
fmtU(data.final_profit_at_tp_u) +
|
|
"</strong></div>" +
|
|
"<div><span>最终盈亏比</span><strong>" +
|
|
(data.final_rr != null ? fmt(data.final_rr, 2) + ":1" : "—") +
|
|
"</strong></div>" +
|
|
"</div>" +
|
|
table;
|
|
}
|
|
|
|
const MAX_ROLL_LEGS = 3;
|
|
let rollLegCount = 0;
|
|
|
|
function maxRollLegsAllowed() {
|
|
const done = num("calc-roll-legs-done") || 0;
|
|
return Math.max(0, MAX_ROLL_LEGS - done);
|
|
}
|
|
|
|
function syncRollAddBtn() {
|
|
const btn = $("calc-roll-add-leg");
|
|
if (!btn) return;
|
|
btn.disabled = rollLegCount >= maxRollLegsAllowed();
|
|
}
|
|
|
|
function rollLegRowHtml(index) {
|
|
return (
|
|
'<div class="calc-roll-leg" data-leg-index="' +
|
|
index +
|
|
'">' +
|
|
'<div class="calc-roll-leg-title">滚仓 ' +
|
|
index +
|
|
"</div>" +
|
|
'<div class="calc-roll-leg-grid">' +
|
|
'<label class="calc-field"><span>加仓价</span><input type="number" class="calc-roll-leg-add" min="0" step="any" required /></label>' +
|
|
'<label class="calc-field"><span>新统一止损</span><input type="number" class="calc-roll-leg-stop" min="0" step="any" required /></label>' +
|
|
"</div>" +
|
|
'<button type="button" class="ghost danger calc-roll-leg-remove">删除</button>' +
|
|
"</div>"
|
|
);
|
|
}
|
|
|
|
function renumberRollLegs() {
|
|
const list = $("calc-roll-legs-list");
|
|
if (!list) return;
|
|
const rows = list.querySelectorAll(".calc-roll-leg");
|
|
rollLegCount = rows.length;
|
|
rows.forEach(function (row, i) {
|
|
row.setAttribute("data-leg-index", String(i + 1));
|
|
const title = row.querySelector(".calc-roll-leg-title");
|
|
if (title) title.textContent = "滚仓 " + (i + 1);
|
|
});
|
|
syncRollAddBtn();
|
|
}
|
|
|
|
function addRollLegRow() {
|
|
if (rollLegCount >= maxRollLegsAllowed()) return;
|
|
const list = $("calc-roll-legs-list");
|
|
if (!list) return;
|
|
list.insertAdjacentHTML("beforeend", rollLegRowHtml(rollLegCount + 1));
|
|
rollLegCount += 1;
|
|
syncRollAddBtn();
|
|
}
|
|
|
|
function collectRollLegs() {
|
|
const legs = [];
|
|
document.querySelectorAll(".calc-roll-leg").forEach(function (row) {
|
|
const addEl = row.querySelector(".calc-roll-leg-add");
|
|
const stopEl = row.querySelector(".calc-roll-leg-stop");
|
|
const ap = addEl && addEl.value !== "" ? Number(addEl.value) : null;
|
|
const sl = stopEl && stopEl.value !== "" ? Number(stopEl.value) : null;
|
|
if (ap == null || sl == null || !Number.isFinite(ap) || !Number.isFinite(sl)) return;
|
|
legs.push({ add_price: ap, new_stop_loss: sl });
|
|
});
|
|
return legs;
|
|
}
|
|
|
|
function bindRollLegsUI() {
|
|
const addBtn = $("calc-roll-add-leg");
|
|
const list = $("calc-roll-legs-list");
|
|
const doneInput = $("calc-roll-legs-done");
|
|
if (addBtn && !addBtn._bound) {
|
|
addBtn._bound = true;
|
|
addBtn.addEventListener("click", addRollLegRow);
|
|
}
|
|
if (list && !list._bound) {
|
|
list._bound = true;
|
|
list.addEventListener("click", function (e) {
|
|
const btn = e.target.closest(".calc-roll-leg-remove");
|
|
if (!btn) return;
|
|
const row = btn.closest(".calc-roll-leg");
|
|
if (row) row.remove();
|
|
renumberRollLegs();
|
|
});
|
|
}
|
|
if (doneInput && !doneInput._bound) {
|
|
doneInput._bound = true;
|
|
doneInput.addEventListener("change", function () {
|
|
while (rollLegCount > maxRollLegsAllowed()) {
|
|
const rows = list && list.querySelectorAll(".calc-roll-leg");
|
|
if (rows && rows.length) rows[rows.length - 1].remove();
|
|
rollLegCount = list ? list.querySelectorAll(".calc-roll-leg").length : 0;
|
|
}
|
|
syncRollAddBtn();
|
|
});
|
|
}
|
|
syncRollAddBtn();
|
|
}
|
|
|
|
function showErr(boxId, msg) {
|
|
const box = $(boxId);
|
|
if (!box) return;
|
|
box.classList.remove("hidden");
|
|
box.innerHTML = '<p class="calc-error">' + esc(msg || "计算失败") + "</p>";
|
|
}
|
|
|
|
async function submitTrend(e) {
|
|
e.preventDefault();
|
|
const body = {
|
|
direction: ($("calc-trend-direction") && $("calc-trend-direction").value) || "long",
|
|
capital_usdt: num("calc-trend-capital"),
|
|
risk_percent: num("calc-trend-risk"),
|
|
leverage: num("calc-trend-leverage"),
|
|
entry_price: num("calc-trend-entry"),
|
|
stop_loss: num("calc-trend-sl"),
|
|
add_upper: num("calc-trend-add-upper"),
|
|
take_profit: num("calc-trend-tp"),
|
|
dca_legs: num("calc-trend-dca-legs") || 5,
|
|
contract_size: num("calc-trend-contract-size") || 1,
|
|
};
|
|
try {
|
|
const r = await fetch("/api/calculator/trend", {
|
|
method: "POST",
|
|
credentials: "same-origin",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify(body),
|
|
});
|
|
const j = await r.json();
|
|
if (!j.ok) {
|
|
showErr("calc-trend-result", j.msg || "计算失败");
|
|
return;
|
|
}
|
|
renderTrendResult(j.data);
|
|
} catch (err) {
|
|
showErr("calc-trend-result", String(err));
|
|
}
|
|
}
|
|
|
|
async function submitRoll(e) {
|
|
e.preventDefault();
|
|
const body = {
|
|
direction: ($("calc-roll-direction") && $("calc-roll-direction").value) || "long",
|
|
capital_usdt: num("calc-roll-capital"),
|
|
risk_percent: num("calc-roll-risk"),
|
|
entry_price: num("calc-roll-entry"),
|
|
stop_loss: num("calc-roll-sl"),
|
|
take_profit: num("calc-roll-tp"),
|
|
add_legs: collectRollLegs(),
|
|
legs_done: num("calc-roll-legs-done") || 0,
|
|
};
|
|
try {
|
|
const r = await fetch("/api/calculator/roll", {
|
|
method: "POST",
|
|
credentials: "same-origin",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify(body),
|
|
});
|
|
const j = await r.json();
|
|
if (!j.ok) {
|
|
showErr("calc-roll-result", j.msg || "计算失败");
|
|
return;
|
|
}
|
|
renderRollResult(j.data);
|
|
} catch (err) {
|
|
showErr("calc-roll-result", String(err));
|
|
}
|
|
}
|
|
|
|
function bindOnce() {
|
|
if (inited) return;
|
|
inited = true;
|
|
const trendForm = $("calc-trend-form");
|
|
const rollForm = $("calc-roll-form");
|
|
const dirSel = $("calc-trend-direction");
|
|
if (trendForm) trendForm.addEventListener("submit", submitTrend);
|
|
if (rollForm) rollForm.addEventListener("submit", submitRoll);
|
|
if (dirSel) {
|
|
dirSel.addEventListener("change", syncTrendAddLabel);
|
|
syncTrendAddLabel();
|
|
}
|
|
bindRollLegsUI();
|
|
}
|
|
|
|
window.hubCalculatorPage = {
|
|
init: bindOnce,
|
|
destroy: function () {},
|
|
};
|
|
})();
|