# Robot Management Module - Architecture Design **Module:** Robot Management System **Version:** 1.0 **Date:** 2025-01-XX **Status:** ๐Ÿ“‹ Architecture Design Phase --- ## ๐Ÿ“‹ Mแปฅc Lแปฅc 1. [Tแป•ng Quan](#tแป•ng-quan) 2. [Cแบฅu Trรบc Database](#cแบฅu-trรบc-database) 3. [Cแบฅu Trรบc Backend](#cแบฅu-trรบc-backend) 4. [Cแบฅu Trรบc Frontend](#cแบฅu-trรบc-frontend) 5. [API Endpoints](#api-endpoints) 6. [VDA5050 Integration](#vda5050-integration) --- ## ๐ŸŽฏ Tแป•ng Quan ### Mแปฅc ฤรญch Xรขy dแปฑng hแป‡ thแป‘ng quแบฃn lรฝ thรดng tin robot bao gแป“m: - **RobotModel Management**: Quแบฃn lรฝ cรกc chแปงng loแบกi robot (thรชm, sแปญa, xรณa, preview) - **Robot Management**: Quแบฃn lรฝ thรดng tin robot (thรชm, sแปญa, xรณa, preview) - **Robot Detail**: Hiแปƒn thแป‹ thรดng tin robot theo tiรชu chuแบฉn VDA5050 vร  manual actions ### Quan Hแป‡ Dแปฏ Liแป‡u ``` RobotModel (1) โ”€โ”€< (N) Robot ``` - 1 RobotModel cรณ thแปƒ cรณ nhiแปu Robot - 1 Robot chแป‰ thuแป™c vแป 1 RobotModel --- ## ๐Ÿ—„๏ธ Cแบฅu Trรบc Database ### 1. Bแบฃng RobotModels ```sql CREATE TABLE [RobotModels] ( [Id] uniqueidentifier PRIMARY KEY DEFAULT NEWID(), [ModelName] nvarchar(256) NOT NULL, [Length] decimal(18,2) NOT NULL, -- Chiแปu dร i robot (m) [Width] decimal(18,2) NOT NULL, -- Chiแปu rแป™ng robot (m) [ImageWidth] int NOT NULL, -- Chiแปu rแป™ng แบฃnh (pixels) [ImageHeight] int NOT NULL, -- Chiแปu cao แบฃnh (pixels) [NavigationPointX] decimal(18,2) NOT NULL, -- Tแปa ฤ‘แป™ X ฤ‘iแปƒm navigation (m) [NavigationPointY] decimal(18,2) NOT NULL, -- Tแปa ฤ‘แป™ Y ฤ‘iแปƒm navigation (m) [NavigationType] int NOT NULL, -- Enum: Differential, Forklift, OmniDrive [CreatedDate] datetime2 NOT NULL DEFAULT GETUTCDATE(), [UpdatedDate] datetime2 NULL ); -- Indexes CREATE INDEX IX_RobotModels_ModelName ON [RobotModels]([ModelName]); CREATE INDEX IX_RobotModels_NavigationType ON [RobotModels]([NavigationType]); ``` **Fields:** - `Id`: GUID primary key - `ModelName`: Tรชn model robot (unique, cรณ thแปƒ thรชm constraint) - `Length`, `Width`: Kรญch thฦฐแป›c robot (mรฉt) - `ImageWidth`, `ImageHeight`: Kรญch thฦฐแป›c แบฃnh hiแปƒn thแป‹ - `NavigationPointX`, `NavigationPointY`: ฤiแปƒm navigation tฦฐฦกng ฤ‘แป‘i so vแป›i tรขm robot - `NavigationType`: Enum (0=Differential, 1=Forklift, 2=OmniDrive) - `CreatedDate`, `UpdatedDate`: Timestamps ### 2. Bแบฃng Robots ```sql CREATE TABLE [Robots] ( [Id] uniqueidentifier PRIMARY KEY DEFAULT NEWID(), [RobotId] nvarchar(64) NOT NULL UNIQUE, -- Robot identifier (serial number) [Name] nvarchar(256) NOT NULL, -- Tรชn hiแปƒn thแป‹ [ModelId] uniqueidentifier NOT NULL, -- FK to RobotModels [MapId] uniqueidentifier NULL, -- FK to Maps (cรณ thแปƒ nullable) [CreatedDate] datetime2 NOT NULL DEFAULT GETUTCDATE(), [UpdatedDate] datetime2 NULL, CONSTRAINT FK_Robots_RobotModels FOREIGN KEY ([ModelId]) REFERENCES [RobotModels]([Id]) ON DELETE RESTRICT ); -- Indexes CREATE INDEX IX_Robots_RobotId ON [Robots]([RobotId]); CREATE INDEX IX_Robots_ModelId ON [Robots]([ModelId]); CREATE INDEX IX_Robots_MapId ON [Robots]([MapId]); CREATE UNIQUE INDEX UX_Robots_RobotId ON [Robots]([RobotId]); ``` **Fields:** - `Id`: GUID primary key - `RobotId`: Serial number hoแบทc identifier duy nhแบฅt cแปงa robot - `Name`: Tรชn hiแปƒn thแป‹ cแปงa robot - `ModelId`: Foreign key ฤ‘แบฟn RobotModels - `MapId`: Foreign key ฤ‘แบฟn Maps (cรณ thแปƒ null nแบฟu chฦฐa gรกn map) - `CreatedDate`, `UpdatedDate`: Timestamps ### 3. Entity Relationship Diagram ``` โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ RobotModels โ”‚ โ”œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ค โ”‚ Id (PK) โ”‚ โ”‚ ModelName โ”‚ โ”‚ Length โ”‚ โ”‚ Width โ”‚ โ”‚ ImageWidth โ”‚ โ”‚ ImageHeight โ”‚ โ”‚ NavPointX โ”‚ โ”‚ NavPointY โ”‚ โ”‚ NavigationType โ”‚ โ”‚ CreatedDate โ”‚ โ”‚ UpdatedDate โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ 1 โ”‚ โ”‚ N โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ–ผโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ Robots โ”‚ โ”œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ค โ”‚ Id (PK) โ”‚ โ”‚ RobotId (UK) โ”‚ โ”‚ Name โ”‚ โ”‚ ModelId (FK) โ”‚โ”€โ”€โ” โ”‚ MapId (FK) โ”‚ โ”‚ โ”‚ CreatedDate โ”‚ โ”‚ โ”‚ UpdatedDate โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ (optional) โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ–ผ [Maps Table] ``` --- ## ๐Ÿ”ง Cแบฅu Trรบc Backend ### 1. Folder Structure ``` RobotNet10.FleetManager/ โ”œโ”€โ”€ Data/ โ”‚ โ”œโ”€โ”€ NavigationType.cs โœ… (Enum) โ”‚ โ”œโ”€โ”€ RobotModel.cs โœ… (Entity) โ”‚ โ”œโ”€โ”€ Robot.cs โœ… (Entity) โ”‚ โ””โ”€โ”€ ApplicationDbContext.cs (Update: Add DbSets) โ”‚ โ”œโ”€โ”€ Services/ โ”‚ โ”œโ”€โ”€ IRobotModelService.cs (Interface) โ”‚ โ”œโ”€โ”€ RobotModelService.cs (Implementation) โ”‚ โ”œโ”€โ”€ IRobotService.cs (Interface) โ”‚ โ”œโ”€โ”€ RobotService.cs (Implementation) โ”‚ โ”œโ”€โ”€ IRobotModelImageStorageService.cs (Image storage interface) โ”‚ โ””โ”€โ”€ RobotModelImageStorageService.cs (FileSystem implementation) โ”‚ โ”œโ”€โ”€ Controllers/ โ”‚ โ”œโ”€โ”€ RobotModelController.cs (API endpoints) โ”‚ โ”œโ”€โ”€ RobotController.cs (API endpoints) โ”‚ โ””โ”€โ”€ RobotModelImagesController.cs (Image upload/download) โ”‚ โ””โ”€โ”€ Hubs/ โ””โ”€โ”€ RobotStateHub.cs (SignalR Hub cho VDA5050 State) RobotNet10.FleetManager.Shared/ โ”œโ”€โ”€ DTOs/ โ”‚ โ”œโ”€โ”€ RobotModel/ โ”‚ โ”‚ โ”œโ”€โ”€ RobotModelDto.cs โ”‚ โ”‚ โ”œโ”€โ”€ CreateRobotModelRequest.cs โ”‚ โ”‚ โ”œโ”€โ”€ UpdateRobotModelRequest.cs โ”‚ โ”‚ โ””โ”€โ”€ RobotModelUsageInfoDto.cs โ”‚ โ””โ”€โ”€ Robot/ โ”‚ โ”œโ”€โ”€ RobotDto.cs โ”‚ โ”œโ”€โ”€ CreateRobotRequest.cs โ”‚ โ””โ”€โ”€ UpdateRobotRequest.cs ``` ### 2. Services Interface #### IRobotModelService ```csharp public interface IRobotModelService { Task CreateAsync(CreateRobotModelRequest request); Task> GetAllAsync(); Task GetByIdAsync(Guid id); Task UpdateAsync(Guid id, UpdateRobotModelRequest request); Task DeleteAsync(Guid id); Task> SearchAsync(string query); Task ExistsAsync(string modelName); Task GetUsageInfoAsync(Guid id); } ``` #### IRobotService ```csharp public interface IRobotService { Task CreateAsync(CreateRobotRequest request); Task> GetAllAsync(); Task GetByIdAsync(Guid id); Task GetByRobotIdAsync(string robotId); Task UpdateAsync(Guid id, UpdateRobotRequest request); Task DeleteAsync(Guid id); Task> GetByModelIdAsync(Guid modelId); Task> SearchAsync(string query); Task ExistsAsync(string robotId); } ``` ### 3. DTOs Structure #### RobotModelDto ```csharp public class RobotModelDto { public Guid Id { get; set; } public string ModelName { get; set; } public decimal Length { get; set; } public decimal Width { get; set; } public int ImageWidth { get; set; } public int ImageHeight { get; set; } public decimal NavigationPointX { get; set; } public decimal NavigationPointY { get; set; } public NavigationType NavigationType { get; set; } public DateTime CreatedDate { get; set; } public DateTime? UpdatedDate { get; set; } public int RobotCount { get; set; } // Sแป‘ lฦฐแปฃng robot sแปญ dแปฅng model nร y } ``` #### RobotDto ```csharp public class RobotDto { public Guid Id { get; set; } public string RobotId { get; set; } public string Name { get; set; } public Guid ModelId { get; set; } public string? ModelName { get; set; } // Include tแปซ RobotModel public Guid? MapId { get; set; } public DateTime CreatedDate { get; set; } public DateTime? UpdatedDate { get; set; } } ``` --- ## ๐ŸŽจ Cแบฅu Trรบc Frontend ### 1. Folder Structure ``` RobotNet10.FleetManager.Client/ โ”œโ”€โ”€ Pages/ โ”‚ โ”œโ”€โ”€ RobotModelManager.razor (Main page: /robot-models) โ”‚ โ”œโ”€โ”€ RobotManager.razor (Main page: /robots) โ”‚ โ””โ”€โ”€ RobotDetail.razor (Detail page: /robots/{robotId}/detail) โ”‚ โ””โ”€โ”€ Components/ (Optional: nแบฟu tรกch components) โ”œโ”€โ”€ RobotModelManager/ โ”‚ โ”œโ”€โ”€ RobotModelManagerComponent.razor โ”‚ โ”œโ”€โ”€ RobotModelListPanel.razor โ”‚ โ”œโ”€โ”€ RobotModelDetailsPanel.razor โ”‚ โ””โ”€โ”€ Dialogs/ โ”‚ โ”œโ”€โ”€ CreateRobotModelDialog.razor โ”‚ โ”œโ”€โ”€ EditRobotModelDialog.razor โ”‚ โ””โ”€โ”€ DeleteRobotModelDialog.razor โ”‚ โ”œโ”€โ”€ RobotManager/ โ”‚ โ”œโ”€โ”€ RobotManagerComponent.razor โ”‚ โ”œโ”€โ”€ RobotListPanel.razor โ”‚ โ”œโ”€โ”€ RobotDetailsPanel.razor โ”‚ โ””โ”€โ”€ Dialogs/ โ”‚ โ”œโ”€โ”€ CreateRobotDialog.razor โ”‚ โ”œโ”€โ”€ EditRobotDialog.razor โ”‚ โ””โ”€โ”€ DeleteRobotDialog.razor โ”‚ โ””โ”€โ”€ RobotDetail/ โ”œโ”€โ”€ RobotDetailComponent.razor โ”œโ”€โ”€ VDA5050StatePanel.razor โ”œโ”€โ”€ ManualActionsPanel.razor โ””โ”€โ”€ RobotInfoCard.razor ``` ### 2. Layout Design #### 2.1. RobotModelManager Page Layout ``` โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ Header (MudPaper) โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ Robot Model Management [Search] [Add] โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ค โ”‚ Main Content (MudGrid) โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ Left Panel (60%) โ”‚ Right Panel (40%) โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ RobotModelList โ”‚ RobotModelDetails โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Search Bar โ”‚ โ”‚ โ”‚ Image Preview โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ [Image Canvas] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ + NavigationPoint โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ MudTable โ”‚ โ”‚ โ”‚ โ”‚ (mลฉi tรชn X, Y) โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - ModelName โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - NavType โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - Dimensions โ”‚ โ”‚ โ”‚ Dimensions โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - RobotCount โ”‚ โ”‚ โ”‚ - Length x Width โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - Actions โ”‚ โ”‚ โ”‚ - Image Size โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Navigation Point โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - X, Y coordinates โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Usage Statistics โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - Robot Count โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Actions โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ [Edit] [Delete] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ดโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ ``` **Lฦฐu รฝ:** - Left Panel: Chแป‰ hiแปƒn thแป‹ danh sรกch (ModelName, NavType, Dimensions, RobotCount) - Right Panel: Preview แบฃnh vแป›i NavigationPoint overlay, thรดng tin chi tiแบฟt, khรดng lแบทp lแบกi thรดng tin tแปซ Left Panel #### 2.2. RobotManager Page Layout ``` โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ Header (MudPaper) โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ Robot Management [Search] [Add] โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ค โ”‚ Main Content (MudContainer) โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ Search & Filters โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ [Search] [Filter by Model] [Filter by Map] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Robot Table (MudTable) โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ RobotId โ”‚ Name โ”‚ Model โ”‚ Map โ”‚ Actions โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ผโ”€โ”€โ”€โ”€โ”€โ”€โ”ผโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ผโ”€โ”€โ”€โ”€โ”€โ”ผโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ ROBOT01 โ”‚ R1 โ”‚ AMR-T โ”‚ M1 โ”‚ [Detail][Edit] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ ROBOT02 โ”‚ R2 โ”‚ AMR-F โ”‚ M2 โ”‚ [Detail][Edit] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ ... โ”‚ ... โ”‚ ... โ”‚ ... โ”‚ ... โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Pagination โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ ``` **Lฦฐu รฝ:** - Bแป Right Panel vรฌ thรดng tin robot รญt - Chแป‰ cรณ 1 bแบฃng vแป›i ฤ‘แบงy ฤ‘แปง thรดng tin - Actions: View Detail (link ฤ‘แบฟn RobotDetail page), Edit, Delete #### 2.3. RobotDetail Page Layout ``` โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ Header (MudPaper) โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ Robot Detail: {RobotName} [Back] [Refresh] โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ค โ”‚ Main Content (MudGrid) โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ Left Panel (60%) โ”‚ Right Panel (40%) โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ VDA5050 State โ”‚ Manual Actions โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Robot Info โ”‚ โ”‚ โ”‚ Action List โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Card โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ Action Type โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ [Select] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Position โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - X, Y, ฮธ โ”‚ โ”‚ โ”‚ Action Parameters โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - MapId โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ Key-Value pairs โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ [Add] [Remove] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Battery โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - Charge % โ”‚ โ”‚ โ”‚ [Send Action] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - Voltage โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Robot Status โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Order Info โ”‚ โ”‚ โ”‚ - Operating Mode โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - OrderId โ”‚ โ”‚ โ”‚ - Driving Status โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - NodeId โ”‚ โ”‚ โ”‚ - Paused โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ Errors & Warnings โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ Errors โ”‚ โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ - List โ”‚ โ”‚ โ”‚ Error List โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ [Clear] โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ”‚ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ดโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ โ”‚ โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ ``` ### 3. Component Details #### 3.1. RobotModelListPanel **Features:** - MudTable vแป›i sorting - Search functionality - Pagination - Row selection - Actions: Edit, Delete, View Details **Columns:** - ModelName (sortable) - NavigationType (Chip) - Dimensions (Length x Width) - formatted display - Robot Count (Badge) - Actions (Icon buttons: Edit, Delete, View Details) #### 3.2. RobotModelDetailsPanel **Sections:** - **Image Preview** (Canvas/SVG vแป›i NavigationPoint overlay) - Hiแปƒn thแป‹ แบฃnh robot model - Vแบฝ mลฉi tรชn tแบกi NavigationPoint (X, Y) - Mลฉi tรชn hฦฐแป›ng lรชn trรชn (Y+) vร  sang phแบฃi (X+) - **Dimensions** - Length x Width (m) - Image Size (pixels) - **Navigation Point** - X, Y coordinates (m) - **Usage Statistics** - Robot Count (sแป‘ robot ฤ‘ang sแปญ dแปฅng model nร y) - **Actions** - Edit, Delete buttons #### 3.3. RobotManager Table **Features:** - MudTable vแป›i sorting - Search functionality (search by RobotId, Name) - Filter by Model (MudSelect dropdown) - Filter by Map (MudSelect dropdown) - Pagination - Inline actions trong table **Columns:** - RobotId (sortable, link to detail page) - Name (sortable) - Model (link to model, hiแปƒn thแป‹ ModelName) - Map (link to map, nullable, hiแปƒn thแป‹ MapName nแบฟu cรณ) - Actions (Icon buttons: View Detail, Edit, Delete) **Lฦฐu รฝ:** Khรดng cรณ Right Panel, tแบฅt cแบฃ thรดng tin hiแปƒn thแป‹ trong table #### 3.5. RobotDetailComponent (VDA5050) **Real-time Data:** - SignalR Hub Client kแบฟt nแป‘i ฤ‘แบฟn RobotStateHub - Subscribe to robot khi vร o page - Nhแบญn events: `OnStateUpdate`, `OnVisualizationUpdate` - Manual refresh button - Auto-disconnect khi rแปi page **VDA5050 State Sections (tแปซ StateMsg):** 1. **Header Info Card** - HeaderId - Timestamp - Version - Manufacturer - SerialNumber 2. **Position Card** (tแปซ agvPosition) - X, Y, Theta - MapId - PositionInitialized - LocalizationScore - DeviationRange 3. **Velocity Card** (tแปซ velocity) - vx, vy, omega 4. **Battery Card** (tแปซ batteryState) - BatteryCharge (%) - BatteryVoltage - BatteryHealth - Charging status - Reach (estimated) 5. **Order Info Card** - OrderId - OrderUpdateId - ZoneSetId - LastNodeId - LastNodeSequenceId - Driving status - Paused status - NewBaseRequest - DistanceSinceLastNode - OperatingMode 6. **Maps Card** (tแปซ maps array) - MapId, MapDescription, MapVersion 7. **Node States** (tแปซ nodeStates array) - MudTable: NodeId, SequenceId, Released, NodePosition 8. **Edge States** (tแปซ edgeStates array) - MudTable: EdgeId, SequenceId, Released 9. **Action States** (tแปซ actionStates array) - MudTable: ActionId, ActionType, ActionStatus, ResultDescription 10. **Loads Card** (tแปซ loads array) - MudTable: LoadId, LoadType, LoadPosition, Weight, Dimensions 11. **Errors Card** (tแปซ errors array) - MudTable: ErrorType, ErrorLevel, ErrorDescription, ErrorReferences - Color coding (ERROR/WARNING/INFO) 12. **Information Card** (tแปซ information array) โญ **MแปšI** - MudTable: InfoType, InfoLevel, InfoDescription, InfoReferences - Color coding (INFO/WARNING/DEBUG) 13. **Safety State Card** (tแปซ safetyState) - EStop status (enum: NONE, SOFT, HARD) - FieldViolation (bool) **VDA5050 Visualization Sections (tแปซ VisualizationMsg):** 14. **Visualization Position** (tแปซ visualization.agvPosition) - X, Y, Theta, MapId, PositionInitialized 15. **Visualization Velocity** (tแปซ visualization.velocity) - vx, vy, omega #### 3.6. ManualActionsPanel **Features:** - Action Type selector (MudSelect vแป›i ActionType enum) - Action Parameters editor (Key-Value pairs) - Send Action button - Action History (recent actions sent) **Action Types:** - startPause / stopPause - startCharging / stopCharging - cancelOrder - stateRequest - initPosition - etc. (theo VDA5050 ActionType enum) --- ## ๐Ÿ”Œ API Endpoints ### RobotModelController **Base Route:** `/api/robot-models` | Method | Endpoint | Description | Request | Response | |--------|----------|-------------|---------|----------| | GET | `/api/robot-models` | Get all robot models | - | `List` | | GET | `/api/robot-models/{id}` | Get robot model by ID | - | `RobotModelDto` | | GET | `/api/robot-models/search?query={text}` | Search robot models | - | `List` | | GET | `/api/robot-models/{id}/usage` | Get usage info | - | `RobotModelUsageInfoDto` | | POST | `/api/robot-models` | Create robot model | `CreateRobotModelRequest` | `RobotModelDto` (201) | | PUT | `/api/robot-models/{id}` | Update robot model | `UpdateRobotModelRequest` | `RobotModelDto` | | DELETE | `/api/robot-models/{id}` | Delete robot model | - | 204 No Content | | GET | `/api/robot-models/{id}/image` | Get robot model image | - | Image file (PNG) | | POST | `/api/robot-models/{id}/image` | Upload robot model image | `multipart/form-data` | Success message | | DELETE | `/api/robot-models/{id}/image` | Delete robot model image | - | 204 No Content | ### RobotController **Base Route:** `/api/robots` | Method | Endpoint | Description | Request | Response | |--------|----------|-------------|---------|----------| | GET | `/api/robots` | Get all robots | `?modelId={guid}&mapId={guid}` | `List` | | GET | `/api/robots/{id}` | Get robot by ID | - | `RobotDto` | | GET | `/api/robots/robotId/{robotId}` | Get robot by RobotId | - | `RobotDto` | | GET | `/api/robots/search?query={text}` | Search robots | - | `List` | | GET | `/api/robots/model/{modelId}` | Get robots by model | - | `List` | | POST | `/api/robots` | Create robot | `CreateRobotRequest` | `RobotDto` (201) | | PUT | `/api/robots/{id}` | Update robot | `UpdateRobotRequest` | `RobotDto` | | DELETE | `/api/robots/{id}` | Delete robot | - | 204 No Content | --- ## ๐Ÿ”„ VDA5050 Integration ### 1. SignalR Hub Architecture **RobotStateHub:** - Hub chแบกy trรชn FleetManager Server - Nhแบญn State vร  Visualization messages tแปซ RobotApp (qua MQTT hoแบทc direct) - HubServer chแปง ฤ‘แป™ng gแปญi updates theo chu kแปณ ฤ‘แบฟn connected clients - Frontend kแบฟt nแป‘i SignalR vร  lแบฏng nghe events **Flow:** ``` RobotApp โ†’ MQTT/HTTP โ†’ FleetManager Backend โ†’ RobotStateHub โ†’ Frontend (SignalR Client) ``` **Hub Methods:** - `SubscribeToRobot(string robotId)`: Client subscribe ฤ‘แปƒ nhแบญn updates cแปงa robot cแปฅ thแปƒ - `UnsubscribeFromRobot(string robotId)`: Client unsubscribe **Hub Events (Server โ†’ Client):** - `OnStateUpdate(string robotId, StateMsg state)`: Khi cรณ State message mแป›i - `OnVisualizationUpdate(string robotId, VisualizationMsg visualization)`: Khi cรณ Visualization message mแป›i **Hub Configuration:** - HubServer gแปญi updates theo chu kแปณ (configurable, vรญ dแปฅ: mแป—i 500ms) - Frontend chแป‰ cแบญp nhแบญt khi nhแบญn ฤ‘ฦฐแปฃc event hoแบทc manual refresh ### 2. Image Storage (RobotModel) **Service:** `IRobotModelImageStorageService` - Tฦฐฦกng tแปฑ `IImageStorageService` trong MapManager - FileSystem-based storage - File naming: `{robotModelId}.png` - Location: `{AppBaseDirectory}/RobotModelImages/` **API Endpoints:** ``` GET /api/robot-models/{id}/image - Get image POST /api/robot-models/{id}/image - Upload image (multipart/form-data) DELETE /api/robot-models/{id}/image - Delete image ``` **Image Upload Flow:** 1. User chแปn file แบฃnh trong Create/Edit dialog 2. Frontend upload แบฃnh qua API 3. Backend lฦฐu แบฃnh vร  extract dimensions (ImageWidth, ImageHeight) 4. Backend lฦฐu dimensions vร o database 5. Frontend hiแปƒn thแป‹ preview vแป›i NavigationPoint overlay **Image Preview vแป›i NavigationPoint:** - Sแปญ dแปฅng HTML5 Canvas hoแบทc SVG overlay - Vแบฝ mลฉi tรชn tแบกi tแปa ฤ‘แป™ (NavigationPointX, NavigationPointY) - Mลฉi tรชn hฦฐแป›ng lรชn trรชn (Y+) vร  sang phแบฃi (X+) nhฦฐ gแป‘c tแปa ฤ‘แป™ - Scale tแปa ฤ‘แป™ tแปซ mรฉt sang pixels dแปฑa trรชn ImageWidth/ImageHeight vร  Length/Width ### 3. Manual Actions **API Endpoint:** ``` POST /api/robots/{robotId}/actions Body: { "actionType": "startPause", "actionParameters": [ {"key": "duration", "value": "60"} ] } ``` **Flow:** 1. User chแปn action type vร  parameters 2. Frontend gแปญi request ฤ‘แบฟn FleetManager API 3. FleetManager chuyแปƒn tiแบฟp action ฤ‘แบฟn robot (MQTT/HTTP) 4. Robot thแปฑc hiแป‡n action vร  bรกo cรกo qua State message ### 4. Data Storage **State & Visualization Messages:** - In-memory storage trong HubServer - Lฦฐu latest state per robot - Mแบฅt khi restart (khรดng persist) - Cรณ thแปƒ thรชm option lฦฐu vร o DB nแบฟu cแบงn history (future enhancement) --- ## ๐Ÿ“ Implementation Steps ### Phase 1: Database & Entities (Foundation) #### 1.1. Create Enum - [ ] Create `NavigationType.cs` enum vแป›i 3 values: Differential, Forklift, OmniDrive - [ ] Location: `RobotNet10.FleetManager/Data/NavigationType.cs` #### 1.2. Create Entities - [ ] Create `RobotModel.cs` entity vแป›i ฤ‘แบงy ฤ‘แปง properties - Id, ModelName, Length, Width, ImageWidth, ImageHeight - NavigationPointX, NavigationPointY, NavigationType - CreatedDate, UpdatedDate - Navigation property: Robots collection - [ ] Create `Robot.cs` entity vแป›i ฤ‘แบงy ฤ‘แปง properties - Id, RobotId, Name, ModelId, MapId - CreatedDate, UpdatedDate - Navigation property: RobotModel #### 1.3. Update Database Context - [ ] Update `ApplicationDbContext.cs` - Add `DbSet RobotModels` - Add `DbSet Robots` - Configure entity relationships trong `OnModelCreating` - Configure indexes #### 1.4. Database Migration - [ ] Create EF Core migration: `AddRobotManagementTables` - [ ] Review migration script - [ ] Apply migration to database - [ ] Verify tables vร  indexes ฤ‘ฦฐแปฃc tแบกo ฤ‘รบng **Deliverables:** - NavigationType enum - RobotModel entity - Robot entity - Database migration - Tables trong database --- ### Phase 2: Shared DTOs (Data Transfer Objects) #### 2.1. RobotModel DTOs - [ ] Create `RobotModelDto.cs` trong `RobotNet10.FleetManager.Shared/DTOs/RobotModel/` - [ ] Create `CreateRobotModelRequest.cs` vแป›i validation attributes - [ ] Create `UpdateRobotModelRequest.cs` vแป›i validation attributes - [ ] Create `RobotModelUsageInfoDto.cs` cho usage statistics #### 2.2. Robot DTOs - [ ] Create `RobotDto.cs` trong `RobotNet10.FleetManager.Shared/DTOs/Robot/` - [ ] Create `CreateRobotRequest.cs` vแป›i validation attributes - [ ] Create `UpdateRobotRequest.cs` vแป›i validation attributes #### 2.3. Error Response DTOs - [ ] Create `ErrorResponseDto.cs` (nแบฟu chฦฐa cรณ) cho API error responses **Deliverables:** - Tแบฅt cแบฃ DTOs trong RobotNet10.FleetManager.Shared - Validation attributes ฤ‘แบงy ฤ‘แปง --- ### Phase 3: Backend Services Layer #### 3.1. RobotModel Service - [ ] Create `IRobotModelService.cs` interface - Methods: CreateAsync, GetAllAsync, GetByIdAsync, UpdateAsync, DeleteAsync - Methods: SearchAsync, ExistsAsync, GetUsageInfoAsync - [ ] Create `RobotModelService.cs` implementation - Implement tแบฅt cแบฃ methods - Add validation logic - Add error handling - Check foreign key constraints khi delete #### 3.2. Robot Service - [ ] Create `IRobotService.cs` interface - Methods: CreateAsync, GetAllAsync, GetByIdAsync, GetByRobotIdAsync - Methods: UpdateAsync, DeleteAsync, GetByModelIdAsync, SearchAsync, ExistsAsync - [ ] Create `RobotService.cs` implementation - Implement tแบฅt cแบฃ methods - Add validation logic - Add error handling #### 3.3. Image Storage Service - [ ] Create `IRobotModelImageStorageService.cs` interface - Methods: SaveImageAsync, GetImageAsync, DeleteImageAsync, ImageExistsAsync, GetImageDimensionsAsync - [ ] Create `RobotModelImageStorageService.cs` implementation - FileSystem-based storage - Folder: `{AppBaseDirectory}/RobotModelImages/` - File naming: `{robotModelId}.png` - Use ImageSharp ฤ‘แปƒ extract dimensions #### 3.4. Service Registration - [ ] Register services trong `Program.cs` - AddScoped IRobotModelService, RobotModelService - AddScoped IRobotService, RobotService - AddScoped IRobotModelImageStorageService, RobotModelImageStorageService **Deliverables:** - 3 Service interfaces - 3 Service implementations - Services registered trong DI container --- ### Phase 4: API Controllers #### 4.1. RobotModel Controller - [ ] Create `RobotModelController.cs` - GET `/api/robot-models` - GetAll - GET `/api/robot-models/{id}` - GetById - GET `/api/robot-models/search?query={text}` - Search - GET `/api/robot-models/{id}/usage` - GetUsageInfo - POST `/api/robot-models` - Create - PUT `/api/robot-models/{id}` - Update - DELETE `/api/robot-models/{id}` - Delete - [ ] Add error handling vร  validation - [ ] Add proper HTTP status codes - [ ] Add API documentation comments #### 4.2. Robot Controller - [ ] Create `RobotController.cs` - GET `/api/robots` - GetAll (vแป›i filters: modelId, mapId) - GET `/api/robots/{id}` - GetById - GET `/api/robots/robotId/{robotId}` - GetByRobotId - GET `/api/robots/search?query={text}` - Search - GET `/api/robots/model/{modelId}` - GetByModelId - POST `/api/robots` - Create - PUT `/api/robots/{id}` - Update - DELETE `/api/robots/{id}` - Delete - [ ] Add error handling vร  validation - [ ] Add proper HTTP status codes - [ ] Add API documentation comments #### 4.3. RobotModel Images Controller - [ ] Create `RobotModelImagesController.cs` - GET `/api/robot-models/{id}/image` - GetImage - POST `/api/robot-models/{id}/image` - UploadImage (multipart/form-data) - DELETE `/api/robot-models/{id}/image` - DeleteImage - [ ] Add file validation (PNG only, max size) - [ ] Extract vร  update ImageWidth, ImageHeight trong database #### 4.4. API Testing - [ ] Test tแบฅt cแบฃ endpoints vแป›i Postman/curl - [ ] Verify error handling - [ ] Verify validation rules **Deliverables:** - 3 Controllers vแป›i ฤ‘แบงy ฤ‘แปง endpoints - API documentation - Tested vร  verified --- ### Phase 5: SignalR Hub (VDA5050 Integration) #### 5.1. RobotState Hub - [ ] Create `RobotStateHub.cs` trong `RobotNet10.FleetManager/Hubs/` - Hub class kแบฟ thแปซa Hub - Methods: SubscribeToRobot, UnsubscribeFromRobot - Events: OnStateUpdate, OnVisualizationUpdate - [ ] Create HubContext service ฤ‘แปƒ manage robot subscriptions - [ ] Implement logic ฤ‘แปƒ nhแบญn State/Visualization tแปซ backend - [ ] Implement periodic broadcast ฤ‘แบฟn clients #### 5.2. Hub Registration - [ ] Register Hub trong `Program.cs` - MapHub("/hubs/robot-state") - [ ] Configure SignalR options nแบฟu cแบงn #### 5.3. Backend Integration (Future) - [ ] Note: Integration vแป›i MQTT/HTTP ฤ‘แปƒ nhแบญn messages tแปซ RobotApp - [ ] Note: Sแบฝ implement trong phase sau khi cรณ RobotConnections module **Deliverables:** - RobotStateHub - Hub registered vร  accessible - Ready ฤ‘แปƒ integrate vแป›i frontend --- ### Phase 6: Frontend - RobotModel Management #### 6.1. API Service Client - [ ] Create `RobotModelApiService.cs` trong Client project - Methods ฤ‘แปƒ call tแบฅt cแบฃ RobotModel endpoints - Methods ฤ‘แปƒ upload/download images - [ ] Create `RobotApiService.cs` trong Client project - Methods ฤ‘แปƒ call tแบฅt cแบฃ Robot endpoints #### 6.2. State Management (Optional) - [ ] Create `RobotModelManagerState.cs` (nแบฟu cแบงn state management) - SelectedRobotModel - RobotModels list - Loading states #### 6.3. RobotModelManager Page - [ ] Create `RobotModelManager.razor` page - Route: `/robot-models` - Layout: Header vแป›i Search vร  Add button - Two-column layout (60% List, 40% Details) #### 6.4. RobotModelListPanel Component - [ ] Create `RobotModelListPanel.razor` - MudTable vแป›i columns: ModelName, NavigationType, Dimensions, RobotCount, Actions - Search functionality - Sorting - Pagination - Row selection ฤ‘แปƒ hiแปƒn thแป‹ details - Actions: Edit, Delete buttons #### 6.5. RobotModelDetailsPanel Component - [ ] Create `RobotModelDetailsPanel.razor` - Image Preview section vแป›i Canvas/SVG - NavigationPoint overlay (mลฉi tรชn X+, Y+) - Dimensions display - Navigation Point coordinates - Usage Statistics (Robot Count) - Actions: Edit, Delete buttons #### 6.6. Image Preview vแป›i NavigationPoint - [ ] Create component ฤ‘แปƒ render image vแป›i overlay - Load image tแปซ API - Calculate scale tแปซ Length/Width vร  ImageWidth/ImageHeight - Draw arrow tแบกi NavigationPoint coordinates - Arrow direction: up (Y+) vร  right (X+) #### 6.7. Create RobotModel Dialog - [ ] Create `CreateRobotModelDialog.razor` - Form fields: ModelName, Length, Width, NavigationPointX, NavigationPointY, NavigationType - Image upload input (file picker) - Image preview - Validation - Submit handler #### 6.8. Edit RobotModel Dialog - [ ] Create `EditRobotModelDialog.razor` - Pre-fill form vแป›i existing data - Image upload/replace - Image preview vแป›i NavigationPoint - Validation - Submit handler #### 6.9. Delete RobotModel Dialog - [ ] Create `DeleteRobotModelDialog.razor` - Confirmation message - Show usage info (Robot count) - Warning nแบฟu cรณ robots ฤ‘ang sแปญ dแปฅng - Delete handler **Deliverables:** - Complete RobotModel management UI - Image upload vร  preview - NavigationPoint visualization - CRUD operations working --- ### Phase 7: Frontend - Robot Management #### 7.1. RobotManager Page - [ ] Create `RobotManager.razor` page - Route: `/robots` - Layout: Header vแป›i Search, Filters, vร  Add button - Single table layout (no Right Panel) #### 7.2. RobotTable Component - [ ] Create `RobotTable.razor` component - MudTable vแป›i columns: RobotId, Name, Model, Map, Actions - Search functionality (by RobotId, Name) - Filter by Model (MudSelect dropdown) - Filter by Map (MudSelect dropdown) - Sorting - Pagination - Actions: View Detail (link), Edit, Delete buttons #### 7.3. Create Robot Dialog - [ ] Create `CreateRobotDialog.razor` - Form fields: RobotId, Name, ModelId (dropdown), MapId (dropdown, optional) - Validation - Submit handler #### 7.4. Edit Robot Dialog - [ ] Create `EditRobotDialog.razor` - Pre-fill form vแป›i existing data - ModelId vร  MapId dropdowns - Validation - Submit handler #### 7.5. Delete Robot Dialog - [ ] Create `DeleteRobotDialog.razor` - Confirmation message - Delete handler **Deliverables:** - Complete Robot management UI - Table vแป›i search vร  filters - CRUD operations working --- ### Phase 8: Frontend - RobotDetail (VDA5050) #### 8.1. SignalR Hub Client - [ ] Create `RobotStateHubClient.cs` trong Client project - Connect to `/hubs/robot-state` - Methods: SubscribeToRobot, UnsubscribeFromRobot - Event handlers: OnStateUpdate, OnVisualizationUpdate - Connection management (connect, disconnect) #### 8.2. RobotDetail Page - [ ] Create `RobotDetail.razor` page - Route: `/robots/{robotId}/detail` - Header vแป›i Robot name, Back button, Refresh button - Two-column layout (60% State, 40% Manual Actions) - Initialize SignalR connection - Subscribe to robot khi vร o page - Unsubscribe khi rแปi page #### 8.3. VDA5050 State Cards - [ ] Create `HeaderInfoCard.razor` - Header info - [ ] Create `PositionCard.razor` - AgvPosition - [ ] Create `VelocityCard.razor` - Velocity - [ ] Create `BatteryCard.razor` - BatteryState - [ ] Create `OrderInfoCard.razor` - Order information - [ ] Create `MapsCard.razor` - Maps array - [ ] Create `NodeStatesCard.razor` - NodeStates table - [ ] Create `EdgeStatesCard.razor` - EdgeStates table - [ ] Create `ActionStatesCard.razor` - ActionStates table - [ ] Create `LoadsCard.razor` - Loads table - [ ] Create `ErrorsCard.razor` - Errors table vแป›i color coding - [ ] Create `InformationCard.razor` - Information array vแป›i color coding - [ ] Create `SafetyStateCard.razor` - SafetyState #### 8.4. VDA5050 Visualization Cards - [ ] Create `VisualizationPositionCard.razor` - Visualization agvPosition - [ ] Create `VisualizationVelocityCard.razor` - Visualization velocity #### 8.5. Manual Actions Panel - [ ] Create `ManualActionsPanel.razor` - Action Type selector (MudSelect vแป›i ActionType enum) - Action Parameters editor (Key-Value pairs vแป›i Add/Remove) - Send Action button - Action History (recent actions sent) - Call API endpoint ฤ‘แปƒ send action #### 8.6. State Update Integration - [ ] Integrate SignalR events vร o RobotDetail page - Handle OnStateUpdate event - Update tแบฅt cแบฃ State cards - Handle OnVisualizationUpdate event - Update Visualization cards - Error handling cho connection issues **Deliverables:** - Complete RobotDetail page - Real-time State vร  Visualization updates - Manual Actions functionality - All VDA5050 fields displayed --- ### Phase 9: Testing & Polish #### 9.1. Unit Tests (Optional) - [ ] Test Services (RobotModelService, RobotService) - [ ] Test Controllers - [ ] Test Image Storage Service #### 9.2. Integration Testing - [ ] Test full flow: Create RobotModel โ†’ Upload Image โ†’ Create Robot โ†’ View Detail - [ ] Test SignalR connection vร  updates - [ ] Test error scenarios #### 9.3. UI/UX Polish - [ ] Verify responsive design - [ ] Add loading states - [ ] Add error messages - [ ] Add success notifications - [ ] Verify navigation flows #### 9.4. Documentation - [ ] Update API documentation - [ ] Add code comments - [ ] Create user guide (nแบฟu cแบงn) **Deliverables:** - Fully tested module - Polished UI/UX - Documentation complete --- ### Phase 10: Manual Actions API (Future) #### 10.1. Manual Actions Endpoint - [ ] Create endpoint: POST `/api/robots/{robotId}/actions` - [ ] Validate action type vร  parameters - [ ] Forward action ฤ‘แบฟn robot (MQTT/HTTP) - [ ] Return response **Note:** Phase nร y sแบฝ implement sau khi cรณ RobotConnections module ฤ‘แปƒ forward actions ฤ‘แบฟn robot. --- ## ๐Ÿ“Š Implementation Summary | Phase | Description | Estimated Tasks | Status | |-------|-------------|-----------------|--------| | Phase 1 | Database & Entities | 4 tasks | โณ Pending | | Phase 2 | Shared DTOs | 3 tasks | โณ Pending | | Phase 3 | Backend Services | 4 tasks | โณ Pending | | Phase 4 | API Controllers | 4 tasks | โณ Pending | | Phase 5 | SignalR Hub | 3 tasks | โณ Pending | | Phase 6 | Frontend - RobotModel | 9 tasks | โณ Pending | | Phase 7 | Frontend - Robot | 5 tasks | โณ Pending | | Phase 8 | Frontend - RobotDetail | 6 tasks | โณ Pending | | Phase 9 | Testing & Polish | 4 tasks | โณ Pending | | Phase 10 | Manual Actions API | 1 task | โณ Future | **Total:** ~43 tasks across 10 phases --- ## ๐Ÿ” Notes & Considerations ### Validation Rules **RobotModel:** - ModelName: Required, unique, max 256 chars - Length, Width: Required, > 0 - ImageWidth, ImageHeight: Required, > 0 - NavigationPointX, Y: Required - NavigationType: Required **Robot:** - RobotId: Required, unique, max 64 chars - Name: Required, max 256 chars - ModelId: Required, must exist - MapId: Optional, must exist if provided ### Business Rules 1. **Delete RobotModel:** - Khรดng ฤ‘ฦฐแปฃc xรณa nแบฟu cรณ Robot ฤ‘ang sแปญ dแปฅng - Phแบฃi xรณa tแบฅt cแบฃ Robot trฦฐแป›c 2. **Delete Robot:** - Cรณ thแปƒ xรณa bแบฅt cแปฉ lรบc nร o - Cรขn nhแบฏc xรณa cรกc dแปฏ liแป‡u liรชn quan (orders, history, etc.) 3. **Update RobotModel:** - Cรณ thแปƒ update bแบฅt cแปฉ lรบc nร o - Cรกc Robot hiแป‡n tแบกi khรดng bแป‹ แบฃnh hฦฐแปŸng ### Performance Considerations 1. **Pagination:** Sแปญ dแปฅng pagination cho list views 2. **Lazy Loading:** Load details khi cแบงn 3. **Caching:** Cache RobotModel list (รญt thay ฤ‘แป•i) 4. **SignalR:** Limit frequency cแปงa State messages --- ## โœ… Checklist ### Database - [ ] NavigationType enum - [ ] RobotModel entity - [ ] Robot entity - [ ] ApplicationDbContext update - [ ] Migration - [ ] Indexes ### Backend - [ ] IRobotModelService - [ ] RobotModelService - [ ] IRobotService - [ ] RobotService - [ ] IRobotModelImageStorageService - [ ] RobotModelImageStorageService - [ ] DTOs (trong RobotNet10.FleetManager.Shared) - [ ] RobotModelController - [ ] RobotController - [ ] RobotModelImagesController - [ ] RobotStateHub (SignalR) - [ ] Service registration ### Frontend - RobotModel - [ ] RobotModelManager page - [ ] RobotModelListPanel - [ ] RobotModelDetailsPanel (vแป›i Image Preview & NavigationPoint) - [ ] CreateDialog (vแป›i image upload) - [ ] EditDialog (vแป›i image upload) - [ ] DeleteDialog ### Frontend - Robot - [ ] RobotManager page (table only, no Right Panel) - [ ] RobotTable component - [ ] CreateDialog - [ ] EditDialog - [ ] DeleteDialog ### Frontend - RobotDetail - [ ] RobotDetail page - [ ] RobotStateHubClient (SignalR client) - [ ] VDA5050StatePanel (ฤ‘แบงy ฤ‘แปง State & Visualization) - [ ] InformationCard component - [ ] ManualActionsPanel - [ ] SignalR event handlers (OnStateUpdate, OnVisualizationUpdate) --- **End of Architecture Document**