@extends('admin.layouts.master')
@section('content')

    <section class="section">
        <ul class="breadcrumb breadcrumb-style ">
            <li class="breadcrumb-item">
                <h4 class="page-title m-b-0">Dashboard</h4>
            </li>
            <li class="breadcrumb-item">Event Type</li>
        </ul>
        @if(session('success'))
          <div class="alert alert-success">{{session('success')}}</div>
        @endif
        <div class="card">
            <div class="card-body">
            @if (session('status'))
            <div class="alert alert-success">
             {{ session('status') }}
           </div>
            @endif
                <button type="button" class="btn  btn-icon icon-left  btn-primary float-right mb-3" data-toggle="modal"
                    data-target="#AddEvent"><i class="far fa-edit"></i>Add Event Type</button>
                <div class="table-responsive">
                   
                    <table class="table table-striped table-md" id="datatable">
                        <tbody>
                            <tr>
                                <th>ID</th>
                                <th>Image</th>
                                <th>Name</th>
                                <th>Action</th>
                            </tr>
                            @foreach($event as $events)
                              <tr id="eventid{{ $events->id }}">
                                  <td>{{$events->id}}</td>
                                  <td><img src="{{asset('/uploads/admin/events/'.$events->image)}}" style="height: 50px;width: 50px;" alt=""></td>
                                  <td>{{$events->name}}</td>
                                  
                                  <td>
                                    <button  class="btn btn-md btn-icon btn-success edit" data-id="{{$events->id}}"><i
                                      class="far fa-edit"></i>
                                    </button>
                                    
                                    <button class="btn btn-md btn-icon btn-danger delete" data-id="{{$events->id}}" ><i
                                      class="fas fa-trash-alt"></i>
                                    </button>
                                  </td>
                                          
                              </tr>
                            @endforeach

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </section>
    <div class="modal" id="AddEvent">
      <div class="modal-dialog">
        <div class="modal-content">

          <!-- Modal Header -->
          <div class="modal-header">
            <h4 class="modal-title">Add Event Type</h4>
            <button type="button" class="close" data-dismiss="modal">&times;</button>
          </div>

          <!-- Modal body -->
          <div class="modal-body">
            <form action="{{route('admin.event.process')}}" method="POST" enctype="multipart/form-data">
              @csrf
            
              <div class="form-group">
                <label>Name</label>
                <div class="input-group">
                  <div class="input-group-prepend">

                  </div>
                  <input type="text" class="form-control" placeholder="Event Name" name="event_name" required>
                </div>
                <span class="text-danger">{{$errors->first('event_name')}}</span>
              </div>

              <div class="form-group">
                <label>Image</label>
                <div class="input-group">
                  <div class="input-group-prepend">

                  </div>
                  <input type="file" class="form-control" name="image" >
                </div>
                <span class="text-danger">{{$errors->first('image')}}</span>
              </div>


              <input type="submit" Value="Add" class="btn  btn-icon icon-left  btn-primary float-right  m-t-15 waves-effect">
            </form>
          </div>

          <!-- Modal footer -->


        </div>
      </div>
    </div>
    <div class="modal" id="EditEvent">
      <div class="modal-dialog">
        <div class="modal-content">

          <!-- Modal Header -->
          <div class="modal-header">
            <h4 class="modal-title">Edit Event Type</h4>
            <button type="button" class="close" data-dismiss="modal">&times;</button>
          </div>

          <!-- Modal body -->
          <div class="modal-body">
            <form  action="{{route('admin.event.update')}}" method="POST" enctype="multipart/form-data">
              @csrf
              <div class="form-group">
                <label>Name</label>
                <div class="input-group">
                  <div class="input-group-prepend">

                  </div>
                  <input type="hidden" name="id" class="id" value="">
                  <input type="text" class="form-control event_name" placeholder="Event Name" name="edit_event_name" required>
                  
                </div>
              </div>

              <div class="form-group">
                <label>Image</label>
                <div class="input-group">
                  <div class="input-group-prepend">

                  </div>
                  <input type="file" class="form-control" name="edit_image" >
                </div>
                <span class="text-danger">{{$errors->first('edit_image')}}</span>
              </div>


              <input type="submit"  value="Update" class="btn  btn-icon icon-left  btn-primary float-right  m-t-15 waves-effect">
            </form>
          </div>

          <!-- Modal footer -->


        </div>
      </div>
    </div>
@endsection

@section('scripts')

<script>

  $(document).ready(function(){ 
    check="{{old('event_name')}}";
    check_id="{{old('id')}}";
    if (check!="" && check_id=='') {
        $("#AddEvent").modal("show");
      }

      if (check_id!="") {
        $(".id").val(check_id);
        $("#EditEvent").modal("show");
      }
    $(document).on("click",".delete",function(){
      if(confirm('Do You Real Want To Delete This Event !'))
      {
        id=$(this).data("id");
          $.ajax({
              url:'event-delete/'+id, 
              type:'GET',
              data:{
                  _token:$('input[name=_token]').val()
  
              },
              success:function(response)
              {
                  $('#eventid'+id).remove();
              }
  
          })
      }
    })
    $(document).on("click",".edit",function(){
      id=$(this).data("id");
      $.get('event-edit/'+id,function(event){
      $(".message").html("");
      $('.id').val(event.id);
      $('.event_name').val(event.name);
      $(".message").html("");
      $('#EditEvent').modal('show');
      
      });
    })
    
    
  });
  
</script>

@endsection