@extends('layouts.app')

@section('title', 'Gestión de Respaldos')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h3 class="card-title">Gestión de Respaldos</h3>
                    <div>
                        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#crearRespaldoModal">
                            <i class="fas fa-plus"></i> Crear Respaldo
                        </button>
                        <button type="button" class="btn btn-success" onclick="programarRespaldo()">
                            <i class="fas fa-clock"></i> Programar
                        </button>
                    </div>
                </div>
                <div class="card-body">
                    <!-- Estadísticas de Respaldos -->
                    <div class="row mb-4">
                        <div class="col-md-3">
                            <div class="card bg-primary text-white">
                                <div class="card-body text-center">
                                    <h4>{{ $totalRespaldos }}</h4>
                                    <small>Total Respaldos</small>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="card bg-success text-white">
                                <div class="card-body text-center">
                                    <h4>{{ $respaldosRecientes }}</h4>
                                    <small>Últimos 7 días</small>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="card bg-info text-white">
                                <div class="card-body text-center">
                                    <h4>{{ $tamañoTotal }}</h4>
                                    <small>Tamaño Total</small>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="card bg-warning text-white">
                                <div class="card-body text-center">
                                    <h4>{{ $ultimoRespaldo }}</h4>
                                    <small>Último Respaldo</small>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- Filtros -->
                    <form method="GET" class="mb-4">
                        <div class="row">
                            <div class="col-md-3">
                                <select name="tipo" class="form-control">
                                    <option value="">Todos los tipos</option>
                                    <option value="completo" {{ request('tipo') == 'completo' ? 'selected' : '' }}>Completo</option>
                                    <option value="base_datos" {{ request('tipo') == 'base_datos' ? 'selected' : '' }}>Base de Datos</option>
                                    <option value="archivos" {{ request('tipo') == 'archivos' ? 'selected' : '' }}>Archivos</option>
                                </select>
                            </div>
                            <div class="col-md-3">
                                <input type="date" name="fecha_desde" class="form-control" value="{{ request('fecha_desde') }}" placeholder="Desde">
                            </div>
                            <div class="col-md-3">
                                <input type="date" name="fecha_hasta" class="form-control" value="{{ request('fecha_hasta') }}" placeholder="Hasta">
                            </div>
                            <div class="col-md-3">
                                <button type="submit" class="btn btn-primary">Filtrar</button>
                                <a href="{{ route('respaldos.index') }}" class="btn btn-secondary">Limpiar</a>
                            </div>
                        </div>
                    </form>

                    <!-- Tabla de respaldos -->
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <thead>
                                <tr>
                                    <th>ID</th>
                                    <th>Nombre</th>
                                    <th>Tipo</th>
                                    <th>Tamaño</th>
                                    <th>Fecha</th>
                                    <th>Estado</th>
                                    <th>Acciones</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($respaldos as $respaldo)
                                    <tr>
                                        <td>{{ $respaldo['id'] }}</td>
                                        <td>
                                            <strong>{{ $respaldo['nombre'] }}</strong>
                                            @if($respaldo['descripcion'])
                                                <br><small class="text-muted">{{ $respaldo['descripcion'] }}</small>
                                            @endif
                                        </td>
                                        <td>
                                            <span class="badge badge-{{ $respaldo['tipo'] == 'completo' ? 'primary' : ($respaldo['tipo'] == 'base_datos' ? 'success' : 'info') }}">
                                                {{ ucfirst(str_replace('_', ' ', $respaldo['tipo'])) }}
                                            </span>
                                        </td>
                                        <td>{{ $respaldo['tamaño'] }}</td>
                                        <td>{{ $respaldo['fecha'] }}</td>
                                        <td>
                                            <span class="badge badge-{{ $respaldo['estado'] == 'completado' ? 'success' : ($respaldo['estado'] == 'error' ? 'danger' : 'warning') }}">
                                                {{ ucfirst($respaldo['estado']) }}
                                            </span>
                                        </td>
                                        <td>
                                            <div class="btn-group" role="group">
                                                <a href="{{ route('respaldos.download', $respaldo['id']) }}" class="btn btn-sm btn-success">
                                                    <i class="fas fa-download"></i>
                                                </a>
                                                <button type="button" class="btn btn-sm btn-primary" onclick="restaurarRespaldo({{ $respaldo['id'] }})">
                                                    <i class="fas fa-undo"></i>
                                                </button>
                                                <button type="button" class="btn btn-sm btn-info" onclick="verDetalles({{ $respaldo['id'] }})">
                                                    <i class="fas fa-eye"></i>
                                                </button>
                                                <form action="{{ route('respaldos.destroy', $respaldo['id']) }}" method="POST" class="d-inline">
                                                    @csrf
                                                    @method('DELETE')
                                                    <button type="submit" class="btn btn-sm btn-danger" onclick="return confirm('¿Eliminar este respaldo?')">
                                                        <i class="fas fa-trash"></i>
                                                    </button>
                                                </form>
                                            </div>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="7" class="text-center">No se encontraron respaldos</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>

                    <!-- Paginación -->
                    {{ $respaldos->links() }}
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Modal para crear respaldo -->
<div class="modal fade" id="crearRespaldoModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Crear Nuevo Respaldo</h5>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <form action="{{ route('respaldos.store') }}" method="POST">
                @csrf
                <div class="modal-body">
                    <div class="form-group">
                        <label for="nombre">Nombre del Respaldo</label>
                        <input type="text" name="nombre" id="nombre" class="form-control" placeholder="Respaldo {{ date('Y-m-d H:i') }}">
                    </div>
                    <div class="form-group">
                        <label for="tipo">Tipo de Respaldo *</label>
                        <select name="tipo" id="tipo" class="form-control" required>
                            <option value="">Seleccionar tipo</option>
                            <option value="completo">Completo (BD + Archivos)</option>
                            <option value="base_datos">Solo Base de Datos</option>
                            <option value="archivos">Solo Archivos</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="descripcion">Descripción</label>
                        <textarea name="descripcion" id="descripcion" class="form-control" rows="3"></textarea>
                    </div>
                    <div class="form-check">
                        <input type="checkbox" name="comprimir" id="comprimir" class="form-check-input" checked>
                        <label for="comprimir" class="form-check-label">Comprimir archivo</label>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                    <button type="submit" class="btn btn-primary">Crear Respaldo</button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Modal para restaurar respaldo -->
<div class="modal fade" id="restaurarRespaldoModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Restaurar Respaldo</h5>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <form id="restaurarForm" method="POST">
                @csrf
                <div class="modal-body">
                    <div class="alert alert-warning">
                        <i class="fas fa-exclamation-triangle"></i>
                        <strong>Advertencia:</strong> Esta acción restaurará el respaldo seleccionado y puede sobrescribir datos existentes.
                    </div>
                    <div class="form-group">
                        <label for="confirmacion">Escriba "RESTAURAR" para confirmar:</label>
                        <input type="text" name="confirmacion" id="confirmacion" class="form-control" placeholder="RESTAURAR" required>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                    <button type="submit" class="btn btn-danger">Restaurar Respaldo</button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Modal para programar respaldo -->
<div class="modal fade" id="programarRespaldoModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Programar Respaldo Automático</h5>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <form action="{{ route('respaldos.programar') }}" method="POST">
                @csrf
                <div class="modal-body">
                    <div class="form-group">
                        <label for="frecuencia">Frecuencia *</label>
                        <select name="frecuencia" id="frecuencia" class="form-control" required>
                            <option value="">Seleccionar frecuencia</option>
                            <option value="diario">Diario</option>
                            <option value="semanal">Semanal</option>
                            <option value="mensual">Mensual</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="hora">Hora de Ejecución</label>
                        <input type="time" name="hora" id="hora" class="form-control" value="02:00">
                    </div>
                    <div class="form-group">
                        <label for="tipo_programado">Tipo de Respaldo</label>
                        <select name="tipo_programado" id="tipo_programado" class="form-control">
                            <option value="completo">Completo</option>
                            <option value="base_datos">Solo Base de Datos</option>
                            <option value="archivos">Solo Archivos</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="retencion">Días de Retención</label>
                        <input type="number" name="retencion" id="retencion" class="form-control" value="30" min="1" max="365">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                    <button type="submit" class="btn btn-primary">Programar</button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
function restaurarRespaldo(respaldoId) {
    document.getElementById('restaurarForm').action = `/respaldos/${respaldoId}/restaurar`;
    $('#restaurarRespaldoModal').modal('show');
}

function programarRespaldo() {
    $('#programarRespaldoModal').modal('show');
}

function verDetalles(respaldoId) {
    // Aquí se mostrarían los detalles del respaldo
    alert('Detalles del respaldo ' + respaldoId);
}
</script>
@endsection