@section('title', 'Skills')
@include('admin/includes/header')
@section('head')
@endsection

@php
    /**
     * Monta a URL de filtro preservando os parâmetros já ativos,
     * substituindo apenas a chave informada. Valor vazio = remove.
     */
    function skillFilterUrl(string $key, $value): string
    {
        $params = request()->only(['status', 'account']);
        if ($value === '') {
            unset($params[$key]);
        } else {
            $params[$key] = $value;
        }
        return url()->current() . ($params ? '?' . http_build_query($params) : '');
    }
@endphp

<main class="flex-shrink-0 mt-3">
    <div class="container">

        {{-- ── Cabeçalho ───────────────────────────────────────────────── --}}
        <div class="row mb-3">
            <div class="col-md-12 d-flex align-middle flex-wrap gap-2">
                <div>
                    @isset($s)
                        <h4>Buscando por: {{ $s }}</h4>
                    @else
                        <h4>Lista de Skills</h4>
                    @endif
                </div>
                <div class="ms-auto d-flex gap-2 align-items-center flex-nowrap">

                    @if(!$s)
                    <select id="statusFilter" class="form-select form-select-sm" style="width:auto">
                        <option value=""  {{ $filterStatus === ''  ? 'selected' : '' }}>Todos os status</option>
                        <option value="0" {{ $filterStatus === '0' ? 'selected' : '' }}>Aguard. Publicação</option>
                        <option value="3" {{ $filterStatus === '3' ? 'selected' : '' }}>Análise</option>
                        <option value="2" {{ $filterStatus === '2' ? 'selected' : '' }}>Rejeitada</option>
                        <option value="1" {{ $filterStatus === '1' ? 'selected' : '' }}>Aprovada</option>
                        <option value="4" {{ $filterStatus === '4' ? 'selected' : '' }}>Desativada</option>
                    </select>
                    @endif

                    {{-- Busca por porta --}}
                    <div class="input-group input-group-sm" style="width:220px">
                        <input type="text" class="form-control" id="pSea" maxlength="5"
                            placeholder="Buscar porta..."
                            oninput="this.value = this.value.replace(/[^0-9.-]/g, '').replace(/(\..*)\./g, '$1');"
                            autocomplete="off">
                        <button class="btn btn-outline-secondary" type="button" id="sea">Buscar</button>
                    </div>
                </div>
            </div>
        </div>

        {{-- ── Badges de conta — ocultos durante busca por porta ──────── --}}
        @if(!$s)
        <div class="d-flex flex-wrap gap-2 mb-3">

            <a href="{{ skillFilterUrl('account', '') }}"
               class="badge rounded-pill text-decoration-none px-3 py-2
                      {{ $filterAccount === '' ? 'bg-success' : 'bg-secondary' }}">
                Ver todos
            </a>

            @foreach($accountMap as $key => $info)
            @php
                $count    = $accountCounts[$key] ?? 0;
                $display  = $info['label'] . ': ' . $count;
                $isActive = (string) $filterAccount === (string) $key;
            @endphp
            <a href="{{ skillFilterUrl('account', $key) }}"
               class="badge rounded-pill text-decoration-none px-3 py-2
                      {{ $isActive ? 'bg-success' : ($count > 0 ? 'bg-primary' : 'bg-secondary') }}">
                {{ $display }}
            </a>
            @endforeach

        </div>
        @endif

        {{-- ── Alertas de sessão ───────────────────────────────────────── --}}
        @if (\Session::has('success'))
            <div class="alert alert-success alert-icon alert-dismissible fade show fw-semibold" role="alert">
                {!! \Session::get('success') !!}
            </div>
            @php Session::forget('success'); @endphp
        @endif
        @if (\Session::has('error'))
            <div class="alert alert-danger alert-icon alert-dismissible fade show fw-semibold" role="alert">
                {!! \Session::get('error') !!}
            </div>
            @php Session::forget('error'); @endphp
        @endif

        {{-- ── Tabela ───────────────────────────────────────────────────── --}}
        @if($allSkills->count() == 0)
            <div class="py-4 text-center">Nenhuma skill</div>
        @else

            <table class="table table-vcenter">
                <thead>
                <tr>
                    <th class="d-none" scope="col">#</th>
                    <th scope="col">Porta</th>
                    <th scope="col">Nome</th>
                    <th scope="col">Conta</th>
                    <th scope="col">Solicitado em</th>
                    <th scope="col">Status</th>
                    <th class="pe-1 text-end" scope="col">Ação</th>
                </tr>
                </thead>
                <tbody>
                @foreach($allSkills as $app)
                @php
                    $accKey  = (string) $app->account;
                    $accInfo = $accountMap[$accKey] ?? null;
                    $accLabel = $accInfo
                        ? $accInfo['label'] . ($accInfo['email'] ? ' (' . $accInfo['email'] . ')' : '')
                        : ($app->account ?: '--');
                @endphp
                <tr>
                    <th class="d-none" scope="row">{{ $app->id }}</th>
                    <td class="fw-semibold" style="width:7%">{{ $app->port }}</td>
                    <td><span class="fw-semibold text-dark">{{ $app->name }}</span></td>
                    <td><span class="text-muted small">{{ $accLabel }}</span></td>
                    <td>{{ date('d/m/Y H:i', strtotime($app->created_at)) }}</td>
                    <td>
                        {!!
                          $app->status == 0 ? '<span class="fw-semibold text-warning">Aguard. Publicação</span>'   :
                          ($app->status == 1 ? '<span class="fw-semibold text-success">Aprovada</span>'  :
                          ($app->status == 2 ? '<span class="fw-semibold text-danger">Rejeitada</span>'  :
                          ($app->status == 3 ? '<span class="fw-semibold text-primary">Análise</span>'   :
                          ($app->status == 4 ? '<span class="fw-semibold text-danger">Desativada</span>' : ''))))
                        !!}
                    </td>
                    <td class="pe-1 text-end">
						<form id="form-release-{{ $app->id }}"action="{{ route('admin.releaseSkill') }}" method="POST" style="display:inline">
							@csrf
							<input type="hidden" name="id" value="{{ $app->id }}">
							<input type="hidden" name="server" value="{{ $app->qr }}">
							<button onclick="formRelease({{$app->id}},'{{$app->name}}',{{$app->id}},{{$app->qr}})" type="button" class="btn btn-secondary btn-sm btn-release"><i class="bi bi-arrow-clockwise align-top"></i></button>
						</form>
						
                        <a href="{{ route('admin.skill', [$app->qr, $app->id]) }}" class="btn btn-secondary btn-sm">
                            <i class="bi bi-pencil-square align-top"></i>
                        </a>
                    </td>
                </tr>
                @endforeach
                </tbody>
            </table>

            {{ $allSkills->links('vendor.pagination.default') }}
        @endif

    </div>
</main>

@include('admin/includes/footer')

<script src="https://getbootstrap.com/docs/5.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="/assets-manager/js/sweetalert2.all.js"></script>
<script>
    {{-- Busca por porta --}}
    $("#pSea").on('keyup', function (e) {
        if (e.key === 'Enter' || e.keyCode === 13) {
            window.location = "{{ route('admin.skills') }}/" + this.value;
        }
    });
    $('#sea').on('click', function () {
        window.location = "{{ route('admin.skills') }}/" + $('#pSea').val();
    });

    {{-- Select de status navega preservando o filtro de conta ativo --}}
    $('#statusFilter').on('change', function () {
        var params = new URLSearchParams(window.location.search);
        if (this.value === '') {
            params.delete('status');
        } else {
            params.set('status', this.value);
        }
        params.delete('page');
        window.location = "{{ url()->current() }}" + (params.toString() ? '?' + params.toString() : '');
    });
	
	function formRelease (port, name, id, server) {
        Sweetalert2.fire({
            title: 'Deseja liberar o formulário da <b>'+name+'</b>.',
            showDenyButton: false,
            showCancelButton: true,
            confirmButtonText: 'Confirmar',
            cancelButtonText: 'Cancelar',
        }).then((result) => {
            if (result.isConfirmed) {
				$('#form-release-' + id).submit();
			}
	    });
    }
</script>