@extends('layouts.basic')

@section('content')

<div class="container-fluid">
    <div class="page-title">
      <div class="row">
        <div class="col-6">
          <h3>Brand List </h3>
        </div>
        <div class="col-6">
          <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('home') }}">                                         <i data-feather="home"></i></a></li>
            <li class="breadcrumb-item">Masters</li>
            <li class="breadcrumb-item active">Brand</li>
          </ol>
        </div>
      </div>
    </div>
  </div>

<section class="content content-card">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <!-- /.card-header -->
                    <div class="card-body">
                       
                        <!-- <div class="row no-print">
                            <div class="col-12">
                                <button class="btn btn-success float-right add_modal" data-href="{{url('/brand/create')}}" >ADD</button>
                            </div>
                        </div> -->
                        <div class="row no-print align-items-center table-top-div">
                                <div class="col-lg-6">
                                    <div>
                                       <h6 class="table-headings">Brand List</h6>
                                    </div>
                                </div>
                                @can('brand-create')
                                <div class="col-lg-6">
                                   <div class="add-button">
                                        <button class="btn btn-secondary add_modal" data-href="{{url('/brand/create')}}" ><i class="fa fa-plus-circle"></i>&nbsp; ADD</button>
                                   </div>
                                </div>
                                @endcan
                            </div>
                        <br>
                      
                        <div class="tbale-responsive table-holder">
                        <table style="width: 100%;" id="example1" class="table table-bordered table-striped export-table">
                            <thead>
                                <tr class="table table-secondary">
                                    <th>S.NO</th>
                                    <th>Name</th>
                                    <th>Status</th>
                                    @can('brand-edit')
                                    <th>Action</th>
                                    @endcan
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($brands as $brand)
                                <tr>
                                    <td>{{$loop->iteration}}</td>
                                    <td>{{$brand->name}}</td>
                                    <td>

                                    @if ( $brand->status == 1 )
                                    <span  class="active-span">{{$brand->status == '1' ? 'Active' : 'Inactive'}}</span>
                                    @else
                                   
                                    <span class="inactive-span">{{$brand->status == '1' ? 'Active' : 'Inactive'}}</span>
                                    @endif


                                        {{-- <span class="active-span">{{$brand->status == '1' ? 'Active' : 'Inactive'}}</span> --}}
                                    </td>

                                    @can('brand-edit')
                                    <td>
                                        <button type="button" data-href="{{ url('/brand/'.$brand->id.'/edit') }}" class="edit_modal btn table-action-btn table-edit-btn" ><i class="fa fa-edit"></i></button>
                                        {{-- <button type="button" class="btn btn-danger btn-sm" onclick='deleteBrand({{$brand->id}}, "{{$brand->name}}", "{{$brand->status}}")'><i style="color: white;" class="fa fa-trash"></i></button> --}}
                                    </td>
                                    @endcan
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                        </div>

                    </div>
                    <!-- /.card-body -->
                </div>

                <!-- Add Modal -->
                <div class="modal fade" id="addModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                    <div class="modal-dialog modal-dialog-centered" role="document">


                    </div>
                </div>
                <!-- /.card -->
            </div>
            <!-- /.col -->
        </div>
        <!-- /.row -->
    </div>
</section>
@section('script')
@if(session('status'))
    @if(session('status')['success'])
        <script>
            iziToast.success({
                title: 'Success',
                message: "{{ session('status')['msg'] }}",
                position: 'topRight',
                timeout: 3000,
                onClosed: function() {
                    // Perform any additional actions after the toast is closed
                    // ...
                }
            });
        </script>
    @else
        <script>
            iziToast.error({
                title: 'Error',
                message: "{{ session('status')['msg'] }}",
                position: 'topRight',
                timeout: 3000,
                onClosed: function() {
                    // Perform any additional actions after the toast is closed
                    // ...
                }
            });
        </script>
    @endif
@endif

<script type="text/javascript">
    $(document).ready(function() {
        fetchTable('', '');
    });

    $('body').on('click','.edit_modal',function(){
        ajaxCall($(this).data('href'));
    });

    $('.add_modal').on('click',function(){

        ajaxCall($(this).data('href'));
    });

    $('body').on('click','.show_modal',function(){
        ajaxCall($(this).data('href'));
    });

    function fetchTable(sDate, eDate)
    {
        $("#example1").dataTable().fnDestroy();
        $('#example1').DataTable({
            ordering: false,
            searching: true,
            
        });
    }



    function ajaxCall(url) {
    $('.modal-dialog').load(url, function(response, status, xhr) {
        if (xhr.status == 401) {
            window.location.href = "login";
        } else {

            $('#addModal').modal('show');
            $('#addModal').modal({
                show: true,
                backdrop: 'static',
                keyboard: false
            });
        }
    });
}



function modelclose(){
$('#addModal').modal('hide');
}



</script>
@endsection
@endsection