Scan to open on your phone
Point a camera at the QR code - it opens this exact paste, no app needed.
https://codepastes.com/zzgspabqc6np1vvr無題HTML
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>クラスポイント 管理者マニュアル ver.1.0</title>
<style>
:root{
--bg:#f6f7fb;
--card:#ffffff;
--text:#1f2937;
--muted:#6b7280;
--primary:#2563eb;
--primary-soft:#e8efff;
--warn:#b45309;
--warn-bg:#fff7ed;
--danger:#b91c1c;
--danger-bg:#fef2f2;
--ok:#047857;
--ok-bg:#ecfdf5;
--border:#e5e7eb;
--radius:14px;
}
*{box-sizing:border-box}
body{
margin:0;
font-family:"Hiragino Sans","Noto Sans JP",Meiryo,sans-serif;
background:var(--bg);
color:var(--text);
line-height:1.7;
}
header{
background:linear-gradient(135deg,#1d4ed8,#2563eb);
color:#fff;
padding:28px 18px 22px;
}
.wrap{max-width:960px;margin:0 auto;padding:0 16px}
header h1{margin:0;font-size:1.7rem}
header p{margin:8px 0 0;opacity:.9;font-size:.95rem}
.search-box{
margin-top:18px;
display:flex;
gap:8px;
}
.search-box input{
flex:1;
padding:12px 14px;
border:none;
border-radius:10px;
font-size:1rem;
}
main{padding:20px 0 60px}
nav{
background:var(--card);
border:1px solid var(--border);
border-radius:var(--radius);
padding:16px;
margin-bottom:18px;
}
nav h2{margin:0 0 10px;font-size:1.05rem}
nav ol{
margin:0;
padding-left:20px;
columns:2;
column-gap:24px;
}
nav li{margin:4px 0}
nav a{color:var(--primary);text-decoration:none}
nav a:hover{text-decoration:underline}
section{
background:var(--card);
border:1px solid var(--border);
border-radius:var(--radius);
padding:18px;
margin-bottom:16px;
scroll-margin-top:16px;
}
h2{
margin:0 0 12px;
font-size:1.25rem;
display:flex;
align-items:center;
gap:8px;
}
h3{margin:18px 0 8px;font-size:1.05rem}
p{margin:8px 0}
ul{margin:8px 0;padding-left:20px}
li{margin:4px 0}
table{
width:100%;
border-collapse:collapse;
margin:10px 0;
font-size:.95rem;
}
th,td{
border:1px solid var(--border);
padding:9px 10px;
text-align:left;
vertical-align:top;
}
th{background:#f3f4f6;font-weight:700}
.tag{
display:inline-block;
font-size:.78rem;
font-weight:700;
padding:2px 8px;
border-radius:999px;
background:var(--primary-soft);
color:var(--primary);
white-space:nowrap;
}
.warn{
background:var(--warn-bg);
border-left:4px solid var(--warn);
padding:12px 14px;
border-radius:8px;
margin:12px 0;
}
.danger{
background:var(--danger-bg);
border-left:4px solid var(--danger);
padding:12px 14px;
border-radius:8px;
margin:12px 0;
}
.ok{
background:var(--ok-bg);
border-left:4px solid var(--ok);
padding:12px 14px;
border-radius:8px;
margin:12px 0;
}
.secret{
font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
background:#f3f4f6;
padding:2px 6px;
border-radius:6px;
word-break:break-all;
}
details{
border:1px solid var(--border);
border-radius:10px;
background:#fafafa;
padding:10px 14px;
margin:8px 0;
}
summary{
cursor:pointer;
font-weight:700;
}
.hidden{display:none !important}
.no-result{
display:none;
background:var(--card);
border:1px dashed var(--border);
border-radius:var(--radius);
padding:18px;
text-align:center;
color:var(--muted);
}
footer{
text-align:center;
color:var(--muted);
font-size:.85rem;
padding:20px 16px 40px;
}
@media (max-width:640px){
nav ol{columns:1}
header h1{font-size:1.4rem}
table{font-size:.88rem}
th,td{padding:7px 8px}
}
</style>
</head>
<body>
<header>
<div class="wrap">
<h1>クラスポイント 管理者マニュアル</h1>
<p>システム仕様 / 運用ガイド / トラブルシューティング<br>ver. 1.0 ／ 2026年10月</p>
<div class="search-box">
<input id="search" type="search" placeholder="マニュアル内を検索（例：手数料、ローン、期限切れ）">
</div>
</div>
</header>
<main class="wrap">
<nav id="toc">
<h2>目次</h2>
<ol>
<li><a href="#overview">システム概要</a></li>
<li><a href="#admin">管理者アカウント</a></li>
<li><a href="#accounts">初期登録アカウント</a></li>
<li><a href="#screens">画面構成と使い方</a></li>
<li><a href="#logic">ビジネスロジック</a></li>
<li><a href="#trouble">トラブルシューティング</a></li>
<li><a href="#operation">運用上の注意</a></li>
</ol>
</nav>
<div id="no-result" class="no-result">
検索語に一致する項目は見つかりませんでした。
</div>
<section id="overview" data-keywords="概要 システム localStorage バース サーバー不要">
<h2>1. システム概要</h2>
<p><strong>クラスポイント</strong>は、ブラウザの <span class="secret">localStorage</span> のみを使って動作する、シングルファイルのWebアプリです。サーバーは不要で、スマートフォンやタブレットのブラウザに保存して利用できます。データは端末・ブラウザごとに独立して保存されます。<span class="tag">localStorage</span></p>
<h3>通貨単位</h3>
<p>すべての金額は <strong>バース</strong> を単位として扱います。</p>
<h3>主な機能</h3>
<ul>
<li>ユーザー登録・ログイン（個人口座 / 会社口座）</li>
<li>送金リクエストの作成・承認・拒否・キャンセル</li>
<li>独自の送金パスワードによる受取確認</li>
<li>利子付きローン（借入・任意返済・自動回収）</li>
<li>取引履歴の自動記録・閲覧</li>
<li>ユーザーからの意見・要望の受信箱（assar専用）</li>
</ul>
<h3>技術的な特徴</h3>
<ul>
<li>HTML / CSS / JavaScript を1ファイルに統合</li>
<li>外部ライブラリ不使用（バニラJavaScriptのみ）</li>
<li>localStorage によるデータ永続化</li>
<li>モバイルファーストのレスポンシブデザイン</li>
<li>画面切り替えは <span class="secret">display: none</span> で制御</li>
</ul>
</section>
<section id="admin" data-keywords="管理者 assar パスワード 特権 無限 受信箱">
<h2>2. 管理者アカウント</h2>
<div class="danger">
<strong>重要：</strong>以下の管理者情報は紛失しないよう厳重に保管してください。パスワードはシステム上で変更できません。
</div>
<table>
<tr><th>項目</th><th>値</th></tr>
<tr><td>管理者ユーザー名</td><td><span class="secret">assar</span></td></tr>
<tr><td>管理者パスワード</td><td><span class="secret">35619021157568127803</span></td></tr>
</table>
<h3>assarアカウントの特権</h3>
<ul>
<li>残高は <strong>∞（無限）バース</strong></li>
<li>送金・返済の回収先として機能</li>
<li>マイページに受信箱（意見・要望一覧）を表示</li>
<li>全ユーザーからの意見を閲覧・既読管理</li>
<li>送金されても残高は常に ∞ のまま</li>
</ul>
</section>
<section id="accounts" data-keywords="初期登録 アカウント 山崎銀行 テスト 初期残高 1000">
<h2>3. 初期登録アカウント</h2>
<p>アプリ初回起動時、またはデータ再構築時に、以下のアカウントが自動登録されます。</p>
<table>
<tr><th>ユーザー名</th><th>パスワード</th><th>口座種別</th><th>初期残高</th></tr>
<tr><td>assar</td><td><span class="secret">35619021157568127803</span></td><td>会社口座</td><td>∞ バース</td></tr>
<tr><td>山崎銀行</td><td><span class="secret">38899450270594177294</span></td><td>会社口座</td><td>1,000 バース</td></tr>
<tr><td>テスト</td><td><span class="secret">1827539</span></td><td>個人</td><td>1,000 バース</td></tr>
</table>
<div class="warn">
<strong>注意：</strong>新規口座の初期付与残高は <strong>1,000 バース</strong> です。<strong>assar</strong> と <strong>山崎銀行</strong> は運用に必要な特殊アカウントのため、削除しないでください。
</div>
</section>
<section id="screens" data-keywords="画面 使い方 ログイン 新規口座 マイページ 送金 受取 ローン 履歴 意見">
<h2>4. 画面構成と使い方</h2>
<p>すべての画面は独立したセクションとして構成され、常に1画面のみ表示されます。</p>
<details open>
<summary>4.1 ウェルカム画面 / ログイン / 新規口座作成</summary>
<h3>ウェルカム画面</h3>
<p>アプリ起動時に表示されます。「ログインする」「新規口座を作る」の2つのボタンがあります。</p>
<h3>ログイン画面</h3>
<p>ユーザー名とパスワードを入力してログインします。空欄は許可されません。</p>
<h3>新規口座作成画面</h3>
<p>ユーザー名・パスワード・口座種別（個人 / 会社）を入力して登録します。既存ユーザー名との重複や空欄はエラーになります。登録時には初期残高 <strong>1,000 バース</strong> が付与されます。</p>
</details>
<details>
<summary>4.2 マイページ</summary>
<p>ログイン後のメイン画面です。</p>
<table>
<tr><th>表示項目</th><th>説明</th></tr>
<tr><td>通知センター</td><td>未受取送金件数、返済期限3日以内の警告、滞納通知、期限切れ送金リクエスト件数を表示</td></tr>
<tr><td>ユーザー情報</td><td>ユーザー名、口座種別、現在残高（assarは∞バース）</td></tr>
<tr><td>画面遷移ボタン</td><td>送金申請、受取確認、ローン、取引履歴、意見送信へ移動</td></tr>
<tr><td>ローンボタン</td><td>assar・山崎銀行・信用度lowの場合は非表示</td></tr>
<tr><td>送信中のリクエスト</td><td>自分が送ったPending状態の送金一覧。キャンセル可能</td></tr>
<tr><td>借入ステータス</td><td>残り元金、残り利子、返済総額、返済期限、信用度を表示</td></tr>
<tr><td>受信箱</td><td>assar専用。全ユーザーの意見・要望を一覧表示</td></tr>
<tr><td>ログアウト</td><td>ログアウトしてウェルカム画面へ戻る</td></tr>
</table>
</details>
<details>
<summary>4.3 送金申請 / 確認 / 受取確認</summary>
<h3>送金申請画面</h3>
<ul>
<li>宛先ユーザー名、送金額、メモ（任意）、送金パスワードを入力</li>
<li>存在しない宛先、自分自身への送金、残高超過、0バース以下は禁止</li>
</ul>
<h3>送金確認画面</h3>
<p>入力内容を再確認して送信します。「修正する」で申請画面に戻れます。</p>
<h3>受取確認画面</h3>
<ul>
<li>自分宛の送金リクエスト一覧を表示</li>
<li>承認時は送金パスワードの入力が必須</li>
<li>パスワードが一致した場合のみ受取完了</li>
<li>承認・拒否後はボタンが無効化</li>
</ul>
<h3>送金リクエストの状態</h3>
<table>
<tr><th>状態</th><th>説明</th></tr>
<tr><td>Pending</td><td>送信中。受取側の承認・拒否待ち。有効期限は作成から7日間</td></tr>
<tr><td>Completed</td><td>承認・受取完了</td></tr>
<tr><td>Rejected</td><td>受取側が拒否</td></tr>
<tr><td>Expired</td><td>7日以内に承認・拒否されず期限切れ</td></tr>
<tr><td>Cancelled</td><td>送金側がキャンセル</td></tr>
</table>
</details>
<details>
<summary>4.4 ローン画面（借入 / 返済）</summary>
<h3>借入タブ</h3>
<ul>
<li>借入額と返済期限（日数）を入力</li>
<li>固定10%の利子が加算され、返済総額をリアルタイム表示</li>
<li>未返済の借入がある場合や信用度lowの場合は新規借入不可</li>
</ul>
<h3>返済タブ</h3>
<ul>
<li>残り元金、残り利子、返済総額、返済期限を表示</li>
<li>返済額を入力して任意返済が可能</li>
<li>返済額は元金回収分と利子回収分に按分され、内訳をリアルタイム表示</li>
</ul>
</details>
<details>
<summary>4.5 取引履歴 / 意見送信</summary>
<h3>取引履歴画面</h3>
<p>送金・受取・借入・返済・手数料・強制回収・キャンセルの全取引を、日時の新しい順に表示します。種別・相手名・金額・メモ・実行後残高が記録されます。</p>
<h3>意見送信画面</h3>
<p>内容を入力して送信します。空欄は禁止です。送信された意見は assar の受信箱に届きます。</p>
</details>
</section>
<section id="logic" data-keywords="手数料 ローン 利子 返済 自動回収 信用度 意見 受信箱">
<h2>5. ビジネスロジック</h2>
<h3>5.1 手数料ルール</h3>
<table>
<tr><th>送金の種類</th><th>手数料</th></tr>
<tr><td>assar → 一般口座</td><td>受取側から自動的に <strong>100バース</strong> 徴収。残高が100バース未満ならスキップ。徴収分は山崎銀行へ加算</td></tr>
<tr><td>個人 → assar</td><td>手数料なし。assarの残高は∞のまま変化しない</td></tr>
</table>
<h3>5.2 ローン・返済・自動回収</h3>
<details open>
<summary>借入時</summary>
<ul>
<li>元金が借り手の口座に付与される</li>
<li>利子 ＝ 元金 × 0.1（固定10%）</li>
<li>返済総額 ＝ 元金 ＋ 利子</li>
<li>返済期限 ＝ 現在日時 ＋ 入力した日数</li>
<li>元金残高と利子残は別々に管理</li>
</ul>
</details>
<details>
<summary>任意返済（繰上返済）</summary>
<ul>
<li>期限前でもいつでも返済可能</li>
<li>利子回収分 ＝ 返済額 ×（利子 ÷ 返済総額）、小数点以下切り捨て</li>
<li>元金回収分 ＝ 返済額 − 利子回収分</li>
<li>元金回収分は assar へ、利子回収分は山崎銀行へ</li>
<li>返済総額が0以下になると完済し、信用度は high に復帰</li>
</ul>
</details>
<details>
<summary>自動回収（期限超過時）</summary>
<ul>
<li>マイページ表示時に返済期限をチェック</li>
<li>期限超過で信用度を low にし、新規借入をブロック</li>
<li>口座残高から最低100バースを残し、余剰分を強制回収</li>
<li>回収分は任意返済と同じ方法で元金・利子に按分</li>
<li>元金回収分は assar へ、利子回収分は山崎銀行へ移動</li>
<li>全額返済で信用度は high に自動復帰</li>
</ul>
</details>
<h3>5.3 意見・要望の受信箱</h3>
<ul>
<li>一般ユーザーの意見は localStorage の <span class="secret">feedback</span> 配列に保存</li>
<li>assarでログインした場合のみ受信箱を表示</li>
<li>未読件数をバッジで表示</li>
<li>未読の意見は太字・背景色で強調</li>
<li>「確認済みにする」で既読にできる</li>
<li>assar以外のユーザーには受信箱を完全に非表示</li>
</ul>
</section>
<section id="trouble" data-keywords="トラブル エラー データ消失 ログインできない 承認されない ローンボタン マイナス 通知">
<h2>6. トラブルシューティング</h2>
<table>
<tr><th>症状</th><th>原因</th><th>対処法</th></tr>
<tr>
<td>データが消えた / 初期状態に戻った</td>
<td>キャッシュ削除、プライベートモード、端末変更</td>
<td>localStorageは端末・ブラウザごとに独立。事前にデータをエクスポート・バックアップする</td>
</tr>
<tr>
<td>ログインできない</td>
<td>パスワード入力ミス、localStorage破損</td>
<td>パスワードを再確認。破損時は初期データへ再構築されるため、assarで再ログイン可能</td>
</tr>
<tr>
<td>送金リクエストが承認されない</td>
<td>送金パスワード不一致、期限切れ</td>
<td>正しい送金パスワードを確認。7日超過の場合は再送金が必要</td>
</tr>
<tr>
<td>ローンボタンが表示されない</td>
<td>assar・山崎銀行アカウント、または信用度low</td>
<td>assar・山崎銀行はローン不可。信用度lowの場合は返済完了後に復帰を待つ</td>
</tr>
<tr>
<td>残高がマイナスになった</td>
<td>バグ（本来はバリデーションで防止）</td>
<td>ブラウザコンソールでエラーを確認。localStorageの手動修正または初期化で対応</td>
</tr>
<tr>
<td>通知が消えない</td>
<td>未受取送金や滞納が残っている</td>
<td>受取確認画面で未受取を確認、またはローン返済を完了させる</td>
</tr>
</table>
</section>
<section id="operation" data-keywords="運用 注意 セキュリティ バックアップ 制限 管理者 役割">
<h2>7. 運用上の注意事項</h2>
<h3>データの永続性</h3>
<div class="warn">
localStorageのデータは、ブラウザのキャッシュ削除や端末変更で失われる可能性があります。重要な取引記録は、定期的にスクリーンショットやメモで保存してください。
</div>
<p>localStorageはブラウザ内にデータを保存し、ブラウザを閉じても原則として保持されます。ただし、保存先は端末・ブラウザ・オリジンごとに分かれます。[3][5]</p>
<h3>セキュリティ</h3>
<ul>
<li>assarのパスワードは変更不可のため、第三者に知られないよう厳重管理する</li>
<li>共有端末では使用後に必ずログアウトする</li>
<li>送金パスワードは受取側に伝える必要があるが、第三者への漏洩に注意する</li>
</ul>
<div class="danger">
<strong>補足：</strong>localStorageは同一オリジンのJavaScriptからアクセス可能なため、機密情報の保存には注意が必要です。共有端末・不特定多数が使う端末では特にログアウトを徹底してください。[3][10]
</div>
<h3>制限事項</h3>
<ul>
<li>同一端末・同一ブラウザ内でのみデータを共有</li>
<li>複数人が同時操作すると整合性が崩れる可能性</li>
<li>シークレットモードではデータが保存されない</li>
<li>外部通信を行わないため、リモート復元は不可</li>
</ul>
<h3>管理者（assar）の役割</h3>
<ul>
<li>受信箱で全ての意見・要望を確認し、対応を検討する</li>
<li>ローンの元金回収先として機能する</li>
<li>手数料・自動回収の仕組みを理解し、ユーザーへ説明できるようにする</li>
</ul>
<div class="ok">
<strong>本マニュアルについて</strong><br>
本ページは「クラスポイント」ver. 1.0 の仕様に基づいています。動作確認や不具合報告は、マイページの「意見・要望を送る」から assar の受信箱へ送信してください。
</div>
</section>
</main>
<footer>
クラスポイント 管理者マニュアル ／ ver. 1.0 ／ 2026年10月
</footer>
<script>
const input = document.getElementById('search');
const sections = Array.from(document.querySelectorAll('section'));
const noResult = document.getElementById('no-result');
input.addEventListener('input', () => {
const q = input.value.trim().toLowerCase();
let visible = 0;
sections.forEach(sec => {
const text = (sec.textContent + ' ' + (sec.dataset.keywords || '')).toLowerCase();
const match = !q || text.includes(q);
sec.classList.toggle('hidden', !match);
if (match) visible++;
});
document.getElementById('toc').classList.toggle('hidden', !!q);
noResult.style.display = visible === 0 ? 'block' : 'none';
});
</script>
</body>
</html>13,810 chars · codepastes.com