@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <div class="row mb-4">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h2 class="h3 mb-1">Editar Ticket #{{ $soporte->id }}</h2>
                    <p class="text-muted mb-0">{{ $soporte->categoria }}</p>
                </div>
                <div class="d-flex gap-2">
                    <a href="{{ route('soporte.show', $soporte) }}" class="btn btn-info">
                        <i class="fas fa-eye"></i> Ver Ticket
                    </a>
                    <a href="{{ route('soporte.index') }}" class="btn btn-secondary">
                        <i class="fas fa-arrow-left"></i> Volver
                    </a>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-8">
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0">Información del Ticket</h5>
                </div>
                <div class="card-body">
                    <form action="{{ route('soporte.update', $soporte) }}" method="POST">
                        @csrf
                        @method('PUT')
                        
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="cliente_id" class="form-label">Cliente *</label>
                                    <select class="form-select @error('cliente_id') is-invalid @enderror" 
                                            id="cliente_id" name="cliente_id" required>
                                        <option value="">Seleccionar cliente</option>
                                        @foreach($clientes as $cliente)
                                            <option value="{{ $cliente->id }}" 
                                                    {{ old('cliente_id', $soporte->cliente_id) == $cliente->id ? 'selected' : '' }}>
                                                {{ $cliente->nombre }} {{ $cliente->apellido }}
                                                @if($cliente->empresa) - {{ $cliente->empresa }} @endif
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('cliente_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="tecnico_id" class="form-label">Técnico Asignado</label>
                                    <select class="form-select @error('tecnico_id') is-invalid @enderror" 
                                            id="tecnico_id" name="tecnico_id">
                                        <option value="">Sin asignar</option>
                                        @foreach($tecnicos as $tecnico)
                                            <option value="{{ $tecnico->id }}" 
                                                    {{ old('tecnico_id', $soporte->tecnico_id) == $tecnico->id ? 'selected' : '' }}>
                                                {{ $tecnico->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('tecnico_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-8">
                                <div class="mb-3">
                                    <label for="titulo" class="form-label">Título *</label>
                                    <input type="text" 
                                           class="form-control @error('titulo') is-invalid @enderror" 
                                           id="titulo" name="titulo" 
                                           value="{{ old('titulo', $soporte->titulo) }}" 
                                           required maxlength="255">
                                    @error('titulo')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="mb-3">
                                    <label for="categoria" class="form-label">Categoría *</label>
                                    <select class="form-select @error('categoria') is-invalid @enderror" 
                                            id="categoria" name="categoria" required>
                                        <option value="">Seleccionar</option>
                                        <option value="tecnico" {{ old('categoria', $soporte->categoria) == 'tecnico' ? 'selected' : '' }}>Técnico</option>
                                        <option value="comercial" {{ old('categoria', $soporte->categoria) == 'comercial' ? 'selected' : '' }}>Comercial</option>
                                        <option value="facturacion" {{ old('categoria', $soporte->categoria) == 'facturacion' ? 'selected' : '' }}>Pagos/Cobranza</option>
                                        <option value="conectividad" {{ old('categoria', $soporte->categoria) == 'conectividad' ? 'selected' : '' }}>Conectividad</option>
                                        <option value="hardware" {{ old('categoria', $soporte->categoria) == 'hardware' ? 'selected' : '' }}>Hardware</option>
                                        <option value="performance" {{ old('categoria', $soporte->categoria) == 'performance' ? 'selected' : '' }}>Performance</option>
                                        <option value="otro" {{ old('categoria', $soporte->categoria) == 'otro' ? 'selected' : '' }}>Otro</option>
                                    </select>
                                    @error('categoria')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="prioridad" class="form-label">Prioridad *</label>
                                    <select class="form-select @error('prioridad') is-invalid @enderror" 
                                            id="prioridad" name="prioridad" required>
                                        <option value="">Seleccionar</option>
                                        <option value="baja" {{ old('prioridad', $soporte->prioridad) == 'baja' ? 'selected' : '' }}>Baja</option>
                                        <option value="media" {{ old('prioridad', $soporte->prioridad) == 'media' ? 'selected' : '' }}>Media</option>
                                        <option value="alta" {{ old('prioridad', $soporte->prioridad) == 'alta' ? 'selected' : '' }}>Alta</option>
                                        <option value="critica" {{ old('prioridad', $soporte->prioridad) == 'critica' ? 'selected' : '' }}>Crítica</option>
                                    </select>
                                    @error('prioridad')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="estado" class="form-label">Estado *</label>
                                    <select class="form-select @error('estado') is-invalid @enderror" 
                                            id="estado" name="estado" required>
                                        <option value="">Seleccionar</option>
                                        <option value="pendiente" {{ old('estado', $soporte->estado) == 'pendiente' ? 'selected' : '' }}>Pendiente</option>
                                        <option value="asignado" {{ old('estado', $soporte->estado) == 'asignado' ? 'selected' : '' }}>Asignado</option>
                                        <option value="en_proceso" {{ old('estado', $soporte->estado) == 'en_proceso' ? 'selected' : '' }}>En Proceso</option>
                                        <option value="resuelto" {{ old('estado', $soporte->estado) == 'resuelto' ? 'selected' : '' }}>Resuelto</option>
                                        <option value="cerrado" {{ old('estado', $soporte->estado) == 'cerrado' ? 'selected' : '' }}>Cerrado</option>
                                    </select>
                                    @error('estado')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label for="descripcion" class="form-label">Descripción del Problema *</label>
                            <textarea class="form-control @error('descripcion') is-invalid @enderror" 
                                      id="descripcion" name="descripcion" rows="4" 
                                      required>{{ old('descripcion', $soporte->descripcion) }}</textarea>
                            @error('descripcion')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="mb-3">
                            <label for="observaciones" class="form-label">Observaciones</label>
                            <textarea class="form-control @error('observaciones') is-invalid @enderror" 
                                      id="observaciones" name="observaciones" rows="3">{{ old('observaciones', $soporte->observaciones) }}</textarea>
                            @error('observaciones')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="d-flex gap-2">
                            <button type="submit" class="btn btn-primary">
                                <i class="fas fa-save"></i> Actualizar Ticket
                            </button>
                            <a href="{{ route('soporte.show', $soporte) }}" class="btn btn-secondary">
                                <i class="fas fa-times"></i> Cancelar
                            </a>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- Información Adicional -->
        <div class="col-md-4">
            <div class="card">
                <div class="card-header">
                    <h6 class="mb-0">Información del Ticket</h6>
                </div>
                <div class="card-body">
                    <table class="table table-borderless table-sm">
                        <tr>
                            <td class="fw-bold">ID:</td>
                            <td>#{{ $soporte->id }}</td>
                        </tr>
                        <tr>
                            <td class="fw-bold">Creado:</td>
                            <td>{{ $soporte->fecha_creacion ? $soporte->fecha_creacion->format('d/m/Y H:i') : $soporte->created_at->format('d/m/Y H:i') }}</td>
                        </tr>
                        @if($soporte->fecha_asignacion)
                        <tr>
                            <td class="fw-bold">Asignado:</td>
                            <td>{{ $soporte->fecha_asignacion->format('d/m/Y H:i') }}</td>
                        </tr>
                        @endif
                        @if($soporte->fecha_resolucion)
                        <tr>
                            <td class="fw-bold">Resuelto:</td>
                            <td>{{ $soporte->fecha_resolucion->format('d/m/Y H:i') }}</td>
                        </tr>
                        @endif
                        <tr>
                            <td class="fw-bold">Actualizado:</td>
                            <td>{{ $soporte->updated_at->format('d/m/Y H:i') }}</td>
                        </tr>
                    </table>
                </div>
            </div>

            @if($soporte->cliente)
            <div class="card mt-3">
                <div class="card-header">
                    <h6 class="mb-0">Información del Cliente</h6>
                </div>
                <div class="card-body">
                    <p class="mb-1"><strong>{{ $soporte->cliente->nombre }} {{ $soporte->cliente->apellido }}</strong></p>
                    @if($soporte->cliente->empresa)
                        <p class="mb-1 text-muted">{{ $soporte->cliente->empresa }}</p>
                    @endif
                    <p class="mb-1">
                        <i class="fas fa-envelope"></i> {{ $soporte->cliente->email }}
                    </p>
                    <p class="mb-0">
                        <i class="fas fa-phone"></i> {{ $soporte->cliente->telefono }}
                    </p>
                </div>
            </div>
            @endif
        </div>
    </div>
</div>
@endsection