97 lines
2.5 KiB
HTML
97 lines
2.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ja">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>試算表</title>
|
|
<link rel="stylesheet" href="css/style.css" />
|
|
</head>
|
|
<body>
|
|
<h1>試算表</h1>
|
|
|
|
<label>
|
|
期間：
|
|
<input type="date" id="from" />
|
|
〜
|
|
<input type="date" id="to" />
|
|
</label>
|
|
<button onclick="loadTrialBalance()">表示</button>
|
|
|
|
<table id="trial-table">
|
|
<thead>
|
|
<tr>
|
|
<th>科目コード</th>
|
|
<th>科目名</th>
|
|
<th>期首</th>
|
|
<th>借方</th>
|
|
<th>贷方</th>
|
|
<th>期末</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
|
|
<h3>💰 当前资金状况</h3>
|
|
|
|
<table border="1" cellpadding="6" style="border-collapse: collapse">
|
|
<thead>
|
|
<tr style="background: #f5f5f5">
|
|
<th>账户</th>
|
|
<th style="text-align: right">余额</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="cashBalanceBody">
|
|
<tr>
|
|
<td colspan="2">读取中...</td>
|
|
</tr>
|
|
</tbody>
|
|
<tfoot>
|
|
<tr style="font-weight: bold">
|
|
<td>合计</td>
|
|
<td id="cashBalanceTotal" style="text-align: right">-</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
|
|
<script src="js/api.js"></script>
|
|
<script src="js/trial_balance.js"></script>
|
|
<script>
|
|
const API_BASE = "http://127.0.0.1:18080";
|
|
|
|
function formatYen(v) {
|
|
return "¥ " + Number(v).toLocaleString("ja-JP");
|
|
}
|
|
|
|
async function loadCashBalance() {
|
|
const body = document.getElementById("cashBalanceBody");
|
|
const totalEl = document.getElementById("cashBalanceTotal");
|
|
|
|
body.innerHTML = "<tr><td colspan='2'>读取中...</td></tr>";
|
|
totalEl.innerText = "-";
|
|
|
|
try {
|
|
const res = await fetch(`${API_BASE}/cash/balance`);
|
|
const data = await res.json();
|
|
|
|
body.innerHTML = "";
|
|
|
|
data.items.forEach((item) => {
|
|
const tr = document.createElement("tr");
|
|
tr.innerHTML = `
|
|
<td>${item.account_name}</td>
|
|
<td style="text-align:right;">${formatYen(item.balance)}</td>
|
|
`;
|
|
body.appendChild(tr);
|
|
});
|
|
|
|
totalEl.innerText = formatYen(data.total_balance);
|
|
} catch (e) {
|
|
body.innerHTML = `<tr><td colspan="2">读取失败</td></tr>`;
|
|
}
|
|
}
|
|
|
|
// 页面加载时自动读取
|
|
window.addEventListener("DOMContentLoaded", loadCashBalance);
|
|
</script>
|
|
</body>
|
|
</html>
|