@props([
    'pageTitle' => '콘텐츠 관리',
])
<x-admin.layout.default-layout :pageTitle="$pageTitle">
    <div id="contentsList" class="contents-wrapper">

        <div class="contents-header">
            <form id="formSearch" name="formSearch" method="get">
                <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="코드, 작성자, 제목, 내용">
                        </div>
                    </div>
                </div>
                <div class="header-submit">
                    <button class="btn btn-contained-primary">검색</button>
                </div>
            </form>
        </div>

        <form name="formList" id="formList" method="post" action="{{ route('admin.content.manage.destroy.list') }}">
            @csrf
            @method("DELETE")

            <div class="table-header">
                <div class="col">
                    <button type="button" class="btn btn-solid-tertiary icon-only btn-delete-list">
                        <i class="ico ico-delete"></i>
                        <span class="sr-only">선택삭제</span>
                    </button>
                    <div>
                        전체 {{ number_format($contents->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.content.manage.create', Request::query()) }}" 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>
                        <th scope="col">작성일</th>
                        <th scope="col">관리</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($contents as $content)
                        <tr>
                            <td class="only-checkbox">
                                <div class="form-checkbox">
                                    <div class="inner">
                                        <input type="checkbox" id="id_{{ $loop->index }}" name="ids[{{ $loop->index }}]" value="{{ $content->id }}" class="check-item">
                                        <label for="id_{{ $loop->index }}" tabindex="0"><span class="sr-only">선택하기</span></label>
                                    </div>
                                </div>
                            </td>
                            <td>{{ $content->id }}</td>
                            <td>{{ $content->title }}</td>
                            <td>
                                @if ($content->author)
                                    <a href="{{ route('admin.user.manage.edit', ['user' => $content->author]) }}">
                                        {{ $content->author->name }}
                                    </a>
                                @else
                                    {{ $content->author_id }}
                                @endif
                            </td>
                            <td>{{ $content->created_at }}</td>
                            <td>
                                <a href="{{ route('admin.content.manage.edit', ['content' => $content] + Request::query()) }}" class="btn btn-contained-secondary">수정</a>
                                <button type="button" class="btn btn-solid-secondary btn-delete"
                                    data-url="{{ route('admin.content.manage.destroy', ['content' => $content] + Request::query()) }}">
                                    삭제
                                </button>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6" class="text-center">등록된 콘텐츠가 없습니다.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </form>

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

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

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

                if (!confirm('삭제하시겠습니까?')) {
                    return false;
                }
                formList.submit();
            });

            // 목록 > 삭제버튼
            document.querySelectorAll('.btn-delete').forEach(function (button) {
                button.addEventListener('click', function () {
                    deleteConfirm(this.dataset.url);
                });
            });
        });
    </script>

</x-admin.layout.default-layout>