@extends('admins.layouts.main')
@section('content')
        <div class="panel panel-bordered">
        <form id="From" method="get" class="form-horizontal" enctype="multipart/form-data">
            <div class="alert-light alert-dismissible alert-check">
                <div class="row">
                    <div class="p-4 pl-4 col-md-6 col-xl-6 form-title-right">
                        <div class="form-group row">
                            <label class="col-lg-4 col-form-label">縣市區域:</label>
                            <div class="col-md-4">
                                {{--                            <div class="example-wrap">--}}
                                <select id="place_city_id" class="form-control" name="s_place_city_id">
                                    <option value="all" {{ $sPlaceCityId == 'all' ? 'selected' : null }}>全部</option>
                                    @foreach($cities as $city)
                                        <option value="{{ $city->id }}" {{ $sPlaceCityId == $city->id ? 'selected' : null }}>{{ $city->name }}</option>
                                    @endforeach
                                </select>
                                {{--                            </div>--}}
                            </div>
                            <div class="col-md-4">
                                {{--                            <div class="example-wrap">--}}
                                <select id="place_town_id" class="form-control" name="s_place_town_id">
                                    <option value="0">鄉鎮區域</option>
                                    @foreach($placeTown as $town)
                                        <option value="{{ $town->id }}" {{ $sPlaceAreaId == $town->id ? 'selected' : null }}>{{ $town->name }}</option>
                                    @endforeach
                                </select>
                                {{--                            </div>--}}
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-lg-4 col-form-label ">關鍵字：</label>
                            <div class="col-md-8 ">
                                <input type="text" class="form-control" name="s_keyword" id="s_keyword"
                                       placeholder="" autocomplete="off" value="{{$sKeyword}}"
                                />
                            </div>
                        </div>
                    </div>
                    <div class="p-4 pl-4 col-md-6 col-xl-6 form-title-right">
                        <div class="form-group row">
                            <label class="col-lg-4 col-form-label">場所類型:</label>
                            <div class="col-md-4">
                                <select id="place_main_type" class="form-control" name="place_type_id">
                                    <option value="all" {{ $sPlaceTypeId == 'all' ? 'selected' : null }}>全部</option>
                                    @foreach($mainPlaceTypes as $placeType)
                                        <option value="{{ $placeType->id }}" {{ $sPlaceTypeId == $placeType->id ? 'selected' : null }}>{{ $placeType->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-md-4">
                                <select id="place_sub_type_id" class="form-control" name="place_sub_type_id">
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-md-4 col-form-label"></label>
                            <div class="col-md-8">
                                <button type="button" onclick="resetUrl()" class="btn btn-warning">重設</button>
                                <button type="submit" class="btn btn-primary" value="">搜尋</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
        <div class="row">
        <div class="col-lg-12">
            <div class="panel">
                <div class="panel-body">
                    <ul class="nav nav-pills tab-list" id="tab-list" role="tablist">
                        @foreach($tabOrder as $status)
                        <li class="nav-item">
                            <a class="nav-link"  data-toggle="tab" href="#status-{{$tabKey}}-{{ $status }}"
                               role="tab" data-tabKey={{$tabKey}} data-tabStatus={{$status}}><span id="status-{{$tabKey}}-{{ $status }}-count" >{{ $tableTypeName[$status] }} ()</span></a>
                            
                        </li>
                        @endforeach
                    </ul>
                    <div class="tab-content" id="tab-content">
                        @foreach($tabOrder as $status)
                            <div class="tab-pane fade" id="status-{{$tabKey}}-{{ $status }}" role="tabpanel">
                                <table id="locationApply-{{$tabKey}}-{{ $status }}" class="table locationApply2 locationApply" data-tabKey={{$tabKey}} data-tabStatus={{$status}}>
                                    <thead>
                                    <tr class="table-head-2">
                                        <th>操作</th>
                                        <th>安心場所申請單id</th>
                                        <th>場所名稱</th>
                                        <th>統一編號</th>
                                        <th>場所地址</th>
                                        <th>管理員姓名</th>
                                        <th>狀態</th>
                                        <th>安心場所認證到期日</th>
                                        <th>新增時間</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                 
                                    </tbody>
                                </table>
                            </div>
                        @endforeach
                    </div>

                </div>
            </div>
        </div>
    </div>
{{--    <div>--}}
{{--        {!! $Paginate !!}--}}
{{--    </div>--}}

    <script>
        var subPlaceTypes = @json($subPlaceTypes);
        var towns = @json($towns);
        var areaId = "{{ $sPlaceAreaId ?? 0 }}";
        var placeSubTypeId = "{{ $sPlaceSubTypeId ?? 0 }}";

    
        var place_city_id , place_town_id , s_keyword , place_main_type ,place_sub_type_id ;  

    function getDataTableObj(tabKey,tabStatus) {
            var table=$('#locationApply-' + tabKey + '-' + tabStatus).DataTable({
                    "searching": false, // 顯示搜尋
                    "processing": true,
                    "serverSide": true,
                    "ordering": true,
                    "autoWidth": false,
                    "ajax": {
                        "url": "{{route('admin.aed_management.safe_places.getSafePlaceListJson')}}",
                        "data": {
                            "tabKey": tabKey,
                            "tabStatus": tabStatus,
                            "s_place_city_id": place_city_id,
                            "s_place_town_id": place_town_id,
                            "s_keyword": s_keyword,
                            "place_type_id": place_main_type,
                            "place_sub_type_id": place_sub_type_id,
                        },
                    },
                    "destroy": true, //Cannot reinitialise DataTable,解决重新加载表格内容问题
                    "columns": [
                        { "data": "id" }, //第一欄使用data中的name
                        { "data": "id" },
                        { "data": "place_name" },
                        { "data": "unicode" },
                        { "data": "address" },
                        { "data": "admin_name" },
                        { "data": "status_ch" },
                        { "data": "certification_period" },
                        { "data": "created_at2" },
                    ],
                    createdRow:function(row,data,dataIndex,cells){
                        
                        var td = $(row).find('td:first-child');
                            var html = '';
                           
                            @can('verify', \App\Models\SafePlaceApply::class)
                        //if(in_array(status, reviewableStatusMap))
                            if(data.status==1){
                            html += '<a href="' + data.verify_url + '" class="btn btn-warning"><i class="icon md-spellcheck" aria-hidden="true"></i>備查</a>';
                            }
                        
                            @endcan

                            @can('show', \App\Models\SafePlaceApply::class)
                            html += '<a href="' + data.show_url + '" class="btn btn-dark"><i class="icon md-eye" aria-hidden="true"></i>查看</a>';
                            if(data.status==9){
                                html += '<a href="javascript:exportReportWithCertificates(1,\'' + data.place_id + '\', \'pdf\')" class="btn btn-primary"><i class="icon md-calendar-note" aria-hidden="true"></i>預覽</a>';
                            }
                            @endcan

                            td.html(html)
                    },
                    language: {
                        "sInfo": "顯示第 _START_ 至 _END_ 項結果，共 _TOTAL_ 項",
                        "sInfoEmpty": "顯示第 0 至 0 項結果，共 0 項",
                        "search": "搜尋:",
                        "lengthMenu": "每頁顯示 _MENU_ 筆",
                        "zeroRecords": "沒有資料",
                        "processing": "處理中...",
                        "loadingRecords": "載入中...",
                        paginate: {
                            first:    '«',
                            previous: '‹',
                            next:     '›',
                            last:     '»'
                        },
                        aria: {
                            paginate: {
                                first:    'First',
                                previous: 'Previous',
                                next:     'Next',
                                last:     'Last'
                            }
                        }
                    }
                } );
              return table; 
        }

        //預覽安心場所證書
        function exportReportWithCertificates(report,placeId, type){
            var url = new URL('{{ $exportCertificatesUrl }}');
            url.searchParams.append('report', report);
            /*
            url.searchParams.append('s_place_city_id', $("select[name=s_place_city_id]").val());
            url.searchParams.append('s_sd', $("input[name=s_sd]").val());
            url.searchParams.append('s_ed', $("input[name=s_ed]").val());
            */
            url.searchParams.append('place_id', placeId);
            url.searchParams.append('type', type);
            url.searchParams.append('preview', 1);
            window.open(url.href);
        }
        
        $(document).ready(function () {
            var oTable ;
            $(".locationApply2").each(function(){
                var tabKey = $(this).attr('data-tabKey');
                var tabStatus = $(this).attr('data-tabStatus');
                place_city_id ='{{$sPlaceCityId}}'; 
                place_town_id = '{{$sPlaceAreaId}}'; 
                s_keyword = $('#s_keyword').val();
                place_main_type = '{{$sPlaceTypeId}}'; 
                place_sub_type_id = '{{$sPlaceSubTypeId}}';  
                if(tabStatus !=