@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",['category_id'=>$category_id])}}" class="btn btn-sm btn-neutral" >{{__('Create New Items')}}+</a><br><br>
                   </div>
               </div>
                <div class="card">

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

                            <div class="collapse" id="collapseExample">
                            <div class="card card-body">
                                @if(isset($branche_id) && !empty($branche_id))
                                   <form method="POST" action="{{route('vendor.addCategory.store')}}"  enctype="multipart/form-data">
                                        @csrf
                                        <input type="hidden" name="storeId" value="{{$branche_id}}">
                                        <div class="row">
                                       <div class="col-lg-6">
                                                                <div class="form-group">
                                                                <label class="form-control-label" for="input-username" >{{__('English Main Category Name')}} </label>
                                                                <input type="text" name="CategoryName"  required class="form-control" >
                                                                </div>
                                                                </div>
                                                                    <div class="col-lg-6">
                                                                <div class="form-group">
                                                                <label class="form-control-label" for="input-username" >{{__('Arabic Main Category Name')}}</label>
                                                                <input type="text" name="CategoryNamear"  required class="form-control" >
                                                                </div>
                                                                </div>
                                        </div>

                        </form>
                     @endif

                </div>
            </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="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.items.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>
                </div>
            </div>
        </div>
        <!-- Dark table -->
@endsection