# 社員旅行 点呼管理

スマートフォンで班ごとの出席を記録し、16チェックポイントの進行を管理するWebアプリです。実際の社員名簿とチェックポイント名は含めていません。設定後、管理画面からExcel名簿を読み込み、名称を入力して使います。

## 実装方式

- **Web画面**：HTML / CSS / JavaScript の静的ページです。ビルド工程はありません。
- **ログイン・共有データ**：Supabase Auth と PostgreSQL を使います。各幹事はメールアドレスとパスワードでログインします。
- **班ごとの権限**：班1・班2の割り当てをデータベースで確認します。担当幹事は自分の班だけ、管理者は両班を確認できます。認証と行単位のデータ権限を組み合わせる方式は、[Supabase Auth](https://supabase.com/docs/guides/auth) と [Row Level Security](https://supabase.com/docs/guides/database/postgres/row-level-security) の仕組みに沿っています。
- **ホスティング**：静的サイトを配信できる Cloudflare Pages を想定しています。アカウントがあれば、ダッシュボードの Direct Upload からフォルダまたはZIPを公開できます（[Cloudflare Pages Direct Upload](https://developers.cloudflare.com/pages/get-started/direct-upload/)）。
- **Excel読込**：`.xlsx`、`.xls`、`.csv` をブラウザ内で解析します。ワークブックのデータを別サービスへアップロードする処理はありません。Excel読込ライブラリは[公式CDN版](https://docs.sheetjs.com/docs/getting-started/installation/standalone/)から取得します。

点呼内容は班とチェックポイントの組み合わせごとに独立しています。チェックを付けると「入力中」として保存され、「完了して保存」を押すまで点呼は確定しません。完了済みを修正するときは明示的に再開し、修正前の完了内容を履歴に残します。保存時には版番号を照合するため、別端末で先に更新された内容を無言で上書きしません。

履歴CSVには完了保存と修正再開の内容・日時・操作者が記録されます。入力中の各タップは履歴イベントとしては追加せず、現在の下書きに反映します。

## 使い始める手順

### 1. Supabaseプロジェクトを用意する

1. Supabaseで新しいプロジェクトを作成し、旅行の利用期間に合ったデータ保管地域を選びます。社員名・点呼結果を保存するので、会社の情報管理ルールに沿ったサービス利用・保管地域を選んでください。
2. Supabase Dashboard の **SQL Editor** で `supabase-setup.sql` の内容を実行します。
4. **Authentication > Users** で最初の管理者アカウントを作成します。公開サインアップは無効にし、管理者が招待したアカウントだけで運用してください。
5. Auth Users一覧から管理者のユーザーID（UUID）を確認し、SQL Editorで割り当てます。

```sql
insert into public.app_users (user_id, role, group_no, display_name)
values ('ここにユーザーID', 'admin', null, '管理者');
```

5. **Authentication > URL Configuration** のSite URLを公開URLに設定し、Redirect URLsにも公開URL（`https://<プロジェクト名>.pages.dev/**`）を追加します。招待やパスワード再設定メールからアプリへ戻るために必要です。

6. プロジェクトの **Project Settings > API Keys** からProject URLと **publishable key** を確認します。古い画面で `anon` key と表示される場合は、その公開用キーを使います。`secret` / `service_role` key はブラウザに入力しないでください。

### 2. ログイン画面を接続する

`config.js` を開き、次の2つを設定します。

```js
window.ROLLCALL_CONFIG = {
  supabaseUrl: "https://プロジェクトID.supabase.co",
  supabasePublishableKey: "sb_publishable_..."
};
```

publishable keyはブラウザで使う公開キーです。名簿・点呼データの保護はデータベースの権限設定で行います。secret / service_role keyはRLSを迂回するため、絶対に画面のファイルやブラウザに置かないでください（[Supabaseのデータ保護ガイド](https://supabase.com/docs/guides/database/secure-data)）。

### 3. Webページを公開する

アプリ一式のZIPを解凍し、`config.js` を設定してから、Cloudflareの **Workers & Pages > Create application > Get started > Drag and drop your files** でフォルダまたはZIPをアップロードします。公開後に発行される `https://<プロジェクト名>.pages.dev` のURLを幹事に共有します。PagesのDirect Uploadは手動で再公開する方式です。継続的に更新する場合は、最初からGit連携を選んでください。詳しくは[公式手順](https://developers.cloudflare.com/pages/get-started/direct-upload/)を参照してください。

外部からSupabaseとライブラリCDNにアクセスできるHTTPS接続が必要です。スマートフォンで使うときは、公開URLをSafari / Chromeで開きます。URLを知っているだけではデータを見られず、割り当て済みアカウントでのログインが必要です。

### 4. 班1・班2の幹事を登録する

管理者がSupabase Dashboard の **Authentication > Users** から幹事を招待し、招待したユーザーIDを `app_users` に割り当てます。

```sql
-- 班1の幹事
insert into public.app_users (user_id, role, group_no, display_name)
values ('班1幹事のユーザーID', 'coordinator', 1, '幹事の表示名');

-- 班2の幹事
insert into public.app_users (user_id, role, group_no, display_name)
values ('班2幹事のユーザーID', 'coordinator', 2, '幹事の表示名');
```

同じ幹事を別の班へ割り当てる場合は、既存行を `update public.app_users set group_no = 2 where user_id = 'ユーザーID';` のように変更します。管理者が幹事へ公開URLを共有し、幹事本人が招待メールの手順でパスワードを設定します。

### 5. Excel名簿と点呼名を設定する

1. 管理者でログインし、**設定・名簿** を開きます。
2. Excel / CSVを選び、シート・氏名・班・社員番号の列を指定します。班列がない場合は、ファイル全員を班1または班2に割り当てられます。
3. プレビューの人数を確認し、追加・更新、班別置き換え、両班置き換えのいずれかを選びます。置き換えは確認画面が出ます。
4. 16個のチェックポイント名を実際の予定に合わせて編集し、名称を保存します。

取り込む列は社員番号・氏名・班です。社員番号を使わない場合は「班＋氏名」を照合キーにします。同姓同名の方がいる場合は、社員番号列を使ってください。過去の点呼には保存時点の名簿スナップショットが残ります。

## 当日の操作

1. 幹事はログインし、チェックポイントを選びます。班はログイン中の担当班に固定されています。
2. 名簿の名前をタップして出席を付けます。出席人数・全体人数・未確認者が画面に表示され、入力中の内容は自動保存されます。
3. 未確認者を確認してから **この点呼を完了して保存** を押します。未確認者が残っていても、確認ダイアログで了承すれば完了を記録できます。
4. 次のチェックポイントへ移動します。各点呼は独立しているので、前のチェックは引き継がれません。
5. 管理者は **全体状況** で32枠（16か所×2班）を見渡し、点呼結果と変更履歴をCSV出力できます。

## 運用上の注意

- オフラインでは保存できません。画面に保存エラーが出た場合は、通信回復後に再試行してください。
- 同じ班・同じチェックポイントを複数端末から同時に触ることはできますが、先に保存した端末の版番号により、後からの古い更新は拒否されます。最新の記録を読み込み、必要な変更をやり直してください。
- Excel読込用ライブラリをCDNから取得するため、初回表示時にインターネット接続が必要です。Excelファイル自体はブラウザ内で解析され、サーバーへアップロードされません。
- 公開するアプリのソースには顧客名簿を含めないでください。`config.js` に入れるのはURLとpublishable keyだけです。

## ファイル

- `index.html`、`styles.css`、`app.js`：スマートフォン対応の点呼アプリ
- `config.js`：Supabase接続先
- `supabase-setup.sql`：テーブル、認証権限、点呼保存処理の初期設定
- `roster-template.csv`：列名だけの名簿テンプレート