<?php $__env->startSection('title', __('History')); ?>
<?php $__env->startSection('active', 'history'); ?>

<?php $__env->startSection('content'); ?>
  <?php
    $statusClasses = [
      'completed' => 'bg-emerald-50 text-emerald-600',
      'review' => 'bg-amber-50 text-amber-600',
      'scanning' => 'bg-blue-50 text-blue-600',
      'scheduled' => 'bg-gray-100 text-gray-600',
    ];
    $activeCollection = $collections->firstWhere('id', (int) $filters['collection_id']);
  ?>

  <div class="rounded-2xl border border-[#c7d3fc] bg-[#eff3fe] p-6 lg:p-8">
    <div class="flex flex-col gap-5">
      <div class="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
        <div>
          <p class="text-xs font-medium text-[#4f6ef7]"><?php echo e(__('Inspection History')); ?> - <?php echo e(__('Workspace')); ?>: <?php echo e($activeWorkspace->name); ?></p>
          <h1 class="mt-2 text-2xl font-bold tracking-tight lg:text-3xl"><?php echo e(__('Inspection History')); ?></h1>
          <p class="mt-2 max-w-2xl text-sm leading-6 text-gray-500">
            <?php echo e($activeCollection ? __('Filtered to collection: :name', ['name' => $activeCollection->displayName()]) : __('View and manage all property inspection records')); ?>

          </p>
        </div>
        <a href="<?php echo e(route('inspections.index', ['workspace_id' => $activeWorkspace->id])); ?>" data-spa-link class="flex items-center justify-center rounded-xl bg-[#4f6ef7] px-4 py-2 text-sm font-medium text-white shadow-sm hover:bg-[#3d5ce0]"><?php echo e(__('New Inspection')); ?></a>
      </div>

      <div class="grid gap-3 md:grid-cols-2 xl:grid-cols-4">
        <?php $__currentLoopData = $workspaces; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $workspace): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
          <a href="<?php echo e(route('history.index', ['workspace_id' => $workspace->id])); ?>" data-spa-link class="rounded-xl border p-4 transition-colors <?php echo e((int) $filters['workspace_id'] === $workspace->id ? 'border-[#4f6ef7] bg-white shadow-sm' : 'border-[#c7d3fc]/70 bg-white/60 hover:bg-white'); ?>">
            <div class="flex items-center justify-between gap-3">
              <p class="truncate text-sm font-semibold text-gray-900"><?php echo e($workspace->name); ?></p>
              <span class="rounded-full bg-[#eff3fe] px-2 py-0.5 text-[11px] font-medium text-[#4f6ef7]"><?php echo e($workspace->collections_count); ?></span>
            </div>
            <p class="mt-2 text-xs text-gray-500"><?php echo e(__('Completed')); ?> / <?php echo e(__('Total Inspections')); ?></p>
            <p class="mt-1 text-lg font-bold"><?php echo e($workspace->completed_count); ?> / <?php echo e($workspace->inspections_count); ?></p>
            <p class="mt-1 text-xs text-gray-500">Rp <?php echo e(number_format($workspace->estimated_cost_sum ?? 0, 0, ',', '.')); ?></p>
          </a>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
      </div>
    </div>
  </div>

  <div class="grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
    <div class="stat-card rounded-2xl border border-gray-100 bg-white p-5 shadow-sm">
      <p class="text-sm font-medium text-gray-500"><?php echo e(__('Total Inspections')); ?></p>
      <p class="mt-2 text-2xl font-bold tracking-tight" data-live="totalInspections"><?php echo e($stats['total']); ?></p>
      <p class="mt-2 text-xs font-medium text-[#4f6ef7]"><?php echo e(__('Live records')); ?></p>
    </div>
    <div class="stat-card rounded-2xl border border-gray-100 bg-white p-5 shadow-sm">
      <p class="text-sm font-medium text-gray-500"><?php echo e(__('Completed')); ?></p>
      <p class="mt-2 text-2xl font-bold tracking-tight" data-live="completedInspections"><?php echo e($stats['completed']); ?></p>
      <p class="mt-2 text-xs font-medium text-emerald-500"><?php echo e(__('Ready for archive')); ?></p>
    </div>
    <div class="stat-card rounded-2xl border border-gray-100 bg-white p-5 shadow-sm">
      <p class="text-sm font-medium text-gray-500"><?php echo e(__('In Review')); ?></p>
      <p class="mt-2 text-2xl font-bold tracking-tight" data-live="reviewInspections"><?php echo e($stats['review']); ?></p>
      <p class="mt-2 text-xs font-medium text-amber-500"><?php echo e(__('Needs attention')); ?></p>
    </div>
    <div class="stat-card rounded-2xl border border-gray-100 bg-white p-5 shadow-sm">
      <p class="text-sm font-medium text-gray-500"><?php echo e(__('Total Cost')); ?></p>
      <p class="mt-2 text-2xl font-bold tracking-tight" data-live="estimatedCost">Rp <?php echo e(number_format($stats['totalCost'], 0, ',', '.')); ?></p>
      <p class="mt-2 text-xs font-medium text-gray-400"><?php echo e(__('Synced')); ?> <span data-live-updated-at>--:--:--</span></p>
    </div>
  </div>

  <div class="rounded-2xl border border-gray-100 bg-white p-5 shadow-sm">
    <form id="historyFilterForm" method="GET" action="<?php echo e(route('history.index')); ?>" class="grid gap-3 md:grid-cols-[1fr_200px_220px_180px_auto]">
      <input name="search" value="<?php echo e($filters['search']); ?>" type="search" placeholder="<?php echo e(__('Search inspections by property or address...')); ?>" class="h-10 rounded-xl border border-gray-200 bg-gray-50 px-4 text-sm outline-none focus:border-[#4f6ef7] focus:bg-white focus:ring-2 focus:ring-[#4f6ef7]/20">
      <select id="historyWorkspaceSelect" name="workspace_id" class="h-10 rounded-xl border border-gray-200 bg-gray-50 px-4 text-sm outline-none focus:border-[#4f6ef7] focus:bg-white focus:ring-2 focus:ring-[#4f6ef7]/20">
        <?php $__currentLoopData = $workspaces; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $workspace): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
          <option value="<?php echo e($workspace->id); ?>" <?php if((int) $filters['workspace_id'] === $workspace->id): echo 'selected'; endif; ?>><?php echo e($workspace->name); ?></option>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
      </select>
      <select id="historyCollectionSelect" name="collection_id" class="h-10 rounded-xl border border-gray-200 bg-gray-50 px-4 text-sm outline-none focus:border-[#4f6ef7] focus:bg-white focus:ring-2 focus:ring-[#4f6ef7]/20">
        <option value=""><?php echo e(__('All collections')); ?></option>
        <?php $__currentLoopData = $collections; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $collection): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
          <option value="<?php echo e($collection->id); ?>" <?php if((int) $filters['collection_id'] === $collection->id): echo 'selected'; endif; ?>><?php echo e($collection->displayName()); ?></option>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
      </select>
      <select name="status" class="h-10 rounded-xl border border-gray-200 bg-gray-50 px-4 text-sm outline-none focus:border-[#4f6ef7] focus:bg-white focus:ring-2 focus:ring-[#4f6ef7]/20">
        <option value=""><?php echo e(__('All status')); ?></option>
        <?php $__currentLoopData = ['completed', 'review', 'scanning', 'scheduled']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $status): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
          <option value="<?php echo e($status); ?>" <?php if($filters['status'] === $status): echo 'selected'; endif; ?>><?php echo e(Str::headline($status)); ?></option>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
      </select>
      <button type="submit" class="h-10 rounded-xl bg-[#4f6ef7] px-4 text-sm font-medium text-white"><?php echo e(__('Apply')); ?></button>
    </form>
  </div>

  <div class="rounded-2xl border border-gray-100 bg-white p-5 shadow-sm">
    <div class="mb-4 flex items-center justify-between">
      <div>
        <h3 class="text-base font-semibold"><?php echo e(__('History Records')); ?></h3>
        <p class="text-sm text-gray-400"><?php echo e(__(':count matched inspections', ['count' => $inspections->total()])); ?></p>
      </div>
    </div>

    <div class="overflow-x-auto">
      <table class="w-full text-left text-sm">
        <thead class="text-xs uppercase text-gray-400">
          <tr>
            <th class="px-3 py-3"><?php echo e(__('Property')); ?></th>
            <th class="px-3 py-3"><?php echo e(__('Collection')); ?></th>
            <th class="px-3 py-3"><?php echo e(__('Status')); ?></th>
            <th class="px-3 py-3"><?php echo e(__('Damages')); ?></th>
            <th class="px-3 py-3"><?php echo e(__('Confidence')); ?></th>
            <th class="px-3 py-3"><?php echo e(__('Cost')); ?></th>
            <th class="px-3 py-3"><?php echo e(__('Date')); ?></th>
            <th class="px-3 py-3 text-right"><?php echo e(__('Action')); ?></th>
          </tr>
        </thead>
        <tbody class="divide-y divide-gray-100">
          <?php $__empty_1 = true; $__currentLoopData = $inspections; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $inspection): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
            <tr>
              <td class="px-3 py-3">
                <p class="font-medium"><?php echo e($inspection->property_name); ?></p>
                <p class="mt-0.5 text-xs text-gray-400"><?php echo e($inspection->property_address); ?></p>
              </td>
              <td class="px-3 py-3">
                <p class="font-medium"><?php echo e($inspection->collection?->displayName() ?? __('Unbatched')); ?></p>
                <p class="mt-0.5 text-xs text-gray-400"><?php echo e(Str::headline($inspection->collection?->collection_type ?? 'single scan')); ?></p>
              </td>
              <td class="px-3 py-3"><span class="rounded-lg px-2 py-1 text-xs font-medium <?php echo e($statusClasses[$inspection->status] ?? 'bg-gray-100 text-gray-600'); ?>"><?php echo e(Str::headline($inspection->status)); ?></span></td>
              <td class="px-3 py-3"><?php echo e($inspection->damage_findings_count); ?></td>
              <td class="px-3 py-3"><?php echo e(number_format($inspection->ai_confidence, 1)); ?>%</td>
              <td class="px-3 py-3"><?php echo e($inspection->estimated_cost_label ?? 'Rp '.number_format($inspection->estimated_cost, 0, ',', '.')); ?></td>
              <td class="px-3 py-3"><?php echo e($inspection->scheduled_at?->format('M d, Y') ?? '-'); ?></td>
              <td class="px-3 py-3 text-right">
                <button type="button"
                  class="rounded-lg border border-gray-200 px-3 py-1.5 text-xs font-medium text-gray-600 hover:bg-gray-50"
                  data-history-detail
                  data-property="<?php echo e($inspection->property_name); ?>"
                  data-collection="<?php echo e($inspection->collection?->displayName() ?? __('Unbatched')); ?>"
                  data-address="<?php echo e($inspection->property_address); ?>"
                  data-status="<?php echo e(Str::headline($inspection->status)); ?>"
                  data-damages="<?php echo e($inspection->damage_findings_count); ?>"
                  data-confidence="<?php echo e(number_format($inspection->ai_confidence, 1)); ?>%"
                  data-cost="<?php echo e($inspection->estimated_cost_label ?? 'Rp '.number_format($inspection->estimated_cost, 0, ',', '.')); ?>"
                  data-report-url="<?php echo e($inspection->report ? route('reports.show', $inspection->report) : ''); ?>"
                  data-images="<?php echo e(e(json_encode($inspection->visualization_image_paths ?? []))); ?>">
                  <?php echo e(__('Detail')); ?>

                </button>
              </td>
            </tr>
          <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
            <tr>
              <td colspan="8" class="px-3 py-10 text-center text-sm text-gray-400"><?php echo e(__('No inspection history found.')); ?></td>
            </tr>
          <?php endif; ?>
        </tbody>
      </table>
    </div>

    <div class="mt-5"><?php echo e($inspections->links()); ?></div>
  </div>

  <div id="historyModal" class="fixed inset-0 z-50 hidden items-center justify-center bg-black/40 p-4">
    <div class="w-full max-w-lg rounded-2xl bg-white p-6 shadow-xl">
      <div class="mb-5 flex items-start justify-between gap-4">
        <div>
          <p class="text-xs font-medium uppercase tracking-wide text-gray-400"><?php echo e(__('Inspection Detail')); ?></p>
          <h3 id="historyModalTitle" class="mt-1 text-xl font-bold tracking-tight">Property</h3>
          <p id="historyModalCollection" class="mt-1 text-sm font-medium text-[#4f6ef7]"></p>
          <p id="historyModalAddress" class="mt-1 text-sm text-gray-500"></p>
        </div>
        <button type="button" onclick="closeHistoryModal()" class="rounded-lg p-2 text-gray-400 hover:bg-gray-100">x</button>
      </div>
      <div class="grid gap-3 sm:grid-cols-2">
        <div class="rounded-xl border border-gray-100 p-4"><p class="text-xs text-gray-400"><?php echo e(__('Status')); ?></p><p id="historyModalStatus" class="mt-1 font-semibold"></p></div>
        <div class="rounded-xl border border-gray-100 p-4"><p class="text-xs text-gray-400"><?php echo e(__('Damages')); ?></p><p id="historyModalDamages" class="mt-1 font-semibold"></p></div>
        <div class="rounded-xl border border-gray-100 p-4"><p class="text-xs text-gray-400"><?php echo e(__('Confidence')); ?></p><p id="historyModalConfidence" class="mt-1 font-semibold"></p></div>
        <div class="rounded-xl border border-gray-100 p-4"><p class="text-xs text-gray-400"><?php echo e(__('Cost')); ?></p><p id="historyModalCost" class="mt-1 font-semibold"></p></div>
      </div>
      <div id="historyModalImages" class="mt-5 grid gap-3 sm:grid-cols-2"></div>
      <div class="mt-5 flex justify-end">
        <a id="historyModalReportLink" href="<?php echo e(route('reports.index')); ?>" data-spa-link class="hidden rounded-xl bg-[#4f6ef7] px-4 py-2 text-sm font-medium text-white hover:bg-[#3d5ce0]"><?php echo e(__('View Full Report')); ?></a>
      </div>
    </div>
  </div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
<script data-page-script>
  function closeHistoryModal() {
    document.getElementById('historyModal')?.classList.add('hidden');
    document.getElementById('historyModal')?.classList.remove('flex');
  }

  document.querySelectorAll('[data-history-detail]').forEach((button) => {
    button.addEventListener('click', () => {
      document.getElementById('historyModalTitle').textContent = button.dataset.property;
      document.getElementById('historyModalCollection').textContent = button.dataset.collection;
      document.getElementById('historyModalAddress').textContent = button.dataset.address;
      document.getElementById('historyModalStatus').textContent = button.dataset.status;
      document.getElementById('historyModalDamages').textContent = button.dataset.damages;
      document.getElementById('historyModalConfidence').textContent = button.dataset.confidence;
      document.getElementById('historyModalCost').textContent = button.dataset.cost;
      const images = JSON.parse(button.dataset.images || '[]');
      const imageWrap = document.getElementById('historyModalImages');
      imageWrap.innerHTML = images.map((image) => `
        <figure class="overflow-hidden rounded-xl border border-gray-100 bg-white">
          <img src="${escapeHistoryHtml(image.url || '')}" alt="${escapeHistoryHtml(image.key || 'Roboflow result')}" class="h-56 w-full object-contain bg-gray-950">
          <figcaption class="truncate px-3 py-2 text-xs text-gray-500">${escapeHistoryHtml(image.key || 'Roboflow result')}</figcaption>
        </figure>
      `).join('');
      const reportLink = document.getElementById('historyModalReportLink');
      reportLink.href = button.dataset.reportUrl || '#';
      reportLink.classList.toggle('hidden', !button.dataset.reportUrl);
      document.getElementById('historyModal').classList.remove('hidden');
      document.getElementById('historyModal').classList.add('flex');
    });
  });

  function escapeHistoryHtml(value) {
    return String(value ?? '').replace(/[&<>"']/g, (char) => ({
      '&': '&amp;',
      '<': '&lt;',
      '>': '&gt;',
      '"': '&quot;',
      "'": '&#039;'
    }[char]));
  }

  document.getElementById('historyWorkspaceSelect')?.addEventListener('change', () => {
    const collection = document.getElementById('historyCollectionSelect');
    if (collection) collection.value = '';
    document.getElementById('historyFilterForm')?.submit();
  });
</script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\Users\ariqa\Documents\matkul\smster 4\data sains\prj\homeinspector\resources\views\history\index.blade.php ENDPATH**/ ?>