@extends('layouts.app')

@section('title', 'Sales Return')
@section('page', 'sales')
@section('salesNav', 'returns')

@php
  $rows = [
    ['id' => 1, 'return' => 'SR-2201', 'date' => '2026-07-13', 'sale' => 'SL-98417', 'customer' => 'Guest', 'reason' => 'Wrong item', 'items' => 1, 'refund' => 18.50, 'status' => 'Refunded'],
    ['id' => 2, 'return' => 'SR-2200', 'date' => '2026-07-13', 'sale' => 'SL-98414', 'customer' => 'Liam Brooks', 'reason' => 'Cancelled order', 'items' => 5, 'refund' => 98.00, 'status' => 'Approved'],
    ['id' => 3, 'return' => 'SR-2199', 'date' => '2026-07-12', 'sale' => 'SL-98409', 'customer' => 'Sara Kim', 'reason' => 'Quality issue', 'items' => 2, 'refund' => 24.00, 'status' => 'Pending'],
    ['id' => 4, 'return' => 'SR-2198', 'date' => '2026-07-12', 'sale' => 'SL-98403', 'customer' => 'Noah Patel', 'reason' => 'Duplicate charge', 'items' => 1, 'refund' => 12.50, 'status' => 'Refunded'],
    ['id' => 5, 'return' => 'SR-2197', 'date' => '2026-07-11', 'sale' => 'SL-98398', 'customer' => 'Ava Lopez', 'reason' => 'Customer change', 'items' => 3, 'refund' => 41.20, 'status' => 'Rejected'],
    ['id' => 6, 'return' => 'SR-2196', 'date' => '2026-07-11', 'sale' => 'SL-98392', 'customer' => 'Emma Stone', 'reason' => 'Wrong size', 'items' => 1, 'refund' => 9.75, 'status' => 'Refunded'],
    ['id' => 7, 'return' => 'SR-2195', 'date' => '2026-07-10', 'sale' => 'SL-98388', 'customer' => 'Mia Chen', 'reason' => 'Late delivery', 'items' => 2, 'refund' => 36.00, 'status' => 'Approved'],
    ['id' => 8, 'return' => 'SR-2194', 'date' => '2026-07-10', 'sale' => 'SL-98380', 'customer' => 'Oliver Reed', 'reason' => 'Damaged', 'items' => 1, 'refund' => 15.00, 'status' => 'Pending'],
    ['id' => 9, 'return' => 'SR-2193', 'date' => '2026-07-09', 'sale' => 'SL-98374', 'customer' => 'Ryan West', 'reason' => 'Allergy concern', 'items' => 2, 'refund' => 28.40, 'status' => 'Refunded'],
    ['id' => 10, 'return' => 'SR-2192', 'date' => '2026-07-09', 'sale' => 'SL-98370', 'customer' => 'Sophia Lane', 'reason' => 'Wrong item', 'items' => 1, 'refund' => 14.00, 'status' => 'Approved'],
    ['id' => 11, 'return' => 'SR-2191', 'date' => '2026-07-08', 'sale' => 'SL-98365', 'customer' => 'Guest', 'reason' => 'Customer change', 'items' => 4, 'refund' => 52.00, 'status' => 'Rejected'],
    ['id' => 12, 'return' => 'SR-2190', 'date' => '2026-07-08', 'sale' => 'SL-98360', 'customer' => 'Jordan Miles', 'reason' => 'Quality issue', 'items' => 1, 'refund' => 22.00, 'status' => 'Refunded'],
  ];
  $statusVariant = fn ($s) => match ($s) {
    'Refunded', 'Approved' => 'success',
    'Pending' => 'warning',
    'Rejected' => 'danger',
    default => 'neutral',
  };
@endphp

@section('content')
  <div class="app-content__header">
    <div>
      <h1 class="page-title">Sales Return</h1>
      <p class="page-subtitle">Returns and refunds against sales</p>
    </div>
    <div class="app-content__actions">
      <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#salesReturnModal">
        <i class="bi bi-plus-lg"></i><span class="d-none d-sm-inline"> New return</span>
      </button>
    </div>
  </div>

  @include('partials.sales-nav')

  <div class="row g-3 g-lg-4 mb-4">
    <div class="col-6 col-xl-3"><x-stat-card label="Returns today" value="2" icon="bi-arrow-return-left" icon-variant="warning" trend="1" trend-direction="up" trend-meta="vs yesterday" /></div>
    <div class="col-6 col-xl-3"><x-stat-card label="Pending review" value="2" icon="bi-hourglass" icon-variant="info" trend="0" trend-direction="neutral" trend-meta="awaiting approval" /></div>
    <div class="col-6 col-xl-3"><x-stat-card label="Refunded MTD" value="$371" icon="bi-cash" icon-variant="danger" trend="8%" trend-direction="down" trend-meta="vs last month" /></div>
    <div class="col-6 col-xl-3"><x-stat-card label="Return rate" value="1.8%" icon="bi-percent" icon-variant="primary" trend="0.2%" trend-direction="down" trend-meta="of sales" /></div>
  </div>

  <x-data-table id="sales-returns-table" title="Sales returns" subtitle="Refunds & exchanges · Downtown Branch" :page-size="10">
    <x-slot:toolbarActions>
      <button type="button" class="btn btn-soft-primary btn-sm" data-bs-toggle="modal" data-bs-target="#salesReturnModal"><i class="bi bi-plus-lg"></i> New return</button>
    </x-slot:toolbarActions>
    <x-slot:filters>
      <select class="form-select form-select-sm" data-edt-col-filter="status" aria-label="Status">
        <option value="">All statuses</option>
        <option>Pending</option><option>Approved</option><option>Refunded</option><option>Rejected</option>
      </select>
    </x-slot:filters>
    <x-slot:bulkActions>
      <button type="button" class="btn btn-soft-primary btn-sm" data-edt-bulk-action="export">Export selected</button>
      <button type="button" class="btn btn-outline-secondary btn-sm" data-edt-bulk-action="approve">Approve</button>
      <button type="button" class="btn btn-outline-danger btn-sm" data-edt-bulk-action="reject">Reject</button>
    </x-slot:bulkActions>
    <x-slot:head>
      <x-data-table-th label="Return #" col="return" :filterable="true" />
      <x-data-table-th label="Date" col="date" :filterable="true" />
      <x-data-table-th label="Sale #" col="sale" :filterable="true" />
      <x-data-table-th label="Customer" col="customer" :filterable="true" />
      <x-data-table-th label="Reason" col="reason" :filterable="true" />
      <x-data-table-th label="Items" col="items" sort-type="number" />
      <x-data-table-th label="Refund" col="refund" sort-type="number" />
      <x-data-table-th label="Status" col="status" :filterable="true" type="select" filter-options="Pending|Approved|Refunded|Rejected" />
    </x-slot:head>
    <x-slot:body>
      @foreach ($rows as $row)
        <tr data-id="{{ $row['id'] }}">
          <td data-col="return" class="cell-primary">{{ $row['return'] }}</td>
          <td data-col="date">{{ $row['date'] }}</td>
          <td data-col="sale">{{ $row['sale'] }}</td>
          <td data-col="customer">{{ $row['customer'] }}</td>
          <td data-col="reason">{{ $row['reason'] }}</td>
          <td data-col="items">{{ $row['items'] }}</td>
          <td data-col="refund">{{ money($row['refund']) }}</td>
          <td data-col="status"><x-badge :variant="$statusVariant($row['status'])">{{ $row['status'] }}</x-badge></td>
          <td data-edt-actions><x-action-dropdown :id="$row['id']" /></td>
        </tr>
      @endforeach
    </x-slot:body>
  </x-data-table>

  <x-ui-modal id="salesReturnModal" title="New sales return" form-id="sales-return-form">
    <div class="row g-3">
      <div class="col-md-4"><label class="form-label" for="sr_sale">Sale #</label><input type="text" class="form-control" id="sr_sale" name="sale" placeholder="SL-xxxxx" required></div>
      <div class="col-md-4"><label class="form-label" for="sr_customer">Customer</label><input type="text" class="form-control" id="sr_customer" name="customer" required></div>
      <div class="col-md-4"><label class="form-label" for="sr_date">Date</label><input type="date" class="form-control" id="sr_date" name="date" value="2026-07-13" required></div>
      <div class="col-md-6">
        <label class="form-label" for="sr_reason">Reason</label>
        <select class="form-select" id="sr_reason" name="reason">
          <option>Wrong item</option><option>Quality issue</option><option>Customer change</option><option>Damaged</option><option>Duplicate charge</option><option>Other</option>
        </select>
      </div>
      <div class="col-md-3"><label class="form-label" for="sr_qty">Items</label><input type="number" class="form-control" id="sr_qty" name="qty" min="1" value="1" required></div>
      <div class="col-md-3"><label class="form-label" for="sr_refund">Refund amount</label><input type="number" step="0.01" class="form-control" id="sr_refund" name="refund" min="0" value="0" required></div>
      <div class="col-12"><label class="form-label" for="sr_notes">Notes</label><textarea class="form-control" id="sr_notes" name="notes" rows="2"></textarea></div>
    </div>
    <x-alert class="mt-3 mb-0" variant="info" icon="bi-info-circle">UI only — return is not posted.</x-alert>
  </x-ui-modal>
@endsection

@push('scripts')
  <script src="{{ asset('assets/js/pages/sales.js') }}"></script>
@endpush