Skip to content

Add Restocking tab, SaaS sidebar redesign, and collapsible nav#102

Open
SungLinChan wants to merge 2 commits into
beck-source:mainfrom
SungLinChan:new_features
Open

Add Restocking tab, SaaS sidebar redesign, and collapsible nav#102
SungLinChan wants to merge 2 commits into
beck-source:mainfrom
SungLinChan:new_features

Conversation

@SungLinChan

Copy link
Copy Markdown

Summary

  • Restocking Planner — new view with budget slider, greedy demand-based item recommendations (increasing → stable → decreasing trend priority), Place Order button, and order confirmation flow
  • SaaS sidebar redesign — replaced top nav bar with a collapsible left sidebar (240px expanded / 56px icons-only); CSS Grid layout, design token system via CSS variables, auto-collapses below 1024px
  • Orders tab — new "Submitted Restocking Orders" section showing RST-NNN order numbers, items, total value, and 7-day expected delivery
  • BackendPOST /api/restocking/orders and GET /api/restocking/orders endpoints with in-memory store; unit_cost field added to demand forecasts
  • i18n — EN + JA translation keys added for all new UI strings
  • Architecture page — standalone architecture.html overview of the system

Test plan

  • Start backend (cd server && uv run python main.py) and frontend (cd client && npm run dev)
  • Navigate to /restocking — verify budget slider loads with recommended items
  • Move slider left/right — verify items are added/removed and summary bar updates
  • Click "Place Order" — verify confirmation banner appears and button disables
  • Navigate to /orders — verify "Submitted Restocking Orders" section appears with the new order
  • Click sidebar toggle — verify collapse to 56px icons-only rail
  • Click — verify re-expansion to 240px with labels
  • Resize viewport below 1024px — verify sidebar auto-collapses
  • Verify all 7 nav tabs route correctly with active highlight
  • Switch language to Japanese — verify all new strings translate

🤖 Generated with Claude Code

SungLinChan and others added 2 commits May 26, 2026 10:52
- New Restocking Planner view with budget slider, greedy demand-based
  recommendations (increasing → stable → decreasing), and Place Order flow
- FastAPI endpoints POST/GET /api/restocking/orders with in-memory store;
  unit_cost field added to demand_forecasts.json and DemandForecast model
- Orders tab now shows Submitted Restocking Orders section with 7-day
  delivery lead time
- Replaced top nav bar with collapsible left sidebar (240px expanded,
  56px icons-only) using CSS Grid + width transition; auto-collapses
  below 1024px viewport
- Design token system (CSS variables) applied globally via App.vue :root
- FilterBar sticky offset corrected from top:70px to top:0
- EN + JA i18n keys added for all new UI strings
- Architecture overview page (architecture.html) added

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- useDarkMode composable: reads localStorage + prefers-color-scheme,
  applies data-theme on document root, persists preference
- App.vue: [data-theme="dark"] variable overrides for all sidebar
  and surface colors; toggle button ☾/☀ in sidebar footer
- Smooth 0.2s body transition for flicker-free theme switching

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant