@extends('layouts.app')

@section('page_css')
    @parent
    <style>
       .tabulator .tabulator-tableHolder{
            overflow: unset !important;
        }

        
        td:first-child, th:first-child {
            position:sticky;
            left:0;
            z-index:1;
            background-color: white;

        }
        td:last-child, th:last-child {
            position:sticky;
            right:0;
            z-index:1;
            background-color: white;
        }
        thead tr th {
            position:sticky;
            top:0;
        }
    </style>
@endsection

@section('theme_css')
@endsection
<!-- START @PAGE CONTENT -->

@section('content')

    <h2 class="intro-y text-lg font-medium mt-10">Web Notice</h2>
    <div class="grid grid-cols-12 gap-6 mt-5">
        <div class="intro-y col-span-12 flex flex-wrap sm:flex-nowrap items-center mt-2">
            <div class="hidden md:block mx-auto text-gray-600"></div>
        </div>
    </div>
    <div class="grid grid-cols-12 gap-6 mt-5">
        <div class="intro-y col-span-12 flex flex-wrap sm:flex-nowrap items-center mt-2">
            <a class="btn btn-primary shadow-md mr-2" href="{!! route('admin.master.web_notice.add') !!}">Add New</a>
        </div>       
    </div>

    <div class="intro-y box mt-5" style="overflow-y: auto;">
        <table class="table"> 
            <thead> 
                <tr>
                    <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Title</th> 
                    <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Url</th>
                    <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Apply Now Url</th>
                    <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Apply Now Enable</th>
                    <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Home Page Active</th>
                    <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Apply Now Page Active</th>
                    <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Is Active</th>
                    <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Action</th>
                </tr>
            </thead>
            <tbody>
                @foreach($web_notice as $_web_notice)
                <tr >
                    <td class="border-b whitespace-nowrap">
                        @php
                            if($_web_notice["title"])
                                $web_notice_title=$_web_notice["title"];
                            else
                                $web_notice_title="--";
                        @endphp
                        {{$web_notice_title}}
                    </td>
                    <td class="border-b whitespace-nowrap">{{ $_web_notice["url"] }}</td>
                    <td class="border-b whitespace-nowrap">{{ $_web_notice["apply_now_url"] }}</td>
                    <td class="border-b whitespace-nowrap">{{ $_web_notice["is_apply_now_enable"] }}</td>
                    <td class="border-b whitespace-nowrap">{{ $_web_notice["home_page_active"] }}</td>
                    <td class="border-b whitespace-nowrap">{{ $_web_notice["apply_now_page_active"] }}</td>
                    <td class="border-b whitespace-nowrap">{{ $_web_notice["is_active"] }}</td>
                    <td class="border-b whitespace-nowrap">
                        <a class="btn btn-primary py-1 px-2 mr-2" href="{!! tokenize_url(route('admin.master.web_notice.edit'),['id' => $_web_notice['id']]) !!}">Edit</a>
                        <a href="javascript:void(0);" data_url="{!! tokenize_url(route('admin.master.web_notice.destroy'),['id' => @$_web_notice['id']]) !!}" data-toggle="modal" data-target="#delete_confirm_modal_preview" class="btn btn-danger inline-block py-1 px-2 mr-2 delete_confirm">Delete</a>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>



@endsection

@section('modals')
    @parent
    <!-- BEGIN: Modal Content delete confirmation -->
 <div id="delete_confirm_modal_preview" class="modal" tabindex="-1" aria-hidden="true">
     <div class="modal-dialog">
         <div class="modal-content">
             <div class="modal-body p-0">
                 <div class="p-5 text-center"> 
                     <!-- <i data-feather="x-circle" class="w-16 h-16 text-theme-6 mx-auto mt-3"></i> --> 
                    <div class="text-3xl mt-5">Are you sure?</div>
                    <div class="text-gray-600 mt-2">
                        <span id="alert_message"> Do you really want to delete?</span>
                    </div>
                 </div>
                 <div class="px-5 pb-8 text-center"> 
                    <button type="button" data-dismiss="modal" class="btn btn-outline-secondary w-24 dark:border-dark-5 dark:text-gray-300 mr-1">Cancel</button>
                    <a id="delete_confirm_modal_yes" data-dismiss="modal"  href="javascript:void(0);" class="btn btn-success w-24 dark:border-dark-5 dark:text-gray-300 mr-1" data_url="">Yes </a>
                </div>
             </div>
         </div>
     </div>
 </div> 
 <!-- END: Modal Content delete confirmation -->
@endsection

@section('plugin_scripts')

@endsection

@section('page_scripts')
    @parent


<script>

$(document).ready(function(){
    var status=@JSON(session()->get('status'));
    if(status=='deleted')
        showMessage("Deleted Sucessfully");
    else if(status=='inserted')
        showMessage("Inserted Sucessfully");
    else if(status=='updated')
        showMessage("updated Sucessfully");

    $('.delete_confirm').click(function(){
            var data_url=$(this).attr('data_url');
            $('#delete_confirm_modal_yes').attr('href',data_url);
        });

    function showMessage(msg, type) 
    {
        if(type=='error'){
        cash("#error-notification-content").find('.error-message-section').html(msg);
            Toastify({
                node: cash("#error-notification-content")
                    .clone()
                    .removeClass("hidden")[0],
                duration: 1500,
                newWindow: true,
                close: true,
                gravity: "top",
                position: "center",
                stopOnFocus: true,
            }).showToast();
        }else{
            cash("#success-notification-content").find('.success-message-section').html(msg);
            Toastify({
                node: cash("#success-notification-content")
                    .clone()
                    .removeClass("hidden")[0],
                duration: 1500,
                newWindow: true,
                close: true,
                gravity: "top",
                position: "center",
                stopOnFocus: true,
            }).showToast();
        }
    }           
});
</script>
@endsection
<!--/ END PAGE CONTENT -->