desktop/njts-accounting-core
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add minimal frontend (accounts, trial balance)

Browse Source
This commit is contained in:
admin
2025-12-13 23:27:38 +09:00
commit 446f17f21a
11 changed files with 149 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
frontend/README.md Normal file
View File

25
frontend/accounts.html Normal file
View File

@@ -0,0 +1,25 @@
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<title>科目マスタ</title>
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<h1>科目マスタ</h1>
<table border="1">
<thead>
<tr>
<th>コード</th>
<th>科目名</th>
<th>種別</th>
</tr>
</thead>
<tbody id="accounts-body"></tbody>
</table>
<script src="js/api.js"></script>
<script src="js/accounts.js"></script>
</body>
</html>

14
frontend/css/style.css Normal file
View File

@@ -0,0 +1,14 @@
body {
font-family: system-ui, -apple-system, BlinkMacSystemFont;
margin: 20px;
}
table {
margin-top: 10px;
border-collapse: collapse;
}
th,
td {
padding: 6px 10px;
}

16
frontend/index.html Normal file
View File

@@ -0,0 +1,16 @@
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<title>NJTS 会計システム</title>
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<h1>NJTS 会計システム</h1>
<ul>
<li><a href="accounts.html">科目マスタ</a></li>
<li><a href="trial-balance.html">試算表</a></li>
</ul>
</body>
</html>

18
frontend/js/accounts.js Normal file
View File

@@ -0,0 +1,18 @@
(async () => {
try {
const data = await apiGet("/accounts/");
const tbody = document.getElementById("accounts-body");
data.forEach((a) => {
const tr = document.createElement("tr");
tr.innerHTML = `
<td>${a.account_code}</td>
<td>${a.account_name}</td>
<td>${a.account_type}</td>
`;
tbody.appendChild(tr);
});
} catch (e) {
alert(e.message);
}
})();

10
frontend/js/api.js Normal file
View File

@@ -0,0 +1,10 @@
const API_BASE = "http://localhost:18080";
async function apiGet(path) {
const res = await fetch(`${API_BASE}${path}`);
if (!res.ok) {
const text = await res.text();
throw new Error(text || "APIエラー");
}
return res.json();
}

29
frontend/js/trial-balance.js Normal file
View File

@@ -0,0 +1,29 @@
document.getElementById("load").onclick = async () => {
const from = document.getElementById("from").value;
const to = document.getElementById("to").value;
if (!from || !to) {
alert("期間を指定してください");
return;
}
try {
const data = await apiGet(`/trial-balance?date_from=${from}&date_to=${to}`);
const tbody = document.getElementById("tb-body");
tbody.innerHTML = "";
data.accounts.forEach((a) => {
const tr = document.createElement("tr");
tr.innerHTML = `
<td>${a.account_name}</td>
<td style="text-align:right">${a.opening_balance}</td>
<td style="text-align:right">${a.debit}</td>
<td style="text-align:right">${a.credit}</td>
<td style="text-align:right">${a.closing_balance}</td>
`;
tbody.appendChild(tr);
});
} catch (e) {
alert(e.message);
}
};

0
frontend/pages/index.html Normal file
View File

0
frontend/pages/journals.html Normal file
View File

0
frontend/pages/reports.html Normal file
View File

37
frontend/trial-balance.html Normal file
View File

@@ -0,0 +1,37 @@
<!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" />
</label>
<label>
期末：
<input type="date" id="to" />
</label>
<button id="load">表示</button>
<table border="1">
<thead>
<tr>
<th>科目</th>
<th>期首</th>
<th>借方</th>
<th>貸方</th>
<th>期末</th>
</tr>
</thead>
<tbody id="tb-body"></tbody>
</table>
<script src="js/api.js"></script>
<script src="js/trial-balance.js"></script>
</body>
</html>