📝 実装注記
1. 画面構成
一覧・検索型テンプレートに準拠。パンくず→ページヘッダー→フィルタパネル(詳細絞り込み)→カテゴリクイックフィルタ(ピル型タブ)→お知らせ一覧テーブル→ページネーションの順で構成。スライドパネルは使用しない。一覧行クリックでWP標準投稿詳細ページ(F-TOP-008 お知らせ詳細)へ遷移する。サイドバーは設けず1カラム構成とする。
2. 権限制御
ログイン済みの全アカウント種別(法人管理者・事業所管理者・事業所アカウント・個人アカウント)が全お知らせを閲覧可能。アカウント種別による表示内容の差異はなし。非ログインの場合は、非ログイン公開フラグがONのお知らせのみ一覧・詳細を閲覧可能(メンテナンス・障害情報などの運用情報を想定。フラグOFFのお知らせへの非ログイン直アクセスは404)。公開フラグONのお知らせの最新3件はログイン画面(F-AUTH-001)のバナーにも表示。「重要」カテゴリのお知らせはログイン後のトップ画面でもバナー通知として表示する(F-TOP-001連携)。
3. データ表示
お知らせデータはWordPress標準投稿タイプ(`post`)で管理。カテゴリは標準 `category` タクソノミーの親カテゴリ `notice` 配下(固定の初期値リストは持たず事務局が管理画面から自由に追加・編集。重要・お知らせ・メンテナンス等のタブのカテゴリ名は例示)。非ログイン公開の可否はお知らせ単位の投稿メタ `lms_notice_is_public`(既定OFF・B-CNT-005の編集画面で設定)。未読/既読管理はPhase1対象外。一覧取得APIは `/wp-json/lms/v1/notices`。ダミーデータは2026年度(4月〜10月)を基準。
4. インタラクション
カテゴリクイックフィルタのピル型タブクリックで一覧をカテゴリ絞り込み(JS UIステート切替)。フィルタパネル「折りたたむ」ボタンでフィルタ本体の表示/非表示をトグル。一覧行全体がクリック可能(`cursor: pointer`)で、クリック時にお知らせ詳細ページへ遷移する。
5. レスポンシブ
PC表示(1200px)を基準設計。タブレット(768px以下)ではフィルタグリッドを3列→1列に変更し、カテゴリタブは横スクロール対応。スマホ(480px以下)ではタイトル列を2行折り返しで表示。ページネーションは現在ページ±1のみ表示する省略形式に切り替える。
6. パフォーマンス・セキュリティ
お知らせ総件数は年間数十件程度を想定。1ページ10件のサーバーサイドページネーションを適用し、REST APIでオフセット取得する。「重要」カテゴリのお知らせは全ページ共通ヘッダー領域にバナー表示するため、ログイン時にセッション単位でキャッシュ(WordPress Transients API、TTL: 300秒)して余分なDB参照を防ぐ。お知らせ取得API(一覧・詳細)はログイン必須としない。非ログインリクエストには非ログイン公開フラグがONのお知らせのみを返却し、フラグOFFのお知らせは一覧に含めず直アクセスも404とする(サーバー側でログイン状態を判定)。XSS対策としてお知らせ本文はWP標準の `wp_kses_post()` でサニタイズして出力する。
💡 本ワイヤーフレームはPC表示(1200px幅)を基準としています。タブレット・スマホ表示は別途レスポンシブ設計が必要です。