@extends('front.app')
@section('meta')
    <x-meta :meta="$meta"/>
@stop

@section('container')

    <div class="page-content">

        <div class="breadcrumbs-wrapper">
            <div class="container">
                {{ Breadcrumbs::render('goods-item', $goods_subject, $goods_item) }}
            </div>
        </div>

        <div class="product-end">
            <div class="container">
                <div class="product-end-inner">
                    <div class="product-end-sliders">
                        @if($goods_item->oImages->isNotEmpty())
                            <div class="product-end-thumbs">
                                <div class="product-end-thumbs-inner">
                                    <div class="swiper">
                                        <div class="swiper-wrapper">
                                            @foreach($goods_item->oImages as $one_image)
                                                <div class="swiper-slide">
                                                    <img
                                                        src="{{ file_exists('upfiles/goods-items/s/' . showImg($one_image->img)) ? asset('upfiles/goods-items/s/'. showImg($one_image->img)) : asset('front-assets/img/no-image-goods-s.png') }}"
                                                        alt="{{ $goods_item->name ?? '' }} - thumbs image {{ $loop->iteration }}">
                                                </div>
                                            @endforeach
                                        </div>
                                    </div>
                                    <div class="product-end-nav-wrapper">
                                        <button type="button" class="product-end-nav product-end-nav--prev">
                                            <svg>
                                                <use
                                                    xlink:href="{{ asset('front-assets/svg/sprite.svg#arrow-right') }}"></use>
                                            </svg>
                                        </button>
                                        <button type="button" class="product-end-nav product-end-nav--next">
                                            <svg>
                                                <use
                                                    xlink:href="{{ asset('front-assets/svg/sprite.svg#arrow-right') }}"></use>
                                            </svg>
                                        </button>
                                    </div>
                                </div>
                            </div>
                            <div class="product-end-gallery">
                                <div class="swiper">
                                    <div class="swiper-wrapper">
                                        @foreach($goods_item->oImages as $one_image)
                                            <div class="swiper-slide">
                                                <a href="{{ file_exists('upfiles/goods-items/' . $one_image->img) ? asset('upfiles/goods-items/' . $one_image->img) : asset('front-assets/img/no-image-goods.png') }}"
                                                   data-fancybox="gallery">
                                                    <img
                                                        src="{{ file_exists('upfiles/goods-items/m/' . showImg($one_image->img)) ? asset('upfiles/goods-items/m/' . showImg($one_image->img)) : asset('front-assets/img/no-image-goods-m.png') }}"
                                                        alt="{{ $goods_item->name ?? '' }} - image {{ $loop->iteration }}">
                                                </a>
                                            </div>
                                        @endforeach
                                    </div>
                                </div>
                            </div>
                        @endif
                    </div>
                    <div class="product-end-content">
                        <h1 class="h2">{{ $goods_item->name ?? '' }}</h1>
                        <div class="product-end-info">
                            @if($goods_item->getBrand && $goods_item->getBrand->img)
                                <a href="{{ route('brands', $goods_item->getBrand->alias) }}" class="product-end-logo">
                                    <img src="{{ $goods_item->getBrand->img }}" alt="{{ $goods_item->getBrand->name }}">
                                </a>
                            @endif
                            <div class="product-end-id">
                                <p>{{ ShowLabelById(112) }}: <span>{{ $goods_item->one_c_code ?? '' }}</span></p>
                            </div>
                            <div class="product-end-status">
                                @if($goods_item->in_stoc == 1)
                                    <img src="{{ asset('front-assets/img/icons/check.svg') }}" alt="Available">
                                    <p>{{ ShowLabelById(113) }}</p>
                                @else
                                    <img src="{{ asset('front-assets/img/icons/stock.svg') }}" alt="Not available">
                                    <p style="color: rgba(70, 80, 97, .5);">{{ ShowLabelById(114) }}</p>
                                @endif
                            </div>
                        </div>
                        @if($goods_item->in_stoc == 1)
                            <div class="product-end-prices">{{--{{ getDefaultPriceFormat($one_goods->price_old) }}--}}
                                <span class="product-end-prices-current">{{ getDefaultPriceFormat($goods_item->price) }}
                                    {{ ShowLabelById(26) }}</span>
                                @if($goods_item->price_old > 0)
                                    <span
                                        class="product-end-prices-old">{{ getDefaultPriceFormat($goods_item->price_old) }}
                                        {{ ShowLabelById(26) }}</span>
                                    <span class="product-end-prices-discount">-{{ $goods_item->discountPercent() }}
                                        %</span>
                                @endif
                            </div>
                            <div class="product-end-cta">
                                <div class="product-quantity">
                                    <button type="button" class="count-minus"
                                            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" value="1" min="1" class="add-to-basket-count" {{--id="goods-id-{{ $goods_item->id ?? '' }}"--}}>
                                    <button type="button" class="count-plus"
                                            onclick="this.parentNode.querySelector('input[type=number]').value++">
                                        <svg>
                                            <use xlink:href="{{ asset('front-assets/svg/sprite.svg#plus') }}"></use>
                                        </svg>
                                    </button>
                                </div>
                                <a href="javascript:;" class="product-end-add button{{ (app('global_age_verification') && $goods_item->subject_age == 1) || $goods_item->subject_age == 0 ? ' product-end-add-to-basket' : '' }}{{ !app('global_age_verification') && $goods_item->subject_age == 1 ? ' age-verification' : '' }}" data-goods-item-id="{{ $goods_item->id ?? '' }}" {{ !app('global_age_verification') && $goods_item->subject_age == 1 ? 'data-item-type=goods' : '' }}>
                                    <svg>
                                        <use xlink:href="{{ asset('front-assets/svg/sprite.svg#cart') }}"></use>
                                    </svg>
                                    <span>{{ ShowLabelById(115) }}</span>
                                </a>
                                <a href="javascript:;"
                                   class="product-end-favorite add-to-wish{{ $goods_item->checkIfWishItemExist ? ' active' : '' }}"
                                   data-goods-item-id="{{ $goods_item->id ?? '' }}">
                                    <svg>
                                        <use xlink:href="{{ asset('front-assets/svg/sprite.svg#favorites') }}"></use>
                                        <use
                                            xlink:href="{{ asset('front-assets/svg/sprite.svg#favorites-active') }}"></use>
                                    </svg>
                                </a>
                            </div>
                            <div class="product-end-pickup">
                                <img src="{{ asset('front-assets/img/icons/delivery.svg') }}" alt="Delivery">
                                <p>{{ ShowLabelById(116) }}</p>
                            </div>
                        @endif
                        @if(!empty($social_media_call) && count($social_media_call))
                            <div class="product-end-socials">
                                <ul>
                                    @foreach($social_media_call as $one_item)
                                        <li>
                                            <a href="{{ $one_item->link ?? '' }}" target="_blank">
                                                <img
                                                    src="{{ $one_item->img ? asset('upfiles/social-media/'.$one_item->img) : asset('front-assets/img/no-image-xs.png') }}"
                                                    alt="{{ $one_item->name ?? '' }}">
                                            </a>
                                        </li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif
                    </div>
                </div>
                <div class="product-end-about">
                    <div class="product-end-tabs">
                        @if($goods_item->body)
                            <button type="button" class="product-end-tab active" onclick="openAbout(event, 'about-1')">
                                {{ ShowLabelById(117) }}
                            </button>
                        @endif
                        @if($goods_item->model || $goods_item->getBrand)
                            <button type="button" class="product-end-tab{{ !$goods_item->body ? ' active' : '' }}" onclick="openAbout(event, 'about-2')">
                                {{ ShowLabelById(118) }}
                            </button>
                        @endif
                    </div>
                    <div class="product-end-about-wrapper">
                        @if($goods_item->body)
                            <div id="about-1" class="product-end-about-content active">
                                <div class="common-text">
                                    {!! nl2br($goods_item->body) !!}
                                </div>
                            </div>
                        @endif
                        @if($goods_item->getBrand || $goods_item->model)
                            <div id="about-2" class="product-end-about-content{{ !$goods_item->body ? ' active' : '' }}">
                                <div class="product-end-characteristics">
                                    <ul>
                                        @if($goods_item->getBrand)
                                            <li>
                                                <p>{{ ShowLabelById(119) }}</p>
                                                <p><a href="{{ route('brands', $goods_item->getBrand->alias) }}">{{ $goods_item->getBrand->name }}</a></p>
                                            </li>
                                        @endif
                                        @if($goods_item->model)
                                            <li>
                                                <p>{{ ShowLabelById(122) }}</p>
                                                <p>{{ $goods_item->model }}</p>
                                            </li>
                                        @endif
                                    </ul>
                                </div>
                            </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>

        @if(!empty($similar_goods) && count($similar_goods))
            <div class="section goods-slider">
                <div class="container">
                    <div class="goods-slider-head">
                        <h2>{{ ShowLabelById(120) }}</h2>
                        <div class="goods-slider-nav">
                            <button type="button" class="slider-nav slider-nav--prev">
                                <svg>
                                    <use xlink:href="{{ asset('front-assets/svg/sprite.svg#arrow-right') }}"></use>
                                </svg>
                            </button>
                            <button type="button" class="slider-nav slider-nav--next">
                                <svg>
                                    <use xlink:href="{{ asset('front-assets/svg/sprite.svg#arrow-right') }}"></use>
                                </svg>
                            </button>
                        </div>
                    </div>
                    <div class="swiper">
                        <div class="swiper-wrapper">
                            @foreach($similar_goods as $one_goods)
                                <div class="swiper-slide">
                                    @include('front.templates.goods-template')
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        @endif

        @if(!empty($view_goods) && count($view_goods))
            <div class="section goods-slider">
                <div class="container">
                    <div class="goods-slider-head">
                        <h2>{{ ShowLabelById(121) }}</h2>
                        <div class="goods-slider-nav">
                            <button type="button" class="slider-nav slider-nav--prev">
                                <svg>
                                    <use xlink:href="{{ asset('front-assets/svg/sprite.svg#arrow-right') }}"></use>
                                </svg>
                            </button>
                            <button type="button" class="slider-nav slider-nav--next">
                                <svg>
                                    <use xlink:href="{{ asset('front-assets/svg/sprite.svg#arrow-right') }}"></use>
                                </svg>
                            </button>
                        </div>
                    </div>
                    <div class="swiper">
                        <div class="swiper-wrapper">
                            @foreach($view_goods as $one_goods)
                                <div class="swiper-slide">
                                    @include('front.templates.goods-template')
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        @endif
    </div>

@stop