@extends('layouts.panel')

@section('title', 'Configurações')
@section('heading', 'Configurações')
@section('lede', 'Parâmetros globais da plataforma')

@section('content')
<form method="POST" action="{{ route('panel.settings.update') }}" class="settings-form" enctype="multipart/form-data">
    @csrf
    @method('PUT')

    <section class="work-panel">
        <header class="work-panel-head">
            <div>
                <h2>Dados do sistema</h2>
                <p>Identidade visual exibida no painel, login e portal cativo. Envie a versão horizontal para áreas largas e a quadrada para badges compactos.</p>
            </div>
        </header>

        <div class="form-grid">
            <div class="field">
                <label for="system_logo_horizontal">Logo horizontal</label>
                @if ($systemLogoHorizontalUrl)
                    <img class="logo-preview-wide" src="{{ $systemLogoHorizontalUrl }}" alt="Logo horizontal atual">
                @endif
                <input id="system_logo_horizontal" name="system_logo_horizontal" type="file" accept="image/jpeg,image/png,image/webp,image/svg+xml">
                @error('system_logo_horizontal')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">Formato largo. Usada no sidebar, login e no rodapé do portal cativo.</p>
                @if ($systemLogoHorizontalUrl)
                    <label class="checkbox-label" style="margin-top: 0.75rem;">
                        <input type="checkbox" name="remove_system_logo_horizontal" value="1" @checked(old('remove_system_logo_horizontal'))>
                        Remover logo horizontal
                    </label>
                @endif
            </div>

            <div class="field">
                <label for="system_logo_square">Logo quadrada</label>
                @if ($systemLogoSquareUrl)
                    <img class="logo-preview" src="{{ $systemLogoSquareUrl }}" alt="Logo quadrada atual">
                @endif
                <input id="system_logo_square" name="system_logo_square" type="file" accept="image/jpeg,image/png,image/webp,image/svg+xml">
                @error('system_logo_square')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">Formato compacto. Usada em badges e espaços pequenos do portal.</p>
                @if ($systemLogoSquareUrl)
                    <label class="checkbox-label" style="margin-top: 0.75rem;">
                        <input type="checkbox" name="remove_system_logo_square" value="1" @checked(old('remove_system_logo_square'))>
                        Remover logo quadrada
                    </label>
                @endif
            </div>

            <div class="field field-span">
                <label for="contact_phone">Telefone de contato comercial</label>
                <input
                    id="contact_phone"
                    name="contact_phone"
                    type="tel"
                    inputmode="tel"
                    autocomplete="tel"
                    value="{{ old('contact_phone', $formattedContactPhone ?? $contactPhone) }}"
                    placeholder="(11) 99999-9999"
                >
                @error('contact_phone')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">Exibido no portal cativo abaixo da logo do Farol, para anunciantes entrarem em contato.</p>
            </div>
        </div>
    </section>

    <section class="work-panel">
        <header class="work-panel-head">
            <div>
                <h2>Hotspot</h2>
                <p>Define como a internet é liberada após o vídeo. A simulação grava no Farol; MikroTik fala com o roteador via API.</p>
            </div>
        </header>

        <div class="form-grid">
            <div class="field">
                <label for="hotspot_driver">Modo de autorização</label>
                <select id="hotspot_driver" name="hotspot_driver">
                    @foreach (\App\Enums\HotspotDriver::cases() as $driver)
                        <option value="{{ $driver->value }}" @selected($hotspotDriver === $driver)>{{ $driver->label() }}</option>
                    @endforeach
                </select>
                @error('hotspot_driver')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">Simulação grava a autorização no Farol. MikroTik usa a API configurada abaixo.</p>
            </div>

            <div class="field">
                <label for="grant_seconds">Tempo de internet (segundos)</label>
                <input id="grant_seconds" name="grant_seconds" type="number" min="60" max="86400" value="{{ old('grant_seconds', $grantSeconds) }}" required>
                @error('grant_seconds')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">Padrão: 900 segundos (15 minutos). Após esse prazo o Farol remove o ip-binding no MikroTik.</p>
            </div>

            <div class="field">
                <label for="reconnect_cooldown_seconds">Intervalo para reconectar (segundos)</label>
                <input id="reconnect_cooldown_seconds" name="reconnect_cooldown_seconds" type="number" min="0" max="86400" value="{{ old('reconnect_cooldown_seconds', $reconnectCooldownSeconds) }}" required>
                @error('reconnect_cooldown_seconds')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">Tempo de espera após expirar a internet antes de assistir outro vídeo. Padrão: 3600 s (1 hora).</p>
            </div>
        </div>
    </section>

    <section class="work-panel">
        <header class="work-panel-head">
            <div>
                <h2>MikroTik</h2>
                <p>Credenciais da API RouterOS usadas quando o modo MikroTik estiver ativo. A senha fica criptografada no banco.</p>
            </div>
            <span class="badge">{{ $mikrotikConfigured ? 'Configurado' : 'Pendente' }}</span>
        </header>

        <div class="form-grid">
            <div class="field">
                <label for="mikrotik_host">Host / IP</label>
                <input id="mikrotik_host" name="mikrotik_host" value="{{ old('mikrotik_host', $mikrotikHost) }}" placeholder="192.168.88.1">
                @error('mikrotik_host')
                    <p class="field-error">{{ $message }}</p>
                @enderror
            </div>

            <div class="field">
                <label for="mikrotik_port">Porta API</label>
                <input id="mikrotik_port" name="mikrotik_port" type="number" min="1" max="65535" value="{{ old('mikrotik_port', $mikrotikPort) }}">
                @error('mikrotik_port')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">8728 (API) ou 8729 (API-SSL).</p>
            </div>

            <div class="field">
                <label for="mikrotik_user">Usuário API</label>
                <input id="mikrotik_user" name="mikrotik_user" value="{{ old('mikrotik_user', $mikrotikUser) }}" autocomplete="off">
                @error('mikrotik_user')
                    <p class="field-error">{{ $message }}</p>
                @enderror
            </div>

            <div class="field">
                <label for="mikrotik_password">Senha API</label>
                <input id="mikrotik_password" name="mikrotik_password" type="password" autocomplete="new-password" placeholder="{{ $hasMikrotikPassword ? 'Deixe em branco para manter' : 'Informe a senha' }}">
                @error('mikrotik_password')
                    <p class="field-error">{{ $message }}</p>
                @enderror
            </div>

            <div class="field">
                <label for="mikrotik_timeout">Timeout (segundos)</label>
                <input id="mikrotik_timeout" name="mikrotik_timeout" type="number" min="1" max="60" value="{{ old('mikrotik_timeout', $mikrotikTimeout) }}">
                @error('mikrotik_timeout')
                    <p class="field-error">{{ $message }}</p>
                @enderror
            </div>

            <div class="field">
                <label for="mikrotik_hotspot_server">Servidor hotspot</label>
                <input id="mikrotik_hotspot_server" name="mikrotik_hotspot_server" value="{{ old('mikrotik_hotspot_server', $mikrotikHotspotServer) }}" placeholder="Opcional">
                @error('mikrotik_hotspot_server')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">Só preencha se o roteador tiver mais de um hotspot.</p>
            </div>

            <div class="field field-span">
                <label class="checkbox-label">
                    <input type="checkbox" name="mikrotik_ssl" value="1" @checked(old('mikrotik_ssl', $mikrotikUsesSsl))>
                    Usar SSL na API
                </label>
            </div>
        </div>

        <div
            class="mikrotik-test-bar"
            data-mikrotik-test
            data-mikrotik-test-url="{{ route('panel.settings.mikrotik-test') }}"
        >
            <button type="button" class="btn-secondary" data-mikrotik-test-trigger>
                Testar conexão
            </button>
            <p class="field-hint">Usa os valores do formulário acima. A senha em branco usa a já salva.</p>
            <div class="mikrotik-test-result" data-mikrotik-test-result hidden></div>
        </div>

        <p class="field-hint" style="padding: 0 1.3rem 1.2rem;">No MikroTik, aponte o login externo do hotspot para <code>{{ url('/portal?point=CODIGO&mac=$(mac)&ip=$(ip)&link-login-only=$(link-login-only)') }}</code> (substitua <strong>CODIGO</strong> pelo código do ponto).</p>
    </section>

    <section class="work-panel">
        <header class="work-panel-head">
            <div>
                <h2>Vídeos</h2>
                <p>Limite de tamanho do MP4 no envio. O valor efetivo nunca passa do que o PHP deste servidor aceita.</p>
            </div>
        </header>
        <div class="form-grid">
            <div class="field">
                <label for="max_video_mb">Tamanho máximo (MB)</label>
                <input id="max_video_mb" name="max_video_mb" type="number" min="1" max="500" value="{{ old('max_video_mb', $maxVideoMb) }}" required>
                @error('max_video_mb')
                    <p class="field-error">{{ $message }}</p>
                @enderror
                <p class="field-hint">
                    PHP atual: {{ $phpUploadMb }} MB (upload_max_filesize / post_max_size).
                    @if ($phpUploadMb < $maxVideoMb)
                        Enquanto o PHP for menor, o envio fica limitado a {{ $phpUploadMb }} MB.
                    @endif
                </p>
            </div>
        </div>
    </section>

    <div class="form-actions">
        <button type="submit" class="btn-primary">Salvar configurações</button>
    </div>
</form>
@endsection