招待が届きました

📋 目次

⚡ クイックアクション

🔀 ケース別フローチャート

A. Google Workspace でアカウント発行 推奨

前提

• 自社ドメイン (例: example.co.jp) で Google Workspace 契約済み
• 管理コンソール (admin.google.com) に社長・人事担当などの管理者がアクセスできる

管理者側の手順

1. 管理コンソールで新規ユーザー追加
   admin.google.com → ディレクトリ → ユーザー → 「新しいユーザーの追加」
   名 / 姓 / 主メール (例: tanaka.m@example.co.jp) を入力。
   部署・役職を「組織部門」に設定し、「メールでログイン情報を送信」を ON。
2. 組織のカレンダー共有を ON (1 回設定すれば全員に適用)
   管理コンソール → アプリ → Google Workspace → カレンダー → 共有設定
   外部共有: OFF (組織内のみ)
   内部共有: 「すべての予定の詳細を共有」 を選択
   これで @example.co.jp 同士は互いの予定の詳細が見える状態に。
3. 当アプリの STAFF マスターに追加
   app.js の STAFF 配列に新規メンバーの情報を追加。
   Phase 2 以降は employees テーブル(Supabase / Aurora)に INSERT。
4. 本人にログイン URL を送信

   Staff Manager: https://staff.example.co.jp/login.html
   発行された example.co.jp アカウントでサインインしてください。

本人側のアクション

1. 受信した招待メールから Google Workspace アカウントを有効化
2. 初回パスワードを設定
3. ブラウザで https://staff.example.co.jp/login.html を開く
4. 「Google でサインイン」ボタンをクリック
5. example.co.jp アカウントを選択 → 自動でログイン完了

B. 個人 Gmail で参加 業務委託向け

前提

• 業務委託契約者など、@example.co.jp を発行しないケース
• 個人 Gmail を使い続ける

管理者側の手順

1. 本人にメールで以下を依頼
   利用したい Gmail アドレスを教えてもらう。
   そのカレンダーを CEO のメール宛に共有してもらう (詳細は本人側ステップ 2)。
2. 当アプリの STAFF マスターに追加
   app.js の STAFF に email: 'xxx@gmail.com' で追加。
   calendarId も同じメアドで OK (Google カレンダーのデフォルト)。
3. 管理者のカレンダーアプリで「他のカレンダーを追加」
   calendar.google.com → 左メニュー「他のカレンダー」横の「+」 → 「カレンダーに登録」
   共有してもらったメンバーのメアドを入力 → カレンダー一覧に追加される。

本人側のアクション

1. Gmail / Google アカウントを準備
   既にお持ちのもので OK。
2. 自分の Google カレンダーを共有
   calendar.google.com を開く → 左メニュー「マイカレンダー」 → 自分のカレンダー → 三点リーダー → 「設定と共有」
   「特定のユーザーまたはグループと共有」 → 「ユーザーを追加」
   共有先: 管理者から案内された会社の管理用メールアドレス(社長・人事担当)
   権限: 「予定の詳細をすべて閲覧できる」 を選択 → 「送信」
3. 当アプリにログイン
   https://staff.example.co.jp/login.html を開く → 「Google でサインイン」 → 自分の Gmail を選択 → ログイン完了。

📆 カレンダーID の確認方法 (上書きしたい場合)

1. calendar.google.com → 左メニュー「マイカレンダー」 → 対象カレンダー → 「設定と共有」
2. 下にスクロール → 「カレンダーの統合」 → 「カレンダーID」をコピー
   例: c_abc123def456@group.calendar.google.com
3. 当アプリの「Google カレンダー」タブ → 「カレンダーID (上書き)」に貼り付けて保存

🚪 ログアウト・退職フロー

🛠 トラブルシュート

⚙️ OAuth Client ID 取得手順 (CTO/CEO 一回だけ実施)

1. console.cloud.google.com にログイン
2. プロジェクト作成: Staff Manager
3. Google Calendar API を有効化
   「APIとサービス」 → 「ライブラリ」 → Google Calendar API を検索 → 「有効にする」
4. 「APIとサービス」 → 「OAuth 同意画面」
   User Type: 内部 (Workspace 推奨。承認不要、外部監査なし)
   アプリ名: Staff Manager
   サポートメール: admin@example.co.jp
   スコープを追加:
   ・.../auth/userinfo.email
   ・.../auth/userinfo.profile
   ・openid
   ・.../auth/calendar.readonly ← これがカレンダー閲覧の権限
5. 「APIとサービス」 → 「認証情報」 → 「+ 認証情報を作成」 → 「OAuth クライアントID」
   種類: ウェブアプリケーション
   名前: Staff Manager Web
   承認済み JavaScript 生成元:
   ・開発時: http://127.0.0.1:4321
   ・本番: https://staff.example.co.jp
6. 発行された Client ID をコピー
   google-auth.js の GOOGLE_CLIENT_ID に貼り付け。

🗓 カレンダー閲覧の仕組み (個別共有設定が不要になる理由)

このアプリは Google Calendar API の calendar.readonly スコープ をログイン時に同時要求します。

各メンバーのログインフロー

1. 「Google でサインイン (カレンダー閲覧権限込み)」をクリック
2. Google の同意画面が開く

   Staff Manager がアクセスを要求しています:
   ✓ あなたのメールアドレス
   ✓ あなたの個人情報
   ✓ Googleカレンダーで予定を表示する  ← ここがポイント

3. 「許可」を押すと、当アプリは access_token を取得
4. 当アプリは個別の共有設定なしで、本人のカレンダーを直接 API 取得できる

管理者側 (CEO) が他メンバーのカレンダーを見る仕組み

CEO の access_token を使って https://www.googleapis.com/calendar/v3/calendars/{他メンバーのメアド}/events を叩く。これが成功するための条件:

組織カレンダー共有の設定 (人事担当・社長が一回だけ)

1. admin.google.com にログイン
2. アプリ → Google Workspace → カレンダー → 共有設定
3. 「外部共有オプション」: 制限なし (or 組織内のみ)
4. 「内部共有オプション」: すべての予定の詳細を共有 ← これが鍵
5. 保存