@props([
    'title' => '회원 관리',
    'pageTitle' => '회원 관리',
    'filterKeyword' => '아이디, 회원태그, 이름, 이메일, 휴대폰번호, 전화번호, 주소' . ($useCommunity ? ', 닉네임' : ''),
])
<x-admin.layout.default-layout :title="$title" :pageTitle="$pageTitle">
    <div id="memberList" class="contents-wrapper">

        <div class="contents-header">
            <form id="formSearch" name="formSearch" action="{{ route('admin.user.manage') }}" method="get">
                <input type="hidden" name="level" value="{{ Request::get('level') }}">
                <input type="hidden" name="status" value="{{ Request::get('status') }}">
                <input type="hidden" name="review_status" value="{{ Request::get('review_status') }}">
                <input type="hidden" name="limit" value="{{ Request::get('limit') }}">

                <div class="header-search">
                    <div>검색</div>
                    <div>
                        <div class="form-item">
                            <label for="keyword" class="sr-only">Label</label>
                            <input type="text" id="keyword" name="keyword" value="{{ Request::get('keyword') }}" class="item-input" placeholder="{{ $filterKeyword }}">
                        </div>
                    </div>
                </div>
                <div class="header-submit">
                    <button class="btn btn-contained-primary">검색</button>
                </div>
            </form>
        </div>

        <form name="formList" id="formList" action="{{ route('admin.user.manage.update.list') }}"
            method="post" onsubmit="return validateForm();">
            @csrf
            @method('PUT')

            <div class="table-header">
                <div class="col">
                    <button type="button" class="btn btn-solid-secondary btn-update-list">선택수정</button>
                    <button type="button" class="btn btn-solid-secondary btn-export" data-modal-target="exportMember">
                        <i class="ico ico-download"></i>
                        내보내기
                    </button>
                    <div>
                        전체 {{ number_format($users->total()) }}건
                        (<span class="count-selected">0</span>건 선택)
                    </div>
                </div>

                <div class="col">
                    <div class="form">
                        <div class="form-item">
                            <x-admin.forms.items-per-page formId="formSearch"/>
                        </div>
                    </div>
                    <a href="{{ route('admin.user.manage.create') }}" class="btn btn-contained-secondary">회원추가</a>
                </div>
            </div>

            <table class="table-base">
                <thead>
                    <tr>
                        <th scope="col" class="only-checkbox">
                            <div class="form-checkbox">
                                <div class="inner">
                                    <input type="checkbox" id="checkAll" name="checkAll" value="1" class="check-all">
                                    <label for="checkAll" tabindex="0"><span class="sr-only">전체선택하기</span></label>
                                </div>
                            </div>
                        </th>
                        <th scope="col">회원태그</th>
                        <th scope="col">이름</th>
                        <th scope="col">운영진설정</th>
                        @if ($useCommunity)
                            <th scope="col">닉네임</th>
                            <th scope="col" class="member-level">
                                <x-admin.forms.selectbox
                                    :id="'level'"
                                    :name="'level'"
                                    :value="Request::get('level')"
                                    :options="['' => '레벨'] + rangeArray(10, 1)"
                                    :class="'size-small'"
                                />
                            </th>
                        @endif
                        <th scope="col" class="member-status">
                            <x-admin.forms.selectbox
                                :id="'review_status'"
                                :name="'review_status'"
                                :value="Request::get('review_status')"
                                :options="['' => '검수', 'pending' => '검수중', 'approved' => '검수완료']"
                                :class="'size-small'"
                            />
                        </th>
                        <th scope="col" class="member-status">
                            <x-admin.forms.selectbox
                                :id="'status'"
                                :name="'status'"
                                :value="Request::get('status')"
                                :options="['' => '상태', 'normal' => '정상', 'banned' => '이용정지', 'leave' => '탈퇴']"
                                :class="'size-small'"
                            />
                        </th>
                        <th scope="col">이메일</th>
                        <th scope="col">메모</th>
                        <th scope="col">관리</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($users as $user)
                        <tr>
                            <td class="only-checkbox">
                                <div class="form-checkbox">
                                    <div class="inner">
                                        <input type="checkbox" id="ids_{{ $loop->index }}" name="ids[{{ $loop->index }}]" value="{{ $user->id }}" class="check-item">
                                        <label for="ids_{{ $loop->index }}" tabindex="0"><span class="sr-only">선택하기</span></label>
                                    </div>
                                </div>
                            </td>
                            <td>
                                {{ $user->tag }}
                                <x-admin.forms.tooltip>{{ $user->account_id }}</x-admin.forms.tooltip>
                            </td>
                            <td>{{ $user->name }}</td>
                            <td>
                                @adminPage($user)
                                    <a href="{{ route('admin.config.permission.edit', ['user' => $user]) }}" class="btn btn-solid-secondary">수정</a>
                                @elseadminPage
                                    <a href="{{ route('admin.config.permission.create', ['user' => $user]) }}" class="btn btn-solid-secondary">추가</a>
                                @endadminPage
                            </td>
                            @if ($useCommunity)
                                <td>{{ $user->nickname }}</td>
                                <td class="member-level">
                                    <x-admin.forms.selectbox
                                        :id="'level[' . $loop->index . ']'"
                                        :name="'level[' . $loop->index . ']'"
                                        :value="Request::get('level[' . $loop->index . ']', $user->level)"
                                        :options="rangeArray(10, 1)"
                                        :class="'size-small'"
                                    />
                                </td>
                            @endif
                            {{-- @todo 반려 상태는 없는지 확인 필요 --}}
                            <td class="member-status">
                                <x-admin.forms.selectbox
                                    :id="'review_status[' . $loop->index . ']'"
                                    :name="'review_status[' . $loop->index . ']'"
                                    :value="Request::get('review_status[' . $loop->index . ']', $user->review_status)"
                                    :options="['pending' => '검수중', 'approved' => '검수완료']"
                                    :class="'size-small'"
                                />
                            </td>
                            <td class="member-status">
                                @if ($user->banned())
                                    {{-- @todo selectbox로 변경되어 일괄수정이 가능하다면, 이용정지 설정 시 이용정지 기간은 어떻게 할 것인가? --}}
                                    이용정지
                                @elseif ($user->leave())
                                    탈퇴
                                @else
                                    정상
                                @endif
                            </td>
                            <td>{{ $user->email }}</td>
                            <td>
                                <a href="{{ route('admin.user.manage.edit', ['user' => $user]) }}#memo_list" class="btn btn-texted-secondary">
                                    {{ number_format($user->memos_count) }}건
                                </a>
                            </td>
                            <td>
                                <a href="{{ route('admin.user.manage.edit', ['user' => $user]) }}" class="btn btn-solid-secondary">관리</a>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>

        </form>

        {{ $users->links('admin.paginate.default') }}

        <x-admin.modal.export-user :query="Request::query()"/>
    </div>

    <script>
    document.addEventListener('DOMContentLoaded', function() {
        const formSearch = document.getElementById('formSearch');
        const formList = document.getElementById('formList');
        initializeSelectAllFeature(formList);

        // 선택수정
        const btnUpdateList = document.querySelector('.btn-update-list');
        btnUpdateList.addEventListener('click', function() {
            const checkboxes = document.querySelectorAll('.check-item');
            const isChecked = Array.from(checkboxes).some(checkbox => checkbox.checked);
            if (!isChecked) {
                alert('수정할 항목을 선택해주세요.');
                return false;
            }
            formList.submit();
        });

        // 목록 > 레벨 변경
        @if ($useCommunity)
        const levelSelect = document.querySelectorAll('input[type="radio"][name="level"]');
        levelSelect.forEach(radio => {
            radio.addEventListener('click', function() {
                formSearch.level.value = radio.value;
                formSearch.submit();
            });
        });
        @endif

        // 목록 > 검수 상태 변경
        const reviewStatusSelect = document.querySelectorAll('input[type="radio"][name="review_status"]');
        reviewStatusSelect.forEach(radio => {
            radio.addEventListener('click', function() {
                formSearch.review_status.value = radio.value;
                formSearch.submit();
            });
        });

        // 목록 > 상태 변경
        const statusSelect = document.querySelectorAll('input[type="radio"][name="status"]');
        statusSelect.forEach(radio => {
            radio.addEventListener('click', function() {
                formSearch.status.value = radio.value;
                formSearch.submit();
            });
        });
    });
    </script>
</x-admin.layout.default-layout>