@extends('layouts.app')

@section('page_title', 'Locked Account')

@section('content')
    <div id="locked-account-table">
        @if (session('success'))
            <div class="alert alert-success alert-dismissible fade show" role="alert">
                {{ session('success') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        @endif
        @if (session('error'))
            <div class="alert alert-danger alert-dismissible fade show" role="alert">
                {{ session('error') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        @endif
        @include('components.card-member-component', [
            'pageTitle' => 'Locked Account',
            'data' => $members ?? [],
            'columns' => [
                ['name' => 'Card Number', 'key' => 'cardNumber', 'sortable' => true],
                ['name' => 'First Name', 'key' => 'firstName', 'sortable' => true],
                ['name' => 'Last Name', 'key' => 'lastName', 'sortable' => true],
                ['name' => 'Birthday', 'key' => 'birthday', 'sortable' => true],
                ['name' => 'Card Type', 'key' => 'cardType', 'sortable' => true],
                ['name' => 'Status', 'key' => 'status', 'sortable' => true],
                ['name' => 'Lock Status', 'key' => 'is_locked', 'sortable' => true], // New column
            ],
            'actions' => ['view'],
            'showAddButton' => false,
            'showCheckboxes' => false,
            'showBatchDelete' => false,
            'showEditModal' => false,
            'showViewModal' => true,
            'currentPage' => $currentPage ?? 1,
            'lastPage' => $lastPage ?? 1,
            'total' => $total ?? 0,
            'viewRoute' => route('locked-account.show', ':id'),
        ])
        <div id="no-data-message" style="display: {{ empty($members ?? []) ? 'block' : 'none' }}; text-align: center; margin-top: 20px;">
            <p>No locked accounts found.</p>
        </div>
    </div>
@endsection