@extends('layouts.app')

@push('styles')
<link rel="stylesheet" href="{{ asset('css/TbSection/tb.css') }}">
<style>
  .tb03-manage-table th.actions-col,
  .tb03-manage-table td.actions-col {
    min-width: 150px;
    white-space: nowrap;
  }
  .tb03-manage-table th.updated-col,
  .tb03-manage-table td.updated-col {
    min-width: 136px;
    white-space: nowrap;
  }
  .tb03-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: nowrap;
  }
  .tb03-actions form {
    margin: 0;
  }
  .tb03-manage-filter {
    display: grid !important;
    grid-template-columns:
      minmax(160px, 1.3fr)
      minmax(92px, 0.8fr)
      minmax(112px, 0.9fr)
      minmax(92px, 0.8fr)
      minmax(126px, 1fr)
      minmax(118px, 0.9fr)
      minmax(118px, 0.9fr)
      minmax(252px, auto);
    align-items: end;
    gap: 10px;
    margin-left: 0;
    margin-right: 0;
  }
  .tb03-manage-filter > [class*="col-"] {
    width: auto;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }
  .fromDD, .toDD {
    padding-top:5px;
  }
  .tb03-manage-filter .form-label {
    color: #fff;
    font-weight: 600;
    margin-bottom: 4px;
    white-space: nowrap;
  }
  .tb03-manage-filter .form-control,
  .tb03-manage-filter .form-select,
  .tb03-manage-filter .btn {
    height: 38px;
    min-height: 38px;
  }
  .tb03-manage-filter .filter-actions {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
  }
  .tb03-manage-filter .filter-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
  }
  @media (max-width: 1199.98px) {
    .tb03-manage-filter {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .tb03-manage-filter .filter-actions {
      grid-column: 1 / -1;
    }
  }
</style>
@endpush

@section('content')
@auth
@php
  $clinicPrefixes = (array) config('tb_entry.general_id_prefixes', []);
  $formatDate = static function ($value): string {
    if (empty($value)) return '';
    try {
      return \Carbon\Carbon::parse($value)->format('d-m-Y');
    } catch (\Throwable $e) {
      return (string) $value;
    }
  };
@endphp
<div class="container-fluid tb03-record-container">
  <div class="row justify-content-center">
    <div class="col-12">
      <div class="card tb03-card shadow-sm mx-auto">
        <div class="card-header d-flex flex-wrap justify-content-between align-items-center gap-2">
          <div>
            <h2 class="mb-0">TB-03 records</h2>
            <div class="small tb03-header-subtitle">Search, edit, and delete TB-03 register data.</div>
            @if (!empty($recentOnly))
            <div class="small text-warning">Showing only last 60 days (from {{ \Carbon\Carbon::parse($recentCutoff)->format('d-m-Y') }})</div>
            @endif
          </div>
          <div class="d-flex flex-wrap align-items-center gap-2">
            <a href="{{ route('tb03.create') }}" class="btn btn-outline-light btn-sm tb03-header-action-btn">New record</a>
          </div>
        </div>

        <div class="card-body">
          @if (session('status'))
          <div class="alert alert-success">
            {{ session('status') }}
          </div>
          @endif

          <form method="GET" action="{{ route('tb03.manage') }}" class="row g-3 align-items-end tb03-manage-filter">
            <div class="col-12 col-md-3">
              <label for="filter_q" class="form-label">Search</label>
              <input type="text" class="form-control" id="filter_q" name="q" value="{{ $filters['q'] ?? '' }}" placeholder="ID / TB number / Name / Fuchia ID">
            </div>
            <div class="col-12 col-md-2">
              <label for="filter_pid" class="form-label">General ID</label>
              <input type="text" class="form-control" id="filter_pid" name="pid" value="{{ $filters['pid'] ?? '' }}">
            </div>
            <div class="col-12 col-md-2">
              <label for="filter_tb_number" class="form-label">TB number</label>
              <input type="text" class="form-control" id="filter_tb_number" name="tb_number" value="{{ $filters['tb_number'] ?? '' }}">
            </div>
            <div class="col-12 col-md-1">
              <label for="filter_name" class="form-label">Name</label>
              <input type="text" class="form-control" id="filter_name" name="name" value="{{ $filters['name'] ?? '' }}">
            </div>
            <div class="col-12 col-md-1">
              <label for="filter_clinic" class="form-label">Clinic</label>
              <select class="form-select" id="filter_clinic" name="clinic">
                <option value="">All</option>
                @foreach (($clinics ?? []) as $clinic)
                <option value="{{ $clinic }}" {{ ($filters['clinic'] ?? '') === $clinic ? 'selected' : '' }}>
                  {{ $clinic }} : {{ $clinicPrefixes[$clinic] ?? '' }}
                </option>
                @endforeach
              </select>
            </div>
            <div class="col-12 col-md-1">
              <label for="filter_date_from" class="form-label">From</label>
              <div class="date-holder fromDD">
                <input type="text" class="form-control Gdate" id="filter_date_from" name="date_from" value="{{ $filters['date_from'] ?? '' }}" placeholder="dd-mm-yyyy">
                <img src="{{ asset('img/calendar3.svg') }}" class="dateimg" alt="date">
              </div>
            </div>
            <div class="col-12 col-md-1">
              <label for="filter_date_to" class="form-label">To</label>
              <div class="date-holder toDD">
                <input type="text" class="form-control Gdate" id="filter_date_to" name="date_to" value="{{ $filters['date_to'] ?? '' }}" placeholder="dd-mm-yyyy">
                <img src="{{ asset('img/calendar3.svg') }}" class="dateimg" alt="date">
              </div>
            </div>
            <div class="col-12 filter-actions">
              <button type="submit" class="btn btn-primary">Search</button>
              <a href="{{ route('tb03.manage') }}" class="btn btn-outline-light">Reset</a>
              <a href="{{ route('tb03.manage', array_filter(['all' => 1, 'clinic' => $filters['clinic'] ?? null])) }}" class="btn btn-outline-info">All history</a>
            </div>
          </form>

          @if (empty($recentOnly))
          <div class="mt-2 text-info small">
            Search results include all matching TB-03 records.
          </div>
          @endif

          <hr class="my-4">

          <div class="table-responsive">
            <table class="table table-dark table-striped align-middle mb-0 tb03-manage-table">
              <thead>
                <tr>
                  <th>ID</th>
                  <th>General ID</th>
                  <th>Name</th>
                  <th>TB number</th>
                  <th>Treatment date</th>
                  <th>Clinic</th>
                  <th>Outcome</th>
                  <th class="updated-col">Updated</th>
                  <th class="text-end actions-col">Actions</th>
                </tr>
              </thead>
              <tbody>
                @forelse ($records as $record)
                <tr>
                  <td>{{ $record->id }}</td>
                  <td>{{ $record->Pid_TB03 }}</td>
                  <td>{{ $record->Name_TB03 }}</td>
                  <td>{{ $record->TNumber_TB03 }}</td>
                  <td>{{ $formatDate($record->TreDate_TB03) }}</td>
                  <td>{{ $record->Clinic_code }}</td>
                  <td>{{ $record->TrementOut_TB03 ?: '-' }}</td>
                  <td class="updated-col">{{ $record->updated_at ? $record->updated_at->format('d-m-Y H:i') : '' }}</td>
                  <td class="text-end actions-col">
                    <div class="tb03-actions">
                      <a href="{{ route('tb03.edit', $record) }}" class="btn btn-sm btn-outline-primary">Edit</a>
                      <form method="POST" action="{{ route('tb03.destroy', $record) }}" class="tb03-delete-form">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="btn btn-sm btn-outline-danger">Delete</button>
                      </form>
                    </div>
                  </td>
                </tr>
                @empty
                <tr>
                  <td colspan="9" class="text-center text-muted py-4">No TB-03 records found.</td>
                </tr>
                @endforelse
              </tbody>
            </table>
          </div>

          <div class="mt-3">
            {{ $records->links() }}
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
@endauth
@endsection

@push('scripts')
<script src="{{ asset('js/TbSection/tbDatePicker.js') }}?v={{ filemtime(public_path('js/TbSection/tbDatePicker.js')) }}"></script>
<script>
  document.querySelectorAll('.tb03-delete-form').forEach((form) => {
    form.addEventListener('submit', (event) => {
      if (!window.confirm('Delete this TB-03 record? This cannot be undone.')) {
        event.preventDefault();
      }
    });
  });
</script>
@endpush