@extends('admin.layouts.app')

@section('content')
<div class="container-fluid">
    <h2>이미지 관리</h2>
    <hr/>
    @include('admin.messages')

    <form name="f_admin_search" id="fAdminSearch" method="get" action="{{ route('admin.board.image.index') }}">
        <table class="table table-bordered">
            <colgroup>
                <col width="15%" />
                <col width="*" />
            </colgroup>
            <tbody>
                <tr>
                    <th>검색</th>
                    <td>
                        <div class="row g-2">
                            <div class="col-auto">
                                <select name="field" id="field" class="form-select">
                                    <option value="tb_editor_image.id" @if($params->field == 'tb_editor_image.id') selected @endif>PK</option>
                                    <option value="tb_editor_image.origin_name" @if($params->field == 'tb_editor_image.origin_name') selected @endif>파일명</option>
                                    <option value="tb_editor_image.ip_address" @if($params->field == 'tb_editor_image.ip_address') selected @endif>IP</option>
                                    <option value="tb_editor_image.target_type=1" @if( $params->field == 'tb_editor_image.target_type=1') selected @endif>게시글 번호</option>
                                    <option value="tb_editor_image.target_type=2" @if( $params->field == 'tb_editor_image.target_type=2') selected @endif>댓글 번호</option>
                                    <option value="users.id" @if( $params->field == 'users.id') selected @endif>작성자 회원 PK</option>
                                    <option value="users.sid" @if($params->field == 'users.sid') selected @endif>작성자 회원 ID</option>
                                    <option value="users.name" @if($params->field == 'users.name') selected @endif>작성자 이름</option>
                                    <option value="users.email" @if($params->field == 'users.email') selected @endif>작성자 이메일</option>
                                </select>
                            </div>
                            <div class="col">
                                <input type="text" name="keyword" id="keyword" class="form-control" value="{{ $params->keyword }}" placeholder="검색어를 입력하세요." />
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <th>등록일시</th>
                    <td>
                        <div class="row g-2">
                            <div class="col-auto">
                                <input type="text" name="start_date" id="startDate" class="form-control date-picker s-start-date" value="{{ $params->startDate }}" />
                            </div>
                            <div class="col-auto align-self-center">
                                ~
                            </div>
                            <div class="col-auto">
                                <input type="text" name="end_date" id="endDate" class="form-control date-picker s-end-date" value="{{ $params->endDate }}" />
                            </div>
                            <div class="col-sm text-start">
                                <div class="btn-group">
                                    <button type="button" onclick="setDateRange();" class="btn btn-secondary">오늘</button>
                                    <button type="button" onclick="setDateRange('1d');" class="btn btn-secondary">어제</button>
                                    <button type="button" onclick="setDateRange('7d');" class="btn btn-secondary">1주일</button>
                                    <button type="button" onclick="setDateRange('15d');" class="btn btn-secondary">15일</button>
                                    <button type="button" onclick="setDateRange('1m');" class="btn btn-secondary">1개월</button>
                                    <button type="button" onclick="setDateRange('2m');" class="btn btn-secondary">2개월</button>
                                    <button type="button" onclick="setDateRange('3m');" class="btn btn-secondary">3개월</button>
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>

        <div class="text-center">
            <button type="submit" class="btn btn-dark">검색</button>
        </div>
    </form>
    <hr/>

    <div class="row mb-2">
        <div class="col align-self-end">
            <h6>전체 : {{ $editorImageData->total }}</h6>
        </div>
        <div class="col text-end">
            <button type="button" class="btn btn-outline-dark btn-list-delete btn-list-selected disabled" data-list-delete-url="/admin/board/image/destroy">선택삭제</button>
        </div>
    </div>

    <form name="f_admin_list" id="fAdminList" method="post">
        @csrf
        <div class="table-responsive">
            <table class="table table-hover table-bordered table-nowrap">
                <thead>
                    <tr>
                        <th><input type="checkbox" name="chk_all" id="chkAll" class="form-check-input" value="1"/></th>
                        <th>PK</th>
                        <th>구분</th>
                        <th>구분 번호</th>
                        <th>파일명</th>
                        <th>이미지</th>
                        <th>작성자</th>
                        <th>IP</th>
                        <th>등록일시</th>
                        <th>비고</th>
                    </tr>
                </thead>
                <tbody>
                    @if($editorImageData->rows > 0)
                        @foreach($editorImageData->list as $row)
                        <tr>
                            <td>
                                <input type="checkbox" name="chk[]" id="chk_{{ $row->id }}" class="form-check-input list-check-box" value="{{ $row->id }}" />
                                <input type="hidden" name="file_name[{{ $row->id }}]" value="{{ $row->file_name }}" />
                            </td>
                            <td>{{ $row->id }}</td>
                            <td>{{ $row->targetStr }}</td>
                            <td>{{ $row->target_id }}</td>
                            <td>
                                @if($row->fileExists)
                                    <i class="far fa-image"></i> <a href="{{ $row->file_url }}" download>{{ $row->origin_name }}</a>
                                @else
                                    {{ $row->origin_name }}
                                @endif
                            </td>
                            <td>
                                @if($row->fileExists)
                                    <img src="{{ $row->file_url }}" alt="{{ $row->file_name }}" title="{{ $row->file_name }}" width="50%"/>
                                @else
                                    -
                                @endif
                            </td>
                            <td>{{ $row->name . ' (' . $row->sid . ')' }}</td>
                            <td>{{ $row->ip_address }}</td>
                            <td>{{ $row->created_at }}</td>
                            <td>
                                <a href="{{ $row->editURL }}" class="btn btn-sm btn-primary">보기</a>
                            </td>
                        </tr>
                        @endforeach
                    @else
                        <tr>
                            <td colspan="10">
                                No data.
                            </td>
                        </tr>
                    @endif
                </tbody>
            </table>

            <div class="pagination">
                {{ $editorImageData->list->withQueryString()->links() }}
            </div>
        </div>
    </form>
</div>

<script type="module">
    let img = document.getElementsByTagName("img");
    for (let x = 0; x < img.length; x++) {
        img.item(x).onclick = function () {
            popupCenter(this.src, this.title);
        };
        img.item(x).style.cursor = "pointer";
    }
</script>
@endsection
