@extends('layouts.theme')
@section('title','Item List')
@section('style')
    <link href="{{url('libs/datatables.net-bs4/css/dataTables.bootstrap4.min.css')}}" rel="stylesheet" type="text/css" />
    <link href="{{url('libs/summernote/summernote-bs4.min.css')}}" rel="stylesheet" type="text/css" />
    <link href="{{url('libs/sweetalert2/sweetalert2.min.css')}}" rel="stylesheet">
    <script src="{{url('libs/sweetalert2/sweetalert2.min.js')}}"></script>
    {{-- <link href="{{url('assets/libs/select2/css/select2.min.css')}}"  rel="stylesheet" type="text/css" /> --}}
@endsection
@section('content')
<div class="page-content">
    <div class="container-fluid customer-search">
        <div class="loading_div"  id="loading" style="display: none">
            <div class="spinner-grow text-secondary  loading" role="status" ></div>
        </div>
       
        <!-- start page title -->
        <div class="card  w-100">
            <div class="card-body">
                @include('alertsInfo')
                <div class="row">
                    <div class="col-md-12">
                        {{-- <div class="card"> --}}
                            {{-- <div class="card-body"> --}}
                                <div class="row d-flex">
                                    <div class="col-lg-6  ">

                                        <h5 class="card-title">E-Auction Item List </h5>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="float-right d-print-none">
                                            {{-- @can('category.create') --}}
                                                <a href="javascript:;" data-target="#create_modal" id="create_category_btn" data-toggle="modal"  class="btn btn-primary float-right">Create E-Auction Item</a>
                                            {{-- @endcan --}}
                                        </div>
                                    </div>
                                </div>
                                <br>
                                <div class="table-responsive">
                                    <table id="datatable-buttons" class="table table-striped table-bordered w-100 user_table">
                                        <thead>
                                            <tr>
                                                <th>Sr. #</th>
                                                <th>Item Name</th> 
                                                <th>description</th>
                                                <th>Edit</th>
                                                <th>Delete</th> 
                                            </tr>
                                        </thead>
                                        <tbody>
                                                                                    @foreach ($fin as $value)
                                            <tr class="gradeX">
                                                <td class="count"> {{$count++}}</td>
                                                <td class="name">{{$value->item}} </td> 
                                                <td class="specifications">{!!$value->description!!} </td> 
                                                <td> 
                                                    <a href="{{url('auction-item/'.encrypt($value->id).'/edit')}}" class="dropdown-item action_imgs edit_">
                                                        <span class="mdi mdi-square-edit-outline edit-icon"> </span>Edit
                                                    </a>
                                                </td>
                                                <td>
                                                    <button class="delete" type="submit" style="border: none; background-color:transparent;"  data-id="{{ $value->id }}">
                                                     <i class="fas fa-trash fa-lg text-danger"></i>  Delete</button>
                                                </td> 
                                            </tr> 
                                        @endforeach 
                                        </tbody> 
                                    </table>
                                </div>
                            </div>
                        {{-- </div> --}}
                    {{-- </div> <!-- end col --> --}}
                </div> <!-- end row -->
                 
                {{-- @can('category.create') --}}
                <!-- /.create-dialog -->
                <div class="modal fade" id="create_modal" tabindex="-1" role="basic" aria-hidden="true">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h4 class="modal-title">Create E-Auction Item</h4>
                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">X</button>
                            </div>
                            <div class="modal-body">
                                <form   class="custom-validation " id="create_form" action="javascript:;" method="post"  >
                                    <div class="row">
                                        <div class="col-md-6"> 
                                            <div class="form-group">
                                                <label>Item Name</label>
                                                <input type="text" placeholder="Item Name" autocomplete="off" 
                                                id="create_item" name="item" class="form-control"
                                                       value="{{old('item')}}"   required autofocus> 
                                                    <span class="text-danger" id="err_create_item">   </span> 
                                            </div>
                                        </div>
                                       
                                        <div class="col-md-12"> 
                                            <div class="form-group {{ $errors->has('description') ? ' has-error' : '' }}">
                                                <label>description</label>
                                                <textarea class="summernote" name="description"id="create_description" cols="30" rows="10" required ></textarea>
                                               <span class="text-danger" id="err_create_description">   </span>
                                            </div> 
                                        </div> 
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <button type="submit" class="btn btn-light float-right submit_create_form  waves-light">Submit </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <!-- /.modal-content -->
                    </div>

                </div>
            {{-- @endcan  --}}

 
        </div>
    </div>
        @endsection

        @section('script')

            <!-- Required datatable js -->
        <script src="{{url('libs/datatables.net/js/jquery.dataTables.min.js')}}"></script>
        <script src="{{url('libs/datatables.net-bs4/js/dataTables.bootstrap4.min.js')}}"></script>
        <!-- Buttons examples -->
        <script src="{{url('libs/datatables.net-buttons/js/dataTables.buttons.min.js')}}"></script>
        <script src="{{url('libs/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js')}}"></script>
        <script src="{{url('libs/jszip/jszip.min.js')}}"></script>
        <script src="{{url('libs/pdfmake/build/pdfmake.min.js')}}"></script>
        <script src="{{url('libs/pdfmake/build/vfs_fonts.js')}}"></script>
        <script src="{{url('libs/datatables.net-buttons/js/buttons.html5.min.js')}}"></script>
        <script src="{{url('libs/datatables.net-buttons/js/buttons.print.min.js')}}"></script>
        <script src="{{url('libs/datatables.net-buttons/js/buttons.colVis.min.js')}}"></script>
        <!-- Responsive examples -->
        <script src="{{url('libs/datatables.net-responsive/js/dataTables.responsive.min.js')}}"></script>
        <script src="{{url('libs/datatables.net-responsive-bs4/js/responsive.bootstrap4.min.js')}}"></script>
        
        <!-- Datatable init js -->
        <script src="{{url('js/pages/datatables.init.js')}}"></script>
    
        <script src="{{url('libs/sweetalert2/sweetalert2.min.js')}}"></script>
        <script src="{{url("libs/parsleyjs/parsley.min.js")}}"></script>
        <script src="{{url('js/pages/form-validation.init.js')}}"></script>
        <script src="{{url('js/custom/auction-item.js')}}"></script> 
        <script src="{{url('libs/summernote/summernote-bs4.min.js')}}"></script>
        <script src="{{url('js/pages/email-summernote.init.js')}}"></script>
       <script>

        $('.delete').click(function() {
            var uid = $(this).data('id');
            var tr = $(this).closest('tr');
            Swal.fire({
              title: 'Are you sure?',
              text: "You won't be able to revert this!",
              type: "warning",
              showCancelButton: true,
              confirmButtonColor: '#3085d6',
              cancelButtonColor: '#d33',
              confirmButtonText: 'Yes, delete it!'
            }).then((result) => {
              if (result.value) {
                $.ajaxSetup({
                  headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                  }
                });
                $.ajax({
                       method: 'post',
                       data: {'_method': 'DELETE'},
                       url: '{{url('e-auction/')}}/' + uid,
                       beforeSend: function() { 
                           $("#loading").show();
                       },
                   }).done(function(responce) { 
                  $("#loading").hide();
                  if (responce.status) {
                    var table = $('#datatable-buttons').DataTable();
                    table.row(tr).remove().draw();
                    Swal.fire("Deleted!", responce.success, "success"); 
                    
                  } else {
                    swal.fire("Cancelled", responce.error, "error");
                  }
                }).fail(function(responce) { 
                    $("#loading").hide();
                  swal.fire("Cancelled", responce.statusText, "error");
                });
              }
            })
          });
   
</script>
@endsection