@extends('layouts.app')

@section('title', 'Ship Details - Terminal Operating System')

@section('content')
<div class="row mb-4">
    <div class="col-md-8">
        <h1 class="mb-0">
            <i class="fas fa-anchor"></i> {{ $ship->name }}
        </h1>
        <small class="text-muted">{{ $ship->imo_number }}</small>
    </div>
    <div class="col-md-4 text-end">
        <a href="{{ route('ships.edit', $ship) }}" class="btn btn-warning">
            <i class="fas fa-edit"></i> Edit
        </a>
        <a href="{{ route('ships.index') }}" class="btn btn-secondary">
            <i class="fas fa-arrow-left"></i> Back
        </a>
    </div>
</div>

<div class="row mb-4">
    <div class="col-md-3">
        <div class="card">
            <div class="card-body">
                <small class="text-muted">Status</small>
                <p class="mb-0">
                    <span class="badge bg-{{ 
                        $ship->status === 'in_port' ? 'info' : 
                        ($ship->status === 'loading' ? 'warning' : 
                        ($ship->status === 'unloading' ? 'primary' : 
                        ($ship->status === 'departed' ? 'danger' : 'secondary')))
                    }} fs-6">
                        {{ ucfirst(str_replace('_', ' ', $ship->status)) }}
                    </span>
                </p>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card">
            <div class="card-body">
                <small class="text-muted">Capacity</small>
                <p class="mb-0"><strong>{{ $ship->capacity }}</strong> TEU</p>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card">
            <div class="card-body">
                <small class="text-muted">Current Load</small>
                <p class="mb-0"><strong>{{ $ship->current_load }}</strong> / {{ $ship->capacity }}</p>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card">
            <div class="card-body">
                <small class="text-muted">Terminal</small>
                <p class="mb-0">
                    @if($ship->terminal)
                        <a href="{{ route('terminals.show', $ship->terminal) }}">
                            {{ $ship->terminal->name }}
                        </a>
                    @else
                        <span class="text-muted">Not assigned</span>
                    @endif
                </p>
            </div>
        </div>
    </div>
</div>

<div class="row mb-4">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header bg-dark text-white">
                <h5 class="mb-0">Dates & Details</h5>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-md-4">
                        <small class="text-muted">Arrival Date</small>
                        <p class="mb-0">{{ $ship->arrival_date?->format('M d, Y H:i') ?? 'Not set' }}</p>
                    </div>
                    <div class="col-md-4">
                        <small class="text-muted">Departure Date</small>
                        <p class="mb-0">{{ $ship->departure_date?->format('M d, Y H:i') ?? 'Not set' }}</p>
                    </div>
                    <div class="col-md-4">
                        <small class="text-muted">Capacity Utilization</small>
                        <p class="mb-0">
                            {{ $ship->capacity > 0 ? round(($ship->current_load / $ship->capacity) * 100, 2) : 0 }}%
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header bg-dark text-white">
                <div class="d-flex justify-content-between align-items-center">
                    <h5 class="mb-0">Containers</h5>
                    <span class="badge bg-secondary">Total: {{ $containerStats['total'] }}</span>
                </div>
            </div>
            <div class="card-body">
                <div class="row mb-3">
                    <div class="col-md-3">
                        <div class="text-center">
                            <h5 class="text-primary">{{ $containerStats['loaded'] }}</h5>
                            <small class="text-muted">Loaded</small>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="text-center">
                            <h5 class="text-warning">{{ $containerStats['unloaded'] }}</h5>
                            <small class="text-muted">Unloaded</small>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="text-center">
                            <h5 class="text-success">{{ $containerStats['empty'] }}</h5>
                            <small class="text-muted">Empty</small>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="text-center">
                            <h5 class="text-info">{{ $containerStats['total'] }}</h5>
                            <small class="text-muted">Total</small>
                        </div>
                    </div>
                </div>
            </div>
            <div class="table-responsive">
                <table class="table table-hover mb-0">
                    <thead>
                        <tr>
                            <th>Container ID</th>
                            <th>Type</th>
                            <th>Size</th>
                            <th>Status</th>
                            <th>Destination</th>
                            <th>Weight</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($ship->containers as $container)
                            <tr>
                                <td>{{ $container->container_id }}</td>
                                <td><span class="badge bg-secondary">{{ $container->type }}</span></td>
                                <td>{{ $container->size }}</td>
                                <td>
                                    <span class="badge bg-{{ $container->status === 'loaded' ? 'success' : 'warning' }}">
                                        {{ ucfirst($container->status) }}
                                    </span>
                                </td>
                                <td>{{ $container->destination ?? 'N/A' }}</td>
                                <td>{{ $container->weight }} kg</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="6" class="text-center py-4 text-muted">No containers assigned</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection