WorkOrder Pro - 製造現場向け作業指示書・工程管理システム

## 1. アプリの目的・ターゲットユーザー
製造業の中小工場・町工場において、口頭や紙ベースで行われている作業指示を電子化し、作業指示書の発行から工程別進捗管理・完了報告までをブラウザ一本で完結させるシステム。現場リーダー・生産管理担当・工場長が主なターゲット。スマホからも入力できるため、現場作業者が進捗をその場で更新できる。

---

## 2. 主要機能
- **作業指示書の作成・発行**: 製品名・品番・数量・工程・担当者・開始/完了予定日・注意事項・添付図面コメントを入力してA4印刷可能な指示書を生成。指示書番号は自動採番（WO-YYYYMMDD-001形式）
- **工程別ステータス管理**: 「指示待ち→作業中→検査中→完了→保留」の5ステータスをボタン操作で遷移。現場担当者がスマホから自分の担当工程のみ更新可能
- **ダッシュボード（カンバン表示）**: 指示書をステータス列に分けたカンバンボード形式で一覧表示。フィルター（担当者・工程・製品名・期限）で絞り込み。期限超過は赤色で警告
- **実績入力**: 作業開始・完了時刻の打刻、実際の完成数量・不良数量の入力、作業コメントを記録。工数実績を自動集計
- **帳票出力**: 作業指示書PDF相当の印刷レイアウト、日次・週次の作業実績一覧CSV出力、工程別稼働率サマリーの印刷
- **マスタ管理**: 製品マスタ（品番・品名・標準工程）、担当者マスタ（氏名・部署・担当工程）、工程マスタ（工程コード・工程名・標準工数）を管理者が登録・編集

---

## 3. 画面構成

### ① ダッシュボード（トップ）
- 5列カンバンボード（ステータス別）で全指示書をカード表示
- 各カード：指示書番号・製品名・数量・担当者・期限・経過時間バー
- 上部に「本日完了件数 / 作業中件数 / 遅延件数」のサマリーバッジ
- 右上に「＋新規作業指示」ボタン

### ② 作業指示書 作成・編集画面
- フォーム形式：製品マスタから品番を選択→品名・標準工程が自動補完
- 工程を複数行追加可能（工程順・担当者・予定工数を設定）
- 特記事項・品質注意点のテキストエリア
- 「下書き保存」「確定・発行」「印刷プレビュー」ボタン

### ③ 作業指示書 詳細・進捗画面
- 上部に指示書ヘッダー情報（固定表示）
- 工程ごとのタイムライン表示：担当者・予定工数・実績工数・ステータスバッジ
- 各工程に「開始打刻」「完了打刻」「実績入力」「コメント追加」ボタン
- 現場担当者が自分の工程だけ操作できるよう工程フィルタリング（担当者名入力のみで絞込）

### ④ 実績・集計画面
- 日付範囲・製品・担当者でフィルタした実績一覧テーブル
- 集計：総指示件数・完了率・平均リードタイム・工程別稼働時間・不良率
- 棒グラフ（Chart.jsで実装）：日別完了件数・工程別稼働時間
- CSV出力ボタン

### ⑤ マスタ管理画面（管理者用）
- タブ切替：製品マスタ / 工程マスタ / 担当者マスタ
- 各マスタのCRUDテーブル（インライン編集）

### ⑥ 印刷用作業指示書レイアウト
- 画面非表示・印刷専用のA4縦レイアウト
- ヘッダー：会社名・指示書番号・発行日・QRコード（指示書URLエンコード）
- 工程一覧テーブル・注意事項・承認欄

---

## 4. データ構造（DBテーブル概要）

```sql
-- 製品マスタ
products (id, code, name, unit, notes, created_at)

-- 工程マスタ
processes (id, code, name, standard_hours, sort_order)

-- 担当者マスタ
workers (id, name, department, process_ids_json, active)

-- 作業指示書ヘッダー
work_orders (
id, wo_number, product_id, quantity,
status, -- 0:下書き 1:発行 2:完了 3:保留
planned_start, planned_end, actual_end,
notes, issued_by, created_at, updated_at
)

-- 作業指示書 工程明細
wo_processes (
id, wo_id, process_id, worker_id, sort_order,
planned_hours, status, -- 0:待機 1:作業中 2:検査中 3:完了
started_at, completed_at, actual_hours,
good_qty, ng_qty, comment
)

-- 作業ログ（打刻履歴）
wo_logs (
id, wo_process_id, action, -- start/complete/comment/status_change
worker_name, memo, created_at
)
```

---

## 5. デザインの方向性
- **カラーテーマ**: 工場・現場感のあるダークネイビー（#1a2940）をサイドバーに、ホワイト背景のメインコンテンツエリア。アクセントはオレンジ（#f97316）でCTAボタンや警告表示に使用
- **UI**: Bootstrap 5ベースでシンプルかつ情報密度を高めに設計。現場タブレット・スマホでの入力を考慮し、ボタンは最小44px以上のタップターゲット
- **ステータスバッジ**: 指示待ち（グレー）・作業中（ブルー）・検査中（アンバー）・完了（グリーン）・保留（レッド）で色分け
- **カンバンボード**: 各列に件数バッジ。カード内の期限が本日→オレンジ枠、超過→赤枠
- **印刷レイアウト**: 白黒でも視認性の高いシンプルな枠線+表組み。QRコードはqrcode.jsで生成
- **登録不要の簡易認証**: 管理者パスワード（config.phpに設定）でマスタ管理と指示書発行を保護。現場担当者は名前入力だけで自分の工程を更新可能（ログイン不要）