@extends('layouts.vendor.app')

@section('title',translate('messages.food_list'))

@push('css_or_js')
    <meta name="csrf-token" content="{{ csrf_token() }}">
@endpush

@section('content')
    <div class="content container-fluid">
        <!-- Page Header -->
        <div class="page-header d-flex align-items-center gap-2 flex-wrap justify-content-between">
            <div class="mb-0">
                <h1 class="page-header-title"><i class="tio-filter-list"></i> {{translate('messages.food_list')}}<span class="badge badge-soft-dark ml-2" id="itemCount">{{$foods->total()}}</span></h1>
            </div>
            <div class="">
                <div class="row g-2 align-items-center justify-content-sm-end">

                    <div class="col-auto">
                        <a href="{{route('vendor.food.stockOutList')}}" class="btn max-sm-12 badge-soft-danger font-medium py-2 fs-12 w-100"> {{translate('messages.Out of Stock Foods')}}</a>
                    </div>
                    <div class="col-auto">
                        <a href="{{route('vendor.food.add-new')}}" class="btn max-sm-12 fs-12 py-2 px-3 btn--primary w-100"><i
                                    class="tio-add-circle"></i> {{translate('messages.add_new_food')}}</a>
                    </div>

                </div>
            </div>
        </div>
        <!-- End Page Header -->
        <!-- Card -->
        <div class="card">
            <!-- Header -->
            <div class="card-header flex-wrap gap-2 border-0">
                <div class="search--button-wrapper search--button-area justify-content-start">
                    <form action="{{route('vendor.food.list')}}" method="get">
                        <!-- Search -->
                        <div class="input-group input--group border rounded">
                            <input id="datatableSearch" type="search" name="search" class="form-control border-0"
                                   placeholder="{{ translate('messages.Ex : Search Food Name') }}" value="{{ request('search') }}">
                            <button type="submit" class="btn btn--reset py-1 px-2">
                                <i class="tio-search"></i>
                            </button>
                        </div>
                    <!-- End Search -->
                    </form>
                </div>
                @php($filtered = request()->has('types') || request()->has('min_price') || request()->has('max_price') || request()->has('status') || request()->has('category_ids'))
                <div class="d-flex align-items-center gap-lg-3 gap-2 flex-wrap">
                    <div class="hs-unfold">
                        <a id="filterButton"
                           class="btn min-w-100px justify-content-center font-medium btn-sm offcanvas-trigger {{ $filtered ? 'filter-active' : 'btn-outline-primary' }}"
                           data-target="#Food-list_filter"
                           href="javascript:">
                            <i class="tio-tune-horizontal mr-1 fs-16"></i>
                            {{ translate('Filter') }}
                            @if($filtered)
                                <span class="filter-dot"></span>
                            @endif
                        </a>

                    </div>
                    <div class="hs-unfold">
                        <a class="js-hs-unfold-invoker btn btn-sm btn--reset dropdown-toggle min-height-40" href="javascript:;"
                            data-hs-unfold-options='{
                                    "target": "#usersExportDropdown",
                                    "type": "css-animation"
                                }'>
                            <i class="tio-download-from-cloud mr-1 fs-16"></i> {{ translate('messages.export') }}
                        </a>

                        <div id="usersExportDropdown"
                            class="hs-unfold-content dropdown-unfold dropdown-menu dropdown-menu-sm-right">

                            <span class="dropdown-header">{{ translate('messages.download_options') }}</span>
                            <a id="export-excel" class="dropdown-item" href="{{ route('vendor.food.export', ['type' => 'excel', request()->getQueryString()]) }}">
                                <img class="avatar avatar-xss avatar-4by3 mr-2"
                                    src="{{ dynamicAsset('public/assets/admin') }}/svg/components/excel.svg"
                                    alt="Image Description">
                                {{ translate('messages.excel') }}
                            </a>
                            <a id="export-csv" class="dropdown-item" href="{{ route('vendor.food.export', ['type' => 'csv', request()->getQueryString()]) }}">
                                <img class="avatar avatar-xss avatar-4by3 mr-2"
                                    src="{{ dynamicAsset('public/assets/admin') }}/svg/components/placeholder-csv-format.svg"
                                    alt="Image Description">
                                .{{ translate('messages.csv') }}
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- End Header -->

            <!-- Table -->
            <div class="table-responsive datatable-custom pt-0">
                <table id="datatable" class="table table-borderless table-thead-borderedless table-nowrap table-align-middle card-table"
                    data-hs-datatables-options='{
                        "columnDefs": [{
                            "targets": [],
                            "width": "5%",
                            "orderable": false
                        }],
                        "order": [],
                        "info": {
                        "totalQty": "#datatableWithPaginationInfoTotalQty"
                        },

                        "entries": "#datatableEntries",
                        "isResponsive": false,
                        "isShowPaging": false,
                            "paging":false
                    }'>
                    <thead class="global-bg-box">
                        <tr>
                            <th>{{ translate('messages.sl') }}</th>
                            <th class="w-20p">{{translate('messages.name')}}</th>
                            <th class="w-20p">{{translate('messages.category')}}</th>
                            <th class="text-center">{{translate('messages.price')}}</th>
                            @if ($productWiseTax)
                                <th  class="text-center">{{ translate('messages.Vat/Tax') }}</th>
                            @endif
                            <th class="text-center">{{translate('messages.Recommended')}}</th>
                            <th class="text-center">{{translate('messages.status')}}</th>
                            <th class="text-center">{{translate('messages.action')}}</th>
                        </tr>
                    </thead>

                    <tbody id="set-rows">
                    @foreach($foods as $key=>$food)
                    @php( $stock_out = null)

                        <tr>
                            <td>{{$key+$foods->firstItem()}}</td>
                            <td>
                                <a class="media align-items-center min-w-370" href="{{route('vendor.food.view',[$food['id']])}}">
                                    <img class="avatar avatar-lg mr-3 onerror-image" src="{{ $food['image_full_url'] }}"
                                         data-onerror-image="{{dynamicAsset('public/assets/admin/img/100x100/food-default-image.png')}}" alt="{{$food->name}} image">
                                    <div class="media-body align-items-center d-flex gap-1">
                                        <h5 class="text-hover-primary mb-0 text-wrap line-limit-2 max-w-215px">
                                            {{ucwords(Str::limit($food['name'],20,'...'))}}                                            
                                        </h5>
                                        <div class="d-inline-flex align-items-center gap-1">
                                            @if ($food->stock_type != 'unlimited' &&  $food->item_stock <= 0 )
                                            @php( $stock_out = true)

                                            <span class="badge badge-soft-warning badge-pill font-medium">{{ translate('Out Of Stock') }}</span><span class="input-label-secondary" data-toggle="tooltip" data-placement="right" data-original-title="{{translate('messages.Your_main_stock_is_out_of_stock.')}}"><i class="tio-info text-gray1 fs-16"></i></span>
                                            @else

                                                                                            @if($stock_out)
                                                {{-- <span class="badge badge-soft-warning badge-pill fz-10px font-medium">{{ translate('Out Of Stock') }}</span> --}}
                                                <span class="input-label-secondary" data-toggle="tooltip" data-placement="right" data-original-title="{{translate('messages.One_or_more_variations_are_out_of_stock.')}}"><i class="tio-info text-gray1 fs-14"></i></span>
                                                @endif
                                            @endif
                                        </div>
                                    </div>
                                </a>
                            </td>
                            <td>
                                {{ Str::limit(($food?->category?->parent ? $food?->category?->parent?->name : $food?->category?->name )  ?? translate('messages.uncategorize')
                                , 20, '...') }}
                            </td>
                            <td>
                                <div class="text-right mx-auto mw-36px">
                                <!-- Static Symbol -->

                                <!-- Static Symbol -->
                                    {{app\CentralLogics\Helpers::format_currency($food['price'])}}
                                </div>
                            </td>

                            @if ($productWiseTax)
                                <td class="text-center">
                                    <span class="">
                                        @forelse ($food?->taxVats?->pluck('tax.name', 'tax.tax_rate')->toArray() as $key => $tax)
                                            <span> {{ $tax }} : <span class="font-bold">
                                                    ({{ $key }}%)
                                                </span> </span>
                                            <br>
                                        @empty
                                            <span> {{ translate('messages.N/A') }} </span>
                                        @endforelse
                                    </span>
                                </td>
                            @endif

                            <td>
                                <div class="d-flex">
                                    <div class="mx-auto">
                                        <label class="toggle-switch toggle-switch-sm mr-2"  data-toggle="tooltip" data-placement="top" title="{{ translate('messages.Recommend_to_customers') }}" for="stocksCheckbox{{$food->id}}">
                                            <input type="checkbox" data-url="{{route('vendor.food.recommended',[$food['id'],$food->recommended?0:1])}}" class="toggle-switch-input redirect-url" id="stocksCheckbox{{$food->id}}" {{$food->recommended?'checked':''}}>
                                            <span class="toggle-switch-label">
                                                <span class="toggle-switch-indicator"></span>
                                            </span>
                                        </label>
                                    </div>
                                </div>
                            </td>
                            <td>
                                <div class="d-flex">
                                    <div class="mx-auto">
                                        <label class="toggle-switch toggle-switch-sm mr-2" data-toggle="tooltip" data-placement="top" title="{{ translate('messages.Change_food_visibility_to_customers') }}" for="statusCheckbox{{$food->id}}">
                                            <input type="checkbox" data-url="{{route('vendor.food.status',[$food['id'],$food->status?0:1])}}" class="toggle-switch-input redirect-url" id="statusCheckbox{{$food->id}}" {{$food->status?'checked':''}}>
                                            <span class="toggle-switch-label">
                                                <span class="toggle-switch-indicator"></span>
                                            </span>
                                        </label>
                                    </div>
                                </div>
                            </td>
                            <td>
                                <div class="btn--container justify-content-center">

                                    <a class="btn action-btn btn--primary btn-outline-primary"
                                        href="{{route('vendor.food.edit',[$food['id']])}}" title="{{translate('messages.edit_food')}}"><i class="tio-edit"></i>
                                    </a>

                                    @if($stock_out)
                                        <a class="btn btn-sm btn--primary btn-outline-primary action-btn " href="#update-stock{{ $food['id'] }}" title="{{ translate('update_stock') }}" data-toggle="modal">
                                            <i class="tio-autorenew"></i>
                                        </a>
                                    @endif

                                    <a class="btn action-btn btn--danger btn-outline-danger form-alert" href="javascript:"
                                        data-id="food-{{$food['id']}}" data-message="{{ translate('Want to delete this item ?') }}" title="{{translate('messages.delete_food')}}"><i class="tio-delete-outlined"></i>
                                    </a>

                                    <form action="{{route('vendor.food.delete',[$food['id']])}}"
                                            method="post" id="food-{{$food['id']}}">
                                        @csrf @method('delete')
                                    </form>
                                </div>
                            </td>
                        </tr>
                         {{-- Stock Update Modal --}}
                         <div class="modal fade" id="update-stock{{ $food['id'] }}">
                            <div class="modal-dialog modal-dialog-centered max-w-540px">
                                <div class="modal-content">
                                    <div class="modal-header position-absolute top-0 right-0 px-2 pt-2 z-index-2">
                                        <div></div>
                                        <button type="button" data-dismiss="modal" class="btn p-0">
                                            <i class="tio-clear fs-24"></i>
                                        </button>
                                    </div>
                                    <div class="modal-body p-0 pt-4">
                                        <div class="table-rest-info mr-2 p-md-4 p-3 pt-0 align-items-start">
                                            <div class="thumb position-relative min-w-80">
                                                <img src="{{ $food['image_full_url'] }}" class="w-80px">
                                                @if ($food->veg == 1)
                                                <span class="badge badge-soft-success bg-white position-absolute top-0 left-0 m-1 rounded fs-10">{{ translate('Veg') }}</span>
                                                @else
                                                <span class="badge badge-soft-danger bg-white position-absolute top-0 left-0 m-1 rounded fs-10">{{ translate('Non_Veg') }}</span>
                                                @endif
                                            </div>
                                            <div class="info fs-12 text-body">
                                                <span class="d-block text-title fs-16 mb-1">
                                                    <span class="line-limit-1">
                                                        {{ ucwords($food['name']) }}
                                                    </span>
                                                </span>
                                                <span class="rating d-flex align-items-center gap-1 mb-1">
                                                    <i class="tio-star"></i>
                                                    <span class="text-title font-semibold">({{ round($food->avg_rating,2) }}/5)</span>
                                                    <span class="text-gray1">
                                                        ({{ $food->rating_count }}{{ $food->rating_count > 24 ? '+' : '' }})
                                                    </span>

                                                </span>
                                                <div class="fs-14 price-food-modal d-flex algin-items-center gap-1 flex-wrap">
                                                    <span class="gray-dark font-regular">{{ translate('Price') }} : </span> <span class="font-medium text-title">{{ \App\CentralLogics\Helpers::format_currency($food['price'])  }}</span> <span class="line mx-1 d-sm-block d-none"> </span> <span class="gray-dark font-regular">{{ translate('Discount') }} :</span> <span class="font-medium text-title"> {{ $food->discount_type == 'percent' ?  $food->discount . ' %' :  \App\CentralLogics\Helpers::format_currency($food['discount'])   }}</span>
                                                </div>
                                                                  <div>