@extends('front.app')

@section('meta')
    <x-meta :meta="$meta"/>
@stop
@push('css')
    <style>
        .delivery-wrapper.disabled {
            display: none;
        }
    </style>
@endpush

@section('container')
    <div class="page-content">
        <div class="breadcrumbs-wrapper">
            <div class="container">
                {{ Breadcrumbs::render('cart-page') }}
            </div>
        </div>

        @if($current_time >= $start_time_no_work || $current_time <= $end_time_no_work)
            <div class="info-page">
                <div class="container">
                    <div class="info-page-inner">
                        <div class="info-page-icon">
                            <img src="{{asset('front-assets/img/icons/empty.svg')}}" alt="empty">
                        </div>
                        <div class="info-page-title">{{ShowLabelById(96)}}</div>
                        <div class="info-page-text">
                            <p>{{ str_replace(['{start_time}', '{end_time}'], [showSettingBodyByAlias('start-time-no-work'), showSettingBodyByAlias('end-time-no-work')], ShowLabelById(97)) }}</p>
                            <p>{{ShowLabelById(98)}}</p>
                        </div>
                    </div>
                </div>
            </div>
        @elseif($basket->isNotEmpty())
            <div class="basket">
                <div class="container">
                    <div class="page-heading">
                        <h1>{{ShowLabelById(11)}}</h1>
                    </div>
                    <div class="page-block">
                        <div class="basket-head">
                            <div class="basket-name">{{ShowLabelById(12)}}</div>
                            <div class="basket-head-content">
                                <div class="basket-info">&nbsp;</div>
                                <div class="basket-price">{{ShowLabelById(13)}}</div>
                                <div class="basket-quantity">{{ShowLabelById(14)}}</div>
                                <div class="basket-total">{{ShowLabelById(15)}}</div>
                            </div>
                        </div>
                        <div class="basket-list">
                            @foreach($basket as $one_item)
                                <div class="basket-item">
                                    <div class="basket-item-img">
                                        <img src="{{ $goods_items[$one_item->id]->webp }}"
                                             alt="{{$goods_items[$one_item->id]->name}}">
                                    </div>
                                    <div class="basket-item-content">
                                        <div class="basket-item-info">
                                            <div class="basket-item-name">{{$goods_items[$one_item->id]->name}}</div>
                                            <div
                                                class="basket-item-desc">{{$goods_items[$one_item->id]->grammage}}</div>
                                            @if(isset($goods_params_name[$one_item->id]) && !empty($goods_params_name[$one_item->id]) && count($goods_params_name[$one_item->id]))
                                                <div class="basket-item-desc" style="font-size: 16px;">
                                                    {{ShowLabelById(90)}}:
                                                    @foreach($goods_params_name[$one_item->id] as $one_param_name)
                                                        {{ $one_param_name ?? '' }}{{ !$loop->last ? ',' : '' }}
                                                    @endforeach
                                                </div>
                                            @endif
                                        </div>
                                        <div
                                            class="basket-item-price">{{ $one_item->goods_price ?? ''}} {{ShowLabelById(16)}}  </div>
                                        <div class="basket-item-quantity">
                                            <div class="product-quantity">
                                                <button type="button" class="count-minus count-minus-change"
                                                        onclick="this.parentNode.querySelector('input[type=number]').value--">
                                                    <svg>
                                                        <use
                                                            xlink:href="{{asset('front-assets/svg/sprite.svg#minus')}}"></use>
                                                    </svg>
                                                </button>
                                                <input type="number" class="basket-quantity-change count_item"
                                                       data-page="cart" value="{{ $one_item->items_count }}"
                                                       data-goods-item-id="{{ $goods_items[$one_item->id]->id}}"
                                                       data-basket-item-id="{{ $one_item->id ?? '' }}">
                                                <button type="button" class="count-plus count-plus-change"
                                                        onclick="this.parentNode.querySelector('input[type=number]').value++">
                                                    <svg>
                                                        <use
                                                            xlink:href="{{asset('front-assets/svg/sprite.svg#plus')}}"></use>
                                                    </svg>
                                                </button>
                                            </div>
                                        </div>
                                        <div class="basket-item-total">
                                            <span
                                                class="total_item_price">{{getDefaultPriceFormat($vars['total_item_price'][$one_item->id])}}</span> {{ShowLabelById(16)}}
                                        </div>
                                        <div class="basket-item-remove">
                                            <a href="javascript:;" class="basket-item-remove-btn"
                                               onclick="deleteProductFromBasket(this,event)"
                                               data-goods-item-id="{{$one_item->goods_item_id}}"
                                               data-basket-item-id="{{ $one_item->id ?? '' }}">
                                                <svg>
                                                    <use
                                                        xlink:href="{{asset('front-assets/svg/sprite.svg#close')}}"></use>
                                                </svg>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                        <div class="basket-limit">
                            <div class="basket-text">
                                <div class="basket-row">
                                    <p>{{ShowLabelById(14)}}</p>
                                    <p>
                                        <span class="basket_count">{{$basket->count()}}</span> {{ShowLabelById(17)}}.
                                    </p>
                                </div>
                                <div class="basket-row">
                                    <p>{{ShowLabelById(18)}}</p>
                                    <p>
                                        <span class="total_price">{{$vars['total_price']}}</span> {{ShowLabelById(16)}}
                                    </p>
                                </div>
                                @if($delivery_on)
                                    <div class="basket-row basket-row--highlight">
                                        <p>{{ShowLabelById(19)}}</p>
                                        <p>
                                            <span
                                                class="for_free_delivery">{{$vars['for_free_delivery']}}</span> {{ShowLabelById(16)}}
                                        </p>
                                    </div>
                                @endif
                            </div>
                        </div>
                    </div>

                    <form action="{{route('createOrder')}}" id="new_order" method="POST" enctype="multipart/form-data">
                        @csrf
                        <div class="page-block">
                            <div class="basket-limit">
                                <div class="basket-form">
                                    <div class="basket-heading h3">{{ShowLabelById(20)}}</div>
                                    <div class="basket-desc">
                                        <p>{{ShowLabelById(21)}}</p>
                                    </div>
                                    <div class="basket-form-title h4">{{ShowLabelById(22)}}</div>
                                    @if($delivery_on)
                                        <div class="basket-form-text">
                                            <p>{{ShowLabelById(23)}}</p>
                                        </div>
                                    @endif
                                    <div class="form-row">
                                        <div class="form-item">
                                            <label for="name">{{ShowLabelById(24)}}*</label>
                                            <input type="text" id="name" name="name">
                                        </div>
                                        <div class="form-item">
                                            <label for="lastname">{{ShowLabelById(25)}}*</label>
                                            <input type="text" id="lastname" name="lastname">
                                        </div>
                                        <div class="form-item">
                                            <label for="phone">{{ShowLabelById(26)}}*</label>
                                            <input type="number" id="phone" name="phone">
                                        </div>
                                        <div class="form-item">
                                            <label for="email">Email*</label>
                                            <input type="email" id="email" name="email">
                                        </div>
                                    </div>

                                    @if($delivery_on)
                                        <div class="basket-form-title h4">{{ShowLabelById(27)}}</div>
                                        <div class="form-radio form-radio--tabs">
                                            <ul>
                                                <li>
                                                    <input class="change-delivery-method" type="radio" id="delivery"
                                                           name="delivery_method" value="delivery" checked>
                                                    <label for="delivery">{{ShowLabelById(28)}}</label>
                                                </li>
                                                <li>
                                                    <input class="change-delivery-method" type="radio" id="pickup"
                                                           name="delivery_method" value="pickup" data-id="pickup-type">
                                                    <label for="pickup">{{ShowLabelById(29)}}</label>
                                                </li>
                                            </ul>
                                        </div>
                                    @endif
                                    <div class="delivery-wrapper">
                                        @if($delivery_on)
                                            <div class="form-label">{{ShowLabelById(30)}}*</div>
                                            <div class="form-row">
                                                @if($delivery_sectors->isNotEmpty())
                                                    <div class="form-item">
                                                        <label for="area" class="sr-only">{{ShowLabelById(31)}}</label>
                                                        <select name="area" id="area" class="select_area">
                                                            <option value="">{{ShowLabelById(71)}}</option>
                                                            @foreach($delivery_sectors as $delivery_sector)
                                                                <option
                                                                    value="{{$delivery_sector->id}}">{{$delivery_sector->name}}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                                @endif
                                                <div class="form-item">
                                                    <label for="street" class="sr-only">{{ShowLabelById(32)}}</label>
                                                    <input type="text" id="street" name="street"
                                                           placeholder="{{ShowLabelById(32)}}">
                                                </div>

                                                <div class="form-item">
                                                    <label for="home" class="sr-only">{{ShowLabelById(33)}}</label>
                                                    <input type="text" id="home" name="home"
                                                           placeholder="{{ShowLabelById(33)}}">
                                                </div>

                                                <div class="form-item">
                                                    <label for="apartment" class="sr-only">{{ShowLabelById(34)}}</label>
                                                    <input type="text" id="apartment" name="apartment"
                                                           placeholder="{{ShowLabelById(34)}}">
                                                </div>
                                                <div class="form-item">
                                                    <label for="entrance" class="sr-only">{{ShowLabelById(35)}}</label>
                                                    <input type="text" id="entrance" name="entrance"
                                                           placeholder="{{ShowLabelById(35)}}">
                                                </div>
                                                <div class="form-item">
                                                    <label for="floor" class="sr-only">{{ShowLabelById(36)}}</label>
                                                    <input type="text" id="floor" name="floor"
                                                           placeholder="{{ShowLabelById(36)}}">
                                                </div>
                                            </div>
                                            <div class="form-item">
                                                <label for="comment">{{ShowLabelById(37)}}</label>
                                                <textarea name="comment" id="comment"></textarea>
                                            </div>
                                        @endif
                                        <div class="basket-tab-wrapper">
                                            <button type="button" class="basket-tab">{{ShowLabelById(38)}}</button>
                                            <div class="basket-tab-text" style="padding: 0 1.6rem 1rem">
                                                <p>
                                                    <b>
                                                        {{str_replace('{price}',showSettingBodyByAlias('for-free-delivery'),ShowLabelById(39))}}
                                                    </b>
                                                </p>

                                                <p>
                                                    <b>
                                                        {{str_replace(['{start}','{end}'],[$receiving_start,$receiving_end],ShowLabelById(40))}}
                                                    </b>
                                                </p>
                                            </div>

                                            <div class="basket-tab-content">
                                                <p><b>{{ShowLabelById(41)}}</b></p>
                                                @if($delivery_sectors->isNotEmpty())
                                                    @foreach($delivery_sectors as $delivery_sector)
                                                        <p style="color: #E5E5E6">{{$delivery_sector->name}}
                                                            - {{$delivery_sector->short_descr}} {{ShowLabelById(16)}}</p>
                                                    @endforeach
                                                @endif
                                            </div>
                                        </div>
                                    </div>

                                    @if($locations_for_pickup && $locations_for_pickup->childrenFrontLocations->isNotEmpty())
                                        <div id="pickup-type" class="hidden-form">
                                           {{-- <div class="form-label">Adresă*</div>--}}
                                            <div class="form-item">
                                                <label for="location_menu_id">{{ShowLabelById(93)}}*</label>
                                                <select name="location_menu_id" id="location_menu_id">
                                                    <option value="">{{ShowLabelById(94)}}</option>
                                                    @foreach($locations_for_pickup->childrenFrontLocations as $one_locations)
                                                        <option value="{{ $one_locations->id }}">{{ $one_locations->name }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                    @endif

                                    <div class="basket-form-title h4">{{ShowLabelById(42)}}</div>
                                    <div class="form-radio">
                                        <ul>
                                            <li>
                                                <input type="radio" id="cash" name="pay_method" value="cash" checked>
                                                <label for="cash">{{ShowLabelById(43)}}</label>
                                            </li>
                                            <li>
                                                <input type="radio" id="card" name="pay_method" value="card">
                                                <label for="card">{{ShowLabelById(44)}} </label>
                                            </li>
                                            <li>
                                                <input type="radio" id="online" name="pay_method" value="online">
                                                <label for="online">{{ShowLabelById(45)}}</label>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="google-policies">
                                        <p>{!! ShowLabelById(46) !!}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="page-block">
                            <div class="basket-limit">
                                <div class="basket-footer">
                                    <div class="basket-row">
                                        <p>{{ShowLabelById(14)}}</p>
                                        <p>
                                            <span class="basket_count">{{$basket->count()}}</span> {{ShowLabelById(17)}}.
                                        </p>
                                    </div>
                                    <div class="basket-row">
                                        <p>{{ShowLabelById(18)}}</p>
                                        <p>
                                            <span
                                                class="total_price">{{$vars['total_price']}}</span> {{ShowLabelById(16)}}
                                        </p>
                                    </div>
                                    <div class="basket-row">
                                        <p>{{ShowLabelById(47)}}</p>
                                        <p>
                                            <span
                                                class="delivery_price">{{$vars['delivery_price']}}</span> {{ShowLabelById(16)}}
                                        </p>
                                    </div>
                                    <div class="basket-footer-total">
                                        <div class="basket-row">
                                            <p>{{ShowLabelById(48)}}</p>
                                            <p><span
                                                    class="total_price_with_delivery">{{$total_price_with_delivery}}</span> {{ShowLabelById(16)}}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <div class="captcha">
                                    <input type="hidden" name="g-recaptcha-response" id="recaptcha-order-form">
                                </div>
                                <p class="aggreement">
                                    <label>
                                        <input id="agree" name="agree" type="checkbox">
                                        <span class="aggreement-checkbox"></span>
                                        {!! ShowLabelById(49) !!}
                                    </label>
                                </p>
                                <div class="form-submit">
                                    <button type="submit" class="button" onclick="newOrder(event,this)"
                                            data-form-id="new_order">{{ShowLabelById(50)}}</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        @else
            <div class="info-page">
                <div class="container">
                    <div class="info-page-inner">
                        <div class="info-page-icon">
                            <img src="{{asset('front-assets/img/icons/empty.svg')}}" alt="empty">
                        </div>
                        <div class="info-page-title">{{ShowLabelById(51)}}</div>
                        <div class="info-page-text">
                            <p> {{ShowLabelById(52)}} </p>
                        </div>
                        <div class="info-page-link">
                            <a href="{{route('/')}}">{{ShowLabelById(53)}}</a>
                        </div>
                    </div>
                </div>
            </div>
        @endif
    </div>
@stop

@push('js')
    <script>
        getRecaptcha('/cart', 'recaptcha-order-form');
    </script>
@endpush