{{-- resources/views/delegations/index.blade.php --}}
@extends('layouts.app')

@section('title', 'Delegations')

@section('page-header')
<div class="d-sm-flex align-items-center justify-content-between mb-4">
    <h1 class="h3 mb-0 text-gray-800">
        <i class="fas fa-user-clock me-2 text-gray-500"></i>Approval Delegations
    </h1>
    <div>
        <a href="{{ route('delegations.index', ['show_deleted' => $showDeleted ? 0 : 1]) }}" class="btn btn-sm btn-secondary shadow-sm">
            <i class="fas fa-trash-alt fa-sm text-white-50"></i> {{ $showDeleted ? 'Hide Deleted' : 'Show Deleted' }}
        </a>
        <button type="button" class="btn btn-sm btn-primary shadow-sm" data-toggle="modal" data-target="#delegationModal" onclick="resetModal()">
            <i class="fas fa-plus fa-sm text-white-50"></i> Create Delegation
        </button>
    </div>
</div>
@endsection

@section('content')
<div class="container-fluid">
    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="fas fa-check-circle mr-2"></i> {{ session('success') }}
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    @endif

    @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="fas fa-exclamation-circle mr-2"></i> {{ session('error') }}
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    @endif

    <!-- Delegations List -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold text-primary">
                <i class="fas fa-list mr-2"></i>{{ $showDeleted ? 'Deleted Delegations' : 'Active & Historical Delegations' }}
            </h6>
        </div>
        <div class="card-body">
            @if($delegations->count() > 0)
                <div class="table-responsive">
                    <table class="table table-bordered table-hover table-striped align-middle">
                        <thead class="thead-light">
                            <tr>
                                <th>Status</th>
                                <th>Original User</th>
                                <th>Delegated To</th>
                                <th>Workflow</th>
                                <th>Start Date</th>
                                <th>End Date</th>
                                <th>Reason</th>
                                <th style="width: 180px">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($delegations as $delegation)
                                @php
                                    $status = $delegation->isActive() ? 'Active' : ($delegation->isExpired() ? 'Expired' : 'Cancelled');
                                    $statusClass = $delegation->isActive() ? 'success' : ($delegation->isExpired() ? 'secondary' : 'danger');
                                @endphp
                                <tr class="{{ $delegation->trashed() ? 'table-danger' : '' }}">
                                    <td>
                                        <span class="badge badge-{{ $statusClass }} text-white">
                                            {{ $status }}
                                        </span>
                                        @if($delegation->trashed())
                                            <br><small class="text-danger">(Soft Deleted)</small>
                                        @endif
                                    </td>
                                    <td>
                                        <strong>{{ $delegation->originalUser->name ?? 'N/A' }}</strong>
                                    </td>
                                    <td>
                                        <strong>{{ $delegation->delegatedUser->name ?? 'N/A' }}</strong>
                                    </td>
                                    <td>
                                        @if($delegation->workflow)
                                            <span class="badge badge-info text-white">{{ $delegation->workflow->workflow_name }}</span>
                                        @else
                                            <span class="text-muted">All Workflows</span>
                                        @endif
                                    </td>
                                    <td class="small">{{ $delegation->start_date->format('M d, Y H:i') }}</td>
                                    <td class="small">{{ $delegation->end_date->format('M d, Y H:i') }}</td>
                                    <td class="small">{{ $delegation->reason ?? 'N/A' }}</td>
                                    <td>
                                        <div class="btn-group btn-group-sm" role="group">
                                            @if($delegation->trashed())
                                                <!-- Restore -->
                                                <form action="{{ route('delegations.restore', $delegation->delegation_id) }}" method="POST" class="d-inline">
                                                    @csrf
                                                    <button type="submit" class="btn btn-success" title="Restore">
                                                        <i class="fas fa-undo"></i>
                                                    </button>
                                                </form>
                                                <!-- Force Delete (Optional: Admin Only) -->
                                                @if(Auth::user()->isAdmin())
                                                <form action="{{ route('delegations.destroy', $delegation->delegation_id) }}" method="POST" class="d-inline" onsubmit="return confirm('Permanently delete this delegation?');">
                                                    @csrf
                                                    @method('DELETE')
                                                    <button type="submit" class="btn btn-danger" title="Force Delete">
                                                        <i class="fas fa-times"></i>
                                                    </button>
                                                </form>
                                                @endif
                                            @else
                                                <!-- Edit -->
                                                <button class="btn btn-warning text-white" title="Edit" 
                                                        onclick="editDelegation({{ $delegation->toJson() }})">
                                                    <i class="fas fa-edit"></i>
                                                </button>
                                                
                                                <!-- Cancel -->
                                                @if($delegation->isActive() && $delegation->original_user_id == auth()->id())
                                                    <form action="{{ route('delegations.cancel', $delegation->delegation_id) }}" method="POST" class="d-inline">
                                                        @csrf
                                                        <button type="submit" class="btn btn-danger" title="Cancel" onclick="return confirm('Cancel this delegation?')">
                                                            <i class="fas fa-ban"></i>
                                                        </button>
                                                    </form>
                                                @endif

                                                <!-- Soft Delete -->
                                                <form action="{{ route('delegations.destroy', $delegation->delegation_id) }}" method="POST" class="d-inline" onsubmit="return confirm('Are you sure you want to delete this delegation?');">
                                                    @csrf
                                                    @method('DELETE')
                                                    <button type="submit" class="btn btn-secondary" title="Delete">
                                                        <i class="fas fa-trash"></i>
                                                    </button>
                                                </form>
                                            @endif
                                        </div>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <div class="mt-3">
                    {{ $delegations->links('pagination::bootstrap-4') }}
                </div>
            @else
                <div class="text-center py-5">
                    <i class="fas fa-user-clock fa-4x text-muted mb-3"></i>
                    <h5>No Delegations Found</h5>
                    <p class="text-muted">Create delegations to temporarily transfer your approval authority.</p>
                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#delegationModal" onclick="resetModal()">
                        <i class="fas fa-plus mr-2"></i>Create Your First Delegation
                    </button>
                </div>
            @endif
        </div>
    </div>
</div>

<!-- Delegation Modal (Create/Edit) -->
<div class="modal fade" id="delegationModal" tabindex="-1" role="dialog" aria-labelledby="delegationModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header bg-primary text-white">
                <h5 class="modal-title" id="delegationModalLabel">
                    <i class="fas fa-plus-circle mr-2"></i>Create New Delegation
                </h5>
                <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <form method="POST" action="{{ route('delegations.store') }}" id="delegationForm">
                @csrf
                <input type="hidden" name="_method" id="delegationMethod" value="POST">
                <input type="hidden" name="delegation_id" id="delegation_id">
                
                <div class="modal-body">
                    <div class="form-group">
                        <label>Delegate To <span class="text-danger">*</span></label>
                        <select name="delegated_user_id" id="delegated_user_id" class="form-control" required>
                            <option value="">-- Select User --</option>
                            @foreach(\App\Models\User::where('id', '!=', auth()->id())->where('is_active', true)->get() as $user)
                                <option value="{{ $user->id }}">{{ $user->name }} ({{ $user->email }})</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Start Date <span class="text-danger">*</span></label>
                                <input type="datetime-local" name="start_date" id="start_date" class="form-control" 
                                       value="{{ date('Y-m-d\TH:i') }}" required>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label>End Date <span class="text-danger">*</span></label>
                                <input type="datetime-local" name="end_date" id="end_date" class="form-control" 
                                       value="{{ date('Y-m-d\TH:i', strtotime('+7 days')) }}" required>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Specific Workflow</label>
                                <select name="workflow_id" id="workflow_id" class="form-control">
                                    <option value="">All Workflows</option>
                                    @foreach(\App\Models\Workflow::where('is_active', true)->get() as $workflow)
                                        <option value="{{ $workflow->workflow_id }}">
                                            {{ $workflow->workflow_name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Module Type</label>
                                <select name="module_type" id="module_type" class="form-control">
                                    <option value="">All Modules</option>
                                    @foreach(config('workflow.modules') as $key => $label)
                                        <option value="{{ $key }}">{{ $label }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label>Reason for Delegation</label>
                        <textarea name="reason" id="reason" class="form-control" rows="3" 
                                  placeholder="e.g., Out of office, Vacation, Training, Medical leave"></textarea>
                    </div>
                    
                    {{-- Admin Status Select for Editing --}}
                    <div class="form-group" id="statusGroup" style="display: none;">
                        <label>Status</label>
                        <select name="status" id="status" class="form-control">
                            <option value="ACTIVE">Active</option>
                            <option value="EXPIRED">Expired</option>
                            <option value="CANCELLED">Cancelled</option>
                        </select>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary" id="submitButton">Create Delegation</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    // Reset modal to Create state
    function resetModal() {
        document.getElementById('delegationForm').reset();
        document.getElementById('delegationMethod').value = 'POST';
        document.getElementById('delegationForm').action = '{{ route("delegations.store") }}';
        document.getElementById('delegationModalLabel').innerHTML = '<i class="fas fa-plus-circle mr-2"></i>Create New Delegation';
        document.getElementById('submitButton').innerText = 'Create Delegation';
        document.getElementById('statusGroup').style.display = 'none';
        
        // Reset dates
        document.getElementById('start_date').value = '{{ date('Y-m-d\TH:i') }}';
        document.getElementById('end_date').value = '{{ date('Y-m-d\TH:i', strtotime('+7 days')) }}';
    }

    // Populate modal for Editing
    function editDelegation(delegation) {
        resetModal();
        
        document.getElementById('delegationForm').action = '{{ route("delegations.update", ":id") }}'.replace(':id', delegation.delegation_id);
        document.getElementById('delegationMethod').value = 'PUT';
        document.getElementById('delegation_id').value = delegation.delegation_id;
        
        document.getElementById('delegationModalLabel').innerHTML = '<i class="fas fa-edit mr-2"></i>Edit Delegation';
        document.getElementById('submitButton').innerText = 'Update Delegation';
        
        document.getElementById('delegated_user_id').value = delegation.delegated_user_id;
        document.getElementById('workflow_id').value = delegation.workflow_id || '';
        document.getElementById('module_type').value = delegation.module_type || '';
        document.getElementById('reason').value = delegation.reason || '';
        
        // Date formatting for inputs
        document.getElementById('start_date').value = delegation.start_date.replace(' ', 'T').substring(0, 16);
        document.getElementById('end_date').value = delegation.end_date.replace(' ', 'T').substring(0, 16);
        
        // Show status only for Admin/Original User editing
        document.getElementById('statusGroup').style.display = 'block';
        document.getElementById('status').value = delegation.status;
        
        $('#delegationModal').modal('show');
    }

    // Auto-calculate end date (7 days after start)
    document.getElementById('start_date').addEventListener('change', function() {
        var startDate = new Date(this.value);
        if (startDate && !isNaN(startDate.getTime())) {
            var endDate = new Date(startDate);
            endDate.setDate(endDate.getDate() + 7);
            
            var year = endDate.getFullYear();
            var month = String(endDate.getMonth() + 1).padStart(2, '0');
            var day = String(endDate.getDate()).padStart(2, '0');
            var hours = String(endDate.getHours()).padStart(2, '0');
            var minutes = String(endDate.getMinutes()).padStart(2, '0');
            
            document.getElementById('end_date').value = year + '-' + month + '-' + day + 'T' + hours + ':' + minutes;
        }
    });

    // Form validation
    document.getElementById('delegationForm').addEventListener('submit', function(e) {
        var startDate = new Date(document.getElementById('start_date').value);
        var endDate = new Date(document.getElementById('end_date').value);
        
        if (endDate <= startDate) {
            e.preventDefault();
            Swal.fire({
                icon: 'error',
                title: 'Date Error',
                text: 'End date must be after start date'
            });
            return false;
        }
    });
</script>
@endpush