# 画面設計書 26-サプライヤー詳細画面

## 概要

本ドキュメントは、InvenTreeシステムのサプライヤー詳細画面(SupplierDetail)の設計仕様を定義するものである。

### 本画面の処理概要

サプライヤー詳細画面は、部品を供給するサプライヤー企業の詳細情報を表示・管理するための画面である。本画面はCompanyDetailコンポーネントを継承し、購買管理の文脈でサプライヤー情報を表示する。

**業務上の目的・背景**：調達業務において、サプライヤーの情報管理は適切な発注先選定と取引管理に不可欠である。本画面では、サプライヤーの基本情報に加え、そのサプライヤーから調達可能な部品一覧や発注履歴を確認できる。これにより、調達担当者は最適なサプライヤーの選定と発注プロセスの効率化を実現できる。

**画面へのアクセス方法**：購買インデックス画面のサプライヤー一覧から対象のサプライヤーを選択、または発注書詳細画面からリンク、あるいは直接URL `/purchasing/supplier/:id/*` にアクセスすることで本画面を表示できる。

**主要な操作・処理内容**：
1. サプライヤー基本情報の表示・編集
2. サプライヤー部品一覧の表示・管理
3. 発注書一覧の表示・管理
4. サプライヤーからの受入在庫一覧の表示
5. 連絡先・住所の管理
6. 添付ファイル・メモの管理

**画面遷移**：
- 遷移元：購買インデックス画面、発注書詳細画面、サプライヤー部品詳細画面
- 遷移先：サプライヤー部品詳細画面、発注書詳細画面

**権限による表示制御**：
- 会社詳細画面(CompanyDetail)の権限制御を継承
- `UserRoles.purchase_order` のChange権限がない場合、編集操作が無効化
- `UserRoles.purchase_order` のDelete権限がない場合、削除操作が無効化

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 23 | 会社マスタ管理 | 主機能 | サプライヤー情報の詳細表示・編集・削除処理 |
| 24 | サプライヤー部品管理 | 遷移先機能 | サプライヤー部品一覧の表示 |
| 12 | 発注書管理 | 遷移先機能 | 発注書一覧の表示 |

## 画面種別

詳細画面（CompanyDetailを継承）

## URL/ルーティング

| パス | 説明 |
|------|------|
| `/purchasing/supplier/:id/*` | サプライヤー詳細画面 |

## 入出力項目

会社詳細画面(No.25)と同一。CompanyDetailコンポーネントを使用。

## 表示項目

会社詳細画面(No.25)と同一。CompanyDetailコンポーネントを使用。

ただし、以下のタブが主に表示される（is_supplier=trueの場合）：
- Company Details
- Supplied Parts（サプライヤー部品一覧）
- Purchase Orders（発注書一覧）
- Stock Items（在庫アイテム一覧）
- Contacts（連絡先一覧）
- Addresses（住所一覧）
- Parameters
- Attachments
- Notes

## イベント仕様

会社詳細画面(No.25)と同一。CompanyDetailコンポーネントを使用。

## データベース更新仕様

会社詳細画面(No.25)と同一。CompanyDetailコンポーネントを使用。

## メッセージ仕様

会社詳細画面(No.25)と同一。

## 例外処理

会社詳細画面(No.25)と同一。

## 備考

- SupplierDetailは、CompanyDetailコンポーネントに以下のpropsを渡すラッパーコンポーネント：
  - title: "Supplier"
  - breadcrumbs: [{ name: "Purchasing", url: "/purchasing/" }]
  - last_crumb_url: "/purchasing/supplier"
- 会社がサプライヤーとして登録されていない場合（is_supplier=false）でも表示は可能だが、サプライヤー固有のタブ（Supplied Parts, Purchase Orders）は非表示となる

---

## コードリーディングガイド

本画面を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: エントリーポイントを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | SupplierDetail.tsx | `src/frontend/src/pages/company/SupplierDetail.tsx` | ラッパーコンポーネントの実装 |

**主要処理フロー**:
1. **5-12行目**: CompanyDetailコンポーネントを呼び出し、サプライヤー固有のpropsを渡す
   - title: `t\`Supplier\``
   - breadcrumbs: 購買メニューへのリンク
   - last_crumb_url: `/purchasing/supplier`

#### Step 2: ベースコンポーネントを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | CompanyDetail.tsx | `src/frontend/src/pages/company/CompanyDetail.tsx` | ベースとなる会社詳細コンポーネント |

詳細は会社詳細画面(No.25)のコードリーディングガイドを参照。

### プログラム呼び出し階層図

```
SupplierDetail.tsx
    │
    └─ CompanyDetail.tsx
           │
           ├─ props受け取り
           │      ├─ title: "Supplier"
           │      ├─ breadcrumbs: [{ name: "Purchasing", url: "/purchasing/" }]
           │      └─ last_crumb_url: "/purchasing/supplier"
           │
           └─ (会社詳細画面と同じ構成)
```

### データフロー図

```
[入力]                          [処理]                              [出力]

URL /purchasing/supplier/:id ──▶ SupplierDetail ────────────────▶ CompanyDetail
                                    │
                                    └─ props設定
                                       ├─ title
                                       ├─ breadcrumbs
                                       └─ last_crumb_url
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| SupplierDetail.tsx | `src/frontend/src/pages/company/SupplierDetail.tsx` | ソース | ラッパーコンポーネント |
| CompanyDetail.tsx | `src/frontend/src/pages/company/CompanyDetail.tsx` | ソース | ベースコンポーネント |
| SupplierPartTable.tsx | `src/frontend/src/tables/purchasing/SupplierPartTable.tsx` | ソース | サプライヤー部品一覧 |
| PurchaseOrderTable.tsx | `src/frontend/src/tables/purchasing/PurchaseOrderTable.tsx` | ソース | 発注書一覧 |
