@extends('layouts.dashboard')

@section('content')
@php
/** @var array $rows @var array $pager @var string $frole @var string $fstatus @var int $frestaurant @var string $fq @var array $roles @var bool $archived @var array $restaurants @var array|null $form */
$frole = $frole ?? '';
$fstatus = $fstatus ?? '';
$frestaurant = (int) ($frestaurant ?? 0);
$fq = $fq ?? '';
$roles = $roles ?? [];
$archived = $archived ?? false;
$restaurants = $restaurants ?? [];
$form = $form ?? null;
$hasFilters = $frole !== '' || $fstatus !== '' || $frestaurant > 0 || $fq !== '';
$statusOpts = [
    'active'    => t_raw('common.status_active'),
    'pending'   => t_raw('common.status_pending'),
    'suspended' => t_raw('common.status_suspended'),
    'archived'  => t_raw('admin.users.status_archived'),
];
// Roles that belong to one restaurant, supplied by the controller from the roles table
// so a role created on the Roles screen behaves like the shipped ones here too.
$staffRoles = $staffRoles ?? [];
// Status is a read-only pill; suspending/reactivating lives in the row's
// actions menu with the other account levers. Same map the account page uses.
$statusPill = ['active' => 'qm-pill-green', 'pending' => 'qm-pill-amber', 'suspended' => 'qm-pill-red'];
// Current filters, so the Export link carries the same view the admin is looking at.
$qs = http_build_query(array_filter([
    'role' => $frole, 'status' => $fstatus, 'restaurant_id' => $frestaurant ?: '', 'q' => $fq,
], static fn ($v) => (string) $v !== ''));
// PROTOTYPE (Users): the PAGE primary action moves into the top-bar "subheader" slot,
// leaving the table card header for TABLE-scoped utilities (Export). The modal stays in
// this view; its [data-user-new] handler is delegated on document, so the button fires
// from the top bar unchanged.
ob_start();
@endphp
@php /* .qm-d2: the dashboard density standard (app.css §35) */
@endphp
<div class="qm-d2">
<button type="button" class="qm-btn" data-bs-toggle="modal" data-bs-target="#userModal" data-user-new><i class="fas fa-plus me-2" aria-hidden="true"></i>{{ t_raw('admin.users.add_user') }}</button>
@php \App\Support\View::slot('subhead', ob_get_clean());
@endphp
<div class="qm-card">
    <div class="qm-ops-head">
        <div class="d-flex align-items-center gap-2">
            <h2 class="mb-0">{{ t_raw('admin.users.list_heading') }}</h2>
            @if (!empty($pager['total']))<span class="qm-pill qm-pill-grey">{{ t_raw('admin.users.total_pill', [':count' => (int) $pager['total']]) }}</span>@endif
        </div>
        <a class="qm-btn qm-btn-outline" href="{{ url('/admin/users/export' . ($qs !== '' ? '?' . $qs : '')) }}"><i class="fas fa-file-csv me-2" aria-hidden="true"></i>{{ t_raw('common.export_csv') }}</a>
    </div>
    <form method="get" action="{{ route('admin.users') }}" class="qm-order-filters">
        @partial('filter-collapse')
        <div class="qm-of-field">
            <label class="qm-of-label" for="au-role">{{ t_raw('admin.users.filter_role_label') }}</label>
            <select name="role" id="au-role" class="form-select" data-choices data-choices-dots data-placeholder="{{ t_raw('admin.users.filter_role_all') }}">
                <option value="">{{ t_raw('admin.users.filter_role_all') }}</option>
                @foreach ($roles as $r)
                <option value="{{ $r }}"{{ $frole === $r ? ' selected' : '' }}>{{ role_label($r) }}</option>
                @endforeach
            </select>
        </div>
        <div class="qm-of-field">
            <label class="qm-of-label" for="au-status">{{ t_raw('common.status') }}</label>
            <select name="status" id="au-status" class="form-select" data-choices data-choices-dots data-placeholder="{{ t_raw('admin.users.status_filter_all') }}">
                <option value="">{{ t_raw('admin.users.status_filter_all') }}</option>
                @foreach ($statusOpts as $val => $lbl)
                <option value="{{ $val }}"{{ $fstatus === $val ? ' selected' : '' }}>{{ $lbl }}</option>
                @endforeach
            </select>
        </div>
        @php /* One restaurant's people. The Restaurant column beside every row is the
                 association this filters on (the venue an owner owns, else the one a staff
                 account is assigned to), and it is what a restaurant's Team panel sends the
                 reader here for — the search box only ever matched a name or an email. */
@endphp
        <div class="qm-of-field">
            <label class="qm-of-label" for="au-restaurant">{{ t_raw('common.restaurant') }}</label>
            <select name="restaurant_id" id="au-restaurant" class="form-select" data-choices data-placeholder="{{ t_raw('common.all_restaurants') }}">
                <option value="">{{ t_raw('common.all_restaurants') }}</option>
                @foreach ($restaurants as $rest)
                <option value="{{ (int) $rest['id'] }}"{{ $frestaurant === (int) $rest['id'] ? ' selected' : '' }}>{{ (string) $rest['name'] }}</option>
                @endforeach
            </select>
        </div>
        <div class="qm-of-field qm-of-grow">
            <label class="qm-of-label" for="au-q">{{ t_raw('common.search') }}</label>
            <input type="search" name="q" id="au-q" class="form-control" placeholder="{{ t_raw('admin.users.search_placeholder') }}" value="{{ $fq }}">
        </div>
        <div class="qm-of-actions">
            <a href="{{ route('admin.users') }}" class="qm-filter-reset{{ ($hasFilters) ? ' is-active' : '' }}">{{ t_raw('common.reset') }}</a>
        </div>
    </form>
    <div class="table-responsive">
    @php /* NOT data-sortable: qm-sortable-table.js reorders only the rows already in the
              <tbody> ("not a substitute for server-side pagination", its own header comment),
              and this table renders $pager['perPage'] of $pager['total']. The controller
              reads no sort key, so there is nothing to escalate a header click to.
              Joined/Last-active keep their data-sort-value: those cells render via
              fmt_datetime()/time_ago(), and the attribute records the sortable truth behind
              the text for whatever orders them. */
@endphp
    <table class="qm-table">
        <thead><tr><th scope="col">{{ t_raw('common.name') }}</th><th scope="col">{{ t_raw('admin.users.f_role') }}</th><th scope="col">{{ t_raw('common.restaurant') }}</th><th scope="col">{{ t_raw('common.status') }}</th><th scope="col">{{ t_raw('common.joined') }}</th><th scope="col">{{ t_raw('admin.users.col_last_active') }}</th><th class="text-end" scope="col">{{ t_raw('common.actions') }}</th></tr></thead>
        <tbody>
            @if ($rows)
            @foreach ($rows as $u)
@php $isSuper = $u['role'] === 'super_admin'; $isActive = $u['status'] === 'active'; @endphp
            <tr>
                <td>
                    <div class="qm-tbl-id">
                        {!! brandmark_html($u['avatar'] ?? null, (string) $u['name'], 'md', 'qm-brandmark--round') !!}
                        <div class="qm-tbl-id-text">
                            <a class="qm-tbl-link" href="{{ url('/admin/users/' . (int) $u['id']) }}"><strong>{{ $u['name'] }}</strong></a>
                            <small>{{ $u['email'] }}</small>
                            @php // Phone rides under the name rather than as its own column — one identity cell.
@endphp
                            @if (!empty($u['phone']))<small>{{ $u['phone'] }}</small>@endif
                        </div>
                    </div>
                </td>
                @php // What the account IS, in its own column — the identity cell keeps who it is.
@endphp
                <td>{!! role_pill($u['role']) !!}</td>
                <td>
                    @if (!empty($u['restaurant_name']))
                    <a class="qm-tbl-id qm-tbl-link" href="{{ url('/admin/restaurants/' . (int) $u['user_restaurant_id']) }}">
                        {!! restaurant_brandmark(['logo' => $u['restaurant_logo'] ?? null, 'name' => $u['restaurant_name'], 'cuisine_slug' => $u['restaurant_cuisine'] ?? ''], 'sm') !!}
                        <span class="qm-tbl-id-text"><strong>{{ $u['restaurant_name'] }}</strong></span>
                    </a>
                    @else
                    {!! dash() !!}
                    @endif
                </td>
                <td><span class="qm-pill {{ $statusPill[$u['status']] ?? 'qm-pill-grey' }}">{{ status_label('user', $u['status']) }}</span></td>
                <td class="qm-cell-body" data-sort-value="{{ (string) $u['created_at'] }}">{!! fmt_datetime($u['created_at']) !!}</td>
                <td class="qm-cell-body qm-nowrap" data-sort-value="{{ (string) ($u['last_active_at'] ?? '') }}">
                    @if (!empty($u['last_active_at']))
                    <span title="{!! fmt_datetime($u['last_active_at']) !!}">{{ time_ago($u['last_active_at']) }}</span>
                    @else
                    <span class="qm-cell-sub">{{ t_raw('admin.users.never_signed_in') }}</span>
                    @endif
                </td>
                <td class="qm-actions-cell">
                    @php
                    $isSelf = (int) $u['id'] === (int) \App\Support\Auth::id();
                    $isStaffRole = in_array((string) $u['role'], $staffRoles, true);
                    if ($archived) {
                        $rowActions = [
                            ['label' => t_raw('common.view'), 'icon' => 'fa-eye', 'href' => '/admin/users/' . (int) $u['id'], 'primary' => true],
                            [
                                'label' => t_raw('admin.users.action_restore'),
                                'icon'  => 'fa-undo',
                                'form'  => ['action' => '/admin/users/restore', 'fields' => ['id' => (int) $u['id']]],
                            ],
                        ];
                    } else {
                        $rowActions = [
                            ['label' => t_raw('common.view'), 'icon' => 'fa-eye', 'href' => '/admin/users/' . (int) $u['id'], 'primary' => true],
                            // Suspend/reactivate rides with the other account levers — an
                            // inline switch beside the pill read as decoration and could not
                            // say which way it would move the account. Reversible, no confirm
                            // (the same contract the old switch honoured). Never for a super
                            // admin — that account cannot be suspended from a list row.
                            $isSuper ? null : [
                                'label' => t_raw($isActive ? 'admin.users.action_suspend' : 'admin.users.action_activate'),
                                'icon'  => $isActive ? 'fa-user-slash' : 'fa-user-check',
                                'form'  => [
                                    'action' => '/admin/users/status',
                                    'fields' => ['id' => (int) $u['id'], 'status' => $isActive ? 'suspended' : 'active'],
                                ],
                            ],
                            // Support levers: end every session this account holds, and clear a
                            // staff screen-lock PIN the member can no longer remember.
                            $isSelf ? null : [
                                'label' => t_raw('admin.users.action_sign_out'),
                                'icon'  => 'fa-sign-out-alt',
                                'form'  => [
                                    'action'  => '/admin/users/sign-out',
                                    'fields'  => ['id' => (int) $u['id']],
                                    'confirm' => t_raw('admin.users.confirm_sign_out', [':name' => (string) $u['name']]),
                                ],
                            ],
                            $isStaffRole ? [
                                'label' => t_raw('admin.users.action_reset_pin'),
                                'icon'  => 'fa-key',
                                'form'  => [
                                    'action'  => '/admin/users/reset-pin',
                                    'fields'  => ['id' => (int) $u['id']],
                                    'confirm' => t_raw('admin.users.confirm_reset_pin', [':name' => (string) $u['name']]),
                                ],
                            ] : null,
                            $isSelf ? null : [
                                'label'  => t_raw('common.delete'),
                                'icon'   => 'fa-trash-alt',
                                'danger' => true,
                                'form'   => [
                                    'action'  => '/admin/users/delete',
                                    'fields'  => ['id' => (int) $u['id']],
                                    'confirm' => t_raw('admin.users.confirm_delete'),
                                ],
                            ],
                        ];
                    }
@endphp
                    @partial('row-actions', ['actions' => $rowActions])
                </td>
            </tr>
            @endforeach
            @else
            @partial('table-empty', ['colspan' => 8, 'icon' => 'fa-users', 'msg' => $hasFilters ? t('admin.users.empty_filtered') : t('admin.users.empty_none')])
            @endif
        </tbody>
    </table>
    </div>
    @partial('table-toolbar', ['pager' => $pager, 'base' => '/admin/users'])
</div>

@php // Create / edit user modal — reuses the dashboard Bootstrap .modal pattern (staff/pages).
@endphp
<div class="modal fade" id="userModal" tabindex="-1" aria-labelledby="userModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <form method="post" action="{{ route('admin.users.save') }}" autocomplete="off">
                @csrf
                <input type="hidden" name="id" id="um-id" value="0">
                <div class="modal-header">
                    <h2 class="modal-title h5" id="userModalLabel">{{ t_raw('admin.users.modal_add_title') }}</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="row g-3">
                        <div class="col-md-6">
                            <label class="form-label" for="um-first">{{ t_raw('admin.users.f_first') }}</label>
                            <input type="text" class="form-control" id="um-first" name="first_name" maxlength="60" placeholder="{{ t_raw('auth.first_name_placeholder') }}" value="{{ (string) ($form['first_name'] ?? '') }}" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="um-last">{{ t_raw('admin.users.f_last') }}</label>
                            <input type="text" class="form-control" id="um-last" name="last_name" maxlength="60" placeholder="{{ t_raw('auth.last_name_placeholder') }}" value="{{ (string) ($form['last_name'] ?? '') }}" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="um-email">{{ t_raw('common.email') }}</label>
                            <input type="email" class="form-control" id="um-email" name="email" maxlength="190" placeholder="{{ t_raw('auth.email_placeholder') }}" value="{{ (string) ($form['email'] ?? '') }}" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="um-phone">{{ t_raw('common.phone') }}</label>
                            <input type="text" class="form-control" id="um-phone" name="phone" maxlength="40" placeholder="{{ t_raw('auth.phone_placeholder') }}" value="{{ (string) ($form['phone'] ?? '') }}">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="um-role">{{ t_raw('admin.users.f_role') }}</label>
                            <select class="form-select" id="um-role" name="role">
                                @foreach ($roles as $r)
                                <option value="{{ $r }}"{{ ($form['role'] ?? '') === $r ? ' selected' : '' }}>{{ role_label($r) }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-6" id="um-rest-wrap"{{ in_array($form['role'] ?? '', $staffRoles, true) ? '' : ' hidden' }}>
                            <label class="form-label" for="um-rest">{{ t_raw('admin.users.f_restaurant') }}</label>
                            <select class="form-select" id="um-rest" name="restaurant_id">
                                @php /* The placeholder posts NOTHING, not "0". `required` below only
                                         fires when the chosen option's value is empty, so with a "0"
                                         here the browser considered "Choose a restaurant" a real
                                         answer and let a staff account through to the server's own
                                         refusal. The controller still reads (int), so an empty value
                                         reaches it as 0 exactly as before. */
@endphp
                                <option value="">{{ t_raw('admin.users.f_restaurant_choose') }}</option>
                                @foreach ($restaurants as $rest)
                                <option value="{{ (int) $rest['id'] }}"{{ (int) ($form['restaurant_id'] ?? 0) === (int) $rest['id'] ? ' selected' : '' }}>{{ (string) $rest['name'] }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="um-pw">{{ t_raw('admin.users.f_password') }}</label>
                            <div class="qm-pw-wrap">
                                <input type="password" class="form-control" id="um-pw" name="password" autocomplete="new-password" placeholder="{{ t_raw('auth.password_placeholder') }}">
                                <button type="button" class="qm-pw-toggle" data-toggle-password="um-pw" aria-pressed="false" aria-label="{{ t_raw('common.show_password') }}"><i class="fas fa-eye" aria-hidden="true"></i></button>
                            </div>
                            @partial('password-rules', ['for' => 'um-pw'])
                            <small class="qm-hint" id="um-pw-hint"></small>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="um-pw2">{{ t_raw('admin.users.f_password_confirm') }}</label>
                            <div class="qm-pw-wrap">
                                <input type="password" class="form-control" id="um-pw2" name="password_confirm" autocomplete="new-password" placeholder="{{ t_raw('auth.password_placeholder') }}">
                                <button type="button" class="qm-pw-toggle" data-toggle-password="um-pw2" aria-pressed="false" aria-label="{{ t_raw('common.show_password') }}"><i class="fas fa-eye" aria-hidden="true"></i></button>
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="form-check form-switch mb-0">
                                <input class="form-check-input" type="checkbox" role="switch" id="um-active" name="is_active" value="1"{{ (int) ($form['is_active'] ?? 1) === 1 ? ' checked' : '' }}>
                                <label class="form-check-label" for="um-active">{{ t_raw('admin.users.f_active') }}</label>
                            </div>
                        </div>
                    </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>
</div>

<script>
(function () {
    // Row status toggle: submit its form on change (reversible, so no confirm dialog).
    document.addEventListener('change', function (e) {
        var t = e.target.closest('[data-autosubmit]');
        if (t) { var f = t.closest('form'); if (f) { f.submit(); } }
    });

    var modalEl = document.getElementById('userModal');
    if (!modalEl) { return; }
    var STAFF = {!! json_encode(array_values($staffRoles)) !!};
    var $ = function (id) { return document.getElementById(id); };
    var label = { add: {!! json_encode(t_raw('admin.users.modal_add_title')) !!}, edit: {!! json_encode(t_raw('admin.users.modal_edit_title')) !!} };
    var pwHint = { create: {!! json_encode(t_raw('admin.users.pw_hint_create')) !!}, edit: {!! json_encode(t_raw('admin.users.pw_hint_edit')) !!} };

    function syncRest() {
        var staff = STAFF.indexOf($('um-role').value) !== -1;
        $('um-rest-wrap').hidden = !staff;
        $('um-rest').required = staff;
    }
    function setMode(create) {
        $('userModalLabel').textContent = create ? label.add : label.edit;
        $('um-pw').required = create;
        $('um-pw2').required = create;
        $('um-pw-hint').textContent = create ? '' : pwHint.edit;
    }
    $('um-role').addEventListener('change', syncRest);

    document.addEventListener('click', function (e) {
        var addBtn = e.target.closest('[data-user-new]');
        if (addBtn) {
            $('um-id').value = '0';
            $('um-first').value = ''; $('um-last').value = ''; $('um-email').value = '';
            $('um-phone').value = ''; $('um-role').value = 'customer';
            // '' is the placeholder option now, not '0' — see the comment on it.
            $('um-rest').value = ''; $('um-pw').value = ''; $('um-pw2').value = '';
            $('um-active').checked = true;
            setMode(true); syncRest();
            return;
        }
        var ed = e.target.closest('[data-user-edit]');
        if (ed) {
            $('um-id').value = ed.getAttribute('data-id') || '0';
            $('um-first').value = ed.getAttribute('data-first') || '';
            $('um-last').value = ed.getAttribute('data-last') || '';
            $('um-email').value = ed.getAttribute('data-email') || '';
            $('um-phone').value = ed.getAttribute('data-phone') || '';
            $('um-role').value = ed.getAttribute('data-role') || 'customer';
            // An account with no restaurant carries data-restaurant="0"; that is the placeholder.
            var edRest = ed.getAttribute('data-restaurant') || '0';
            $('um-rest').value = edRest === '0' ? '' : edRest;
            $('um-pw').value = ''; $('um-pw2').value = '';
            $('um-active').checked = ed.getAttribute('data-active') === '1';
            setMode(false); syncRest();
        }
    });

    @if ($form)
    // A validation error bounced back: re-open the modal in its prior mode.
    setMode({!! (int) ($form['id'] ?? 0) === 0 ? 'true' : 'false' !!}); syncRest();
    new bootstrap.Modal(modalEl).show();
    @endif
})();
</script>

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