@extends('layouts.adminlte')

@section('title', 'LEGACY PAYROLL SYNC')
@section('page_title', 'LEGACY PAYROLL SYNC')

@php
    $feedback = $feedback ?? session('legacy_sync_feedback');
    $selectedBatch = $selectedBatch ?? null;
    $selectedRows = $selectedRows ?? collect();
    $componentMaps = $componentMaps ?? collect();
    $reviewResult = $reviewResult ?? null;
    $reviewRows = collect(($reviewResult['rows'] ?? []));
    $reviewStats = is_array($reviewResult['stats'] ?? null) ? $reviewResult['stats'] : [];
@endphp

@push('styles')
    <style>
        .legacy-sync-grid {
            display: grid;
            grid-template-columns: 1.1fr .9fr;
            gap: 1rem;
        }
        .legacy-sync-kpis {
            display: grid;
            grid-template-columns: repeat(4, minmax(140px, 1fr));
            gap: .85rem;
        }
        .legacy-sync-kpi {
            border: 1px solid #dbe7f3;
            border-radius: 1rem;
            padding: .95rem 1rem;
            background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
        }
        .legacy-sync-kpi-label {
            font-size: .78rem;
            font-weight: 700;
            letter-spacing: .03em;
            color: #64748b;
            text-transform: uppercase;
        }
        .legacy-sync-kpi-value {
            margin-top: .35rem;
            font-size: 1.3rem;
            font-weight: 800;
            color: #0f172a;
        }
        .legacy-sync-sample {
            border-radius: .85rem;
            background: #0f172a;
            color: #e2e8f0;
            padding: .8rem .9rem;
            font-size: .78rem;
            line-height: 1.45;
            white-space: pre-wrap;
        }
        .legacy-sync-inline-form {
            display: inline-flex;
            gap: .45rem;
            align-items: center;
            flex-wrap: wrap;
        }
        .legacy-sync-table td,
        .legacy-sync-table th {
            vertical-align: top;
        }
        .legacy-sync-badge {
            display: inline-flex;
            align-items: center;
            padding: .2rem .55rem;
            border-radius: 999px;
            font-size: .72rem;
            font-weight: 700;
        }
        .legacy-sync-badge.is-good {
            background: rgba(25, 135, 84, .12);
            color: #146c43;
        }
        .legacy-sync-badge.is-warn {
            background: rgba(255, 193, 7, .18);
            color: #9a6700;
        }
        .legacy-sync-badge.is-bad {
            background: rgba(220, 53, 69, .12);
            color: #b02a37;
        }
        .legacy-sync-badge.is-neutral {
            background: rgba(13, 110, 253, .1);
            color: #0a58ca;
        }
        .legacy-sync-message {
            max-width: 360px;
            white-space: normal;
        }
        @media (max-width: 991.98px) {
            .legacy-sync-grid,
            .legacy-sync-kpis {
                grid-template-columns: 1fr;
            }
        }
    </style>
@endpush

@section('content')
    <div class="container-fluid">
        @if ($errors->any())
            <div class="alert alert-danger">
                <strong>Input belum valid.</strong>
                <ul class="mb-0 mt-2">
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        @if (is_array($feedback))
            <div class="alert alert-{{ ($feedback['ok'] ?? false) ? 'success' : 'danger' }}">
                <div class="fw-semibold">{{ $feedback['message'] ?? 'Proses selesai.' }}</div>
                @if (!empty($feedback['stats']) && is_array($feedback['stats']))
                    <div class="small mt-1">
                        @foreach ($feedback['stats'] as $key => $value)
                            <span class="me-3"><strong>{{ str_replace('_', ' ', ucfirst((string) $key)) }}:</strong> {{ $value }}</span>
                        @endforeach
                    </div>
                @endif
                @if (!empty($feedback['errors']) && is_array($feedback['errors']))
                    <div class="mt-2 small">
                        <strong>Contoh error:</strong>
                        <ul class="mb-0 mt-1">
                            @foreach (collect($feedback['errors'])->take(5) as $errorRow)
                                <li>{{ is_array($errorRow) ? ($errorRow['message'] ?? json_encode($errorRow)) : $errorRow }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif
            </div>
        @endif

        <div class="legacy-sync-kpis mb-3">
            <div class="legacy-sync-kpi">
                <div class="legacy-sync-kpi-label">Source</div>
                <div class="legacy-sync-kpi-value">{{ $sourceSystem }}</div>
            </div>
            <div class="legacy-sync-kpi">
                <div class="legacy-sync-kpi-label">Batch Tersimpan</div>
                <div class="legacy-sync-kpi-value">{{ $batches->count() }}</div>
            </div>
            <div class="legacy-sync-kpi">
                <div class="legacy-sync-kpi-label">Mapping Aktif</div>
                <div class="legacy-sync-kpi-value">{{ $componentMaps->count() }}</div>
            </div>
            <div class="legacy-sync-kpi">
                <div class="legacy-sync-kpi-label">Batch Terpilih</div>
                <div class="legacy-sync-kpi-value">{{ $selectedBatch?->id ?? '-' }}</div>
            </div>
        </div>

        <div class="legacy-sync-grid mb-3">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title m-0">Import Payroll Legacy</h3>
                </div>
                <form method="POST" action="{{ route('penggajian.legacy_sync.import') }}" enctype="multipart/form-data">
                    @csrf
                    <div class="card-body">
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label class="form-label">Source System</label>
                                <input type="text" name="source_system" class="form-control" value="{{ old('source_system', $sourceSystem) }}" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label">Period Key</label>
                                <input type="text" name="period_key" class="form-control" value="{{ old('period_key') }}" placeholder="2026-05" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label">Source Ref</label>
                                <input type="text" name="source_ref" class="form-control" value="{{ old('source_ref') }}" placeholder="ERPA-MAY-2026" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label">Period Start</label>
                                <input type="date" name="period_start" class="form-control" value="{{ old('period_start') }}" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label">Period End</label>
                                <input type="date" name="period_end" class="form-control" value="{{ old('period_end') }}" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label">Pay Date</label>
                                <input type="date" name="pay_date" class="form-control" value="{{ old('pay_date') }}" />
                            </div>
                            <div class="col-12">
                                <label class="form-label">Upload File CSV/JSON</label>
                                <input type="file" name="payload_file" class="form-control" accept=".csv,.json,.txt" />
                                <div class="form-text">Kalau file diisi, kolom JSON boleh dikosongkan.</div>
                            </div>
                            <div class="col-12">
                                <label class="form-label">Payload JSON</label>
                                <textarea name="payload_json" class="form-control" rows="10" placeholder='[{"employee_code":"10022","period_start":"2026-05-01","period_end":"2026-05-31","pay_date":"2026-06-05","gaji_pokok":5000000,"insentif":250000,"gross":5500000,"bpjs":150000,"pph21":50000,"net":5300000}]'>{{ old('payload_json') }}</textarea>
                            </div>
                            <div class="col-12">
                                <label class="form-label">Notes</label>
                                <textarea name="notes" class="form-control" rows="3" placeholder="Catatan import batch">{{ old('notes') }}</textarea>
                            </div>
                        </div>
                    </div>
                    <div class="card-footer d-flex justify-content-between flex-wrap gap-2">
                        <div class="small text-muted">Mode import saat ini: <strong>final_payment</strong></div>
                        <button type="submit" class="btn btn-primary">
                            <i class="fas fa-file-import me-1"></i>Import Ke Staging
                        </button>
                    </div>
                </form>
            </div>

            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center flex-wrap gap-2">
                    <h3 class="card-title m-0">Default Mapping</h3>
                    <form method="POST" action="{{ route('penggajian.legacy_sync.seed_default_maps') }}" class="legacy-sync-inline-form">
                        @csrf
                        <input type="hidden" name="source_system" value="{{ $sourceSystem }}" />
                        <button type="submit" class="btn btn-outline-primary btn-sm">
                            <i class="fas fa-seedling me-1"></i>Seed Default Maps
                        </button>
                    </form>
                </div>
                <div class="card-body">
                    <div class="legacy-sync-sample">[
  {
    "employee_code": "10022",
    "period_start": "2026-05-01",
    "period_end": "2026-05-31",
    "pay_date": "2026-06-05",
    "gaji_pokok": 5000000,
    "upah_lembur_rate": 35000,
    "insentif": 250000,
    "gross": 5600000,
    "bpjs": 150000,
    "pph21": 50000,
    "net": 5400000
  }
]</div>
                    <div class="small text-muted mt-3">
                        Seed ini menghubungkan kode legacy bawaan seperti <code>GAPOK</code>, <code>UPAH_LEMBUR</code>, dan <code>INSENTIF</code> ke master komponen aktif yang paling mirip.
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header">
                <h3 class="card-title m-0">Batch Payroll Legacy Terbaru</h3>
            </div>
            <div class="card-body table-responsive">
                <table class="table table-striped table-hover legacy-sync-table">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Periode</th>
                            <th>Status</th>
                            <th>Rows</th>
                            <th>Source</th>
                            <th>Creator</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse ($batches as $batch)
                            <tr>
                                <td>#{{ $batch->id }}</td>
                                <td>
                                    <div>{{ $batch->period_key ?: '-' }}</div>
                                    <small class="text-muted">{{ optional($batch->period_start)->format('d M Y') ?: '-' }} s/d {{ optional($batch->period_end)->format('d M Y') ?: '-' }}</small>
                                </td>
                                <td>
                                    @php
                                        $status = (string) ($batch->status ?? 'draft');
                                        $statusClass = str_contains($status, 'error') || str_contains($status, 'failed')
                                            ? 'is-bad'
                                            : (str_contains($status, 'validated') || str_contains($status, 'imported') ? 'is-good' : 'is-neutral');
                                    @endphp
                                    <span class="legacy-sync-badge {{ $statusClass }}">{{ strtoupper($status) }}</span>
                                </td>
                                <td>
                                    <div>Total: {{ $batch->total_rows }}</div>
                                    <small class="text-muted">Valid: {{ $batch->validated_rows }} | Sukses: {{ $batch->success_rows }} | Gagal: {{ $batch->failed_rows }}</small>
                                </td>
                                <td>
                                    <div>{{ $batch->source_system }}</div>
                                    <small class="text-muted">{{ $batch->file_name ?: ($batch->source_ref ?: '-') }}</small>
                                </td>
                                <td>{{ $batch->creator->name ?? '-' }}</td>
                                <td>
                                    <div class="d-flex flex-wrap gap-2">
                                        <a href="{{ route('penggajian.legacy_sync.index', ['source_system' => $sourceSystem, 'batch_id' => $batch->id]) }}" class="btn btn-outline-secondary btn-sm">Lihat</a>
                                        <form method="POST" action="{{ route('penggajian.legacy_sync.validate', $batch->id) }}">
                                            @csrf
                                            <input type="hidden" name="source_system" value="{{ $sourceSystem }}" />
                                            <button type="submit" class="btn btn-outline-primary btn-sm">Validate</button>
                                        </form>
                                        <form method="POST" action="{{ route('penggajian.legacy_sync.apply_final', $batch->id) }}" class="legacy-sync-inline-form">
                                            @csrf
                                            <input type="hidden" name="source_system" value="{{ $sourceSystem }}" />
                                            <input type="hidden" name="payment_status" value="paid" />
                                            <div class="form-check form-check-inline m-0">
                                                <input class="form-check-input" type="checkbox" name="replace_existing" value="1" id="replaceExisting{{ $batch->id }}">
                                                <label class="form-check-label small" for="replaceExisting{{ $batch->id }}">Replace</label>
                                            </div>
                                            <button type="submit" class="btn btn-success btn-sm">Apply Final</button>
                                        </form>
                                        <form method="POST" action="{{ route('penggajian.legacy_sync.review_profil_bulan', $batch->id) }}">
                                            @csrf
                                            <input type="hidden" name="source_system" value="{{ $sourceSystem }}" />
                                            <button type="submit" class="btn btn-outline-warning btn-sm">Review Sync</button>
                                        </form>
                                        <form method="POST" action="{{ route('penggajian.legacy_sync.bulk_sync_profil_bulan', $batch->id) }}">
                                            @csrf
                                            <input type="hidden" name="source_system" value="{{ $sourceSystem }}" />
                                            <button type="submit" class="btn btn-warning btn-sm">Bulk Sync Profil Bulan</button>
                                        </form>
                                    </div>
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="7" class="text-center text-muted py-4">Belum ada batch legacy payroll.</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="row g-3">
            <div class="col-lg-7">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title m-0">Preview Row Batch {{ $selectedBatch?->id ? '#' . $selectedBatch->id : '' }}</h3>
                    </div>
                    <div class="card-body table-responsive">
                        <table class="table table-sm table-striped legacy-sync-table">
                            <thead>
                                <tr>
                                    <th>Employee</th>
                                    <th>Period</th>
                                    <th>Status</th>
                                    <th>Nominal</th>
                                    <th>Message</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($selectedRows as $row)
                                    <tr>
                                        <td>
                                            <div class="fw-semibold">{{ $row->employee_name ?: '-' }}</div>
                                            <small class="text-muted">{{ $row->employee_code ?: '-' }} / {{ $row->finger_id ?: '-' }}</small>
                                        </td>
                                        <td>
                                            <div>{{ optional($row->period_start)->format('d M Y') ?: '-' }}</div>
                                            <small class="text-muted">{{ optional($row->period_end)->format('d M Y') ?: '-' }}</small>
                                        </td>
                                        <td>
                                            @php
                                                $rowStatus = (string) ($row->sync_status ?? 'draft');
                                                $rowClass = str_contains($rowStatus, 'failed')
                                                    ? 'is-bad'
                                                    : ($rowStatus === 'validated' || $rowStatus === 'applied' ? 'is-good' : 'is-neutral');
                                            @endphp
                                            <span class="legacy-sync-badge {{ $rowClass }}">{{ strtoupper($rowStatus) }}</span>
                                        </td>
                                        <td>
                                            <div>Gross: {{ number_format((float) ($row->gross_nominal ?? 0), 2, ',', '.') }}</div>
                                            <small class="text-muted">Net: {{ number_format((float) ($row->net_nominal ?? 0), 2, ',', '.') }}</small>
                                        </td>
                                        <td class="legacy-sync-message">
                                            {{ $row->sync_message ?: '-' }}
                                            @if ($row->components->isNotEmpty())
                                                <div class="mt-1">
                                                    @foreach ($row->components->take(3) as $component)
                                                        <div class="small text-muted">
                                                            {{ $component->legacy_code }}:
                                                            {{ $component->mapping_status ?: 'draft' }}
                                                            @if ($component->target_payment_field)
                                                                -> {{ $component->target_payment_field }}
                                                            @endif
                                                        </div>
                                                    @endforeach
                                                </div>
                                            @endif
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="5" class="text-center text-muted py-4">Pilih batch untuk melihat preview row.</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

            <div class="col-lg-5">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title m-0">Mapping Komponen Aktif</h3>
                    </div>
                    <div class="card-body table-responsive">
                        <table class="table table-sm table-striped legacy-sync-table">
                            <thead>
                                <tr>
                                    <th>Legacy</th>
                                    <th>Group</th>
                                    <th>Target</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($componentMaps as $map)
                                    <tr>
                                        <td>
                                            <div class="fw-semibold">{{ $map->legacy_code }}</div>
                                            <small class="text-muted">{{ $map->legacy_name ?: '-' }}</small>
                                        </td>
                                        <td>{{ $map->component_group }}</td>
                                        <td>
                                            @if ($map->target_component_id)
                                                <span class="legacy-sync-badge is-good">{{ $map->target_payment_field ?: 'mapped' }}</span>
                                            @else
                                                <span class="legacy-sync-badge is-warn">belum ditemukan</span>
                                            @endif
                                            <div class="small text-muted mt-1">{{ $map->notes ?: '-' }}</div>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="3" class="text-center text-muted py-4">Belum ada mapping. Jalankan seed default maps.</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        @if ($selectedBatch)
            <div class="card mt-3">
                <div class="card-header d-flex justify-content-between align-items-center flex-wrap gap-2">
                    <div>
                        <h3 class="card-title m-0">Review Sinkron Profil Bulan Batch #{{ $selectedBatch->id }}</h3>
                        <div class="small text-muted mt-1">Menampilkan komponen legacy yang berbeda dengan assignment + override dinamis di profil bulan.</div>
                    </div>
                    <div class="d-flex flex-wrap gap-2">
                        <span class="legacy-sync-badge is-neutral">Row beda: {{ $reviewStats['different_rows'] ?? 0 }}</span>
                        <span class="legacy-sync-badge is-warn">Komponen beda: {{ $reviewStats['different_components'] ?? 0 }}</span>
                        <span class="legacy-sync-badge is-good">Override baru: {{ $reviewStats['new_components'] ?? 0 }}</span>
                    </div>
                </div>
                <div class="card-body table-responsive">
                    <table class="table table-sm table-striped legacy-sync-table">
                        <thead>
                            <tr>
                                <th>Employee</th>
                                <th>Assignment</th>
                                <th>Status</th>
                                <th>Selisih Komponen</th>
                                <th>Aksi</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse ($reviewRows as $review)
                                <tr>
                                    <td>
                                        <div class="fw-semibold">{{ $review['employee_name'] ?: '-' }}</div>
                                        <small class="text-muted">{{ $review['employee_code'] ?: '-' }}</small>
                                    </td>
                                    <td>
                                        @if (!empty($review['profil_bulan_karyawan_id']))
                                            <span class="legacy-sync-badge is-good">Assignment #{{ $review['profil_bulan_karyawan_id'] }}</span>
                                        @else
                                            <span class="legacy-sync-badge is-bad">Belum ada assignment</span>
                                        @endif
                                    </td>
                                    <td>
                                        @if (!empty($review['missing_assignment']))
                                            <span class="legacy-sync-badge is-bad">Missing Assignment</span>
                                        @elseif (!empty($review['has_diff']))
                                            <span class="legacy-sync-badge is-warn">Perlu Sync</span>
                                        @else
                                            <span class="legacy-sync-badge is-good">Sudah Sama</span>
                                        @endif
                                    </td>
                                    <td class="legacy-sync-message">
                                        @if (!empty($review['diff_items']) && is_array($review['diff_items']))
                                            @foreach (collect($review['diff_items'])->take(6) as $item)
                                                <div class="mb-1">
                                                    <strong>{{ $item['legacy_code'] ?: '-' }}</strong>
                                                    <span class="text-muted">-> {{ $item['target_code'] ?: ('ID ' . ($item['target_component_id'] ?? '-')) }}</span>
                                                    <div class="small text-muted">
                                                        Legacy {{ number_format((float) ($item['legacy_amount'] ?? 0), 2, ',', '.') }}
                                                        |
                                                        Existing {{ $item['current_amount'] !== null ? number_format((float) $item['current_amount'], 2, ',', '.') : '-' }}
                                                        @if (!empty($item['missing_in_assignment']))
                                                            | assignment belum punya
                                                        @endif
                                                        @if (!empty($item['missing_override']))
                                                            | override belum ada
                                                        @endif
                                                    </div>
                                                </div>
                                            @endforeach
                                        @else
                                            <span class="text-muted">Tidak ada selisih komponen.</span>
                                        @endif
                                    </td>
                                    <td>
                                        @if (!empty($review['has_diff']) && empty($review['missing_assignment']))
                                            <form method="POST" action="{{ route('penggajian.legacy_sync.sync_profil_bulan_row', $review['row_id']) }}">
                                                @csrf
                                                <input type="hidden" name="source_system" value="{{ $sourceSystem }}" />
                                                <input type="hidden" name="batch_id" value="{{ $selectedBatch->id }}" />
                                                <button type="submit" class="btn btn-outline-warning btn-sm">Sync Row Ini</button>
                                            </form>
                                        @else
                                            <span class="text-muted small">-</span>
                                        @endif
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="5" class="text-center text-muted py-4">Belum ada hasil review untuk batch ini.</td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        @endif
    </div>
@endsection