ken_nogi/Pleasanter/営業積算システム/docs/superpowers/specs/2026-08-01-process-flowchart-generator-design.md

プロセス設定→Mermaidフローチャート生成 設計書

日付: 2026-08-01 起点: site-335411「②問い合わせ内容管理」プロセス設定キャッチボール中の派生要望

背景・目的

pleasanter-site-specスキルでプロセス設定(Processes)を扱う際、Status遷移の全体像を毎回文章・表で追うのは把握コスト高い。processes.json＋サイトのStatus列ChoicesTextから、横向きMermaidフローチャートを機械生成し仕様書へ組み込む。対象は特定サイト専用でなく汎用スキル機能とする。

スコープ

• 対象: 任意サイトのprocesses.json（Processes配列の構造化データのみ）
• 対象外: Scripts/ServerScriptsによるボタン非表示化・独自ボタン経由呼び出しの検出（サイトごとに実装バラバラで完全自動化困難。必要なら仕様書側の既存表・文章で別途補足）

アーキテクチャ

• 新規ファイル generate-process-flowchart.js（プロジェクトルート、build-desired-config.js等と同階層）
• サイトフォルダ解決はbuild-desired-config.js（ルート版）のresolveSiteDirと同じロジックを踏襲（フォルダ名前方一致対応）

注記（実装計画作成時に判明・実態に合わせ確定）: .claude/js/配下はSKILL.md記載の正式仕様（site-paths.js使用、configs/site-*/sitesettings/配置）だが、実際に稼働中のルート直下スクリプト群（get-site-config.js/extract-site-config.js/build-desired-config.js）は別実装で、site-paths.jsは使わず、生JSONはconfigs/の外siteSettingJsons/直下に置く。本機能はルート直下の稼働版に合わせる。

• 入力2つ
  • configs/site-{SiteId}_{サイト名}/processes.json（Processes配列本体。extract-site-config.jsの出力）
  • siteSettingJsons/site-{SiteId}_latest.json（Status列のChoicesText解決用。ノードラベルに必須。get-site-config.jsの出力）
• 出力: 標準出力へ ```mermaid〜``` ブロック込み文字列。ファイルへの自動書き込みはせず、Claudeが仕様書「8. プロセス設定」節へ組み込む
  • 役割分担: 抽出・変換＝機械的（スクリプト）、仕様書への組み込み＝Claudeが解釈して配置（既存の抽出ツール群の設計思想を踏襲）

実行方法

node generate-process-flowchart.js site-335411

トリガーキーワード（SKILL.md冒頭の依頼キーワード一覧へ追加）:

• 「フローチャートを作って」
• 「フローチャートを更新」

ノード設計

• ノードID: Status値そのもの（例: 100, 450）
• ノードラベル: {ラベル}<br/>{値}（Status列ChoicesTextの第2フィールドから解決。例: 依頼者質疑中<br/>450）
• ノード形状: ((...)) 円形
• ChoicesTextが見つからない/空の場合: 値のみのラベルにフォールバックし、警告ログを出す（処理は継続）

エッジ設計

3パターン。

1. 通常遷移（CurrentStatus≠-1） A -->|プロセス名| B

2. 任意状態からの遷移（CurrentStatus=-1 かつ ChangedStatus≠-1）

   • View.ColumnFilterHash.Statusが指定されていれば、そのリスト内の各Statusノードから個別に矢印（例: 対象7件なら7本）
   • 指定なければ仮想ノード((任意))から1本

3. 状態変化なしアクション（CurrentStatus=-1 かつ ChangedStatus=-1。画面遷移・通知送信のみ等）

   • View.ColumnFilterHash.Statusが指定されていれば、その各Statusノードへ自己ループ
   • 指定なければ仮想ノード((任意))への自己ループ

エッジラベル装飾:

• Depts指定あり → プロセス名 (Dept{番号}) を付記（例: 営業積算確認 (Dept25)）
• Notifications配列が空でない → ラベル先頭に📧（例: 📧遅延連絡 (Dept25)）
• View.ColumnFilterHashのStatus以外の条件（例: ClassC:["Own"]）はラベルに含めない。仕様書8節の既存表（Id/Name/実行条件/動作/成功メッセージ）側でカバーする役割分担とする

CurrentStatus/ChangedStatusの値が対象Status列のChoicesTextに存在しない場合: 値のみのノードとして描画し警告ログを出す。

方向

flowchart LR（横向き）固定。

エラー処理

• processes.jsonが存在しない → 「先にnode get-site-config.jsを実行してください」で終了
• Status列のChoicesText欠落時のフォールバックは上記ノード設計の通り

SKILL.md反映内容

1. 冒頭の対応依頼キーワード一覧へ「フローチャートを作って」「フローチャートを更新」を追加
2. 「関連ツール」節へgenerate-process-flowchart.jsの説明を追加（実行手順・入出力・役割分担）
3. 仕様書テンプレート8節（プロセス設定）へ「Mermaidフローチャート（横向き、Status遷移）」の記載ルールを追加

サンプル出力（site-335411実データ試作）

flowchart LR
  100((新規<br/>100))
  400((受付済<br/>400))
  450((依頼者質疑中<br/>450))
  480((依頼者回答有<br/>480))
  500((積算対応中<br/>500))
  510((外部見積待ち<br/>510))
  520((社内確認中<br/>520))
  800((一部完了<br/>800))
  900((完了<br/>900))
  901((依頼不要<br/>901))
  any((任意))

  100 -->|質疑送信| 450
  400 -->|質疑送信| 450
  450 -->|質疑送信| 450
  500 -->|質疑送信| 450
  510 -->|質疑送信| 450
  520 -->|質疑送信| 450
  800 -->|質疑送信| 450
  450 -->|回答送信| 480
  450 -->|営業積算確認 (Dept25)| 500
  450 -->|質疑回答削除 (Dept25)| 450
  any -->|📧遅延連絡 (Dept25)| any
  800 -->|📧見積回答 (Dept25)| 800
  900 -->|📧見積回答 (Dept25)| 900
  901 -->|📧見積回答 (Dept25)| 901

未確定・保留事項

なし（本設計内容でキャッチボール完了、承認済み）