# 機能設計書 54-添付ファイル表示

## 概要

本ドキュメントは、InvenTreeモバイルアプリにおける添付ファイル表示機能の設計を記述する。

### 本機能の処理概要

パーツ、在庫アイテム、発注、受注、会社などの各種アイテムに関連付けられた添付ファイル（ドキュメント・画像・リンク）を一覧表示し、ダウンロード・閲覧できる機能を提供する。

**業務上の目的・背景**：在庫管理において、パーツの仕様書、データシート、マニュアル、写真などの関連ドキュメントを参照することは重要な業務である。添付ファイル機能により、必要なドキュメントにモバイルデバイスから即座にアクセスでき、現場での作業効率が向上する。また、発注書や検収書類などの業務ドキュメントを紐付けて管理することで、トレーサビリティを確保できる。

**機能の利用シーン**：パーツ詳細画面、在庫アイテム詳細画面、発注詳細画面、受注詳細画面、会社詳細画面などで、添付ファイル項目をタップして添付ファイル一覧画面へ遷移する。一覧から個々のファイルをタップしてダウンロード・表示する。

**主要な処理内容**：
1. 対象モデルタイプとIDに基づいて添付ファイル一覧を取得する
2. ファイルタイプに応じたアイコンで一覧表示する
3. ファイルタップ時にダウンロードして開く
4. URLリンクの場合は外部ブラウザで開く
5. 長押しでオプションメニュー（編集・削除）を表示する

**関連システム・外部連携**：InvenTree REST API（attachment/エンドポイント）との通信を行う。

**権限による制御**：認証済みユーザーのみがアクセス可能。添付ファイルの表示権限はモデルごとの権限に依存する。

## 関連画面

| 画面No | 画面名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 22 | 部品詳細画面 | 補助機能 | 添付ファイル項目押下時に添付ファイル一覧表示 |
| 25 | 在庫アイテム詳細画面 | 補助機能 | 添付ファイル項目押下時に添付ファイル一覧表示 |
| 27 | 購入注文詳細画面 | 補助機能 | 添付ファイル項目押下時に添付ファイル一覧表示 |
| 29 | 販売注文詳細画面 | 補助機能 | 添付ファイル項目押下時に添付ファイル一覧表示 |
| 31 | 会社詳細画面 | 補助機能 | 添付ファイル項目押下時に添付ファイル一覧表示 |

## 機能種別

CRUD操作（Read）

## 入力仕様

### 入力パラメータ

| パラメータ名 | 型 | 必須 | 説明 | バリデーション |
|-------------|-----|-----|------|---------------|
| modelType | String | Yes | モデルタイプ（part/stockitem等） | サーバー定義のタイプ |
| modelId | int | Yes | 対象インスタンスのID | 正の整数 |

### 入力データソース

InvenTree REST API: `attachment/` エンドポイント

## 出力仕様

### 出力データ

| 項目名 | 型 | 説明 |
|--------|-----|------|
| pk | int | 添付ファイルの一意識別子 |
| attachment | String | ファイルパス/URL |
| filename | String | ファイル名 |
| comment | String | コメント |
| link | String | 外部リンクURL |
| upload_date | DateTime | アップロード日時 |
| model_type | String | 関連モデルタイプ |
| model_id | int | 関連モデルID |

### 出力先

画面表示（ListTile形式のリストビュー）

## 処理フロー

### 処理シーケンス

```
1. 画面初期化
   └─ AttachmentWidget生成、パラメータ受け取り
2. データ取得リクエスト
   └─ request()でInvenTreeAttachment().list()呼び出し
3. フィルタ適用
   └─ model_type, model_idでフィルタリング
4. 結果リスト構築
   └─ 取得した添付ファイルをattachmentsリストに格納
5. UI表示
   └─ getTiles()でListTile生成
6. ユーザー操作処理
   ├─ タップ → ダウンロード/リンク表示
   └─ 長押し → オプションメニュー表示
```

### フローチャート

```mermaid
flowchart TD
    A[添付ファイル項目タップ] --> B[AttachmentWidget表示]
    B --> C[request実行]
    C --> D[InvenTreeAttachment.list]
    D --> E[フィルタ: model_type, model_id]
    E --> F[attachmentsリスト構築]
    F --> G[getTiles実行]
    G --> H{attachments空?}
    H -->|Yes| I[空メッセージ表示]
    H -->|No| J[ファイル/リンク一覧表示]
    J --> K{ユーザー操作}
    K -->|タップ| L{ファイル?}
    L -->|Yes| M[downloadAttachment]
    L -->|No| N[openLink]
    K -->|長押し| O[オプションメニュー]
```

## ビジネスルール

### 業務ルール

| ルールNo | ルール名 | 内容 | 適用条件 |
|---------|---------|------|---------|
| BR-54-01 | モダンAPI必須 | APIバージョン207以上が必要 | 添付ファイルAPI使用時 |
| BR-54-02 | ファイルアイコン | 拡張子に応じたアイコンを表示 | 一覧表示時 |
| BR-54-03 | リンクとファイルの区別 | URLリンクはリンクアイコン、ファイルは拡張子別アイコン | 一覧表示時 |

### 計算ロジック

該当なし

## データベース操作仕様

### 操作別データベース影響一覧

| 操作 | 対象テーブル | 操作種別 | 概要 |
|-----|-------------|---------|------|
| 添付ファイル一覧取得 | attachment | SELECT | モデルに関連する添付ファイル取得 |
| 添付ファイル件数取得 | attachment | COUNT | 添付ファイル数を取得 |

### テーブル別操作詳細

#### attachment（リモートAPI）

| 操作 | 項目（カラム名） | 更新値・取得条件 | 備考 |
|-----|-----------------|-----------------|------|
| SELECT | all | model_type, model_id | 指定モデルの添付ファイル |

## エラー処理

### エラーケース一覧

| エラーコード | エラー種別 | 発生条件 | 対処方法 |
|------------|----------|---------|---------|
| - | 接続エラー | サーバー未接続時 | 接続ステータスを表示 |
| - | ダウンロードエラー | ファイル取得失敗時 | エラーメッセージ表示 |
| - | 非対応 | APIバージョン207未満 | 項目を非表示 |

### リトライ仕様

プルダウンリフレッシュによる手動リトライが可能

## トランザクション仕様

読み取り専用のためトランザクション制御なし

## パフォーマンス要件

- 添付ファイル一覧の表示は2秒以内
- ファイルダウンロードは接続状態に依存

## セキュリティ考慮事項

- 認証トークンによるアクセス制御
- モデル単位の権限チェック
- HTTPS通信による通信暗号化

## 備考

API バージョン207以降でのみサポート。統合添付ファイルAPIを使用。

---

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

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

### 推奨読解順序

#### Step 1: データ構造を理解する

添付ファイルモデルの構造を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | attachment.dart | `lib/inventree/attachment.dart` | InvenTreeAttachmentクラス、プロパティ定義 |

**読解のコツ**: InvenTreeModelを継承しており、attachment/エンドポイントを使用。ファイルとリンクの2種類の添付がある。

**主要処理フロー**:
- **13-15行目**: InvenTreeAttachmentクラス定義
- **25行目**: APIエンドポイント `attachment/`
- **39行目**: modelTypeプロパティ
- **42行目**: modelIdプロパティ
- **44-46行目**: attachmentプロパティとhasAttachment
- **49-51行目**: filenameプロパティ
- **53-76行目**: iconプロパティ（拡張子別アイコン）
- **173-175行目**: downloadAttachment()メソッド

#### Step 2: ウィジェット構造を理解する

添付ファイル表示ウィジェットの構造を確認。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | attachment_widget.dart | `lib/widget/attachment_widget.dart` | AttachmentWidget、_AttachmentWidgetState |

**主要処理フロー**:
- **23-38行目**: AttachmentWidgetクラス定義、コンストラクタパラメータ
- **40-41行目**: RefreshableStateを継承した_AttachmentWidgetState
- **167-189行目**: request()メソッドでデータ取得
- **191-240行目**: getTiles()メソッドでUI構築

#### Step 3: 一覧表示処理を理解する

添付ファイル一覧のUI構築を確認。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | attachment_widget.dart | `lib/widget/attachment_widget.dart` | getTiles()内のListTile構築 |

**主要処理フロー**:
- **196-212行目**: ファイル添付のListTile
- **213-227行目**: リンク添付のListTile
- **230-236行目**: 空の場合のメッセージ表示

#### Step 4: ダウンロード処理を理解する

ファイルダウンロードの実装を確認。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 4-1 | attachment.dart | `lib/inventree/attachment.dart` | downloadAttachment() |
| 4-2 | api.dart | `lib/api.dart` | downloadFile() |

**主要処理フロー**:
- **173-175行目**: downloadAttachment()でAPI呼び出し
- **887-985行目**: api.dart内のdownloadFile()実装

#### Step 5: リスト項目タイルの生成を理解する

親画面からの呼び出しを確認。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 5-1 | attachment_widget.dart | `lib/widget/attachment_widget.dart` | ShowAttachmentsItem()関数 |

**主要処理フロー**:
- **246-278行目**: ShowAttachmentsItem()関数
- **254-256行目**: supportsModernAttachmentsチェック
- **258-276行目**: ListTile生成とNavigator.push

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

```
ShowAttachmentsItem() (attachment_widget.dart)
    │
    └─ Navigator.push
           └─ AttachmentWidget
                  │
                  ├─ _AttachmentWidgetState
                  │      │
                  │      ├─ request()
                  │      │      └─ InvenTreeAttachment().list()
                  │      │             └─ InvenTreeModel.list() (model.dart)
                  │      │                    └─ InvenTreeAPI.get() (api.dart)
                  │      │
                  │      ├─ getTiles()
                  │      │      ├─ ListTile (ファイル)
                  │      │      │      └─ onTap: downloadAttachment()
                  │      │      │             └─ InvenTreeAPI().downloadFile()
                  │      │      │
                  │      │      └─ ListTile (リンク)
                  │      │             └─ onTap: openLink()
                  │      │
                  │      └─ showOptionsMenu()
                  │             ├─ editAttachment()
                  │             └─ deleteAttachment()
                  │
                  └─ RefreshableState
```

### データフロー図

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

添付ファイル項目  ───▶  ShowAttachmentsItem()      ───▶  Navigator.push
タップ                     │
                          ▼
                   AttachmentWidget
                          │
                          ├─ request()
                          │      └─ GET attachment/
                          │            ?model_type=xxx
                          │            &model_id=xxx
                          │
                          ▼
API応答         ◀───  InvenTreeAttachment.list()  ───▶  添付ファイル一覧
                          │
                          ├─ getTiles()
                          │      └─ ListTile構築
                          │
                          ▼
ファイルタップ   ───▶  downloadAttachment()       ───▶  ファイルダウンロード
                          └─ InvenTreeAPI().downloadFile()
                                 └─ OpenFilex.open()
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| attachment_widget.dart | `lib/widget/attachment_widget.dart` | ソース | 添付ファイル表示ウィジェット |
| attachment.dart | `lib/inventree/attachment.dart` | ソース | 添付ファイルモデル |
| model.dart | `lib/inventree/model.dart` | ソース | 基底モデルクラス |
| api.dart | `lib/api.dart` | ソース | API通信・ファイルダウンロード |
| refreshable_state.dart | `lib/widget/refreshable_state.dart` | ソース | リフレッシュ可能な状態管理 |
| fields.dart | `lib/widget/fields.dart` | ソース | ファイルピッカー |
