関連記事 標準の汎用見積は見積（標準）、工程別に原価を積む 工程別原価版 は /app/quotation-matrix-view（Phase 2 記事化予定）、スマホ向けは /app/mobile-quotation（Phase 2 記事化予定）。受注変換後の進捗は受注進捗ボード、営業全体の見積ラインは営業業務フローを参照。

概要

見積作成（構成表）は、Single Page Layout（SPL） 方式で 4 ゾーン + Sticky Header + Scrollspy + Footer HUD を備えた、構成表型見積のためのカスタム画面です。Quotation Item のカスタムフィールド row_type（"Section Break" / "Item"）によって セクション + 品目行の階層構造 を構築し、画面左には 実際の PDF 出力イメージ がリアルタイムレンダリングされます。

画面URL: /app/quotation-composer/<quotation-name>（Quotation DocType の name を末尾に指定）

見積作成（構成表）全景（SPL レイアウト）

こんなときに使う

組立品・装置系の見積で セクション単位に小計を出す 内訳提示をしたい
同じ顧客に向けた 複数案（A 案 / B 案） を並べて比較しながら組み立てたい
単価編集と同時に 粗利率をリアルタイム に確認し、基準割れを即検知したい
見積 PDF の見た目を 編集中から確認 しながら組みたい（印刷プレビューに往復しない運用）
過去に同社でよく使われた 頻出品目サジェスト を活用して起票を速めたい

他の見積画面との使い分け

画面	構造	典型用途	出力 DocType
見積（標準）	フラット明細	サービス / 単純販売	Quotation
見積作成（構成表・本記事）	セクション階層（row_type）	組立品 / 装置 / 内訳提示	Quotation
`/app/quotation-matrix-view`	マトリクス（工程 × 品目）	工程別原価を積み上げる案件	Quotation
`/app/mobile-quotation`	スマホ UI	外出先の即時見積	Quotation

重要: 保存先はすべて 同じ Quotation DocType。使いやすい UI から編集するだけで、受注変換 / 印刷 / PDF は共通です。

画面構成：SPL（Single Page Layout）

1 ページ内に以下 4 ゾーンを縦に配置し、Scrollspy で現在位置を自動ハイライトしながらスクロールします。

ゾーン	内容
❶ 基本情報	顧客 / 件名 / 有効期限 / 条件等のヘッダ入力
❷ 明細	左: プレビュー（PDF 送信形式） / 右: エディタの 2 カラム
❸ 条件	支払条件 / 納期 / 保証等
❹ 確認	送信前チェックリスト + Timeline + 共有リンク

常時画面上部に表示され、編集中もコンテキストを失いません。

顧客名
見積額
ステータスバッジ（Draft / Submitted / Lost を qc-status-0/1/2 で色分け）
未保存ドット（qc-dirty-dot） — 変更があると赤ドット、保存で消える
標準フォームへのリンク（/app/quotation/<name>）
ヘルプボタン（qc-sh-help）

Scrollspy（4 ゾーンの飛び遷移）

ヘッダ下の ❶ 基本情報 → ❷ 明細 → ❸ 条件 → ❹ 確認 のアンカーをクリックすると該当ゾーンへジャンプします。スクロール位置に応じて現在ゾーンが自動ハイライトされます。

粗利率バー — 現在の粗利率をリアルタイム表示、基準値割れで警告色（qc-hud-margin-warn）
未保存インジケータ
主要アクションボタン（確定・保存・提出）

比較パネル（`qc-compare-panel`）

別の見積 / 別バージョン を並べて比較する機能。同一顧客に A 案 / B 案を同時提示するときに使います。

注意: 比較パネルは「別の見積」を並べるモードで、「同一見積のリビジョン」を並べるモードではありません（将来対応の可能性あり）。

構成表（Hierarchical Items）の仕組み

階層構築の鍵: `row_type` カスタムフィールド

Quotation Item にカスタムフィールド row_type が定義されており、値によって行の役割が変わります。

`row_type`	表示	動作
`Section Break`	「節」ラベル + 小計のみ	折りたたみ可能なセクションヘッダ
`Item`	通常の明細行	数量・単価・金額・値引を入力

これにより、標準 Quotation の子テーブルをそのまま使いながら ツリー状の階層提示 が実現されています。

セクションの折りたたみ

セクション行のキャレットをクリックで配下の Item 行が折りたたまれます。

注意: セクションの折りたたみ状態は UI 状態のみ（データには保存されません）。画面を再読み込みすると全セクションが展開された状態に戻ります。

値引の UX

セクション単位・明細単位の値引が可能
値引適用時は 元価格に取消線 + 値引後価格を並記 する UX
粗利率 HUD（Footer）に即時反映

主な操作

1. 見積を新規作成して Composer で開く

Quotation Composer は 既存の Quotation を開く前提の URL 構造です（/app/quotation-composer/<quotation-name>）。新規作成する場合は以下の順:

標準 Quotation から新規作成（見積（標準） §ステップ 2 参照）
Draft 状態で保存（name が確定する）
Sticky Header のリンク or Awesome Bar (Ctrl+K) で「見積作成（構成表）」に切替
以降は本画面で編集

CRM Hub の「見積」タブからも個別見積を Composer で開く動線があります。

2. セクション階層を組み立てる

左ペイン側には Scrollspy 対応の構成ツリー、中央の明細ゾーンで実際の階層を編集します。

左ペイン構成ツリー

❷ 明細ゾーンのエディタ側で 「＋セクションを追加」
セクション名を入力（例: 「本体」「オプション」「サービス」）
セクション内で 「＋行を追加」 で品目を追加
品目コードを入力（頻出品目サジェストが自動候補表示）
数量・単価を入力
セクション単位に小計が自動計算される

選択行のノード詳細（項目名・数量・単価・値引等）は中央〜右の詳細ペインで編集します:

ノード詳細の編集

3. 頻出品目サジェスト

同社で過去よく使われた品目を候補表示します。

内部 API: get_frequent_items
スコープ: ユーザーの デフォルト会社（User-default_company カスタムフィールド）
入力欄でキーワード入力時に TOP N 件を候補表示

4. プレビューで送信時の見た目を確認しながら編集

左カラムに 実際の PDF 出力イメージ（標準 Quotation Print Format がベース）がリアルタイムレンダリングされます。

セル編集 → Blur or Save で反映（一部セクションはリアルタイムではない）
qc-quick-preview-toggle でミニプレビュー切替（エディタ側にもコンパクト表示）

5. 粗利率 HUD の活用

Footer HUD のバーで粗利率がリアルタイム表示されます。

基準値（事前に設定した粗利率しきい値）割れで色が赤に変化（qc-hud-margin-warn）
値引を追加するたびに即座に反映
赤警告のまま提出するとレビューで差戻されやすい → 事前に再調整

6. 送信前チェックリスト（❹ 確認ゾーン）

ゾーン ❹ で送信前チェックリスト（qc-validation-list）を確認します。典型的なチェック項目:

連絡先メール有無
有効期限が妥当か
必須項目の埋まり
カスタム質問（テンプレートで定義）
保存済みか

全項目が緑になってから提出するのが推奨運用です。

7. BOM から構成を取り込む（組立品向け）

既存の BOM（Bill of Materials）から構成表を取り込む動線があります。製造部門が管理する BOM をそのまま見積の骨格として流用することで、技術仕様と営業見積の乖離を防げます。

BOM 取込ダイアログ

8. 代替品（候補）を並べる

同じ構成位置に複数の候補品目を登録し、A/B 案型の比較見積を組めます。

代替候補の設定

9. 比較パネルで複数案を並べる

比較したい別見積を選択（同一顧客の別 Quotation name）
比較パネル を開く
左右に並んだ状態で金額・構成の差分を確認
優劣を判断して採用案を決定

8. 共有リンク生成

ゾーン ❹ の 共有リンク 機能で、顧客向けの Web 閲覧リンクを生成します。顧客が ERPNext にログインせずにブラウザで見積を閲覧できる URL です（社内規程に応じて使い分け）。

9. 保存・提出

保存: Ctrl+S または Footer の「保存」 → Draft のまま
提出: 提出ボタン → docstatus=1 (Submitted) に遷移
提出後は標準 Quotation と同じく 印刷・PDF・受注変換 が可能

扱う DocType とフィールド

Quotation（本体）

標準 + カスタムフィールド。

customer / quotation_to（Lead or Customer）
transaction_date / valid_till / company / currency
grand_total / rounded_total
status (0=Draft, 1=Submitted, 2=Lost/Cancelled)

Quotation Item（構成表の要）

標準 + row_type カスタムフィールド。

item_code / item_name / qty / rate / amount
row_type （カスタム、"Section Break" | "Item"）
description / uom

セクション行は qty / rate が非表示、Item 行のみ数値が表示されます。

技術メモ: row_type は hooks.py の fixtures で管理されるカスタムフィールドです。デモ環境 / 本番環境とも fixtures 経由で投入されています。

連動先・遷移

連動先	役割
Quotation（標準）	保存先 DocType（別 DocType は作らない）
`/app/quotation/<name>`	標準フォーム（Sticky Header のリンク）
`/app/quotation-matrix-view/<name>`	工程別原価版（Phase 2 記事化予定、独立実装）
`/app/mobile-quotation`	スマホ向け（Phase 2 記事化予定、同じ Quotation を編集）
上流: CRM Hub 見積タブ	見積詳細から遷移
下流: Sales Order 変換	CRM Hub 受注変換タブ / 標準 Quotation の「Make > Sales Order」

ロールと権限

page role（[quotation_composer.json]）:

ロール	権限
System Manager	全機能
Demo Viewer	読み取り
Demo Operator	書込（デモ用）

⚠️ Sales User / Sales Manager が未付与

現在の実装では Sales User / Sales Manager が page role として付与されていません。業務運用では以下のいずれかの対応が必要です。

管理者が page role に Sales User / Sales Manager を追加（fixture 更新推奨）
撮影・検証時は System Manager ロールで一時運用

WSL 側エージェントに「Quotation Composer の page role に Sales User/Sales Manager を追加」の依頼が可能です。

設定依存

必須

Quotation Settings（ERPNext 標準）
Item マスタ（品目コード・単位・税率）
Customer マスタ
Price List（価格表） — 単価自動引当
Custom Field Quotation Item-row_type — 既存 fixtures で投入済み

推奨

Territory / Currency / Tax Template — 外貨案件や複数税率対応
Print Format — Quotation の印刷フォーマット（プレビューに使用）

デモ環境の注意点

Quotation のデモデータ: Composer は既存 Quotation を開く UI のため、事前に 1 件以上の Quotation が必要
page role 問題: y-okamoto@maihatch.com（Sales User）では /app/quotation-composer にアクセス不可の可能性 → System Manager / Demo ロールでアクセス
Print Format: 顧客向け Print Format が未整備だとプレビューが空白
深いセクション階層: セクション内セクション（入れ子）の対応可否は要テスト、通常は 1 階層での運用推奨

ショートカット

専用キーボードショートカット は未実装
Scrollspy クリック でゾーン間ジャンプ（Ctrl+1〜4 等の割り当ては今後の実装候補）
Ctrl+S は Frappe 標準の保存
ヘルプボタン (qc-sh-help) でヘルプダイアログ表示

挙動の注意点

未保存ドット: 変更があると Sticky Header に赤ドットが点灯、保存で消える
自動保存は未確認: 現時点では明示的保存が必須。画面を閉じる前に必ず Ctrl+S を推奨
比較パネルの誤解注意: 別見積を並べるモードであり、同一見積のリビジョン比較ではない
セクション折りたたみはデータに保存されない: 再読み込みで全展開状態に戻る
プレビュー更新タイミング: セル編集 → Blur / Save で反映。セクション内数値はリアルタイムではない瞬間あり
楽観的ロックなし: 複数ユーザーで同じ見積を同時編集すると 最後に保存した変更が勝つ（Frappe 標準）

Tips

明示的保存を習慣化: 自動保存が未確認なため、数分ごとに Ctrl+S を押す癖を
プレビューで「顧客視点」を保つ: 編集中から PDF プレビューを見ることで、顧客に出す際の誤字・空白行・レイアウト崩れを未然に防げる
粗利率 HUD の赤を放置しない: 基準割れのまま提出すると承認で差戻されやすい。赤のときは値引を戻すか単価見直し
頻出品目を活用: 過去実績の多い品目から候補が出るため、入力を 3-5 割短縮できる
比較パネルで勝率アップ: 機械装置・産業機器の業態では A/B 案提示で受注率が上がる
セクション 1 階層で運用: 入れ子を避け、セクション単位に小計を出す運用が可読性的に最適

よくある質問

Q: 新規見積はどうやって作ればいいですか？

Quotation Composer は既存 Quotation を開く URL 構造（/app/quotation-composer/<name>）のため、先に見積（標準）で Draft を作成してください。Draft の name が確定したら Sticky Header や CRM Hub 見積タブから Composer に切替できます。

Q: 工程別原価版との切替タイミングは？

セクション階層（部品構成）が主 → 構成表（本画面）
工程・作業時間の原価積み上げが主 → 工程別原価版（/app/quotation-matrix-view、Phase 2 記事化予定）

どちらも同じ Quotation DocType に保存されるため、画面を切り替えて併用も可能です。

Q: 保存した Quotation を標準フォームで編集したらどうなりますか？

標準 Quotation フォームから編集してもデータは同一ですが、row_type を意識した編集は Composer の方が圧倒的にやりやすいです。セクション構造の意図を保ちたいなら Composer で編集 することを推奨します。

Q: PDF 出力時の階層表現をカスタマイズしたい

Quotation の Print Format で制御します。階層を展開して表示するか総額のみ表示するかは印刷フォーマットの設定次第です。

Q: Sales User なのに画面に入れません

page role に Sales User が未付与の状態です。管理者に Quotation Composer page の role 追加を依頼してください（WSL 側に fixture 更新依頼可能）。

Q: 自動保存はありますか？

現時点では自動保存の実装は確認できていません。明示的に Ctrl+S で保存 してから画面を閉じてください。

Q: 比較パネルでリビジョン比較がしたい

現在の比較パネルは 別の Quotation を並べるモードで、同一 Quotation のリビジョン比較には対応していません。リビジョン差分を見たい場合は、Frappe 標準の Version 履歴（フォーム右上のバージョンタイムライン）を参照してください。

次のステップ

標準フォームでの印刷・PDF 出力 → 見積（標準）
受注変換後の進捗 → 受注進捗ボード
組立品 BOM との連動基盤 → BOM（部品表）
営業業務全体像 → 営業業務フロー

概要