diff --git a/frontend/src/api/hooks/production.ts b/frontend/src/api/hooks/production.ts index 15018e22..944eff6c 100644 --- a/frontend/src/api/hooks/production.ts +++ b/frontend/src/api/hooks/production.ts @@ -88,7 +88,9 @@ export const useActiveBatches = ( ) => { return useQuery({ queryKey: productionKeys.activeBatches(tenantId), - queryFn: () => productionService.getActiveBatches(tenantId), + queryFn: () => productionService.getBatches(tenantId, { + status: undefined // Get all active statuses + }), enabled: !!tenantId, staleTime: 30 * 1000, // 30 seconds refetchInterval: 60 * 1000, // 1 minute @@ -103,7 +105,7 @@ export const useBatchDetails = ( ) => { return useQuery({ queryKey: productionKeys.batch(tenantId, batchId), - queryFn: () => productionService.getBatchDetails(tenantId, batchId), + queryFn: () => productionService.getBatch(tenantId, batchId), enabled: !!tenantId && !!batchId, staleTime: 30 * 1000, // 30 seconds ...options, @@ -160,9 +162,9 @@ export const useCreateProductionBatch = ( options?: UseMutationOptions ) => { const queryClient = useQueryClient(); - + return useMutation({ - mutationFn: ({ tenantId, batchData }) => productionService.createProductionBatch(tenantId, batchData), + mutationFn: ({ tenantId, batchData }) => productionService.createBatch(tenantId, batchData), onSuccess: (data, { tenantId }) => { // Invalidate active batches to refresh the list queryClient.invalidateQueries({ queryKey: productionKeys.activeBatches(tenantId) }); @@ -189,7 +191,7 @@ export const useUpdateBatchStatus = ( ApiError, { tenantId: string; batchId: string; statusUpdate: ProductionBatchStatusUpdate } >({ - mutationFn: ({ tenantId, batchId, statusUpdate }) => + mutationFn: ({ tenantId, batchId, statusUpdate }) => productionService.updateBatchStatus(tenantId, batchId, statusUpdate), onSuccess: (data, { tenantId, batchId }) => { // Update the specific batch data diff --git a/frontend/src/api/services/production.ts b/frontend/src/api/services/production.ts index 7b6ece79..691d94f8 100644 --- a/frontend/src/api/services/production.ts +++ b/frontend/src/api/services/production.ts @@ -1,79 +1,360 @@ -import { apiClient } from '../client'; -import type { - ProductionBatchCreate, - ProductionBatchStatusUpdate, +/** + * Production API Service - Handles all production-related API calls + */ +import { apiClient } from '../client/apiClient'; +import { + // Types ProductionBatchResponse, + ProductionBatchCreate, + ProductionBatchUpdate, + ProductionBatchStatusUpdate, ProductionBatchListResponse, + ProductionBatchFilters, + ProductionScheduleResponse, + ProductionScheduleCreate, + ProductionScheduleUpdate, + ProductionScheduleFilters, + ProductionCapacityResponse, + ProductionCapacityFilters, + QualityCheckResponse, + QualityCheckCreate, + QualityCheckFilters, + ProductionPerformanceAnalytics, + YieldTrendsAnalytics, + TopDefectsAnalytics, + EquipmentEfficiencyAnalytics, + CapacityBottlenecks, ProductionDashboardSummary, - DailyProductionRequirements, - ProductionScheduleData, - ProductionCapacityStatus, - ProductionRequirements, - ProductionYieldMetrics, + BatchStatistics, } from '../types/production'; export class ProductionService { - private readonly baseUrl = '/production'; + private baseUrl = '/production'; - getDashboardSummary(tenantId: string): Promise { - return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/dashboard-summary`); + // ================================================================ + // PRODUCTION BATCH ENDPOINTS + // ================================================================ + + async getBatches( + tenantId: string, + filters?: ProductionBatchFilters + ): Promise { + const params = new URLSearchParams(); + if (filters?.status) params.append('status', filters.status); + if (filters?.product_id) params.append('product_id', filters.product_id); + if (filters?.order_id) params.append('order_id', filters.order_id); + if (filters?.start_date) params.append('start_date', filters.start_date); + if (filters?.end_date) params.append('end_date', filters.end_date); + if (filters?.page) params.append('page', filters.page.toString()); + if (filters?.page_size) params.append('page_size', filters.page_size.toString()); + + const queryString = params.toString(); + const url = `/tenants/${tenantId}${this.baseUrl}/batches${queryString ? `?${queryString}` : ''}`; + + return apiClient.get(url); } - getDailyRequirements(tenantId: string, date?: string): Promise { - const params = date ? { date } : {}; - return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/daily-requirements`, { params }); + async getBatch(tenantId: string, batchId: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/batches/${batchId}`); } - getProductionRequirements(tenantId: string, date?: string): Promise { - const params = date ? { date } : {}; - return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/requirements`, { params }); + async createBatch( + tenantId: string, + batchData: ProductionBatchCreate + ): Promise { + return apiClient.post( + `/tenants/${tenantId}${this.baseUrl}/batches`, + batchData + ); } - createProductionBatch(tenantId: string, batchData: ProductionBatchCreate): Promise { - return apiClient.post(`/tenants/${tenantId}${this.baseUrl}/batches`, batchData); - } - - getActiveBatches(tenantId: string): Promise { - return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/batches/active`); - } - - getBatchDetails(tenantId: string, batchId: string): Promise { - return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/batches/${batchId}`); - } - - updateBatchStatus( + async updateBatch( tenantId: string, batchId: string, - statusUpdate: ProductionBatchStatusUpdate + batchData: ProductionBatchUpdate ): Promise { - return apiClient.put(`/tenants/${tenantId}${this.baseUrl}/batches/${batchId}/status`, statusUpdate); + return apiClient.put( + `/tenants/${tenantId}${this.baseUrl}/batches/${batchId}`, + batchData + ); } - getProductionSchedule( + async deleteBatch(tenantId: string, batchId: string): Promise { + return apiClient.delete(`/tenants/${tenantId}${this.baseUrl}/batches/${batchId}`); + } + + async updateBatchStatus( + tenantId: string, + batchId: string, + statusData: ProductionBatchStatusUpdate + ): Promise { + return apiClient.patch( + `/tenants/${tenantId}${this.baseUrl}/batches/${batchId}/status`, + statusData + ); + } + + async startBatch(tenantId: string, batchId: string): Promise { + return apiClient.post( + `/tenants/${tenantId}${this.baseUrl}/batches/${batchId}/start` + ); + } + + async completeBatch( + tenantId: string, + batchId: string, + completionData?: { actual_quantity?: number; notes?: string } + ): Promise { + return apiClient.post( + `/tenants/${tenantId}${this.baseUrl}/batches/${batchId}/complete`, + completionData || {} + ); + } + + async getBatchStatistics( tenantId: string, startDate?: string, endDate?: string - ): Promise { - const params: Record = {}; - if (startDate) params.start_date = startDate; - if (endDate) params.end_date = endDate; - - return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/schedule`, { params }); + ): Promise { + const params = new URLSearchParams(); + if (startDate) params.append('start_date', startDate); + if (endDate) params.append('end_date', endDate); + + const queryString = params.toString(); + const url = `/tenants/${tenantId}${this.baseUrl}/batches/stats${queryString ? `?${queryString}` : ''}`; + + return apiClient.get(url); } - getCapacityStatus(tenantId: string, date?: string): Promise { - const params = date ? { date } : {}; - return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/capacity/status`, { params }); + // ================================================================ + // PRODUCTION SCHEDULE ENDPOINTS + // ================================================================ + + async getSchedules( + tenantId: string, + filters?: ProductionScheduleFilters + ): Promise<{ schedules: ProductionScheduleResponse[]; total_count: number; page: number; page_size: number }> { + const params = new URLSearchParams(); + if (filters?.start_date) params.append('start_date', filters.start_date); + if (filters?.end_date) params.append('end_date', filters.end_date); + if (filters?.is_finalized !== undefined) params.append('is_finalized', filters.is_finalized.toString()); + if (filters?.page) params.append('page', filters.page.toString()); + if (filters?.page_size) params.append('page_size', filters.page_size.toString()); + + const queryString = params.toString(); + const url = `/tenants/${tenantId}${this.baseUrl}/schedules${queryString ? `?${queryString}` : ''}`; + + return apiClient.get(url); } - getYieldMetrics( + async getSchedule(tenantId: string, scheduleId: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/schedules/${scheduleId}`); + } + + async createSchedule( + tenantId: string, + scheduleData: ProductionScheduleCreate + ): Promise { + return apiClient.post( + `/tenants/${tenantId}${this.baseUrl}/schedules`, + scheduleData + ); + } + + async updateSchedule( + tenantId: string, + scheduleId: string, + scheduleData: ProductionScheduleUpdate + ): Promise { + return apiClient.put( + `/tenants/${tenantId}${this.baseUrl}/schedules/${scheduleId}`, + scheduleData + ); + } + + async deleteSchedule(tenantId: string, scheduleId: string): Promise { + return apiClient.delete(`/tenants/${tenantId}${this.baseUrl}/schedules/${scheduleId}`); + } + + async finalizeSchedule(tenantId: string, scheduleId: string): Promise { + return apiClient.post( + `/tenants/${tenantId}${this.baseUrl}/schedules/${scheduleId}/finalize` + ); + } + + async getTodaysSchedule(tenantId: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/schedules/today`); + } + + // ================================================================ + // PRODUCTION CAPACITY ENDPOINTS + // ================================================================ + + async getCapacity( + tenantId: string, + filters?: ProductionCapacityFilters + ): Promise<{ capacity: ProductionCapacityResponse[]; total_count: number; page: number; page_size: number }> { + const params = new URLSearchParams(); + if (filters?.resource_type) params.append('resource_type', filters.resource_type); + if (filters?.date) params.append('date', filters.date); + if (filters?.availability !== undefined) params.append('availability', filters.availability.toString()); + if (filters?.page) params.append('page', filters.page.toString()); + if (filters?.page_size) params.append('page_size', filters.page_size.toString()); + + const queryString = params.toString(); + const url = `/tenants/${tenantId}${this.baseUrl}/capacity${queryString ? `?${queryString}` : ''}`; + + return apiClient.get(url); + } + + async getCapacityByDate(tenantId: string, date: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/capacity/date/${date}`); + } + + async getCapacityByResource(tenantId: string, resourceId: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/capacity/resource/${resourceId}`); + } + + // ================================================================ + // QUALITY CHECK ENDPOINTS + // ================================================================ + + async getQualityChecks( + tenantId: string, + filters?: QualityCheckFilters + ): Promise<{ quality_checks: QualityCheckResponse[]; total_count: number; page: number; page_size: number }> { + const params = new URLSearchParams(); + if (filters?.batch_id) params.append('batch_id', filters.batch_id); + if (filters?.product_id) params.append('product_id', filters.product_id); + if (filters?.start_date) params.append('start_date', filters.start_date); + if (filters?.end_date) params.append('end_date', filters.end_date); + if (filters?.pass_fail !== undefined) params.append('pass_fail', filters.pass_fail.toString()); + if (filters?.page) params.append('page', filters.page.toString()); + if (filters?.page_size) params.append('page_size', filters.page_size.toString()); + + const queryString = params.toString(); + const url = `/tenants/${tenantId}${this.baseUrl}/quality-checks${queryString ? `?${queryString}` : ''}`; + + return apiClient.get(url); + } + + async getQualityCheck(tenantId: string, checkId: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/quality-checks/${checkId}`); + } + + async createQualityCheck( + tenantId: string, + checkData: QualityCheckCreate + ): Promise { + return apiClient.post( + `/tenants/${tenantId}${this.baseUrl}/quality-checks`, + checkData + ); + } + + async getQualityChecksByBatch(tenantId: string, batchId: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/quality-checks/batch/${batchId}`); + } + + // ================================================================ + // ANALYTICS ENDPOINTS + // ================================================================ + + async getPerformanceAnalytics( tenantId: string, startDate: string, endDate: string - ): Promise { - const params = { start_date: startDate, end_date: endDate }; - return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/metrics/yield`, { params }); + ): Promise { + return apiClient.get( + `/tenants/${tenantId}${this.baseUrl}/analytics/performance?start_date=${startDate}&end_date=${endDate}` + ); + } + + async getYieldTrends( + tenantId: string, + period: 'week' | 'month' = 'week' + ): Promise { + return apiClient.get( + `/tenants/${tenantId}${this.baseUrl}/analytics/yield-trends?period=${period}` + ); + } + + async getTopDefects( + tenantId: string, + startDate?: string, + endDate?: string + ): Promise { + const params = new URLSearchParams(); + if (startDate) params.append('start_date', startDate); + if (endDate) params.append('end_date', endDate); + + const queryString = params.toString(); + const url = `/tenants/${tenantId}${this.baseUrl}/analytics/defects${queryString ? `?${queryString}` : ''}`; + + return apiClient.get(url); + } + + async getEquipmentEfficiency( + tenantId: string, + startDate?: string, + endDate?: string + ): Promise { + const params = new URLSearchParams(); + if (startDate) params.append('start_date', startDate); + if (endDate) params.append('end_date', endDate); + + const queryString = params.toString(); + const url = `/tenants/${tenantId}${this.baseUrl}/analytics/equipment-efficiency${queryString ? `?${queryString}` : ''}`; + + return apiClient.get(url); + } + + async getCapacityBottlenecks( + tenantId: string, + days: number = 7 + ): Promise { + return apiClient.get( + `/tenants/${tenantId}${this.baseUrl}/analytics/capacity-bottlenecks?days=${days}` + ); + } + + // ================================================================ + // DASHBOARD ENDPOINTS + // ================================================================ + + async getDashboardSummary(tenantId: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/dashboard/summary`); + } + + async getDailyProductionPlan(tenantId: string, date?: string): Promise { + const queryString = date ? `?date=${date}` : ''; + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/dashboard/daily-plan${queryString}`); + } + + async getProductionRequirements(tenantId: string, date: string): Promise { + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/dashboard/requirements/${date}`); + } + + async getCapacityOverview(tenantId: string, date?: string): Promise { + const queryString = date ? `?date=${date}` : ''; + return apiClient.get(`/tenants/${tenantId}${this.baseUrl}/dashboard/capacity-overview${queryString}`); + } + + async getQualityOverview( + tenantId: string, + startDate?: string, + endDate?: string + ): Promise { + const params = new URLSearchParams(); + if (startDate) params.append('start_date', startDate); + if (endDate) params.append('end_date', endDate); + + const queryString = params.toString(); + const url = `/tenants/${tenantId}${this.baseUrl}/dashboard/quality-overview${queryString ? `?${queryString}` : ''}`; + + return apiClient.get(url); } } -export const productionService = new ProductionService(); \ No newline at end of file +export const productionService = new ProductionService(); +export default productionService; \ No newline at end of file diff --git a/frontend/src/api/types/production.ts b/frontend/src/api/types/production.ts index c2fd0f07..baddfafa 100644 --- a/frontend/src/api/types/production.ts +++ b/frontend/src/api/types/production.ts @@ -1,77 +1,82 @@ -export enum ProductionStatusEnum { - PENDING = "pending", - IN_PROGRESS = "in_progress", - COMPLETED = "completed", - CANCELLED = "cancelled", - ON_HOLD = "on_hold", - QUALITY_CHECK = "quality_check", - FAILED = "failed" +/** + * Production API Types - Mirror backend schemas + */ + +// Enums +export enum ProductionStatus { + PENDING = "PENDING", + IN_PROGRESS = "IN_PROGRESS", + COMPLETED = "COMPLETED", + CANCELLED = "CANCELLED", + ON_HOLD = "ON_HOLD", + QUALITY_CHECK = "QUALITY_CHECK", + FAILED = "FAILED" } -export enum ProductionPriorityEnum { - LOW = "low", - MEDIUM = "medium", - HIGH = "high", - URGENT = "urgent" -} - -export enum ProductionBatchStatus { - PLANNED = "planned", - IN_PROGRESS = "in_progress", - COMPLETED = "completed", - CANCELLED = "cancelled", - ON_HOLD = "on_hold" +export enum ProductionPriority { + LOW = "LOW", + MEDIUM = "MEDIUM", + HIGH = "HIGH", + URGENT = "URGENT" } +// Quality Check Status Enum export enum QualityCheckStatus { - PENDING = "pending", - IN_PROGRESS = "in_progress", - PASSED = "passed", - FAILED = "failed", - REQUIRES_ATTENTION = "requires_attention" + PASSED = "PASSED", + FAILED = "FAILED", + PENDING = "PENDING", + IN_REVIEW = "IN_REVIEW" } +// Alternative exports for compatibility +export const ProductionStatusEnum = ProductionStatus; +export const ProductionPriorityEnum = ProductionPriority; +export const ProductionBatchStatus = ProductionStatus; +export const ProductionBatchPriority = ProductionPriority; +export const QualityCheckStatusEnum = QualityCheckStatus; + +// Production Batch Types export interface ProductionBatchBase { product_id: string; product_name: string; - recipe_id?: string | null; + recipe_id?: string; planned_start_time: string; planned_end_time: string; planned_quantity: number; planned_duration_minutes: number; - priority: ProductionPriorityEnum; + priority: ProductionPriority; is_rush_order: boolean; is_special_recipe: boolean; - production_notes?: string | null; + production_notes?: string; } export interface ProductionBatchCreate extends ProductionBatchBase { - batch_number?: string | null; - order_id?: string | null; - forecast_id?: string | null; - equipment_used?: string[] | null; - staff_assigned?: string[] | null; - station_id?: string | null; + batch_number?: string; + order_id?: string; + forecast_id?: string; + equipment_used?: string[]; + staff_assigned?: string[]; + station_id?: string; } export interface ProductionBatchUpdate { - product_name?: string | null; - planned_start_time?: string | null; - planned_end_time?: string | null; - planned_quantity?: number | null; - planned_duration_minutes?: number | null; - actual_quantity?: number | null; - priority?: ProductionPriorityEnum | null; - equipment_used?: string[] | null; - staff_assigned?: string[] | null; - station_id?: string | null; - production_notes?: string | null; + product_name?: string; + planned_start_time?: string; + planned_end_time?: string; + planned_quantity?: number; + planned_duration_minutes?: number; + actual_quantity?: number; + priority?: ProductionPriority; + equipment_used?: string[]; + staff_assigned?: string[]; + station_id?: string; + production_notes?: string; } export interface ProductionBatchStatusUpdate { - status: ProductionStatusEnum; - actual_quantity?: number | null; - notes?: string | null; + status: ProductionStatus; + actual_quantity?: number; + notes?: string; } export interface ProductionBatchResponse { @@ -80,37 +85,50 @@ export interface ProductionBatchResponse { batch_number: string; product_id: string; product_name: string; - recipe_id?: string | null; + recipe_id?: string; planned_start_time: string; planned_end_time: string; planned_quantity: number; planned_duration_minutes: number; - actual_start_time?: string | null; - actual_end_time?: string | null; - actual_quantity?: number | null; - actual_duration_minutes?: number | null; - status: ProductionStatusEnum; - priority: ProductionPriorityEnum; - estimated_cost?: number | null; - actual_cost?: number | null; - yield_percentage?: number | null; - quality_score?: number | null; - equipment_used?: string[] | null; - staff_assigned?: string[] | null; - station_id?: string | null; - order_id?: string | null; - forecast_id?: string | null; + actual_start_time?: string; + actual_end_time?: string; + actual_quantity?: number; + actual_duration_minutes?: number; + status: ProductionStatus; + priority: ProductionPriority; + estimated_cost?: number; + actual_cost?: number; + labor_cost?: number; + material_cost?: number; + overhead_cost?: number; + yield_percentage?: number; + quality_score?: number; + waste_quantity?: number; + defect_quantity?: number; + equipment_used?: string[]; + staff_assigned?: string[]; + station_id?: string; + order_id?: string; + forecast_id?: string; is_rush_order: boolean; is_special_recipe: boolean; - production_notes?: string | null; - quality_notes?: string | null; - delay_reason?: string | null; - cancellation_reason?: string | null; + production_notes?: string; + quality_notes?: string; + delay_reason?: string; + cancellation_reason?: string; created_at: string; updated_at: string; - completed_at?: string | null; + completed_at?: string; } +export interface ProductionBatchListResponse { + batches: ProductionBatchResponse[]; + total_count: number; + page: number; + page_size: number; +} + +// Production Schedule Types export interface ProductionScheduleBase { schedule_date: string; shift_start: string; @@ -118,23 +136,23 @@ export interface ProductionScheduleBase { total_capacity_hours: number; planned_capacity_hours: number; staff_count: number; - equipment_capacity?: Record | null; - station_assignments?: Record | null; - schedule_notes?: string | null; + equipment_capacity?: Record; + station_assignments?: Record; + schedule_notes?: string; } export interface ProductionScheduleCreate extends ProductionScheduleBase {} export interface ProductionScheduleUpdate { - shift_start?: string | null; - shift_end?: string | null; - total_capacity_hours?: number | null; - planned_capacity_hours?: number | null; - staff_count?: number | null; - overtime_hours?: number | null; - equipment_capacity?: Record | null; - station_assignments?: Record | null; - schedule_notes?: string | null; + shift_start?: string; + shift_end?: string; + total_capacity_hours?: number; + planned_capacity_hours?: number; + staff_count?: number; + overtime_hours?: number; + equipment_capacity?: Record; + station_assignments?: Record; + schedule_notes?: string; } export interface ProductionScheduleResponse { @@ -145,27 +163,58 @@ export interface ProductionScheduleResponse { shift_end: string; total_capacity_hours: number; planned_capacity_hours: number; - actual_capacity_hours?: number | null; - overtime_hours?: number | null; + actual_capacity_hours?: number; + overtime_hours?: number; staff_count: number; - equipment_capacity?: Record | null; - station_assignments?: Record | null; + equipment_capacity?: Record; + station_assignments?: Record; total_batches_planned: number; - total_batches_completed?: number | null; + total_batches_completed?: number; total_quantity_planned: number; - total_quantity_produced?: number | null; + total_quantity_produced?: number; is_finalized: boolean; is_active: boolean; - efficiency_percentage?: number | null; - utilization_percentage?: number | null; - on_time_completion_rate?: number | null; - schedule_notes?: string | null; - schedule_adjustments?: Record | null; + efficiency_percentage?: number; + utilization_percentage?: number; + on_time_completion_rate?: number; + schedule_notes?: string; + schedule_adjustments?: Record; created_at: string; updated_at: string; - finalized_at?: string | null; + finalized_at?: string; } +// Production Capacity Types +export interface ProductionCapacityResponse { + id: string; + tenant_id: string; + resource_type: string; + resource_id: string; + resource_name: string; + date: string; + start_time: string; + end_time: string; + total_capacity_units: number; + allocated_capacity_units: number; + remaining_capacity_units: number; + is_available: boolean; + is_maintenance: boolean; + is_reserved: boolean; + equipment_type?: string; + max_batch_size?: number; + min_batch_size?: number; + setup_time_minutes?: number; + cleanup_time_minutes?: number; + efficiency_rating?: number; + maintenance_status?: string; + last_maintenance_date?: string; + notes?: string; + restrictions?: Record; + created_at: string; + updated_at: string; +} + +// Quality Check Types export interface QualityCheckBase { batch_id: string; check_type: string; @@ -173,21 +222,21 @@ export interface QualityCheckBase { quality_score: number; pass_fail: boolean; defect_count: number; - defect_types?: string[] | null; - check_notes?: string | null; + defect_types?: string[]; + check_notes?: string; } export interface QualityCheckCreate extends QualityCheckBase { - checker_id?: string | null; - measured_weight?: number | null; - measured_temperature?: number | null; - measured_moisture?: number | null; - measured_dimensions?: Record | null; - target_weight?: number | null; - target_temperature?: number | null; - target_moisture?: number | null; - tolerance_percentage?: number | null; - corrective_actions?: string[] | null; + checker_id?: string; + measured_weight?: number; + measured_temperature?: number; + measured_moisture?: number; + measured_dimensions?: Record; + target_weight?: number; + target_temperature?: number; + target_moisture?: number; + tolerance_percentage?: number; + corrective_actions?: string[]; } export interface QualityCheckResponse { @@ -196,32 +245,128 @@ export interface QualityCheckResponse { batch_id: string; check_type: string; check_time: string; - checker_id?: string | null; + checker_id?: string; quality_score: number; pass_fail: boolean; defect_count: number; - defect_types?: string[] | null; - measured_weight?: number | null; - measured_temperature?: number | null; - measured_moisture?: number | null; - measured_dimensions?: Record | null; - target_weight?: number | null; - target_temperature?: number | null; - target_moisture?: number | null; - tolerance_percentage?: number | null; - within_tolerance?: boolean | null; + defect_types?: string[]; + measured_weight?: number; + measured_temperature?: number; + measured_moisture?: number; + measured_dimensions?: Record; + target_weight?: number; + target_temperature?: number; + target_moisture?: number; + tolerance_percentage?: number; + within_tolerance?: boolean; corrective_action_needed: boolean; - corrective_actions?: string[] | null; - check_notes?: string | null; - photos_urls?: string[] | null; - certificate_url?: string | null; + corrective_actions?: string[]; + check_notes?: string; + photos_urls?: string[]; + certificate_url?: string; created_at: string; updated_at: string; } +// Filter Types +export interface ProductionBatchFilters { + status?: ProductionStatus; + product_id?: string; + order_id?: string; + start_date?: string; + end_date?: string; + page?: number; + page_size?: number; +} + +export interface ProductionScheduleFilters { + start_date?: string; + end_date?: string; + is_finalized?: boolean; + page?: number; + page_size?: number; +} + +export interface ProductionCapacityFilters { + resource_type?: string; + date?: string; + availability?: boolean; + page?: number; + page_size?: number; +} + +export interface QualityCheckFilters { + batch_id?: string; + product_id?: string; + start_date?: string; + end_date?: string; + pass_fail?: boolean; + page?: number; + page_size?: number; +} + +// Analytics Types +export interface ProductionPerformanceAnalytics { + completion_rate: number; + waste_percentage: number; + labor_cost_per_unit: number; + on_time_completion_rate: number; + average_yield_percentage: number; + total_output: number; + efficiency_percentage: number; + period_start: string; + period_end: string; +} + +export interface YieldTrendsAnalytics { + trends: Array<{ + date: string; + product_name: string; + yield_percentage: number; + quantity_produced: number; + }>; + period: 'week' | 'month'; +} + +export interface TopDefectsAnalytics { + defects: Array<{ + defect_type: string; + count: number; + percentage: number; + }>; +} + +export interface EquipmentEfficiencyAnalytics { + equipment: Array<{ + resource_name: string; + efficiency_rating: number; + uptime_percentage: number; + downtime_hours: number; + total_batches: number; + }>; +} + +export interface CapacityBottlenecks { + bottlenecks: Array<{ + date: string; + time_slot: string; + resource_name: string; + predicted_utilization: number; + severity: 'low' | 'medium' | 'high'; + suggestion: string; + }>; +} + +// Dashboard Types export interface ProductionDashboardSummary { active_batches: number; - todays_production_plan: Record[]; + todays_production_plan: Array<{ + batch_id: string; + product_name: string; + planned_quantity: number; + status: ProductionStatus; + priority: ProductionPriority; + }>; capacity_utilization: number; on_time_completion_rate: number; average_quality_score: number; @@ -229,73 +374,14 @@ export interface ProductionDashboardSummary { efficiency_percentage: number; } -export interface DailyProductionRequirements { - date: string; - production_plan: Record[]; - total_capacity_needed: number; - available_capacity: number; - capacity_gap: number; - urgent_items: number; - recommended_schedule?: Record | null; -} - -export interface ProductionMetrics { - period_start: string; - period_end: string; +export interface BatchStatistics { total_batches: number; completed_batches: number; + failed_batches: number; + cancelled_batches: number; completion_rate: number; - average_yield_percentage: number; - on_time_completion_rate: number; - total_production_cost: number; - average_quality_score: number; - efficiency_trends: Record[]; -} - -export interface ProductionBatchListResponse { - batches: ProductionBatchResponse[]; - total_count: number; - page: number; - page_size: number; -} - -export interface ProductionScheduleListResponse { - schedules: ProductionScheduleResponse[]; - total_count: number; - page: number; - page_size: number; -} - -export interface QualityCheckListResponse { - quality_checks: QualityCheckResponse[]; - total_count: number; - page: number; - page_size: number; -} - -export interface ProductionScheduleData { - start_date: string; - end_date: string; - schedules: { - id: string; - date: string; - shift_start: string; - shift_end: string; - capacity_utilization: number; - batches_planned: number; - is_finalized: boolean; - }[]; - total_schedules: number; -} - -export interface ProductionCapacityStatus { - [key: string]: any; -} - -export interface ProductionRequirements { - [key: string]: any; -} - -export interface ProductionYieldMetrics { - [key: string]: any; + average_yield: number; + on_time_rate: number; + period_start: string; + period_end: string; } \ No newline at end of file diff --git a/frontend/src/components/domain/dashboard/AIInsightsWidget.tsx b/frontend/src/components/domain/dashboard/AIInsightsWidget.tsx new file mode 100644 index 00000000..3ec375e9 --- /dev/null +++ b/frontend/src/components/domain/dashboard/AIInsightsWidget.tsx @@ -0,0 +1,408 @@ +import React, { useMemo } from 'react'; +import { useTranslation } from 'react-i18next'; +import { Card, CardHeader, CardBody } from '../../ui/Card'; +import { Badge } from '../../ui/Badge'; +import { Button } from '../../ui/Button'; +import { + Brain, + TrendingUp, + TrendingDown, + AlertTriangle, + Target, + Lightbulb, + BarChart3, + Zap, + Clock, + DollarSign, + Users, + Package +} from 'lucide-react'; +import { useCurrentTenant } from '../../../stores/tenant.store'; +import { useProductionDashboard } from '../../../api'; + +export interface AIInsight { + id: string; + type: 'optimization' | 'prediction' | 'alert' | 'recommendation'; + title: string; + description: string; + impact: 'high' | 'medium' | 'low'; + category: 'cost' | 'quality' | 'efficiency' | 'demand' | 'maintenance'; + confidence: number; + potentialSavings?: number; + timeToImplement?: string; + actions: Array<{ + label: string; + action: string; + }>; + data?: { + current: number; + predicted: number; + unit: string; + }; + createdAt: string; +} + +export interface AIInsightsWidgetProps { + className?: string; + insights?: AIInsight[]; + onViewInsight?: (insightId: string) => void; + onImplement?: (insightId: string, actionId: string) => void; + onViewAll?: () => void; +} + +const AIInsightsWidget: React.FC = ({ + className, + insights, + onViewInsight, + onImplement, + onViewAll +}) => { + const { t } = useTranslation(); + const currentTenant = useCurrentTenant(); + const tenantId = currentTenant?.id || ''; + + const { + data: dashboardData, + isLoading, + error + } = useProductionDashboard(tenantId); + + const aiInsights = useMemo((): AIInsight[] => { + if (insights) return insights; + + // Mock AI-generated insights for demonstration + return [ + { + id: '1', + type: 'optimization', + title: t('ai.insights.reduce_energy_costs', 'Reduce Energy Costs by 15%'), + description: t('ai.insights.energy_description', 'Adjust oven schedules to use off-peak electricity rates. Estimated savings: ¬45/day'), + impact: 'high', + category: 'cost', + confidence: 87, + potentialSavings: 1350, + timeToImplement: '2 days', + actions: [ + { label: t('ai.actions.schedule_optimization', 'Optimize Schedule'), action: 'optimize_schedule' }, + { label: t('ai.actions.view_details', 'View Details'), action: 'view_details' } + ], + data: { + current: 95.2, + predicted: 81.0, + unit: '¬/day' + }, + createdAt: '2024-01-23T08:30:00Z' + }, + { + id: '2', + type: 'prediction', + title: t('ai.insights.demand_increase', 'Croissant Demand Surge Predicted'), + description: t('ai.insights.demand_description', 'Weather and event data suggest 40% increase in croissant demand this weekend'), + impact: 'high', + category: 'demand', + confidence: 92, + timeToImplement: '1 day', + actions: [ + { label: t('ai.actions.increase_production', 'Increase Production'), action: 'adjust_production' }, + { label: t('ai.actions.order_ingredients', 'Order Ingredients'), action: 'order_ingredients' } + ], + data: { + current: 150, + predicted: 210, + unit: 'units/day' + }, + createdAt: '2024-01-23T07:15:00Z' + }, + { + id: '3', + type: 'alert', + title: t('ai.insights.quality_decline', 'Quality Score Decline Detected'), + description: t('ai.insights.quality_description', 'Bread quality has decreased by 8% over the last 3 days. Check flour moisture levels'), + impact: 'medium', + category: 'quality', + confidence: 78, + timeToImplement: '4 hours', + actions: [ + { label: t('ai.actions.check_ingredients', 'Check Ingredients'), action: 'quality_check' }, + { label: t('ai.actions.adjust_recipe', 'Adjust Recipe'), action: 'recipe_adjustment' } + ], + data: { + current: 8.2, + predicted: 7.5, + unit: 'score' + }, + createdAt: '2024-01-23T06:45:00Z' + }, + { + id: '4', + type: 'recommendation', + title: t('ai.insights.maintenance_due', 'Preventive Maintenance Recommended'), + description: t('ai.insights.maintenance_description', 'Mixer #2 showing early wear patterns. Schedule maintenance to prevent breakdown'), + impact: 'medium', + category: 'maintenance', + confidence: 85, + potentialSavings: 800, + timeToImplement: '1 week', + actions: [ + { label: t('ai.actions.schedule_maintenance', 'Schedule Maintenance'), action: 'schedule_maintenance' }, + { label: t('ai.actions.view_equipment', 'View Equipment'), action: 'view_equipment' } + ], + createdAt: '2024-01-22T14:20:00Z' + } + ]; + }, [insights, t]); + + const getInsightConfig = (type: AIInsight['type']) => { + const configs = { + optimization: { + color: 'success' as const, + icon: TrendingUp, + bgColor: 'bg-green-50 dark:bg-green-900/20', + borderColor: 'border-green-200 dark:border-green-800' + }, + prediction: { + color: 'info' as const, + icon: BarChart3, + bgColor: 'bg-blue-50 dark:bg-blue-900/20', + borderColor: 'border-blue-200 dark:border-blue-800' + }, + alert: { + color: 'warning' as const, + icon: AlertTriangle, + bgColor: 'bg-orange-50 dark:bg-orange-900/20', + borderColor: 'border-orange-200 dark:border-orange-800' + }, + recommendation: { + color: 'default' as const, + icon: Lightbulb, + bgColor: 'bg-purple-50 dark:bg-purple-900/20', + borderColor: 'border-purple-200 dark:border-purple-800' + } + }; + return configs[type]; + }; + + const getCategoryIcon = (category: AIInsight['category']) => { + const icons = { + cost: DollarSign, + quality: Target, + efficiency: Zap, + demand: BarChart3, + maintenance: Users + }; + return icons[category] || Package; + }; + + const getImpactColor = (impact: AIInsight['impact']) => { + const colors = { + high: 'text-red-600', + medium: 'text-orange-600', + low: 'text-green-600' + }; + return colors[impact]; + }; + + const formatCurrency = (amount: number) => { + return new Intl.NumberFormat('es-ES', { + style: 'currency', + currency: 'EUR', + minimumFractionDigits: 0 + }).format(amount); + }; + + const highImpactInsights = aiInsights.filter(i => i.impact === 'high').length; + const totalPotentialSavings = aiInsights.reduce((sum, i) => sum + (i.potentialSavings || 0), 0); + const avgConfidence = aiInsights.reduce((sum, i) => sum + i.confidence, 0) / aiInsights.length; + + if (isLoading) { + return ( + + +

+ {t('ai.title', 'AI Insights')} +

+ + +
+
+
+
+
+
+
+
+
+
+
+ + + ); + } + + if (error) { + return ( + + + +

+ {t('ai.error', 'AI insights temporarily unavailable')} +

+ + + ); + } + + return ( + + +
+
+ +
+

+ {t('ai.title', 'AI Insights')} +

+

+ {t('ai.subtitle', 'AI-powered recommendations and predictions')} +

+
+
+ +
+ + + + {/* Summary Stats */} +
+
+
+ {highImpactInsights} +
+
+ {t('ai.high_impact', 'High Impact')} +
+
+
+
+ {totalPotentialSavings > 0 ? formatCurrency(totalPotentialSavings) : ''} +
+
+ {t('ai.potential_savings', 'Potential Savings')} +
+
+
+
+ {avgConfidence.toFixed(0)}% +
+
+ {t('ai.confidence', 'Avg Confidence')} +
+
+
+ + {/* Insights List */} +
+ {aiInsights.slice(0, 3).map((insight) => { + const config = getInsightConfig(insight.type); + const CategoryIcon = getCategoryIcon(insight.category); + const TypeIcon = config.icon; + + return ( +
onViewInsight?.(insight.id)} + > +
+
+
+ + +
+
+
+

+ {insight.title} +

+ + {insight.confidence}% + +
+

+ {insight.description} +

+
+ + {insight.impact.toUpperCase()} {t('ai.impact', 'IMPACT')} + + {insight.timeToImplement && ( + + + {insight.timeToImplement} + + )} + {insight.potentialSavings && ( + + {formatCurrency(insight.potentialSavings)} + + )} +
+
+
+ {insight.data && ( +
+
+ {insight.data.current} ’ {insight.data.predicted} +
+
+ {insight.data.unit} +
+
+ )} +
+ + {/* Action buttons */} +
+ {insight.actions.slice(0, 2).map((action, index) => ( + + ))} +
+
+ ); + })} +
+ + {/* AI Status */} +
+
+
+ + {t('ai.status.active', 'AI monitoring active')} + +
+
+ {t('ai.last_updated', 'Updated 5m ago')} +
+
+ + + ); +}; + +export default AIInsightsWidget; \ No newline at end of file diff --git a/frontend/src/components/domain/dashboard/EquipmentStatusWidget.tsx b/frontend/src/components/domain/dashboard/EquipmentStatusWidget.tsx new file mode 100644 index 00000000..e335d331 --- /dev/null +++ b/frontend/src/components/domain/dashboard/EquipmentStatusWidget.tsx @@ -0,0 +1,392 @@ +import React, { useMemo } from 'react'; +import { useTranslation } from 'react-i18next'; +import { Card, CardHeader, CardBody } from '../../ui/Card'; +import { Badge } from '../../ui/Badge'; +import { Button } from '../../ui/Button'; +import { + Settings, + AlertTriangle, + CheckCircle, + Clock, + Thermometer, + Activity, + Wrench, + Zap, + Calendar, + TrendingUp +} from 'lucide-react'; +import { useCurrentTenant } from '../../../stores/tenant.store'; +import { useProductionDashboard } from '../../../api'; + +export interface EquipmentStatus { + id: string; + name: string; + type: 'oven' | 'mixer' | 'proofer' | 'freezer' | 'packaging'; + status: 'operational' | 'maintenance' | 'down' | 'warning'; + location: string; + temperature?: number; + targetTemperature?: number; + efficiency: number; + uptime: number; + lastMaintenance: string; + nextMaintenance: string; + alerts: string[]; + energyUsage: number; + utilizationToday: number; +} + +export interface EquipmentStatusWidgetProps { + className?: string; + equipment?: EquipmentStatus[]; + onViewEquipment?: (equipmentId: string) => void; + onScheduleMaintenance?: (equipmentId: string) => void; + onViewAll?: () => void; +} + +const EquipmentStatusWidget: React.FC = ({ + className, + equipment, + onViewEquipment, + onScheduleMaintenance, + onViewAll +}) => { + const { t } = useTranslation(); + const currentTenant = useCurrentTenant(); + const tenantId = currentTenant?.id || ''; + + const { + data: dashboardData, + isLoading, + error + } = useProductionDashboard(tenantId); + + const equipmentData = useMemo((): EquipmentStatus[] => { + if (equipment) return equipment; + + // Mock data for demonstration + return [ + { + id: '1', + name: 'Horno Principal #1', + type: 'oven', + status: 'operational', + location: 'Área de Horneado', + temperature: 220, + targetTemperature: 220, + efficiency: 92, + uptime: 98.5, + lastMaintenance: '2024-01-15', + nextMaintenance: '2024-03-15', + alerts: [], + energyUsage: 45.2, + utilizationToday: 87 + }, + { + id: '2', + name: 'Batidora Industrial #2', + type: 'mixer', + status: 'warning', + location: 'Área de Preparación', + efficiency: 88, + uptime: 94.2, + lastMaintenance: '2024-01-20', + nextMaintenance: '2024-02-20', + alerts: ['Vibración inusual detectada', 'Revisar correas'], + energyUsage: 12.8, + utilizationToday: 76 + }, + { + id: '3', + name: 'Cámara de Fermentación #1', + type: 'proofer', + status: 'maintenance', + location: 'Área de Fermentación', + temperature: 32, + targetTemperature: 35, + efficiency: 0, + uptime: 85.1, + lastMaintenance: '2024-01-23', + nextMaintenance: '2024-01-24', + alerts: ['En mantenimiento programado'], + energyUsage: 0, + utilizationToday: 0 + }, + { + id: '4', + name: 'Congelador Rápido', + type: 'freezer', + status: 'operational', + location: 'Área de Congelado', + temperature: -18, + targetTemperature: -18, + efficiency: 95, + uptime: 99.2, + lastMaintenance: '2024-01-10', + nextMaintenance: '2024-04-10', + alerts: [], + energyUsage: 23.5, + utilizationToday: 65 + } + ]; + }, [equipment]); + + const getStatusConfig = (status: EquipmentStatus['status']) => { + const configs = { + operational: { + color: 'success' as const, + icon: CheckCircle, + label: t('equipment.status.operational', 'Operational') + }, + warning: { + color: 'warning' as const, + icon: AlertTriangle, + label: t('equipment.status.warning', 'Warning') + }, + maintenance: { + color: 'info' as const, + icon: Wrench, + label: t('equipment.status.maintenance', 'Maintenance') + }, + down: { + color: 'error' as const, + icon: AlertTriangle, + label: t('equipment.status.down', 'Down') + } + }; + return configs[status]; + }; + + const getEquipmentIcon = (type: EquipmentStatus['type']) => { + const icons = { + oven: Thermometer, + mixer: Activity, + proofer: Settings, + freezer: Zap, + packaging: Settings + }; + return icons[type] || Settings; + }; + + const summary = useMemo(() => { + const total = equipmentData.length; + const operational = equipmentData.filter(e => e.status === 'operational').length; + const warning = equipmentData.filter(e => e.status === 'warning').length; + const maintenance = equipmentData.filter(e => e.status === 'maintenance').length; + const down = equipmentData.filter(e => e.status === 'down').length; + const avgEfficiency = equipmentData.reduce((sum, e) => sum + e.efficiency, 0) / total; + const avgUptime = equipmentData.reduce((sum, e) => sum + e.uptime, 0) / total; + const totalEnergyUsage = equipmentData.reduce((sum, e) => sum + e.energyUsage, 0); + + return { + total, + operational, + warning, + maintenance, + down, + avgEfficiency, + avgUptime, + totalEnergyUsage + }; + }, [equipmentData]); + + if (isLoading) { + return ( + + +

+ {t('equipment.title', 'Equipment Status')} +

+ + +
+
+
+
+
+
+
+
+
+
+
+ + + ); + } + + if (error) { + return ( + + + +

+ {t('equipment.error', 'Error loading equipment data')} +

+ + + ); + } + + return ( + + +
+
+

+ {t('equipment.title', 'Equipment Status')} +

+

+ {t('equipment.subtitle', 'Monitor equipment health and performance')} +

+
+ +
+ + + + {/* Summary Stats */} +
+
+
+ {summary.operational} +
+
+ {t('equipment.operational', 'Operational')} +
+
+
+
+ {summary.warning + summary.maintenance} +
+
+ {t('equipment.needs_attention', 'Needs Attention')} +
+
+
+
+ {summary.avgEfficiency.toFixed(1)}% +
+
+ {t('equipment.efficiency', 'Efficiency')} +
+
+
+ + {/* Equipment List */} +
+ {equipmentData.slice(0, 4).map((item) => { + const statusConfig = getStatusConfig(item.status); + const EquipmentIcon = getEquipmentIcon(item.type); + const StatusIcon = statusConfig.icon; + + return ( +
onViewEquipment?.(item.id)} + > +
+
+ + +
+
+
+ {item.name} +
+
+ {item.location} + {item.temperature && ( + + {item.temperature}°C + + )} +
+
+
+ +
+
+
+ {item.efficiency}% +
+
+ {t('equipment.efficiency', 'Efficiency')} +
+
+ + {statusConfig.label} + +
+
+ ); + })} +
+ + {/* Key Metrics */} +
+
+
+ + + {summary.avgUptime.toFixed(1)}% + +
+
+ {t('equipment.uptime', 'Average Uptime')} +
+
+
+
+ + + {summary.totalEnergyUsage.toFixed(1)} kW + +
+
+ {t('equipment.energy_usage', 'Energy Usage')} +
+
+
+ + {/* Alerts */} + {equipmentData.some(e => e.alerts.length > 0) && ( +
+

+ {t('equipment.alerts', 'Recent Alerts')} +

+ {equipmentData + .filter(e => e.alerts.length > 0) + .slice(0, 3) + .map((item) => ( +
+ +
+
+ {item.name} +
+
+ {item.alerts[0]} +
+
+
+ ))} +
+ )} + + + ); +}; + +export default EquipmentStatusWidget; \ No newline at end of file diff --git a/frontend/src/components/domain/dashboard/ProductionCostMonitor.tsx b/frontend/src/components/domain/dashboard/ProductionCostMonitor.tsx new file mode 100644 index 00000000..2f35792f --- /dev/null +++ b/frontend/src/components/domain/dashboard/ProductionCostMonitor.tsx @@ -0,0 +1,322 @@ +import React, { useMemo } from 'react'; +import { useTranslation } from 'react-i18next'; +import { Card, CardHeader, CardBody } from '../../ui/Card'; +import { StatsGrid } from '../../ui/Stats'; +import { Badge } from '../../ui/Badge'; +import { Button } from '../../ui/Button'; +import { + Euro, + TrendingUp, + TrendingDown, + AlertTriangle, + Target, + Clock, + Activity, + Zap +} from 'lucide-react'; +import { useCurrentTenant } from '../../../stores/tenant.store'; +import { useProductionDashboard } from '../../../api'; + +export interface ProductionCostData { + totalCost: number; + laborCost: number; + materialCost: number; + overheadCost: number; + energyCost: number; + costPerUnit: number; + budget: number; + variance: number; + trend: { + direction: 'up' | 'down' | 'stable'; + percentage: number; + }; +} + +export interface ProductionCostMonitorProps { + className?: string; + data?: ProductionCostData; + onViewDetails?: () => void; + onOptimize?: () => void; +} + +const ProductionCostMonitor: React.FC = ({ + className, + data, + onViewDetails, + onOptimize +}) => { + const { t } = useTranslation(); + const currentTenant = useCurrentTenant(); + const tenantId = currentTenant?.id || ''; + + const { + data: dashboardData, + isLoading, + error + } = useProductionDashboard(tenantId); + + const costData = useMemo((): ProductionCostData => { + if (data) return data; + + // Calculate from dashboard data if available + if (dashboardData) { + const mockData: ProductionCostData = { + totalCost: 2840.50, + laborCost: 1200.00, + materialCost: 1450.00, + overheadCost: 190.50, + energyCost: 95.25, + costPerUnit: 14.20, + budget: 3000.00, + variance: -159.50, + trend: { + direction: 'down', + percentage: 5.3 + } + }; + return mockData; + } + + // Default mock data + return { + totalCost: 2840.50, + laborCost: 1200.00, + materialCost: 1450.00, + overheadCost: 190.50, + energyCost: 95.25, + costPerUnit: 14.20, + budget: 3000.00, + variance: -159.50, + trend: { + direction: 'down', + percentage: 5.3 + } + }; + }, [data, dashboardData]); + + const formatCurrency = (amount: number) => { + return new Intl.NumberFormat('es-ES', { + style: 'currency', + currency: 'EUR', + minimumFractionDigits: 2 + }).format(amount); + }; + + const getVarianceColor = (variance: number) => { + if (variance > 0) return 'text-red-600'; + if (variance < -50) return 'text-green-600'; + return 'text-yellow-600'; + }; + + const getBudgetStatus = () => { + const percentage = (costData.totalCost / costData.budget) * 100; + if (percentage > 100) return { color: 'error', label: t('production.cost.over_budget', 'Over Budget') }; + if (percentage > 90) return { color: 'warning', label: t('production.cost.near_budget', 'Near Budget') }; + return { color: 'success', label: t('production.cost.on_budget', 'On Budget') }; + }; + + const budgetStatus = getBudgetStatus(); + + if (isLoading) { + return ( + + +

+ {t('production.cost.title', 'Production Cost Monitor')} +

+ + +
+
+
+
+
+
+
+ + + ); + } + + if (error) { + return ( + + + +

+ {t('production.cost.error', 'Error loading cost data')} +

+ + + ); + } + + const costStats = [ + { + title: t('production.cost.total_cost', 'Total Cost'), + value: formatCurrency(costData.totalCost), + icon: Euro, + variant: budgetStatus.color as 'success' | 'warning' | 'error', + trend: { + value: costData.trend.percentage, + direction: costData.trend.direction === 'up' ? 'up' as const : 'down' as const, + label: t('production.cost.vs_yesterday', 'vs yesterday') + }, + subtitle: `${formatCurrency(Math.abs(costData.variance))} ${costData.variance > 0 ? t('common.over', 'over') : t('common.under', 'under')} ${t('common.budget', 'budget')}` + }, + { + title: t('production.cost.cost_per_unit', 'Cost per Unit'), + value: formatCurrency(costData.costPerUnit), + icon: Target, + variant: 'info' as const, + subtitle: t('production.cost.average_today', 'Average today') + } + ]; + + const costBreakdown = [ + { + label: t('production.cost.labor', 'Labor'), + amount: costData.laborCost, + percentage: (costData.laborCost / costData.totalCost) * 100, + icon: Clock, + color: 'bg-blue-500' + }, + { + label: t('production.cost.materials', 'Materials'), + amount: costData.materialCost, + percentage: (costData.materialCost / costData.totalCost) * 100, + icon: Activity, + color: 'bg-green-500' + }, + { + label: t('production.cost.overhead', 'Overhead'), + amount: costData.overheadCost, + percentage: (costData.overheadCost / costData.totalCost) * 100, + icon: Euro, + color: 'bg-orange-500' + }, + { + label: t('production.cost.energy', 'Energy'), + amount: costData.energyCost, + percentage: (costData.energyCost / costData.totalCost) * 100, + icon: Zap, + color: 'bg-yellow-500' + } + ]; + + return ( + + +
+
+

+ {t('production.cost.title', 'Production Cost Monitor')} +

+

+ {t('production.cost.subtitle', 'Track and optimize production costs')} +

+
+ + {budgetStatus.label} + +
+ + + + {/* Key Metrics */} + + + {/* Cost Breakdown */} +
+

+ {t('production.cost.breakdown', 'Cost Breakdown')} +

+
+ {costBreakdown.map((item, index) => { + const Icon = item.icon; + return ( +
+
+
+ + + {item.label} + +
+
+ + {formatCurrency(item.amount)} + + + {item.percentage.toFixed(1)}% + +
+
+ ); + })} +
+
+ + {/* Budget Progress */} +
+
+ + {t('production.cost.budget_usage', 'Budget Usage')} + + + {formatCurrency(costData.totalCost)} / {formatCurrency(costData.budget)} + +
+
+
costData.budget + ? 'bg-red-500' + : costData.totalCost > costData.budget * 0.9 + ? 'bg-yellow-500' + : 'bg-green-500' + }`} + style={{ + width: `${Math.min(100, (costData.totalCost / costData.budget) * 100)}%` + }} + >
+
+
+ + {costData.variance > 0 ? '+' : ''}{formatCurrency(costData.variance)} + + + {((costData.totalCost / costData.budget) * 100).toFixed(1)}% {t('common.used', 'used')} + +
+
+ + {/* Actions */} +
+ + +
+ + + ); +}; + +export default ProductionCostMonitor; \ No newline at end of file diff --git a/frontend/src/components/domain/dashboard/index.ts b/frontend/src/components/domain/dashboard/index.ts index 9bc4760d..edb20408 100644 --- a/frontend/src/components/domain/dashboard/index.ts +++ b/frontend/src/components/domain/dashboard/index.ts @@ -5,9 +5,12 @@ export { default as RealTimeAlerts } from './RealTimeAlerts'; export { default as ProcurementPlansToday } from './ProcurementPlansToday'; export { default as ProductionPlansToday } from './ProductionPlansToday'; -// Note: The following components are specified in the design but not yet implemented: -// - DashboardCard -// - DashboardGrid -// - QuickActions -// - RecentActivity -// - KPIWidget \ No newline at end of file +// Production Management Dashboard Widgets +export { default as ProductionCostMonitor } from './ProductionCostMonitor'; +export { default as EquipmentStatusWidget } from './EquipmentStatusWidget'; +export { default as AIInsightsWidget } from './AIInsightsWidget'; + +// Types +export type { ProductionCostData } from './ProductionCostMonitor'; +export type { EquipmentStatus } from './EquipmentStatusWidget'; +export type { AIInsight } from './AIInsightsWidget'; \ No newline at end of file diff --git a/frontend/src/components/domain/index.ts b/frontend/src/components/domain/index.ts index 933db471..fede442d 100644 --- a/frontend/src/components/domain/index.ts +++ b/frontend/src/components/domain/index.ts @@ -24,5 +24,8 @@ export * from './analytics'; // Onboarding components export * from './onboarding'; +// Procurement components +export * from './procurement'; + // Team components export { default as AddTeamMemberModal } from './team/AddTeamMemberModal'; \ No newline at end of file diff --git a/frontend/src/components/domain/procurement/CreatePurchaseOrderModal.tsx b/frontend/src/components/domain/procurement/CreatePurchaseOrderModal.tsx new file mode 100644 index 00000000..1adbfe7f --- /dev/null +++ b/frontend/src/components/domain/procurement/CreatePurchaseOrderModal.tsx @@ -0,0 +1,722 @@ +import React, { useState, useEffect } from 'react'; +import { Plus, Package, Euro, Calendar, Truck, Building2, X, Save, AlertCircle } from 'lucide-react'; +import { Button } from '../../ui/Button'; +import { Input } from '../../ui/Input'; +import { Card } from '../../ui/Card'; +import { useSuppliers } from '../../../api/hooks/suppliers'; +import { useCreatePurchaseOrder } from '../../../api/hooks/suppliers'; +import { useTenantStore } from '../../../stores/tenant.store'; +import type { ProcurementRequirementResponse, PurchaseOrderItem } from '../../../api/types/orders'; +import type { SupplierSummary } from '../../../api/types/suppliers'; + +interface CreatePurchaseOrderModalProps { + isOpen: boolean; + onClose: () => void; + requirements: ProcurementRequirementResponse[]; + onSuccess?: () => void; +} + +/** + * CreatePurchaseOrderModal - Modal for creating purchase orders from procurement requirements + * Allows supplier selection and purchase order creation for ingredients + * Can also be used for manual purchase order creation when no requirements are provided + */ +export const CreatePurchaseOrderModal: React.FC = ({ + isOpen, + onClose, + requirements, + onSuccess +}) => { + const [selectedSupplierId, setSelectedSupplierId] = useState(''); + const [deliveryDate, setDeliveryDate] = useState(''); + const [notes, setNotes] = useState(''); + const [selectedRequirements, setSelectedRequirements] = useState>({}); + const [quantities, setQuantities] = useState>({}); + const [loading, setLoading] = useState(false); + const [error, setError] = useState(null); + + // For manual creation when no requirements are provided + const [manualItems, setManualItems] = useState>([]); + const [manualItemInputs, setManualItemInputs] = useState({ + product_name: '', + product_sku: '', + unit_of_measure: '', + unit_price: '', + quantity: '' + }); + + // Get current tenant + const { currentTenant } = useTenantStore(); + const tenantId = currentTenant?.id || ''; + + // Fetch suppliers (without status filter to avoid backend enum issue) + const { data: suppliersData, isLoading: isLoadingSuppliers, isError: isSuppliersError, error: suppliersError } = useSuppliers( + tenantId, + { limit: 100 }, + { enabled: !!tenantId && isOpen } + ); + const suppliers = (suppliersData?.data || []).filter( + supplier => supplier.status === 'active' + ); + + // Create purchase order mutation + const createPurchaseOrderMutation = useCreatePurchaseOrder(); + + // Initialize quantities when requirements change + useEffect(() => { + if (requirements && requirements.length > 0) { + // Initialize from requirements (existing behavior) + const initialQuantities: Record = {}; + requirements.forEach(req => { + initialQuantities[req.id] = req.approved_quantity || req.net_requirement || req.required_quantity; + }); + setQuantities(initialQuantities); + + // Initialize all requirements as selected + const initialSelected: Record = {}; + requirements.forEach(req => { + initialSelected[req.id] = true; + }); + setSelectedRequirements(initialSelected); + + // Clear manual items when using requirements + setManualItems([]); + } else { + // Reset for manual creation + setQuantities({}); + setSelectedRequirements({}); + setManualItems([]); + } + }, [requirements]); + + // Group requirements by supplier (only when requirements exist) + const groupedRequirements = requirements && requirements.length > 0 ? + requirements.reduce((acc, req) => { + const supplierId = req.preferred_supplier_id || 'unassigned'; + if (!acc[supplierId]) { + acc[supplierId] = []; + } + acc[supplierId].push(req); + return acc; + }, {} as Record) : + {}; + + const handleQuantityChange = (requirementId: string, value: string) => { + const numValue = parseFloat(value) || 0; + setQuantities(prev => ({ + ...prev, + [requirementId]: numValue + })); + }; + + const handleSelectRequirement = (requirementId: string, checked: boolean) => { + setSelectedRequirements(prev => ({ + ...prev, + [requirementId]: checked + })); + }; + + const handleSelectAll = (supplierId: string, checked: boolean) => { + const supplierRequirements = groupedRequirements[supplierId] || []; + const updatedSelected = { ...selectedRequirements }; + + supplierRequirements.forEach(req => { + updatedSelected[req.id] = checked; + }); + + setSelectedRequirements(updatedSelected); + }; + + // Manual item functions + const handleAddManualItem = () => { + if (!manualItemInputs.product_name || !manualItemInputs.unit_of_measure || !manualItemInputs.unit_price) { + return; + } + + const newItem = { + id: `manual-${Date.now()}`, + product_name: manualItemInputs.product_name, + product_sku: manualItemInputs.product_sku || undefined, + unit_of_measure: manualItemInputs.unit_of_measure, + unit_price: parseFloat(manualItemInputs.unit_price) || 0 + }; + + setManualItems(prev => [...prev, newItem]); + + // Reset inputs + setManualItemInputs({ + product_name: '', + product_sku: '', + unit_of_measure: '', + unit_price: '', + quantity: '' + }); + }; + + const handleRemoveManualItem = (id: string) => { + setManualItems(prev => prev.filter(item => item.id !== id)); + }; + + const handleManualItemQuantityChange = (id: string, value: string) => { + const numValue = parseFloat(value) || 0; + setQuantities(prev => ({ + ...prev, + [id]: numValue + })); + }; + + const handleCreatePurchaseOrder = async () => { + if (!selectedSupplierId) { + setError('Por favor, selecciona un proveedor'); + return; + } + + let items: PurchaseOrderItem[] = []; + + if (requirements && requirements.length > 0) { + // Create items from requirements + const selectedReqs = requirements.filter(req => selectedRequirements[req.id]); + + if (selectedReqs.length === 0) { + setError('Por favor, selecciona al menos un ingrediente'); + return; + } + + // Validate quantities + const invalidQuantities = selectedReqs.some(req => quantities[req.id] <= 0); + if (invalidQuantities) { + setError('Todas las cantidades deben ser mayores a 0'); + return; + } + + // Prepare purchase order items from requirements + items = selectedReqs.map(req => ({ + inventory_product_id: req.product_id, + product_code: req.product_sku || '', + product_name: req.product_name, + ordered_quantity: quantities[req.id], + unit_of_measure: req.unit_of_measure, + unit_price: req.estimated_unit_cost || 0, + quality_requirements: req.quality_specifications ? JSON.stringify(req.quality_specifications) : undefined, + notes: req.special_requirements || undefined + })); + } else { + // Create items from manual entries + if (manualItems.length === 0) { + setError('Por favor, agrega al menos un producto'); + return; + } + + // Validate quantities for manual items + const invalidQuantities = manualItems.some(item => quantities[item.id] <= 0); + if (invalidQuantities) { + setError('Todas las cantidades deben ser mayores a 0'); + return; + } + + // Prepare purchase order items from manual entries + items = manualItems.map(item => ({ + inventory_product_id: '', // Not applicable for manual items + product_code: item.product_sku || '', + product_name: item.product_name, + ordered_quantity: quantities[item.id], + unit_of_measure: item.unit_of_measure, + unit_price: item.unit_price, + quality_requirements: undefined, + notes: undefined + })); + } + + setLoading(true); + setError(null); + + try { + // Create purchase order + await createPurchaseOrderMutation.mutateAsync({ + supplier_id: selectedSupplierId, + priority: 'normal', + required_delivery_date: deliveryDate || undefined, + notes: notes || undefined, + items + }); + + // Close modal and trigger success callback + onClose(); + if (onSuccess) { + onSuccess(); + } + } catch (err) { + console.error('Error creating purchase order:', err); + setError('Error al crear la orden de compra. Por favor, intenta de nuevo.'); + } finally { + setLoading(false); + } + }; + + // Log suppliers when they change for debugging + useEffect(() => { + // console.log('Suppliers updated:', suppliers); + }, [suppliers]); + + if (!isOpen) return null; + + return ( +
+
+ {/* Header */} +
+
+
+ +
+
+

+ Crear Orden de Compra +

+

+ Selecciona proveedor e ingredientes para crear una orden de compra +

+
+
+ +
+ + {/* Content */} +
+ {error && ( +
+ + {error} +
+ )} + + {/* Supplier Selection */} +
+ + {!tenantId ? ( +
+ Cargando información del tenant... +
+ ) : isLoadingSuppliers ? ( +
+ ) : isSuppliersError ? ( +
+ Error al cargar proveedores: {suppliersError?.message || 'Error desconocido'} +
+ ) : ( + + )} +
+ + {/* Delivery Date */} +
+ + setDeliveryDate(e.target.value)} + className="w-full" + disabled={loading} + /> +
+ + {/* Notes */} +
+ +