@extends('layouts.app')

@section('title', 'Editar Configuración de Impresión')

@section('content')
<div class="container-fluid">
    <!-- Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h1 class="h3 mb-0 text-gray-800">
                        <i class="fas fa-edit me-2"></i>Editar Configuración de Impresión
                    </h1>
                    <p class="text-muted mb-0">{{ $printConfiguration->report_name }}</p>
                </div>
                <div>
                    <a href="{{ route('admin.print-config.show', $printConfiguration) }}" class="btn btn-info me-2">
                        <i class="fas fa-eye me-2"></i>Ver Detalles
                    </a>
                    <a href="{{ route('admin.print-config.index') }}" class="btn btn-secondary">
                        <i class="fas fa-arrow-left me-2"></i>Volver
                    </a>
                </div>
            </div>
        </div>
    </div>

    <!-- Formulario -->
    <div class="row">
        <div class="col-12">
            <div class="card shadow">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-cog me-2"></i>Configuración de Impresión
                    </h6>
                </div>
                <div class="card-body">
                    <form action="{{ route('admin.print-config.update', $printConfiguration) }}" method="POST">
                        @csrf
                        @method('PUT')
                        
                        <!-- Información Básica -->
                        <div class="row mb-4">
                            <div class="col-12">
                                <h5 class="text-primary mb-3">
                                    <i class="fas fa-info-circle me-2"></i>Información Básica
                                </h5>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="report_type" class="form-label">Tipo de Reporte <span class="text-danger">*</span></label>
                                    <select name="report_type" id="report_type" class="form-control @error('report_type') is-invalid @enderror" required>
                                        <option value="">Seleccionar tipo de reporte</option>
                                        @foreach($reportTypes as $key => $value)
                                            <option value="{{ $key }}" {{ (old('report_type', $printConfiguration->report_type) == $key) ? 'selected' : '' }}>
                                                {{ $value }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('report_type')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="report_name" class="form-label">Nombre del Reporte <span class="text-danger">*</span></label>
                                    <input type="text" name="report_name" id="report_name" 
                                           class="form-control @error('report_name') is-invalid @enderror" 
                                           value="{{ old('report_name', $printConfiguration->report_name) }}" required>
                                    @error('report_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-12">
                                <div class="form-group">
                                    <label for="description" class="form-label">Descripción</label>
                                    <textarea name="description" id="description" rows="3" 
                                              class="form-control @error('description') is-invalid @enderror">{{ old('description', $printConfiguration->description) }}</textarea>
                                    @error('description')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <!-- Configuración de Papel -->
                        <div class="row mb-4">
                            <div class="col-12">
                                <h5 class="text-primary mb-3">
                                    <i class="fas fa-file-alt me-2"></i>Configuración de Papel
                                </h5>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="paper_size" class="form-label">Tamaño de Papel <span class="text-danger">*</span></label>
                                    <select name="paper_size" id="paper_size" class="form-control @error('paper_size') is-invalid @enderror" required>
                                        <option value="A4" {{ old('paper_size', $printConfiguration->paper_size) == 'A4' ? 'selected' : '' }}>A4</option>
                                        <option value="A3" {{ old('paper_size', $printConfiguration->paper_size) == 'A3' ? 'selected' : '' }}>A3</option>
                                        <option value="Letter" {{ old('paper_size', $printConfiguration->paper_size) == 'Letter' ? 'selected' : '' }}>Letter</option>
                                        <option value="Legal" {{ old('paper_size', $printConfiguration->paper_size) == 'Legal' ? 'selected' : '' }}>Legal</option>
                                    </select>
                                    @error('paper_size')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="orientation" class="form-label">Orientación <span class="text-danger">*</span></label>
                                    <select name="orientation" id="orientation" class="form-control @error('orientation') is-invalid @enderror" required>
                                        <option value="portrait" {{ old('orientation', $printConfiguration->orientation) == 'portrait' ? 'selected' : '' }}>Vertical</option>
                                        <option value="landscape" {{ old('orientation', $printConfiguration->orientation) == 'landscape' ? 'selected' : '' }}>Horizontal</option>
                                    </select>
                                    @error('orientation')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="sort_order" class="form-label">Orden de Visualización</label>
                                    <input type="number" name="sort_order" id="sort_order" 
                                           class="form-control @error('sort_order') is-invalid @enderror" 
                                           value="{{ old('sort_order', $printConfiguration->sort_order) }}" min="0">
                                    @error('sort_order')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <!-- Configuración de Márgenes -->
                        <div class="row mb-4">
                            <div class="col-12">
                                <h5 class="text-primary mb-3">
                                    <i class="fas fa-ruler me-2"></i>Márgenes (mm)
                                </h5>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="margin_top" class="form-label">Superior</label>
                                    <input type="number" name="margin_top" id="margin_top" 
                                           class="form-control @error('margin_top') is-invalid @enderror" 
                                           value="{{ old('margin_top', $printConfiguration->margins['top'] ?? 20) }}" min="0" max="50">
                                    @error('margin_top')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="margin_right" class="form-label">Derecha</label>
                                    <input type="number" name="margin_right" id="margin_right" 
                                           class="form-control @error('margin_right') is-invalid @enderror" 
                                           value="{{ old('margin_right', $printConfiguration->margins['right'] ?? 20) }}" min="0" max="50">
                                    @error('margin_right')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="margin_bottom" class="form-label">Inferior</label>
                                    <input type="number" name="margin_bottom" id="margin_bottom" 
                                           class="form-control @error('margin_bottom') is-invalid @enderror" 
                                           value="{{ old('margin_bottom', $printConfiguration->margins['bottom'] ?? 20) }}" min="0" max="50">
                                    @error('margin_bottom')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="margin_left" class="form-label">Izquierda</label>
                                    <input type="number" name="margin_left" id="margin_left" 
                                           class="form-control @error('margin_left') is-invalid @enderror" 
                                           value="{{ old('margin_left', $printConfiguration->margins['left'] ?? 20) }}" min="0" max="50">
                                    @error('margin_left')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <!-- Configuración de Fuente -->
                        <div class="row mb-4">
                            <div class="col-12">
                                <h5 class="text-primary mb-3">
                                    <i class="fas fa-font me-2"></i>Configuración de Fuente
                                </h5>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="font_family" class="form-label">Familia de Fuente</label>
                                    <select name="font_family" id="font_family" class="form-control @error('font_family') is-invalid @enderror">
                                        <option value="Arial" {{ old('font_family', $printConfiguration->font_config['family'] ?? 'Arial') == 'Arial' ? 'selected' : '' }}>Arial</option>
                                        <option value="Times New Roman" {{ old('font_family', $printConfiguration->font_config['family'] ?? 'Arial') == 'Times New Roman' ? 'selected' : '' }}>Times New Roman</option>
                                        <option value="Calibri" {{ old('font_family', $printConfiguration->font_config['family'] ?? 'Arial') == 'Calibri' ? 'selected' : '' }}>Calibri</option>
                                        <option value="Helvetica" {{ old('font_family', $printConfiguration->font_config['family'] ?? 'Arial') == 'Helvetica' ? 'selected' : '' }}>Helvetica</option>
                                    </select>
                                    @error('font_family')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="font_size" class="form-label">Tamaño de Fuente</label>
                                    <input type="number" name="font_size" id="font_size" 
                                           class="form-control @error('font_size') is-invalid @enderror" 
                                           value="{{ old('font_size', $printConfiguration->font_config['size'] ?? 12) }}" min="8" max="24">
                                    @error('font_size')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="font_color" class="form-label">Color de Fuente</label>
                                    <input type="color" name="font_color" id="font_color" 
                                           class="form-control @error('font_color') is-invalid @enderror" 
                                           value="{{ old('font_color', $printConfiguration->font_config['color'] ?? '#000000') }}">
                                    @error('font_color')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <div class="form-check mt-4">
                                        <input type="checkbox" name="font_bold" id="font_bold" 
                                               class="form-check-input @error('font_bold') is-invalid @enderror" 
                                               {{ old('font_bold', $printConfiguration->font_config['bold'] ?? false) ? 'checked' : '' }}>
                                        <label for="font_bold" class="form-check-label">Negrita</label>
                                        @error('font_bold')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Información de la Empresa -->
                        <div class="row mb-4">
                            <div class="col-12">
                                <h5 class="text-primary mb-3">
                                    <i class="fas fa-building me-2"></i>Información de la Empresa
                                </h5>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="company_name" class="form-label">Nombre de la Empresa <span class="text-danger">*</span></label>
                                    <input type="text" name="company_name" id="company_name" 
                                           class="form-control @error('company_name') is-invalid @enderror" 
                                           value="{{ old('company_name', $printConfiguration->company_name) }}" required>
                                    @error('company_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="company_logo" class="form-label">Logo de la Empresa</label>
                                    <input type="text" name="company_logo" id="company_logo" 
                                           class="form-control @error('company_logo') is-invalid @enderror" 
                                           value="{{ old('company_logo', $printConfiguration->company_logo) }}" placeholder="URL del logo">
                                    @error('company_logo')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="company_address" class="form-label">Dirección</label>
                                    <textarea name="company_address" id="company_address" rows="2" 
                                              class="form-control @error('company_address') is-invalid @enderror">{{ old('company_address', $printConfiguration->company_address) }}</textarea>
                                    @error('company_address')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="company_phone" class="form-label">Teléfono</label>
                                    <input type="text" name="company_phone" id="company_phone" 
                                           class="form-control @error('company_phone') is-invalid @enderror" 
                                           value="{{ old('company_phone', $printConfiguration->company_phone) }}">
                                    @error('company_phone')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="company_email" class="form-label">Email</label>
                                    <input type="email" name="company_email" id="company_email" 
                                           class="form-control @error('company_email') is-invalid @enderror" 
                                           value="{{ old('company_email', $printConfiguration->company_email) }}">
                                    @error('company_email')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <div class="form-check mt-4">
                                        <input type="checkbox" name="is_active" id="is_active" 
                                               class="form-check-input @error('is_active') is-invalid @enderror" 
                                               {{ old('is_active', $printConfiguration->is_active) ? 'checked' : '' }}>
                                        <label for="is_active" class="form-check-label">Configuración Activa</label>
                                        @error('is_active')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Botones -->
                        <div class="row mt-4">
                            <div class="col-12">
                                <div class="d-flex justify-content-end">
                                    <a href="{{ route('admin.print-config.show', $printConfiguration) }}" class="btn btn-secondary me-2">
                                        <i class="fas fa-times me-2"></i>Cancelar
                                    </a>
                                    <button type="submit" class="btn btn-primary">
                                        <i class="fas fa-save me-2"></i>Actualizar Configuración
                                    </button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function() {
    // Validación de márgenes
    const marginInputs = ['margin_top', 'margin_right', 'margin_bottom', 'margin_left'];
    marginInputs.forEach(inputId => {
        const input = document.getElementById(inputId);
        input.addEventListener('input', function() {
            if (this.value < 0) this.value = 0;
            if (this.value > 50) this.value = 50;
        });
    });
    
    // Validación de tamaño de fuente
    const fontSizeInput = document.getElementById('font_size');
    fontSizeInput.addEventListener('input', function() {
        if (this.value < 8) this.value = 8;
        if (this.value > 24) this.value = 24;
    });
});
</script>
@endpush