@extends('layouts.dashboard')

@section('content')
@php
/**
 * Vendor → Reasons: the restaurant's own reason lists (+ platform defaults, read-only) that
 * drive the reason dropdowns across the POS + back office.
 * @var array $own      rows this restaurant owns: id, scope, label, sort_order, is_active
 * @var array $defaults platform defaults grouped by scope: [scope => [ [label], ... ]]
 * @var array $scopes   scope => label
 * @var array $filter   ['scope' => '']
 */
use App\Models\Reason;
use App\Support\Auth;

$own      = $own ?? [];
$defaults = $defaults ?? [];
$scopes   = $scopes ?? [];
$scope    = (string) (($filter ?? [])['scope'] ?? '');
$canManage = Auth::can('reasons.manage');

$scopePill = [
    'return'        => 'qm-pill-blue',
    'void'          => 'qm-pill-red',
    'discount'      => 'qm-pill-green',
    'cash_variance' => 'qm-pill-amber',
    'stock_adjust'  => 'qm-pill-violet',
];
@endphp
@php /* .qm-d2: the dashboard density standard (app.css §35) */
@endphp
<div class="qm-d2">
@if ($canManage)
@php ob_start(); @endphp
<button type="button" class="qm-btn" data-bs-toggle="modal" data-bs-target="#reasonModal" data-reason-add><i class="fas fa-plus me-1" aria-hidden="true"></i> {{ t_raw('vendor.reasons.btn_add') }}</button>
@php
\App\Support\View::slot('subhead', ob_get_clean());
@endphp
@endif

<div class="qm-card">
    <div class="qm-ops-head">
        <h2 class="mb-0">{{ t_raw('vendor.reasons.list_heading') }}</h2>
    </div>

    <form method="get" action="{{ route('vendor.reasons') }}" class="qm-order-filters">
        @partial('filter-collapse')
        <div class="qm-of-field qm-of-grow">
            <label class="qm-of-label" for="rf-scope">{{ t_raw('vendor.reasons.filter_scope') }}</label>
            <select id="rf-scope" name="scope" class="form-select">
                <option value="">{{ t_raw('vendor.reasons.filter_all_scopes') }}</option>
                @foreach ($scopes as $sk => $sl)
                <option value="{{ $sk }}"{{ $scope === $sk ? ' selected' : '' }}>{{ $sl }}</option>
                @endforeach
            </select>
        </div>
        <div class="qm-of-actions">
            <a href="{{ route('vendor.reasons') }}" class="qm-filter-reset{{ $scope !== '' ? ' is-active' : '' }}">{{ t_raw('common.reset') }}</a>
        </div>
    </form>
    <div class="table-responsive">
    <table class="qm-table" data-sortable>
        <thead><tr>
            <th scope="col" data-sort="text">{{ t_raw('vendor.reasons.col_reason') }}</th>
            <th scope="col">{{ t_raw('vendor.reasons.col_scope') }}</th>
            <th scope="col" data-sort="number">{{ t_raw('vendor.reasons.col_order') }}</th>
            <th scope="col">{{ t_raw('common.status') }}</th>
            @if ($canManage)<th class="text-end" scope="col">{{ t_raw('common.actions') }}</th>@endif
        </tr></thead>
        <tbody>
            @if (count($own))
            @foreach ($own as $r)
            <tr>
                <td><strong>{{ $r['label'] }}</strong></td>
                <td><span class="qm-pill {{ $scopePill[$r['scope']] ?? 'qm-pill-grey' }}">{{ $scopes[$r['scope']] ?? $r['scope'] }}</span></td>
                <td data-sort-value="{{ (int) $r['sort_order'] }}">{{ (int) $r['sort_order'] }}</td>
                <td>
                    @if ($canManage)
                    <form method="post" action="{{ route('vendor.reasons.save') }}" class="d-inline">
                        @csrf
                        <input type="hidden" name="id" value="{{ (int) $r['id'] }}">
                        <div class="form-check form-switch d-inline-block m-0 align-middle">
                            <input class="form-check-input" type="checkbox" role="switch" name="is_active" value="1" data-reason-toggle{{ $r['is_active'] ? ' checked' : '' }} aria-label="{{ $r['label'] }}">
                        </div>
                    </form>
                    @else
                    <span class="qm-pill {{ $r['is_active'] ? 'qm-pill-green' : 'qm-pill-grey' }}">{!! $r['is_active'] ? t('common.active') : t('common.inactive') !!}</span>
                    @endif
                </td>
                @if ($canManage)
                <td class="qm-actions-cell">
                    @partial('row-actions', ['inline' => 0, 'actions' => [
                        ['label' => t_raw('common.edit'), 'icon' => 'fa-pen', 'attrs' => [
                            'data-bs-toggle' => 'modal', 'data-bs-target' => '#reasonModal', 'data-reason-edit' => '1',
                            'data-id' => (string) (int) $r['id'], 'data-scope' => (string) $r['scope'],
                            'data-label' => (string) $r['label'], 'data-order' => (string) (int) $r['sort_order'],
                        ]],
                        ['label' => t_raw('common.delete'), 'icon' => 'fa-trash-alt', 'danger' => true, 'form' => [
                            'action' => '/vendor/reasons/delete', 'fields' => ['id' => (int) $r['id']],
                            'confirm' => t_raw('vendor.reasons.confirm_remove'),
                        ]],
                    ]])
                </td>
                @endif
            </tr>
            @endforeach
            @else
            @partial('table-empty', ['colspan' => $canManage ? 5 : 4, 'icon' => 'fa-comment-dots', 'msg' => t_raw('vendor.reasons.empty_own')])
            @endif
        </tbody>
    </table>
    </div>
</div>

@php // Platform defaults, always available on top of the restaurant's own reasons.
@endphp
<div class="qm-card mt-3">
    <div class="qm-ops-head"><h2 class="mb-0">{{ t_raw('vendor.reasons.defaults_heading') }}</h2></div>
    <div class="qm-card-pad">
        @foreach ($defaults as $sk => $rows)
@php if (!count($rows)) { continue; }; @endphp
        <div class="mb-2">
            <span class="qm-pill {{ $scopePill[$sk] ?? 'qm-pill-grey' }} me-2">{{ $scopes[$sk] ?? $sk }}</span>
            @foreach ($rows as $d)<span class="qm-pill qm-pill-grey me-1 mb-1">{{ $d['label'] }}</span>@endforeach
        </div>
        @endforeach
    </div>
</div>

@if ($canManage)
<div class="modal fade" id="reasonModal" tabindex="-1" aria-labelledby="reasonModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content" method="post" action="{{ route('vendor.reasons.save') }}">
            @csrf
            <input type="hidden" name="id" id="rsn-id" value="">
            <div class="modal-header">
                <h2 class="modal-title h5" id="reasonModalLabel" data-add-title="{{ t_raw('vendor.reasons.btn_add') }}" data-edit-title="{{ t_raw('vendor.reasons.edit_title') }}">{{ t_raw('vendor.reasons.btn_add') }}</h2>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{{ t_raw('common.close') }}"></button>
            </div>
            <div class="modal-body">
                <div class="mb-3">
                    <label class="form-label" for="rsn-scope">{{ t_raw('vendor.reasons.col_scope') }}</label>
                    <select class="form-select" id="rsn-scope" name="scope">
                        @foreach ($scopes as $sk => $sl)<option value="{{ $sk }}">{{ $sl }}</option>@endforeach
                    </select>
                </div>
                <div class="mb-3">
                    <label class="form-label" for="rsn-label">{{ t_raw('vendor.reasons.col_reason') }}</label>
                    <input type="text" class="form-control" id="rsn-label" name="label" maxlength="120" placeholder="{{ t_raw('vendor.reasons.placeholder_label') }}" required>
                </div>
                <div class="mb-0">
                    <label class="form-label" for="rsn-order">{{ t_raw('vendor.reasons.col_order') }}</label>
                    <input type="number" class="form-control qm-maxw-320" id="rsn-order" name="sort_order" min="0" max="999" value="0">
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="qm-btn qm-btn-outline" data-bs-dismiss="modal">{{ t_raw('common.cancel') }}</button>
                <button type="submit" class="qm-btn">{{ t_raw('common.save') }}</button>
            </div>
        </form>
    </div>
</div>
<script>
(function () {
    document.addEventListener('change', function (e) {
        var sw = e.target.closest('[data-reason-toggle]');
        if (sw) { sw.closest('form').submit(); }
    });
    var modal = document.getElementById('reasonModal');
    if (!modal) { return; }
    var title = document.getElementById('reasonModalLabel');
    function setv(sel, v) { var el = modal.querySelector(sel); if (el) { el.value = v; } }
    document.addEventListener('click', function (e) {
        var add = e.target.closest('[data-reason-add]');
        if (add) { title.textContent = title.getAttribute('data-add-title'); setv('#rsn-id', ''); setv('#rsn-scope', '{!! e($scope !== '' ? $scope : 'discount') !!}'); setv('#rsn-label', ''); setv('#rsn-order', '0'); return; }
        var btn = e.target.closest('[data-reason-edit]');
        if (!btn) { return; }
        title.textContent = title.getAttribute('data-edit-title');
        setv('#rsn-id', btn.getAttribute('data-id') || '');
        setv('#rsn-scope', btn.getAttribute('data-scope') || 'discount');
        setv('#rsn-label', btn.getAttribute('data-label') || '');
        setv('#rsn-order', btn.getAttribute('data-order') || '0');
    });
})();
</script>
@endif

</div>@php /* /.qm-d2 */
@endphp
@endsection