Add new Spa POS vertical with appointment-based beauty/spa services: Main POS screens (3 device variants): - SpaDesktop.razor: Desktop 2-panel layout with service categories/grid + appointment panel - SpaTablet.razor: Tablet touch-friendly layout with 340px appointment sidebar - SpaMobile.razor: Mobile single-column with floating appointment button + bottom sheet Workflow screens (9 files): - CustomerLookup.razor: Search by phone/name with VIP tier display - CustomerProfile.razor: Full profile with tier progress, visit history, rewards - AppointmentBook.razor: Date picker, time slots grid (9:00-20:00), staff selection - ServicePackage.razor: Package list with expandable details and savings - ServiceCombo.razor: Active combos/promotions with flash sale timer - StaffAssign.razor: Staff list with ratings, skills, availability status - TherapistSchedule.razor: Calendar day view with horizontal timeline - TreatmentTimer.razor: Circular countdown timer with extend/complete actions - SpaJourney.razor: 5-step journey tracker (Check-in → Dịch vụ → Thực hiện → Thanh toán → Hoàn tất) All files follow existing Cafe/Karaoke patterns: - @layout PosLayout, @inherits PosBase - Bilingual EN/VI comments, section separators - CSS variables, Lucide icons, FormatPrice/NavigateTo helpers - Vietnamese UI labels, VND prices, demo data Co-authored-by: Velik <hongochai10@users.noreply.github.com>
WebClientTpos - Blazor Web App .NET 10
Base frontend web application cho GoodGo Platform được xây dựng với Blazor WebAssembly + BFF Pattern.
Quick Links
Architecture / Kiến trúc
┌─────────────────────────────────────────────────────────────────────┐
│ Browser │
│ ┌─────────────────────────────────────────────────────────────┐ │
│ │ Blazor WebAssembly Client │ │
│ └─────────────────────────────────────────────────────────────┘ │
└────────────────────────────────┬────────────────────────────────────┘
│ /api/*
▼
┌─────────────────────────────────────────────────────────────────────┐
│ BFF (Backend for Frontend) │
│ WebClientTpos.Server + YARP │
│ ┌─────────────────────────────────────────────────────────────┐ │
│ │ Routes: /api/iam/** → iam-service │ │
│ │ /api/merchants/** → merchant-service │ │
│ │ /api/catalog/** → catalog-service │ │
│ │ /api/orders/** → order-service │ │
│ └─────────────────────────────────────────────────────────────┘ │
└────────────────────────────────┬────────────────────────────────────┘
│ Internal Network
▼
┌─────────────────────────────────────────────────────────────────────┐
│ Microservices │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │ IAM │ │ Merchant │ │ Catalog │ │ Order │ │
│ │ :5101 │ │ :5102 │ │ :5103 │ │ :5104 │ │
│ └──────────┘ └──────────┘ └──────────┘ └──────────┘ │
└─────────────────────────────────────────────────────────────────────┘
Tech Stack
| Layer | Technology |
|---|---|
| Client | Blazor WebAssembly (.NET 10) |
| BFF | ASP.NET Core + YARP Reverse Proxy |
| Shared | Class Library với Data Annotations |
| Styling | CSS Variables, Dark Mode |
Getting Started / Bắt đầu
cd apps/web-client-base-net
dotnet restore
dotnet run --project src/WebClientTpos.Server
# Open http://localhost:5091
Project Structure / Cấu trúc
web-client-base-net/
├── src/
│ ├── WebClientTpos.Client/ # Blazor WebAssembly
│ ├── WebClientTpos.Server/ # BFF with YARP Proxy
│ └── WebClientTpos.Shared/ # Shared DTOs
├── docs/
│ ├── en/ # English docs
│ └── vi/ # Vietnamese docs
└── Dockerfile