@extends('vendor.header.header')
@section('content')

    <div class="header bg-primary pb-6  pt-5">
        <div class="container-fluid">
            <div class="header-body">
                <div class="row align-items-center py-4">
                    <div class="col-lg-6 col-7">
                        <h6 class="h2 text-white d-inline-block mb-0">{{__('Items')}}</h6>
                        <nav aria-label="breadcrumb" class="d-none d-md-inline-block ml-md-4">
                            <ol class="breadcrumb breadcrumb-links breadcrumb-dark">
                                <li class="breadcrumb-item"><a href="#"><i class="fas fa-home"></i></a></li>
                                <li class="breadcrumb-item"><a href="/">{{__('Dashboard')}}</a></li>
                                <li class="breadcrumb-item active" aria-current="page">{{__('items table')}}</li>
                            </ol>
                        </nav>
                    </div><br>
                </div>
            </div>
        </div>
    </div>
    <div class="container-fluid mt--6">
        <div class="row">
            <div class="col">
                <a href="{{route("vendor.item.create")}}" class="btn btn-sm btn-neutral" >{{__('Create New Items')}}+</a><br><br>
                </div>
            </div>
                <div class="card">
                    <!-- Card header -->
                    <div class="card-header border-0">
                        <h3 class="mb-0 mb-2">{{__('items table')}}</h3>
                        <input class="form-control" id="myInput" type="text" placeholder="Search..">
                    </div>
                    <!-- Light table -->
                    <div class="table-responsive">
                        <table class="table align-items-center table-flush">
                            <thead class="thead-light">
                            <tr >
                                <th scope="col" class="sort" data-sort="budget">{{__('Item Image')}}</th>
                                <th scope="col" class="sort" data-sort="name">{{__('item name')}} </th>


                                <th scope="col" class="sort" data-sort="status">{{__('Price')}}</th>
{{--                                <th scope="col" class="sort" data-sort="status">{{__('quantity')}}</th>--}}

                                <th scope="col" class="sort" data-sort="status">{{__('Status')}}</th>
                                <th scope="col" class="sort" data-sort="status">{{__('Rate')}}</th>
                                <th scope="col" class="sort" data-sort="status">{{__('Description')}}</th>
                            <th scope="col" class="sort" data-sort="status">{{__('Control')}}</th>

                                <th scope="col" class="sort" data-sort="completion">{{__('Action')}}</th>
                                <th scope="col"></th>
                            </tr>
                            </thead>
                            <tbody class="list" id="myTable">
                            @foreach($items as $item)
                                <tr>
                                    <td><img src="{{$item->item_image}}" width="75" alt=""></td>
                                      <td>{{$item->lang->translate_title_ar}}</td>

                                    <td>{{$item->price}}</td>
{{--                                    <td>{{$item->quantity}}</td>--}}
                                    <td>
                                        <span class="badge badge-dot mr-4">
                                            @if($item->status == 0)
                                                <i class="bg-warning"></i>
                                            @elseif($item->status == 1)
                                                <i class="bg-success"></i>
                                            @endif
                                            <span class="status">
                                                @if($item->status == 0)
                                                    InActive
                                                @elseif($item->status == 1)
                                                    Active
                                                @endif
                                            </span>
                                        </span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <span class="completion mr-2">{{$item['Rate']}}</span>
                                            <div>
                                                <div class="progress">
                                                    <div class="progress-bar bg-warning" role="progressbar" aria-valuenow={{$item->Rate}} aria-valuemin="0" aria-valuemax="5" style="width: {{$item->Rate *2*10}}%;"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                    <td scope="row" class="overFloweEllipsis" data-placement="top" title="{{$item->Description}}">
                                        {{$item->Description}}
                                    </td>
{{--                                 <td><a href="{{route("vendor.addons.add_ons",$item['id'])}}" class="btn btn-primary">{{__('Add Ons')}}</a></td>--}}

                                    <td id="ignorStyle" >
                                        <form method="GET" class="makeITinline" action="{{route("vendor.item.edit", $item->id)}}">
                                            <button class="btn btn-outline-primary" id="updateCat"  ><i class="fas fa-pencil-alt"></i></button>
                                        </form>
                                        <button type="button" class="btn btn-outline-default" data-toggle="modal" data-target="#exampleModal{{$item->id}}">
                                            <i class="fas fa-eye fa-lg"></i>
                                        </button>
                                        <!-- Modal -->
                                        <div class="modal fade" id="exampleModal{{$item->id}}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                            <div class="modal-dialog">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title" id="exampleModalLabel">{{__('Item Description')}}</h5>
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <div class="col-sm-12  mb-3">
                                                            <img src={{$item->item_image}} width="100%" />
                                                        </div>
                                                        <div class="col-sm-12">
                                                            <div class="form-group form-group-default">
                                                                <label>{{__('Item Name')}} :  <span class="bold">{{$item->lang->translate_title_ar}}</span></label>
                                                            </div>
                                                        </div>
                                                        <div class="col-sm-12">
                                                            <div class="form-group form-group-default">
                                                                <label>{{__('Item price')}} : <span class="bold"> {{$item->price}}</span></label>

                                                            </div>
                                                        </div>
{{--                                                        <div class="col-sm-12">--}}
{{--                                                            <div class="form-group form-group-default">--}}
{{--                                                                <label>{{__('Item quantity')}} :  <span class="bold"> {{$item->quantity}}</span></label>--}}

{{--                                                            </div>--}}
{{--                                                        </div>--}}
                                                        <div class="col-sm-12">
                                                            <div class="form-group form-group-default">
                                                                <label>Description</label>
                                                                <textarea wrap="virtual" class="form-control" rows="5" name="Description" readonly="">{{$item->Description}}</textarea>
                                                            </div>
                                                        </div>
{{--                                                        @if(isset($item['topping']) && !empty($item['topping']))--}}
{{--                                                            <div class="col-sm-12">--}}
{{--                                                                <div class="form-group form-group-default" style="max-height: 200px;overflow-y: scroll;">--}}
{{--                                                                    <label>Topping</label>--}}
{{--                                                                    @foreach($item['topping'] as  $toppingItem)--}}
{{--                                                                        <div class="form-group form-group-default">--}}
{{--                                                                            <div class="col-sm-3"><label>Category Topping : <span class="bold">{{$toppingItem['CategoryTopping']}}</span></label></div>--}}
{{--                                                                            <div class="col-sm-3"><label>Topping Name : <span class="bold">{{$toppingItem['name_en']}}</span></label></div>--}}
{{--                                                                            <div class="col-sm-3"><label>Topping price : <span class="bold">{{$toppingItem['price']}}</span></label></div>--}}
{{--                                                                        </div>--}}
{{--                                                                    @endforeach--}}
{{--                                                                </div>--}}
{{--                                                            </div>--}}
{{--                                                        @endif--}}
                                                    </div>
                                                    <div class="modal-footer">
                                                        <button type="button" class="btn btn-secondary" data-dismiss="modal">{{__('Close')}}</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <form action="{{route("vendor.item.destroy", $item->id)}}" method="post" id="delete{{$item->id}}" style="display: none" data-swal-title="{{__("Delete Items")}}" data-swal-text="{{__("Are You Sure To Delete This Item?")}}" data-yes="{{__("Yes")}}" data-no="{{__("No")}}" data-success-msg="{{__("the item has been deleted successfully")}}">@csrf @method("delete")</form>
                                        <span href="#" class="control-link btn btn-outline-danger remove form-confirm" data-form-id="#delete{{$item->id}}"><i class="far fa-trash-alt"></i></span>
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                        <div class="ml-3">{!! $items->links() !!}</div>
                    </div>
                </div>
            </div>
   
        <!-- Dark table -->
@endsection