@push('styles')
    <link rel="stylesheet" href="{{ asset('apk-manager/marketing-v4.css') }}">
@endpush
<div class="apk-portal" id="demoMarketing" {{ ($initialMode ?? 'dev') !== 'Marketing' ? 'hidden' : '' }}>
    <main class="apk-shell">
        <div class="apk-marketing">
            <main class="mk-shell">
                <div class="mk-head">
                    <div>
                        <div class="mk-eyebrow">BuildHub / Marketing</div>
                        <h1>Danh sách ứng dụng & APK</h1>
                        <p class="mk-lead">Tải bản mới nhất hoặc mở lại phiên bản cũ của mọi ứng dụng công ty.</p>
                    </div>
                    {{-- <span class="mk-headtag"><i></i> Quyền chỉ xem và tải xuống</span> --}}
                </div>

                <div class="mk-stats">
                    <div class="mk-stat">
                        <div class="mk-stat-icon">▦</div>
                        <div><strong>{{ count($marketingApps ?? []) }}</strong><span>Ứng dụng</span></div>
                    </div>
                </div>

                <section class="mk-section">
                    <div class="mk-sectiontop">
                        <div>
                            <h2>Danh sách ứng dụng</h2>
                            <div class="mk-small">Bản mới upload có thể chưa Pass; bản đã Public được đánh dấu riêng.
                            </div>
                        </div>
                        @php
                            $filter = request('filter') ?? (request('status') ?? 'all');
                            $searchQ = strtolower(trim(request('q') ?? ''));
                            $apps = collect($marketingApps ?? []);

                            if ($searchQ !== '') {
                                $apps = $apps->filter(function ($app) use ($searchQ) {
                                    $allTesters = $app->versions->flatMap->reports
                                        ->pluck('tester.name')
                                        ->filter()
                                        ->unique()
                                        ->implode(' ');
                                    return str_contains(strtolower($app->name), $searchQ) ||
                                        str_contains(strtolower($app->st_app ?? ''), $searchQ) ||
                                        str_contains(strtolower($app->package), $searchQ) ||
                                        str_contains(strtolower($allTesters), $searchQ);
                                });
                            }

                            if ($filter === 'published') {
                                $apps = $apps->filter(fn($app) => $app->stableRelease !== null);
                            } elseif ($filter === 'passed') {
                                $apps = $apps->filter(fn($app) => $app->latestRelease?->test_status === 'passed');
                            } elseif ($filter === 'pending') {
                                $apps = $apps->filter(
                                    fn($app) => $app->latestRelease?->test_status !== 'passed' &&
                                        !$app->latestRelease?->isPublished(),
                                );
                            }
                        @endphp
                        <form class="mk-filterform" method="get" action="">
                            <input type="hidden" name="tab" value="Marketing">
                            <input class="mk-field mk-search" type="search" name="q"
                                value="{{ request('q') ?? '' }}" placeholder="Tìm app, package, version…"
                                aria-label="Tìm ứng dụng">
                            <select class="mk-field" name="status" aria-label="Lọc trạng thái"
                                onchange="this.form.submit()">
                                <option value="all" @selected($filter === 'all')>Mọi trạng thái</option>
                                <option value="published" @selected($filter === 'published')>Có bản Public</option>
                                <option value="passed" @selected($filter === 'passed')>Có bản Pass</option>
                                <option value="pending" @selected($filter === 'pending')>Có bản chưa Pass</option>
                            </select>
                            <button class="mk-submit" type="submit">Tìm kiếm</button>
                        </form>
                    </div>

                    <div class="mk-apps">
                        @forelse($apps as $app)
                            @php
                                $latest = $app->latestRelease;
                                $stable = $app->stableRelease;
                                $latestBuild = $app->latestBuild;
                                $noads = $app->noadsRelease ?? null;
                                $state = $latest?->published_at ? 'published' : $latest?->test_status ?? 'waiting';
                                $labels = [
                                    'published' => 'Đã Public',
                                    'passed' => 'Đã Pass',
                                    'waiting' => 'Chờ test',
                                    'testing' => 'Đang test',
                                    'failed' => 'Cần sửa',
                                ];
                                $colors = [
                                    '#5367e9,#987cf0',
                                    '#13a59f,#67c3b3',
                                    '#ea8a5d,#f2bb79',
                                    '#6578a9,#9eabd1',
                                    '#a66dd3,#d08ed8',
                                    '#378dc2,#82b7e9',
                                ];

                                // Thông tin Tester
                                $testedBy = $latest?->reports?->pluck('tester.name')->filter()->unique()->implode(', ');
                                if (empty($testedBy)) {
                                    $testedBy = $app->versions->flatMap->reports
                                        ->pluck('tester.name')
                                        ->filter()
                                        ->unique()
                                        ->implode(', ');
                                }
                                $assignedTesters = '';
                                if (!empty($app->tester_ids) && isset($testerUsers)) {
                                    $assignedTesters = collect($app->tester_ids)
                                        ->map(fn($uid) => $testerUsers[$uid] ?? null)
                                        ->filter()
                                        ->unique()
                                        ->implode(', ');
                                }
                                $appTester = $testedBy ?: $assignedTesters;
                            @endphp
                            <article class="mk-app">
                                <div class="mk-apphead">
                                    @if (!empty($app->package))
                                        <div style="position:relative;width:56px;height:56px;flex-shrink:0;">
                                            <img src="{{ url('/play-icon/' . urlencode($app->package)) }}"
                                                alt="{{ $app->name }}" loading="lazy"
                                                style="width:56px;height:56px;border-radius:15px;object-fit:cover;display:block;"
                                                onload="if(this.nextElementSibling) this.nextElementSibling.style.display='none';"
                                                onerror="this.remove();">
                                            <div class="mk-appicon"
                                                style="position:absolute;top:0;left:0;background:linear-gradient(135deg, {{ $colors[$loop->index % count($colors)] }})">
                                                {{ mb_strtoupper(mb_substr($app->name, 0, 1)) }}
                                            </div>
                                        </div>
                                    @else
                                        <div class="mk-appicon"
                                            style="background:linear-gradient(135deg, {{ $colors[$loop->index % count($colors)] }})">
                                            {{ mb_strtoupper(mb_substr($app->name, 0, 1)) }}
                                        </div>
                                    @endif
                                    <div class="mk-appinfo">
                                        <div class="mk-appname">
                                            {{ $app->st_app ? $app->st_app . ' - ' : '' }}{{ $app->name }}</div>
                                        <div class="mk-package">{{ $app->package }}</div>
                                        <div class="mk-appmeta"><span class="mk-pill">{{ $app->versionCount }} phiên
                                                bản</span><span class="mk-pill">{{ $app->buildCount }} file
                                                APK</span><span class="mk-pill">Cập nhật:
                                                {{ $latestBuild?->created_at?->format('d/m/Y H:i') ?? '—' }}</span>
                                            @if ($appTester)
                                                <span class="mk-pill" style="color:#374151;"
                                                    title="{{ $testedBy ? 'Người đã test' : 'Tester phụ trách' }}">
                                                    Tester: <b
                                                        style="color:#111827;margin-left:3px;">{{ $appTester }}</b>
                                                </span>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="mk-actions">
                                        @if ($latest)
                                            <button type="button" class="mk-btn"
                                                onclick="openReleaseQR({{ $latest->id }})"
                                                title="Xem mã QR & Link tải">
                                                ▦ QR / Link
                                            </button>
                                        @endif
                                        @if ($latestBuild)
                                            <a class="mk-btn primary"
                                                href="{{ route('apks.library.download', $latestBuild) }}">↓ Tải mới
                                                nhất</a>
                                        @endif
                                    </div>
                                </div>
                                <div class="mk-versionsummary">
                                    <div class="mk-versionbox">
                                        <div class="mk-vlabel">⚡ APK mới upload gần nhất</div>
                                        <div class="mk-vrow">
                                            <strong>{{ $latest ? 'v' . $latest->version_name : '—' }}</strong>
                                            @if ($latestBuild)
                                                <span class="mk-pill">Build #{{ $latestBuild->revision }}</span>
                                            @endif
                                            <span class="mk-status {{ $state }}">
                                                {{ $labels[$state] ?? $state }}</span>
                                            @if ($latest)
                                                @php
                                                    $latestTester =
                                                        $latest->reports
                                                            ->pluck('tester.name')
                                                            ->filter()
                                                            ->unique()
                                                            ->implode(', ') ?:
                                                        $assignedTesters;
                                                @endphp
                                                @if ($latestTester)
                                                    <span class="mk-pill" style="font-weight:600;color:#374151;"
                                                        title="{{ $latest->reports->isNotEmpty() ? 'Người đã test' : 'Tester phụ trách' }}">
                                                        Tester: {{ $latestTester }}
                                                    </span>
                                                @endif
                                                <button type="button" class="mk-mini"
                                                    onclick="openReleaseQR({{ $latest->id }})"
                                                    title="Xem mã QR & Link tải"> ▦ QR / Link</button>
                                            @endif
                                        </div>
                                        <div class="mk-vfoot">
                                            {{ $latestBuild ? number_format($latestBuild->file_size / 1048576, 1) . ' MB' : 'Chưa có file' }}
                                            · {{ $latestBuild?->created_at?->format('d/m/Y H:i') ?? '—' }}</div>
                                    </div>
                                    <div class="mk-versionbox">
                                        <div class="mk-vlabel">Bản không có quảng cáo</div>
                                        @if ($noads)
                                            @php
                                                $noadsExt = $noads->noads_apk_path ? 'APK' : 'AAB';
                                            @endphp
                                            <div class="mk-vrow">
                                                <strong>v{{ $noads->version_name }}</strong>
                                                <span class="mk-status published">No-Ads</span>
                                                <button type="button" class="mk-mini"
                                                    onclick="openNoAdsQR({{ $noads->id }}, '{{ $noadsExt }}', '{{ addslashes($app->name) }}', '{{ $noads->version_name }}')"
                                                    title="Xem mã QR & Link tải No-Ads">▦ QR / Link</button>
                                                <a class="mk-mini"
                                                    href="{{ route('apks.admin.noads.download', ['release' => $noads->id]) }}"
                                                    target="_blank">↓ Tải {{ $noadsExt }}</a>
                                            </div>
                                            <div class="mk-vfoot">
                                                {{ $noadsExt }} No-Ads
                                                @if ($noads->noads_uploaded_at)
                                                    · {{ $noads->noads_uploaded_at->format('d/m/Y H:i') }}
                                                @endif
                                            </div>
                                        @else
                                            <div class="mk-vrow"><strong>Chưa có bản No-Ads</strong></div>
                                            <div class="mk-vfoot">Developer chưa upload bản không có quảng cáo.</div>
                                        @endif
                                    </div>
                                </div>
                                <details class="mk-expander">
                                    <summary>Xem toàn bộ {{ $app->versionCount }} phiên bản và lịch sử build</summary>
                                    @foreach ($app->versions as $release)
                                        @php
                                            $rstate = $release->published_at ? 'published' : $release->test_status;
                                            $relTester =
                                                $release->reports
                                                    ->pluck('tester.name')
                                                    ->filter()
                                                    ->unique()
                                                    ->implode(', ') ?:
                                                $assignedTesters;
                                        @endphp
                                        <div class="mk-release">
                                            <div class="mk-release-main">
                                                <div class="mk-release-title">v{{ $release->version_name }} <span
                                                        class="mk-pill">Code {{ $release->version_code }}</span><span
                                                        class="mk-pill">{{ strtoupper($release->channel ?? ($release->app_android_id ? 'Android' : 'iOS')) }}</span><span
                                                        class="mk-status {{ $rstate }}">{{ $labels[$rstate] ?? $rstate }}</span>
                                                    @if ($relTester)
                                                        <span class="mk-pill"
                                                            style="font-weight:600;color:#374151;">Tester:
                                                            {{ $relTester }}</span>
                                                    @endif
                                                </div>
                                                <div class="mk-release-sub">{{ $release->builds->count() }} lần upload
                                                    ·
                                                    Build mới nhất
                                                    #{{ $release->builds->first()?->revision ?? $release->current_revision }}
                                                </div>
                                                <details class="mk-builds">
                                                    <summary>Xem và tải từng bản APK trong
                                                        v{{ $release->version_name }} ▾
                                                    </summary>
                                                    @foreach ($release->builds as $build)
                                                        <div class="mk-buildrow">
                                                            <div>
                                                                <div class="mk-buildname">Build
                                                                    #{{ $build->revision }}
                                                                    @if ($loop->first)
                                                                        · Bản mới của version này
                                                                    @endif
                                                                </div>
                                                                <div class="mk-buildmeta">{{ $build->original_name }}
                                                                    ·
                                                                    {{ number_format($build->file_size / 1048576, 1) }}
                                                                    MB
                                                                    · {{ $build->created_at?->format('d/m/Y H:i') }}
                                                                </div>
                                                                @if ($build->notes)
                                                                    <div class="mk-notes">
                                                                        {{ \Illuminate\Support\Str::limit($build->notes, 180) }}
                                                                    </div>
                                                                @endif
                                                            </div>
                                                            <a class="mk-mini"
                                                                href="{{ route('apks.library.download', $build) }}">↓
                                                                Tải
                                                                APK</a>
                                                        </div>
                                                    @endforeach
                                                </details>
                                            </div>
                                            <div style="display:inline-flex;gap:6px;align-items:center;flex-shrink:0;">
                                                <button type="button" class="mk-mini"
                                                    onclick="openReleaseQR({{ $release->id }})"
                                                    title="Xem mã QR & Link tải v{{ $release->version_name }}">
                                                    ▦ QR / Link
                                                </button>
                                                @if ($release->builds->first())
                                                    <a class="mk-mini"
                                                        href="{{ route('apks.library.download', $release->builds->first()) }}">↓
                                                        Tải v{{ $release->version_name }}</a>
                                                @endif
                                            </div>
                                        </div>
                                    @endforeach
                                </details>
                            </article>
                        @empty
                            <div class="mk-empty">Không có ứng dụng nào phù hợp. Thử tìm theo tên hoặc package khác.
                            </div>
                        @endforelse
                    </div>
                    {{-- <div class="mk-pagination"><span class="mk-small">{{ $page->total() }} ứng dụng · Trang
                            {{ $page->currentPage() }}/{{ $page->lastPage() }}</span>
                        <div class="mk-actions">
                            @if ($page->previousPageUrl())
                                <a class="mk-btn" href="{{ $page->previousPageUrl() }}">← Trước</a>
                                @endif @if ($page->nextPageUrl())
                                    <a class="mk-btn" href="{{ $page->nextPageUrl() }}">Tiếp →</a>
                                @endif
                        </div>
                    </div> --}}
                </section>


                {{-- Modal QR No-Ads (giống style modal QR tải APK) --}}
                <div class="demo-modal" id="noadsQrModal" aria-hidden="true">
                    <div class="demo-modal-box" role="dialog" aria-modal="true"
                        aria-labelledby="noadsModalHeading">
                        <div class="apk-card-header">
                            <div>
                                <h2 id="noadsModalHeading">QR tải No-Ads</h2>
                                <p>File không có quảng cáo · APK hoặc AAB.</p>
                            </div>
                            <button class="apk-btn" onclick="closeNoAdsQR()">Đóng ×</button>
                        </div>
                        <div class="demo-modal-content">
                            <div class="demo-qr-box">
                                <img id="noadsQrImage" alt="QR tải No-Ads"
                                    style="width:100%;max-width:180px;height:auto;aspect-ratio:1/1;display:block;margin:0 auto;background:#fff;border-radius:8px;padding:6px;box-shadow:0 1px 4px rgba(0,0,0,0.06);">
                                <small style="display:block;margin-top:8px;color:#6B7280;font-size:11.5px;">Quét mã để
                                    tải bản No-Ads</small>
                            </div>
                            <div>
                                <span class="apk-badge published">No-Ads</span>
                                <h3 id="noadsQrTitle">—</h3>
                                <p class="apk-muted" id="noadsQrVersion"></p>
                                <div class="demo-url" id="noadsQrUrl"
                                    style="user-select:all;word-break:break-all;font-size:12px;padding:8px 10px;background:#F9FAFB;border-radius:6px;border:1px solid #E5E7EB;margin:10px 0;">
                                </div>
                                <div class="apk-actions">
                                    <button class="apk-btn primary" onclick="copyNoAdsUrl()">Sao chép link</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <script>
                    function openNoAdsQR(releaseId, ext, appName, version) {
                        var noadsUrl = window.location.origin + '/apks/' + releaseId + '/noads/download';

                        document.getElementById('noadsQrTitle').textContent = appName || 'Bản No-Ads';
                        document.getElementById('noadsQrVersion').textContent = (version ? 'v' + version + ' · ' : '') + (ext ||
                            'APK') + ' No-Ads';
                        document.getElementById('noadsQrUrl').textContent = noadsUrl;
                        document.getElementById('noadsQrImage').src = 'https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=' +
                            encodeURIComponent(noadsUrl);

                        var modal = document.getElementById('noadsQrModal');
                        modal.classList.add('open');
                        modal.setAttribute('aria-hidden', 'false');
                    }

                    function closeNoAdsQR() {
                        var modal = document.getElementById('noadsQrModal');
                        modal.classList.remove('open');
                        modal.setAttribute('aria-hidden', 'true');
                    }

                    function copyNoAdsUrl() {
                        var url = (document.getElementById('noadsQrUrl')?.textContent || '').trim();
                        if (!url) return;

                        var onSuccess = function() {
                            var btn = document.querySelector('#noadsQrModal .apk-btn.primary');
                            if (btn) {
                                btn.textContent = '✓ Đã sao chép!';
                                setTimeout(function() {
                                    btn.textContent = 'Sao chép link';
                                }, 1500);
                            }
                            if (typeof quickToast === 'function') {
                                quickToast('Đã sao chép link!');
                            }
                        };

                        if (navigator.clipboard && window.isSecureContext) {
                            navigator.clipboard.writeText(url).then(onSuccess).catch(function() {
                                fallbackCopyNoAds(url, onSuccess);
                            });
                        } else {
                            fallbackCopyNoAds(url, onSuccess);
                        }
                    }

                    function fallbackCopyNoAds(text, cb) {
                        try {
                            var textArea = document.createElement("textarea");
                            textArea.value = text;
                            textArea.style.position = "fixed";
                            textArea.style.top = "-9999px";
                            textArea.style.left = "-9999px";
                            document.body.appendChild(textArea);
                            textArea.focus();
                            textArea.select();
                            var successful = document.execCommand('copy');
                            document.body.removeChild(textArea);
                            if (successful) {
                                if (cb) cb();
                                return;
                            }
                        } catch (err) {}
                        window.prompt('Sao chép link tải:', text);
                    }
                    document.getElementById('noadsQrModal').addEventListener('click', function(e) {
                        if (e.target === this) closeNoAdsQR();
                    });
                    document.addEventListener('keydown', function(e) {
                        if (e.key === 'Escape') closeNoAdsQR();
                    });
                </script>

                <div class="mk-note"><strong>Lưu ý:</strong> “Mới upload” không đồng nghĩa “đã Pass” hoặc “đã Public”.
                    Marketing có thể tải APK của build cũ nhưng nên ưu tiên bản Public khi cần một phiên bản đã phát
                    hành.
                    Module này không cho phép thay đổi trạng thái kiểm thử hoặc phát hành.</div>
            </main>
        </div>
    </main>
</div>