📅
このゼミは 2026年10月22日（火）10:00 に開催予定です。Zoom URLは開催30分前から表示されます。
📝 実装注記
1. 画面構成
メインカラム（約830px）＋ サイドバー（320px固定）の2カラムレイアウト、コンテンツ詳細型テンプレートに準拠。メインカラムは上から「開催ステータスアラート → ヒーローカード（Zoomビジュアル・開催情報グリッド・Zoom参加情報・自分の申込状況表示）→ アクションバー → ゼミ情報（タブ切替: 概要/資料）」の順。サイドバーは「受講状況パネル → 研修計画紐付け → 関連ゼミ」のスタック構成。サイドバーは position: sticky でスクロール追従。ページヘッダー右上に「← ゼミ一覧に戻る」ボタンを配置し、パンくずリストと併せて一覧画面（F-LIVE-001）への導線を強化。F-WEB-003（Web講義ページ）と同じ詳細型レイアウトを踏襲し、動画プレーヤー部分をZoom開催情報に置換した構成。
2. 権限制御
事業所アカウント・個人アカウント共通で閲覧可能。Zoom URLの表示はログイン済みユーザーかつ開催30分前〜開催終了後30分の時間帯に限定。それ以外の時間帯は「開催30分前から表示されます」のメッセージを表示。「受講しました！」ボタンは開催日以降のみ有効化し、開催前は非活性（disabled）表示。受講証明書ボタンも同様に開催日以降のみ有効化。お試し会員は有効期限内のみアクセス可能。事業所アカウントの場合、証明書フォームに受講者名・メールアドレスの手入力欄を追加表示（クライアント確認事項Q1参照）。
3. データ表示
LIVEゼミデータは lms_contents（content_type='live'）から取得（REST API: /wp-json/lms/v1/contents/{id}。管理UI層のカスタム投稿タイプ lms_live_seminar から同期）。開催情報は live_start_at／live_end_at／registration_deadline_at／event_status カラム。Zoom参加情報（ミーティングID・URL・パスコード）は別テーブル lms_content_zoom_secrets に暗号化保存し、申込済み受講者本人に開催30分前以降のみAPIで返却する。自分の申込状態は申込テーブル lms_seminar_registrations（F-LIVE-002 所有）の該当有無から判定する（定員・残席の概念は持たない）。申込時の任意メモ（note・自由記述）を含む。資料ファイルは lms_content_materials から取得。受講状況パネルは lms_completion_marks（受講しました！記録）と lms_certificates（証明書発行）の有無から表示する。関連ゼミは同一テーマから最大3件を開催日が近い順で取得。
4. インタラクション
「受講しました！」ボタン: ワンクリックでAjax送信 → ボタン状態を「受講済み✅」に変更（再クリックで取消不可）。「受講証明書」ボタン: モーダルダイアログを開き、フォーム入力→送信→PDFダウンロード。タブ切替: 概要/資料をJS切替。資料ファイルの「DL」ボタン: ファイルダウンロード（wp_get_attachment_url）。関連ゼミカード: クリックで該当ゼミの詳細ページに遷移（同じF-LIVE-002テンプレート）。研修計画名クリック: F-CORP-003 / F-SITE-003（研修計画一覧）に遷移。自分の申込状況表示は申込・キャンセル操作の都度更新される。申込時には任意の申込メモ（参加者の内訳・連絡事項など自由記述）を添えて送信できる。
5. レスポンシブ
PC表示（1200px幅）を基準設計。タブレット（768px以下）ではサイドバーをメインカラムの下に配置し1カラムに変更。ヒーローカードの開催情報グリッドは2列→1列に変更。スマホ（480px以下）ではアクションバーのボタンを縦積みに変更。受講状況パネルの4分割グリッドは2列×2行を維持。
6. パフォーマンス・セキュリティ
Zoom URLはサーバーサイドで時間帯判定を行い、条件を満たす場合のみAPIレスポンスに含める（開催30分前〜終了30分後）。それ以外の時間帯ではZoom URL、ミーティングID、パスコードをレスポンスから除外し、URLの不要な露出を防止。受講証明書のPDF生成はサーバーサイドで実行（mpdf / TCPDF等）。生成済みPDFはサーバーに保存し、再ダウンロード時はキャッシュを返却。証明書フォームにはCSRF保護（wp_nonce）を適用。「受講しました！」ボタンの連打防止（フロントサイドでdisable＋サーバーサイドで重複チェック）。自分の申込状態の判定は申込テーブル（lms_seminar_registrations）の該当有無を確認するのみで、COUNT集計は発生しない。申込は送信時点で即確定するため、定員超過を防ぐための排他制御は行わない（`UNIQUE` 制約で重複申込のみ防止）。お試し会員の有効期限チェックはミドルウェアで実施。
💡 本ワイヤーフレームはPC表示（1200px幅）を基準としています。タブレット・スマホ表示は別途レスポンシブ設計が必要です。