financial-quizディレクトリ構造の整理計画

現状の構造（2025-12-23時点）

financial-quiz/
├── AnimationControlPanel.vue
├── AnimationExportButton.vue
├── BaseCompanyComparison.vue
├── ChartComparison.vue
├── EPSGrowthComparison.vue
├── FillInBlankQuestion.vue
├── FinancialChartsPanel.vue
├── FinancialDataTable.vue
├── GrossMarginComparison.vue
├── NetIncomeComparison.vue
├── RevenueMarketCapComparison.vue
│
├── charts/                           # ✅ Phase 4完了
│   ├── base/
│   │   ├── BaseBarChart.vue
│   │   ├── BaseLineChart.vue
│   │   └── index.ts
│   ├── composables/
│   │   └── useChartDimensions.ts
│   ├── chartLayout.ts
│   ├── EPSChart.vue
│   ├── FCFChart.vue
│   ├── ProfitMarginChart.vue
│   ├── ExpenseRatioChart.vue
│   ├── EvMultiplesChart.vue
│   ├── LiquidityRatioChart.vue
│   ├── MarketCapChart.vue
│   ├── ROEChart.vue
│   ├── EACMarginChart.vue
│   ├── EACSingleMetricChart.vue
│   ├── PEEvEbitChart.vue
│   └── index.ts
│
├── waterfall/                        # ✅ Phase 1完了
│   ├── PLWaterfallChart.vue
│   ├── CFWaterfallChart.vue
│   └── index.ts
│
├── proportional-statements/          # ✅ Phase 2完了
│   ├── ProportionalFinancialStatements.vue
│   ├── ProportionalFinancialStatementsAnimated.vue
│   ├── ProportionalFinancialStatementsComparison.vue
│   ├── BalanceSheetBox.vue
│   ├── BalanceSheetComparison.vue
│   └── index.ts
│
├── proportional-animation/           # 既存ディレクトリ
│   ├── CompanySelectorModal.vue
│   ├── CompanySelectorSidebar.vue
│   ├── ExportContainer.vue
│   ├── index.ts
│   └── composables/
│       ├── industry-short-names.ts
│       └── useCompanyFinancialMetrics.ts
│
├── nvidia-eps-forecast/              # 既存ディレクトリ
│   └── ...
│
└── micron-eps-forecast/              # 既存ディレクトリ
    └── ...

残りの課題:

• 比較コンポーネント（Comparison系）がルート直下に残っている
• AnimationControlPanel/AnimationExportButtonが未整理

提案: 機能別ディレクトリ構造

全体計画

financial-quiz/
│
├── waterfall/                      # ✅ 完了 - ウォーターフォールチャート
│   ├── PLWaterfallChart.vue
│   ├── CFWaterfallChart.vue
│   └── index.ts
│
├── proportional-statements/        # ✅ 完了 - 比例縮尺財務諸表
│   ├── ProportionalFinancialStatements.vue
│   ├── ProportionalFinancialStatementsAnimated.vue
│   ├── ProportionalFinancialStatementsComparison.vue
│   ├── BalanceSheetBox.vue
│   ├── BalanceSheetComparison.vue
│   └── index.ts
│
├── animation/                      # アニメーション制御（共通）
│   ├── AnimationControlPanel.vue
│   ├── AnimationExportButton.vue
│   ├── CompanySelectorModal.vue
│   ├── CompanySelectorSidebar.vue
│   ├── ExportContainer.vue
│   ├── composables/
│   │   ├── useCompanyFinancialMetrics.ts
│   │   └── industry-short-names.ts
│   └── index.ts
│
├── charts/                         # ✅ 完了 - 各種チャート
│   ├── base/                       # ベースコンポーネント
│   │   ├── BaseBarChart.vue
│   │   ├── BaseLineChart.vue
│   │   └── index.ts
│   ├── composables/
│   │   └── useChartDimensions.ts
│   ├── chartLayout.ts
│   ├── EPSChart.vue
│   ├── FCFChart.vue
│   ├── ProfitMarginChart.vue
│   ├── ExpenseRatioChart.vue
│   ├── EvMultiplesChart.vue
│   ├── LiquidityRatioChart.vue
│   ├── MarketCapChart.vue
│   ├── ROEChart.vue
│   ├── EACMarginChart.vue
│   ├── EACSingleMetricChart.vue
│   ├── PEEvEbitChart.vue
│   └── index.ts
│
├── comparison/                     # 比較コンポーネント
│   ├── BaseCompanyComparison.vue
│   ├── ChartComparison.vue
│   ├── GrossMarginComparison.vue
│   ├── NetIncomeComparison.vue
│   ├── EPSGrowthComparison.vue
│   ├── RevenueMarketCapComparison.vue
│   └── index.ts
│
├── forecasts/                      # 企業別予測
│   ├── nvidia/
│   │   └── (nvidia-eps-forecastの内容)
│   └── micron/
│   │   └── (micron-eps-forecastの内容)
│
└── shared/                         # 共有コンポーネント
    ├── FillInBlankQuestion.vue
    ├── FinancialChartsPanel.vue
    ├── FinancialDataTable.vue
    └── index.ts

実施状況

Phase 1: waterfall/ (2025-12-22 完了)

Phase 2: proportional-statements/ (2025-12-22 完了)

影響を受けたファイル:

• apps/web/app/pages/financial-quiz/waterfall-test.vue
• apps/web/app/pages/financial-quiz/proportional-animation.vue
• apps/web/app/pages/financial-quiz/proportional-comparison.vue
• apps/web/app/pages/financial-quiz/balance-sheet-test.vue
• apps/web/app/components/financial-quiz/proportional-animation/ExportContainer.vue

Phase 4: charts/ (2025-12-23 完了)

影響を受けたファイル:

• apps/web/app/components/financial-quiz/FinancialChartsPanel.vue
• apps/web/app/components/financial-quiz/proportional-animation/ExportContainer.vue

Phase 3以降: 未着手

移動時の作業手順

1. ディレクトリを作成
2. ファイルを移動（git mv推奨）
3. index.tsを作成してre-export
4. importしているファイルのパスを更新
5. ビルド・テストで動作確認

備考

• コンポーネントの内部ロジックは変更しない
• 段階的に実施し、一度に全てを移動しない
• 各Phase完了後にテストを実行して動作確認