@extends('layouts.app')
@php $isMarketing = auth()->user()->unit_type === 'marketing'; @endphp
@section('title', $isMarketing ? 'Consumer Contact Plan' : 'Buat Panel Test')
@section('content')

<div class="d-flex align-items-center gap-2 mb-4">
    <a href="{{ route('panel-tests.index') }}" class="btn btn-outline-secondary btn-sm">
        <i class="bi bi-arrow-left"></i>
    </a>
    <h4 class="fw-bold mb-0">
        {{ $isMarketing ? 'Consumer Contact Plan' : 'Buat Panel Test Baru' }}
    </h4>
</div>

<div class="row justify-content-center">
    <div class="col-lg-8">
        <div class="card">
            <div class="card-body p-4">
                <form method="POST" action="{{ route('panel-tests.store') }}">
                    @csrf
                    <div class="row g-3">

                        {{-- Produk / Nama APS/SPG/TL --}}
                        <div class="col-12">
                            <label class="form-label fw-medium">
                                {{ $isMarketing
                                    ? 'Nama APS/SPG/TL yang Bertugas Menjalankan Contact'
                                    : 'Produk' }}
                                <span class="text-danger">*</span>
                            </label>

                            @if($isMarketing)
                            {{-- Marketing: dropdown dari anggota tim --}}
                            <select name="spg_user_id"
                                class="form-select @error('spg_user_id') is-invalid @enderror"
                                required>
                                <option value="">-- Pilih APS/SPG/TL dari Tim --</option>
                                @foreach($spgList as $spg)
                                <option value="{{ $spg->id }}"
                                    {{ old('spg_user_id') == $spg->id ? 'selected' : '' }}>
                                    {{ $spg->name }}
                                    — {{ strtoupper($spg->role) }}
                                    ({{ $spg->area_promotion ?? $spg->area_office }})
                                </option>
                                @endforeach
                            </select>
                            @if($spgList->isEmpty())
                            <div class="form-text text-warning">
                                <i class="bi bi-exclamation-triangle"></i>
                                Belum ada anggota tim SPG/SPV di area Anda.
                                <a href="{{ route('users.region') }}">Tambah anggota tim</a>
                            </div>
                            @endif
                            @error('spg_user_id')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror

                            @else
                            {{-- Divisi: dropdown produk biasa, tidak berubah --}}
                            <select name="product_id"
                                class="form-select @error('product_id') is-invalid @enderror">
                                <option value="">-- Pilih Produk --</option>
                                @foreach($products as $product)
                                <option value="{{ $product->id }}"
                                    {{ old('product_id') == $product->id ? 'selected' : '' }}>
                                    {{ $product->name }} ({{ $product->code }})
                                </option>
                                @endforeach
                            </select>
                            @error('product_id')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                            @endif

                        </div>

                        {{-- Judul Panel Test / Nama Brand Aktivasi --}}
                        <div class="col-12">
                            <label class="form-label fw-medium">
                                {{ $isMarketing ? 'Nama Brand Aktivasi' : 'Judul Panel Test' }}
                                <span class="text-danger">*</span>
                            </label>

                            @if($isMarketing)
                            <select name="title"
                                class="form-select @error('title') is-invalid @enderror">
                                <option value="">-- Pilih Brand Aktivasi --</option>
                                @foreach($brandAktivasis ?? [] as $brand)
                                <option value="{{ $brand->name }}"
                                    {{ old('title') === $brand->name ? 'selected' : '' }}>
                                    {{ $brand->name }}
                                </option>
                                @endforeach
                            </select>
                            @if(isset($brandAktivasis) && $brandAktivasis->isEmpty())
                            <div class="form-text text-warning">
                                <i class="bi bi-exclamation-triangle"></i>
                                Belum ada brand aktivasi.
                                <a href="{{ route('master-data.index') }}" target="_blank">
                                    Tambah di Master Data
                                </a>
                            </div>
                            @endif
                            @else
                            <input type="text" name="title"
                                class="form-control @error('title') is-invalid @enderror"
                                value="{{ old('title') }}"
                                placeholder="Contoh: Panel Test Sabun XYZ - Maret 2026">
                            @endif
                            @error('title')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        {{-- Tanggal Test --}}
                        <div class="col-md-6">
                            <label class="form-label fw-medium">
                                Tanggal {{ $isMarketing ? 'Contact' : 'Test' }}
                                <span class="text-danger">*</span>
                            </label>
                            <input type="date" name="test_date"
                                class="form-control @error('test_date') is-invalid @enderror"
                                value="{{ old('test_date') }}">
                            @error('test_date')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        {{-- Tipe Panel Test --}}
                        <div class="col-12">
                            <label class="form-label fw-medium">
                                <i class="bi bi-tag"></i>
                                Tipe {{ $isMarketing ? 'Consumer Contact Plan' : 'Panel Test' }}
                                <span class="text-danger">*</span>
                            </label>
                            <div class="row g-2">
                                <div class="col-md-4">
                                    <label class="d-flex align-items-start gap-2 p-3 border rounded"
                                        style="cursor:pointer" id="type-regional">
                                        <input type="radio" name="type" value="regional"
                                            class="mt-1 type-radio"
                                            {{ old('type','regional') === 'regional' ? 'checked' : '' }}>
                                        <div>
                                            <div class="fw-semibold">🗺️ Regional</div>
                                            <small class="text-muted">
                                                {{ $isMarketing
                                                    ? 'Hanya SPG di wilayah tertentu'
                                                    : 'Hanya SPG di wilayah tertentu yang bisa mengisi' }}
                                            </small>
                                        </div>
                                    </label>
                                </div>
                                <div class="col-md-4">
                                    <label class="d-flex align-items-start gap-2 p-3 border rounded"
                                        style="cursor:pointer" id="type-internal">
                                        <input type="radio" name="type" value="internal"
                                            class="mt-1 type-radio"
                                            {{ old('type') === 'internal' ? 'checked' : '' }}>
                                        <div>
                                            <div class="fw-semibold">🏢 Internal Kantor</div>
                                            <small class="text-muted">
                                                Peserta internal daftar via link khusus
                                            </small>
                                        </div>
                                    </label>
                                </div>
                                <div class="col-md-4">
                                    <label class="d-flex align-items-start gap-2 p-3 border rounded"
                                        style="cursor:pointer" id="type-public">
                                        <input type="radio" name="type" value="public"
                                            class="mt-1 type-radio"
                                            {{ old('type') === 'public' ? 'checked' : '' }}>
                                        <div>
                                            <div class="fw-semibold">🌐 Publik</div>
                                            <small class="text-muted">Siapa saja bisa ikut via link</small>
                                        </div>
                                    </label>
                                </div>
                            </div>
                        </div>

                        {{-- Region (super_admin) --}}
                        @if(auth()->user()->isSuperAdmin() || auth()->user()->isMarketingAdmin())
                        <div class="col-12" id="region-section">
                            <label class="form-label fw-medium">Wilayah</label>
                            <select name="region" class="form-select">
                                <option value="all">🌏 Semua Wilayah</option>
                                <option value="barat">⬅️ Wilayah Barat saja</option>
                                <option value="timur">➡️ Wilayah Timur saja</option>
                                <option value="utara">⬆️ Wilayah Utara saja</option>
                                <option value="selatan">⬇️ Wilayah Selatan saja</option>
                            </select>
                        </div>
                        @else
                        <div class="col-12">
                            <div class="p-3 rounded" style="background:#f0fdf4;border:1px solid #bbf7d0">
                                <i class="bi bi-geo-alt-fill text-success"></i>
                                {{ $isMarketing ? 'Consumer Contact Plan' : 'Panel test' }} ini akan otomatis masuk ke
                                <strong>{{ auth()->user()->region_label }}</strong>.
                            </div>
                        </div>
                        @endif

                        {{-- Lokasi — hanya untuk divisi --}}
                        @if(!$isMarketing)
                        <div class="col-12">
                            <label class="form-label fw-medium">Lokasi</label>
                            <input type="text" name="location" class="form-control"
                                value="{{ old('location') }}"
                                placeholder="Contoh: Jakarta Selatan">
                        </div>
                        @endif

                        {{-- Deskripsi / Target Consumer Contact --}}
                        <div class="col-12">
                            <label class="form-label fw-medium">
                                {{ $isMarketing ? 'Target Consumer Contact' : 'Deskripsi' }}
                            </label>
                            <textarea name="description" class="form-control" rows="3"
                                placeholder="{{ $isMarketing
                                    ? 'Tuliskan target jumlah dan profil consumer contact yang harus dicapai...'
                                    : 'Tujuan dan keterangan panel test...' }}">{{ old('description') }}</textarea>
                        </div>

                        {{-- Tombol --}}
                        <div class="col-12 d-flex gap-2 justify-content-end pt-2">
                            <a href="{{ route('panel-tests.index') }}"
                                class="btn btn-outline-secondary">Batal</a>
                            <button type="submit" class="btn btn-primary">
                                <i class="bi bi-check-lg"></i>
                                {{ $isMarketing ? 'Submit' : 'Buat & Tambah Pertanyaan' }}
                            </button>
                        </div>

                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
document.querySelectorAll('.type-radio').forEach(radio => {
    radio.addEventListener('change', () => {
        document.querySelectorAll('[id^="type-"]').forEach(el => {
            el.style.background  = '';
            el.style.borderColor = '';
        });
        const label = radio.closest('label');
        if (label) {
            label.style.background  = '#eff6ff';
            label.style.borderColor = '#3b82f6';
        }
    });
    if (radio.checked) radio.dispatchEvent(new Event('change'));
});
</script>
@endpush