201 lines
No EOL
7.9 KiB
Markdown
201 lines
No EOL
7.9 KiB
Markdown
# PDF 帳票テンプレート設計 - 母艦お局様
|
||
|
||
## 1. ポリシー概要
|
||
|
||
| 項目 | 内容 |
|
||
| --- | --- |
|
||
| **テンプレート基準** | A5 サイズ（210mm x 297mm）- 印刷・メール送信対応 |
|
||
| **レイアウト方式** | 縦型フォーマット - ヘッダー / フッター統一デザイン |
|
||
| **帳票種別** | 見積書 / 伝票類 / 請求書 / 領収書 |
|
||
| **PDF 生成ライブラリ** | `flutter_pdf_generator`（機能性重視） |
|
||
|
||
---
|
||
|
||
## 2. レイアウト定義
|
||
|
||
### 📐 ヘッダーエリア（統一）
|
||
|
||
```
|
||
┌─────────────────────────────────────┐
|
||
│ 🏢 LOGO │ ← 右上に配置
|
||
│ ────────────────────────────────── │
|
||
│ 会社名：〇〇株式会社 │
|
||
│ 代表者：田中次郎 │
|
||
│ アドレス：東京都港区_test 1-1-1 │
|
||
│ TEL:03-1234-5678 / FAX:03-1234-5679│
|
||
│ 📧 mail@example.com │ ← メールアイコン付き
|
||
│ ────────────────────────────────── │
|
||
│ 帳票種別：見積書 │
|
||
│ 作成日：2026/03/08 │
|
||
└─────────────────────────────────────┘
|
||
```
|
||
|
||
**要件**:
|
||
- 🖼️ LOGO: 右上隅に配置（100 x 50px）
|
||
- 🏢 会社情報：左揃え、フォント 12pt, 灰色系
|
||
- 📋 帳票種別と作成日：右揃え、太字で強調
|
||
|
||
### 📦 商品明細エリア（標準化）
|
||
|
||
| カラム | 幅 | 内容 | 例 |
|
||
| --- | --- | --- | --- |
|
||
| **No** | 40px | シーケンス番号 | EST-260301-0001 |
|
||
| **得意先名** | 150px | クライアント名称 | テスト株式会社 Alpha |
|
||
| **商品コード** | 80px | JAN / コード | PRD001 |
|
||
| **商品名** | 200px | 商品詳細 | テスト商品 A |
|
||
| **単価（¥）** | 60px | ユニットプライス | ¥3,500 |
|
||
| **数量** | 50px | Units | 1 |
|
||
| **小計** | 80px | 金額合計 | ¥3,500 |
|
||
|
||
**デザインガイド**:
|
||
- 奇数行：白色背景
|
||
- 偶数行：薄いグレー (#f5f5f5) のアルナテレーティング
|
||
- フォントサイズ：10pt（明細）/ 11pt（ヘッダー）
|
||
|
||
### 💰 合計金額エリア
|
||
|
||
```
|
||
┌─────────────────────────────────────┐
|
||
│ 合 計 │
|
||
│ ────────────────────────────────── │
|
||
│ ¥3,500 │ ← タイトル（左揃え）
|
||
│ ¥3,850 (税込) │ ← 合計金額（太字/オレンジ色）
|
||
│ │
|
||
│ │
|
||
│ 📝 備考 │ ← フッターの付帯情報
|
||
│ ・納期：即日 │
|
||
│ ・決済条件：前金 │
|
||
└─────────────────────────────────────┘
|
||
```
|
||
|
||
### 🖨️ フッターエリア（統一）
|
||
|
||
```
|
||
┌─────────────────────────────────────┐
|
||
│ 請求書番号：EST-260301-0001 │ ← 左上（灰色）
|
||
│ │
|
||
│ QR コード： │ ← QR（右上隅に配置）
|
||
│ 発行日：2026/03/08 │
|
||
│ [QR パターンのエリア] │
|
||
│ │
|
||
│ ────────────────────────────────── │
|
||
│ © ○○株式会社 全著作権所有 │ ← 会社ロゴ + 免責事項（グレー）
|
||
│ ────────────────────────────────── │
|
||
│ 📞 03-1234-5678 | 🌐 www.example.co.jp│
|
||
└─────────────────────────────────────┘
|
||
```
|
||
|
||
---
|
||
|
||
## 3. PDF 帳票の出力フロー
|
||
|
||
### 🔧 flutter_pdf_generator の基本構造
|
||
|
||
```dart
|
||
import 'package:flutter_pdfgenerator/flutter_pdfgenerator.dart';
|
||
import 'package:pdf/pdf.dart';
|
||
import 'package:pdf/widgets.dart' as pw;
|
||
|
||
Future<void> generateEstimatePdf() async {
|
||
// PDF ドキュメントの作成
|
||
final doc = pw.Document();
|
||
|
||
doc.addPage(
|
||
pw.MultiPage(
|
||
pageFormat: PdfPageSize.a5, // A5 サイズ設定
|
||
build: (pw.Context context) => [
|
||
// ヘッダーエリア
|
||
_buildHeader(context),
|
||
|
||
// 商品明細エリア
|
||
_buildItemsTable(context),
|
||
|
||
// 合計金額エリア
|
||
_buildFooter(context),
|
||
],
|
||
),
|
||
);
|
||
|
||
// PDF ファイルの保存
|
||
await doc.save(path: 'estimates/EST-260301-0001.pdf');
|
||
}
|
||
```
|
||
|
||
### 📋 パッケージ依存関係
|
||
|
||
```yaml
|
||
# pubspec.yaml
|
||
dependencies:
|
||
flutter_pdf_generator: ^3.0.0
|
||
pdf: ^3.10.8
|
||
printing: ^5.9.0
|
||
```
|
||
|
||
**注**: `flutter_pdf_generator` はレンダリングエンジン最適化済みなので、パフォーマンス優先に選定。
|
||
|
||
---
|
||
|
||
## 4. テンプレート拡張仕様
|
||
|
||
### 🔁 レイアウトの再利用可能性
|
||
|
||
| ファイル | 目的 | 共有リソース |
|
||
| --- | --- | --- |
|
||
| `pdf_template/estimate_template.dart` | 見積書用テンプレート | ヘッダー / フッター |
|
||
| `pdf_template/sales_template.dart` | 伝票用テンプレート | ヘッダー（統一）/ フッター（簡易） |
|
||
| `pdf_template/invoice_template.dart` | 請求書用テンプレート | QR コード付与エリア |
|
||
|
||
**設計原則**:
|
||
- ✅ ヘッダー / フッターを共有クラスで抽象化
|
||
- ✅ コンテンツ領域を動的に差し替え可能
|
||
- ✅ QR コードは右揃え（Google Drive 連携用）
|
||
|
||
---
|
||
|
||
## 5. マイルストーンチェックポイント
|
||
|
||
| フェーズ | 完了条件 | 担当チーム | 期限 |
|
||
| --- | --- | --- | --- |
|
||
| **T1: テンプレート設計** | PDF ファイル出力テストパス | Sales チーム | 3/12（3 営業日） |
|
||
| **T2: レイアウト実装** | flutter_pdf_generator インテグレーション完了 | UI/UX チーム | 3/16（7 営業日） |
|
||
| **T3: Google Drive 連携** | QR コードによるファイル保存・開示機能動作確認 | Cloud チーム | 3/20（11 営業日） |
|
||
|
||
**依存関係**:
|
||
```mermaid
|
||
graph LR
|
||
A[見積入力画面完了] --> B[PDF テンプレート設計]
|
||
B --> C[flutter_pdf_generator インテグレーション]
|
||
C --> D[売上伝票・請求書のテンプレート展開]
|
||
```
|
||
|
||
---
|
||
|
||
## 6. テストケース定義
|
||
|
||
| # | テストシナリオ | 期待結果 | 検証タイミング |
|
||
| --- | --- | --- | --- |
|
||
| T-01 | 見積書 PDF 出力テスト（単品） | ファイル生成・A5 印刷動作確認 | 3/12 |
|
||
| T-02 | 商品明細の文字切替確認 | 行間が正常に折り返されている | 3/12 |
|
||
| T-03 | フッター QR コード有効化 | Google Drive で開示可能 | 3/18 |
|
||
| T-04 | 売上伝票テンプレート展開 | 見積書から派生し、伝票用レイアウト動作 | 3/16 |
|
||
|
||
**注**: テストは `test/widget_test.dart` のフローに従う。
|
||
|
||
---
|
||
|
||
## 📋 ドキュメント管理履歴
|
||
|
||
| 日付 | 更新者 | 変更内容 |
|
||
| --- | --- | --- |
|
||
| **2026/03/08** | AI / 開発者 | 見積書テンプレート定義・拡張仕様明記 |
|
||
|
||
**最終更新**: 2026/03/08
|
||
**バージョン**: 1.0 (PDF Template Init)
|
||
|
||
---
|
||
|
||
## 📚 関連ドキュメント
|
||
|
||
- [requirements.md](file:///home/user/dev/h-1.flutter.4/docs/requirements.md): 機能一覧・要件定義
|
||
- [short_term_plan.md](file:///home/user/dev/h-1.flutter.4/docs/short_term_plan.md): Sprint 計画・マイルストーン管理
|
||
- [engineering_management.md](file:///home/user/dev/h-1.flutter.4/docs/engineering_management.md): 工程管理フレームワーク活用ガイド |