@extends('Admin.Layout.main_layout')

@section('main_container')
<style>.dropdown-toggle::after { display: none !important;}</style>

<!-- begin app-main -->

<div class="app-main" id="main">

   <!-- begin container-fluid -->

   <div class="container-fluid">

      <!-- begin row -->

      <div class="row">

         <div class="col-md-12 m-b-30">

            <!-- begin event title -->

            <div class="d-block d-sm-flex flex-nowrap align-items-center">

               <div class="page-title mb-2 mb-sm-0">

                  <h1>Manage Event</h1>

               </div>

               <div class="ml-auto d-flex align-items-center">

                  <a class="btn btn-dark text-white" href="{{ route('addEvent') }}">Add Event</a>

               </div>

            </div>

            <!-- end event title -->

         </div>

      </div>

      <!-- end row -->

      <!-- begin row -->

      <div class="row editable-wrapper">

         <div class="col-lg-12 ">

            <div class="card card-statistics">

               <div class="card-body">

                  <div class="table-responsive">

                     <table id="table" class="table display responsive nowrap table-light table-bordered">

                        <thead class="thead-light">

                           <tr>

                              <th scope="col">id</th>

                              <th scope="col">Event Title</th>

                              <th scope="col">Event Slug</th>

                              <th scope="col">Event Image</th>

                              <th scope="col">Actions</th>

                           </tr>

                        </thead>

                        <tbody>

                           @if(!$event_arr->isEmpty())

                           @foreach($event_arr as $key => $data)

                           <tr>

                              <th scope="row">{{ ($key+1) }}</th>

                              <td>{{ $data->event_title }}</td>

                              <td>{{ $data->slug }}</td>

                              <td><img src="{{ URL('public/upload/event') }}/{{ $data->event_image }}" alt="" height="100px" width="100px"></td>

                              <td class="text-left">
                                    <div class="dropdown">
                                        <a class="dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                            <i class="fe fe-more-vertical" style="font-size: 1.5em;"></i>
                                        </a>
                                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">

                                            <a class="dropdown-item" href="{{ route('eventimage', $data->event_id )}}">
                                                <i class="fa fa-file-image-o mr-2"></i>Event Images
                                            </a>

                                            <a class="dropdown-item" href="{{ route('editEvent', $data->event_id )}}">
                                                <i class="fe fe-edit mr-2"></i>Edit
                                            </a>

                                            <a class="dropdown-item btnDelete" href="javascript:void(0)" data-delete_url="{{url('event/delete/'.$data->event_id )}}">
                                                <i class="fe fe-trash mr-2"></i>Delete
                                            </a>

                                        </div>
                                    </div>
                                </td>

                           </tr>

                           @endforeach

                           @else

                           <p class="text-danger mt-2" style="padding-left:450px;">No Event Available</p>

                           @endif

                        </tbody>

                     </table>

                  </div>

               </div>

            </div>

         </div>

      </div>

      <!-- end row -->

   </div>

   <!-- end container-fluid -->

</div>

<!-- end app-main -->

</div>

<!-- end app-container -->



@endsection