@extends('admin.admin')
@section('adminContent')
<!-- Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<div class="row page-titles">
    <div class="col-md-5 align-self-center">
        <h3 class="text-themecolor">Event List</h3>
    </div>
    <div class="text-right col-md-7" style="line-height: 4.5;">
        <a class=" waves-effect waves-light btn-warning btn" href="{{URL::to('admin/adminEvent')}}">Add Event</a>
    </div>

    <div>
        <button class="right-side-toggle waves-effect waves-light btn-inverse btn btn-circle btn-sm pull-right m-l-10"><i class="ti-settings text-white"></i></button>
    </div>
</div>
<!-- ============================================================== -->
<!-- End Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Container fluid  -->
<!-- ============================================================== -->
<div class="container-fluid">


    <div class="row">
        @if($errors->any())
        <p class="alert alert-danger">
            {{$errors}}
        </p>
        @endif
        <!--@if($message=Session::get('success'))-->
        <!--<div class="alert alert-success">-->
        <!--    {{$message}}-->
        <!--</div>-->
        <!--@elseif($message=Session::get('error'))-->
        <!--<div class="text-danger">-->
        <!--    {{$message}}-->
        <!--</div>-->

        <!--@endif-->
        <div class="col-12">
            <div class="card card-default">
                <div class="card-header">
                    <div class="card-actions">
                        <a class="" data-action="collapse"><i class="ti-minus"></i></a>
                        <a class="btn-minimize" data-action="expand"><i class="mdi mdi-arrow-expand"></i></a>
                        <a class="btn-close" data-action="close"><i class="ti-close"></i></a>
                    </div>
                    <h4 class="card-title m-b-0">Events</h4>
                </div>
                <div class="card-body collapse show">
                    <div class="table-responsive">
                        <table class="table product-overview">
                            <thead>
                                <tr>
                                    <th>Photo</th>
                                    <th>Events Title</th>
                                    <th>Image</th>
                                    <th>Created Date</th>
                                    <th>Videos</th>
                                    <th>Status</th>
                                    <th class="tdaction">Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @if($data!=null)
                                    @foreach($data as $item)
                                    <tr>
                                        <td scope="row"> <img src="{{asset('storage/uploads/event/'.$item['thumbnail'])}}" alt="iMac" width="80"></td>
                                        <td scope="row">{{$item['event']}}</td>
                                        <td><a href="{{url('/admin/photoGallery',['event_id' => $item->event_id])}}"><button class="btn btn-primary">{{$item->count_image_count}}</button></a></td>
                                        <td scope="row">{{$item['created_at']}}</td>
                                        <td><a href="{{url('/admin/videoGallery',['event_id' => $item->event_id])}}"><button class="btn btn-primary">{{$item->count_videos_count}}</button></a></td>
                                        @if($item['status']=='active')
                                        <td scope="row" ><p class="bg-success text-center">Active</p></td>
                                        @else
                                        <td scope="row"><p class="bg-danger text-center">Inactive</p></td>
                                        @endif
                                        <td class="tdaction"><button value="{{$item->event_id}}" type="button" data-bs-toggle="modal" data-bs-target="#exampleModal" class="editBtn border-0 bg-white text-inverse p-r-10"><i class="ti-marker-alt"></i></button><a href="{{url('admin/deleteEvent',$item->event_id)}}" class="text-inverse" title="" data-toggle="tooltip" data-original-title="Delete"><i class="ti-trash"></i></a></td>
                                    </tr>
                                    @endforeach
                                @else
                                  <tr class="text-center"><td colspan="4">No Records Found!</td></tr>
                                @endif
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- ============================================================== -->
<!-- End Container fluid  -->
<!-- ============================================================== -->


<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="text-center">Edit Event Name</h3>
            </div>
            <form action="{{url('admin/editEvent')}}" enctype="multipart/form-data" method="post">
                @csrf
                @method('PUT')
                <div class="modal-body">
                    <div class="mb-3">
                        <label for="event-name" class="col-form-label">Event Name</label>
                        <input type="text" class="form-control" name="name" id="event-name">
                        <input type="text" hidden class="form-control"  name="id" id="id">
                        <label class="control-label">Album Thumnail</label>
                        <input type="file" name="image" accept="image/*" class="form-control">
                        <img src="" id="event-file" width="80" height="auto" title="privious photo" alt="">
                        <div class="form-check my-3 form-switch">
                            <input class="form-check-input" name="status" type="checkbox" value="active" id="flexSwitchCheckChecked" role="switch">
                            <!-- <input type="checkbox" name="status" id="flexSwitchCheckChecked" class="js-switch" data-color="#ffb22b" value="active" data-size="small" /> -->
                            <label class="form-check-label" for="flexSwitchCheckChecked">Active</label>
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-close btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary">Update</button>
                </div>
        </div>
        </form>
    </div>
</div>

<script>
     $(document).ready(function() {
        $(document).on('click', '.editBtn', function() {
            let event_id = $(this).val();
            $('#exampleModal').modal('show');
            $.ajax({
                type: 'get',
                url: "getEvent/" + event_id,
                success: function(response) {
                    $('#event-name').val(response.event_name);
                    $('#event-file').attr('src', "{{asset('storage/uploads/event/')}}" + "/" + response.event_file);
                    if (response.event_status == 'active') {
                        $('#flexSwitchCheckChecked').attr('checked', 'true');
                    } else {
                        $('#flexSwitchCheckChecked').removeAttr('checked');
                    }

                    $('#id').val(response.event_id);
                
                }

            });

        })
        $('.btn-close').on('click', function() {
            $('#exampleModal').modal('hide');
        });
    })
</script>
@stop