@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <div class="page-header d-flex justify-content-between align-items-center mb-4">
        <div>
            <h1 class="h3 mb-1">Device Assignments</h1>
            <p class="text-muted mb-0">Manage DECT device assignments to users</p>
        </div>
        <div class="d-flex gap-2">
            <a href="{{ route('dect.assignments.create') }}" class="btn btn-primary btn-sm">
                <i class="fas fa-plus"></i> New Assignment
            </a>
        </div>
    </div>

    <!-- Assignment Statistics -->
    <div class="row mb-4">
        <div class="col-md-4">
            <div class="card border-0 shadow-sm">
                <div class="card-body">
                    <div class="d-flex align-items-center">
                        <div class="bg-primary bg-opacity-10 rounded p-3">
                            <i class="fas fa-users text-primary fs-4"></i>
                        </div>
                        <div class="ms-3">
                            <h6 class="text-muted mb-1">Active Assignments</h6>
                            <h4 class="mb-0">{{ $assignments->total() }}</h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card border-0 shadow-sm">
                <div class="card-body">
                    <div class="d-flex align-items-center">
                        <div class="bg-success bg-opacity-10 rounded p-3">
                            <i class="fas fa-phone text-success fs-4"></i>
                        </div>
                        <div class="ms-3">
                            <h6 class="text-muted mb-1">Unassigned Handsets</h6>
                            <h4 class="mb-0">{{ $unassignedHandsets }}</h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card border-0 shadow-sm">
                <div class="card-body">
                    <div class="d-flex align-items-center">
                        <div class="bg-info bg-opacity-10 rounded p-3">
                            <i class="fas fa-chart-line text-info fs-4"></i>
                        </div>
                        <div class="ms-3">
                            <h6 class="text-muted mb-1">Assignment Rate</h6>
                            <h4 class="mb-0">{{ round((1 - $unassignedHandsets / max(DectHandset::where('status', 'registered')->count(), 1)) * 100, 1) }}%</h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Assignments Table -->
    <div class="card border-0 shadow-sm">
        <div class="card-header bg-white border-bottom">
            <h5 class="card-title mb-0">Current Assignments</h5>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-hover">
                    <thead class="table-light">
                        <tr>
                            <th>User</th>
                            <th>Handset</th>
                            <th>Assigned By</th>
                            <th>Assigned At</th>
                            <th>Duration</th>
                            <th>Status</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($assignments as $assignment)
                        <tr>
                            <td>
                                <div class="fw-semibold">{{ $assignment->user->name }}</div>
                                <small class="text-muted">{{ $assignment->user->email }}</small>
                            </td>
                            <td>
                                <div class="fw-semibold">{{ $assignment->handset->name }}</div>
                                <small class="text-muted">{{ $assignment->handset->extension_id ?? 'No Extension' }}</small>
                            </td>
                            <td>{{ $assignment->assignedBy->name }}</td>
                            <td>{{ $assignment->assigned_at->format('Y-m-d H:i:s') }}</td>
                            <td>
                                <span class="badge bg-light">{{ $assignment->assignment_duration }}</span>
                            </td>
                            <td>
                                <span class="badge {{ $assignment->is_active ? 'bg-success' : 'bg-secondary' }}">
                                    {{ $assignment->is_active ? 'Active' : 'Inactive' }}
                                </span>
                            </td>
                            <td>
                                <div class="btn-group btn-group-sm">
                                    <a href="{{ route('dect.assignments.show', $assignment->id) }}" class="btn btn-outline-primary">
                                        <i class="fas fa-eye"></i>
                                    </a>
                                    <a href="{{ route('dect.assignments.edit', $assignment->id) }}" class="btn btn-outline-secondary">
                                        <i class="fas fa-edit"></i>
                                    </a>
                                    @if($assignment->is_active)
                                        <form action="{{ route('dect.assignments.revoke', $assignment->id) }}" method="POST" style="display: inline;">
                                            @csrf
                                            <button type="submit" class="btn btn-outline-warning" onclick="return confirm('Revoke this assignment?')">
                                                <i class="fas fa-times"></i>
                                            </button>
                                        </form>
                                    @endif
                                </div>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            
            {{ $assignments->links() }}
        </div>
    </div>
</div>
@endsection