@extends('common.layout')

@section('content')
    <form name="sch_form" method="get">
        <div class="row justify-content-center">
            <!-- start page title -->
            <div class="row">
                <div class="col-12">
                    <div class="page-title-box d-flex justify-content-between align-items-center">
                        <h4 class="page-title"></h4>
                        <div>
                            <div class="d-flex">
                                <div class="input-group">
                                    <button class="btn btn-success my-2 mr-sm-2" type="button" onclick="excelmodal()"><i class="dripicons-document"></i> 일괄업로드</button>
                                    <input class="form-control mr-sm-2 w-40 mx-2 my-2" type="search" name="k" placeholder="학교배너명 검색" aria-label="Search" value="{{ $search_keyword }}" autocomplete="off">
                                    <button class="btn btn-primary my-2 mr-sm-2" type="submit">검색</button>
                                    <a href="{{route('schoolbanner.list')}}" class="btn btn-primary ms-1 my-2">초기화</a>
                                    <button type="button" onclick="location.href='{{ route('schoolbanner.create') }}'" class="btn btn-danger my-2 mr-sm-2 ms-1">학교배너등록</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>

    <!-- end page title -->
    <div class="row">
        <div class="col-12">
            <div class="card">

                <div class="card-body">
                    <div class="table-responsive">
                        <div class="dataTables_wrapper dt-bootstrap4 no-footer">
                            <!-- S: Table Data -->
                            <div class="row">
                                <div class="col-sm-12">
                                    <table class="table table-centered w-100 dt-responsive nowrap dataTable no-footer dtr-inline collapsed">
                                        <thead>
                                            <tr>
                                                <th style="width: 5%;">번호</th>
                                                <th style="width: 25%;">학교배너명</th>
                                                <th style="width: 15%;">국가</th>
                                                <th style="width: 25%;">큰 타이틀 (국문명)-1</th>
                                                <th style="width: 15%;">등록일</th>
                                                <th style="width: 15%;"></th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        @if(count($lists) == 0)
                                            <tr>
                                                <td colspan="99" class="text-center" style="height:100px">데이터가 존재하지 않습니다.</td>
                                            </tr>
                                        @else
                                            @foreach($lists as $list)
                                            @php
                                                $selectedCountries = explode(',', $list->country);
                                                $displayCountries = array_map(function($code) use ($countries) {
                                                    return $countries[$code] ?? $code;
                                                }, $selectedCountries);
                                            @endphp
                                            <tr>
                                                <td>{{ $list->id }}</td>
                                                <td><a href="/schoolbanner/edit/{{ $list->id }}?{{ $param }}" class="text-decoration-underline">{{ $list->name }}</a></td>
                                                <td>{{ implode(', ', $displayCountries) }}</td>
                                                <td>{{ $list->bt1_title }}</td>
                                                <td>{{ $list->created_at->format('Y-m-d') }}</td>
                                                <td class="text-center">
                                                    <a href="javascript:openmodal({{ $list->id }}, '{{ addslashes($list->name) }}')" class="btn btn-warning">미리보기</a>
                                                    <a href="/schoolbanner/edit/{{ $list->id }}?{{ $param }}" class="btn btn-primary">수정</a>
                                                    <button type="button" onclick="delitem({{ $list->id }})" class="btn btn-danger">삭제</button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <!-- E: Table Data -->

                        </div>
                    </div> <!-- end table-responsive-->
                </div> <!-- end card-body-->
            </div> <!-- end card-->
        </div> <!-- end col-->
    </div>
    <!-- end row -->

    <form name="delfrm" action="{{ route('schoolbanner.destroy') }}" method="POST" style="display:none">
        @csrf
        <input type="hidden" name="id" value="">
    </form>

    @include('schoolbanner.modal')
@endsection

@section('script')
<script>
    function delitem(id){
        if(confirm('삭제 하시겠습니까?\n삭제 후에는 복구가 불가능합니다.')){
            $('form[name="delfrm"] input[name="id"]').val(id);
            delfrm.submit();
        }
    }

    function openmodal(id, name){
        $('#pdf-preview-modal .modal-title').text(name+' 미리보기');
        $('#pdf-preview-modal iframe').attr('src', '/schoolbanner/preview/'+id);
        $('#pdf-preview-modal').modal('show');
    }

    function excelmodal(){
        $('#excel-upload-modal').modal('show');
    }
</script>
@endsection