@props(['query' => null])
{{-- @todo 필터기능 확인 후 재 작업해야함 --}}
<form id="formExport" name="formExport" action="{{ route('admin.user.manage.export.list', $query) }}" method="get">
    <div class="modal" id="exportMember">
        <div class="modal-overlay"></div>
        <div class="modal-container">
            <div class="modal-header">
                회원 내보내기
                <button type="button" class="modal-close"><i class="ico ico-close"></i><span class="sr-only">닫기</span></button>
            </div>
            <div class="sortable-list modal-body lined">
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">이름 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">이름</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">이메일 주소 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">이메일 주소</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">휴대폰번호 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">휴대폰번호</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">전화번호 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">전화번호</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">추천인 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">추천인</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">본인인증 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">본인인증</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">본인인증 내역 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">본인인증 내역</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">성인인증 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">성인인증</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">만 14세 미만 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">만 14세 미만</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">우편번호 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">우편번호</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">기본주소 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">기본주소</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">상세주소 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">상세주소</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">메모 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">메모</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">개인정보 제3자 제공 동의 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">개인정보 제3자 제공 동의</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">광고성 정보 수신 동의 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">광고성 정보 수신 동의</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">탈퇴일자 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">탈퇴일자</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">탈퇴사유 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">탈퇴사유</label>
                        </div>
                    </div>
                </div>
                <div class="sortable-item export-item">
                    <span class="sr-only">출력순서 <span class="text-order"></span>번 회원 정보</span>
                    <button type="button" class="drag-handle" draggable="true">
                        <span class="ico ico-drag-order"></span>
                        <span class="sr-only">이용정지기간 출력순서 변경</span>
                    </button>
                    {{-- #BACK hidden 불필요시 삭제 --}}
                    <input type="hidden" name="" value="" class="sort-order">

                    <div class="form-checkbox">
                        <div class="inner">
                            <input type="checkbox" id="" name="" value="">
                            <label for="" tabindex="0">이용정지기간</label>
                        </div>
                    </div>
                </div>
                <!-- #BACK 서비스 패키지에서 항목 추가 -->
                <!-- #BACK 커뮤니티: 닉네임 / 레벨 / 프로필 공개 -->
            </div>
            <div class="modal-footer">
                {{-- <div class="form-checkbox">
                    <div class="inner">
                        <input type="checkbox" id="" name="" value="">
                        <label for="" tabindex="0">저장</label>
                    </div>
                </div>
                <div class="form-item">
                    <label for="" class="sr-only">필터명</label>
                    <input type="text" id="" name="" value="" class="item-input" placeholder="필터{숫자}">
                </div> --}}
                <button type="button" class="btn btn-contained-primary btn-download">다운로드</button>
                <button type="button" class="btn btn-solid-secondary modal-close">닫기</button>
            </div>
        </div>
    </div>
</form>

<script src="{{ asset('static/admin/js/listHandler.js') }}"></script>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const formExport = document.getElementById('formExport');

        const btnDownload = document.querySelector('.btn-download');
        btnDownload.addEventListener('click', function() {
            formExport.submit();
            // const url = formExport.action;
            // const data = {};
            // sendAjaxRequest(url, 'GET', data, {reload: false});
        });
    });
</script>