mirror of https://github.com/4xmen/xshop.git
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
506 lines
28 KiB
PHTML
506 lines
28 KiB
PHTML
2 years ago
|
@extends('website.layout')
|
||
|
@section('title')
|
||
|
{{$pro->name}} -
|
||
|
@endsection
|
||
|
@section('body-class') bg-pinkk @endsection
|
||
|
@section('metas')
|
||
|
<meta name="product_id" content="{{$pro->id}}">
|
||
|
<meta name="product_name" content="{{$pro->name}}">
|
||
|
<meta property="og:image" content="{{$pro->imgurl()}}">
|
||
|
<meta name="product_price" content="{{$pro->getPurePrice()}}">
|
||
|
<meta name="product_old_price" content="{{$pro->getPurePrice()}}">
|
||
|
@if($pro->stock_quantity == 0)
|
||
|
<meta name="availability" content="outofstock">
|
||
|
@else
|
||
|
<meta name="availability" content="instock">
|
||
|
@endif
|
||
|
<meta name="guarantee" content="اصالت کالا">
|
||
|
@endsection
|
||
|
@section('content')
|
||
|
@php
|
||
|
$commentCount = $pro->comments()->count();
|
||
|
@endphp
|
||
|
{!! \App\Helpers\showBreadcrumb(\App\Helpers\makeProductBreadcrumb($pro,$cat)) !!}
|
||
|
<script type="application/ld+json">
|
||
|
{
|
||
|
"@context": "https://schema.org/",
|
||
|
"@type": "Product",
|
||
|
"name": "{{$pro->name}}",
|
||
|
"image": "{{$pro->thumbUrl()}}",
|
||
|
"description": "{{$pro->excerpt}}",
|
||
|
"brand": {
|
||
|
"@type": "Brand",
|
||
|
"name": "{{$cat->name}}"
|
||
|
},
|
||
|
"sku": "{{$cat->sku}}",
|
||
|
"offers": {
|
||
|
"@type": "AggregateOffer",
|
||
|
"url": "{{route('product',$pro->slug)}}",
|
||
|
"priceCurrency": "IRR",
|
||
|
"lowPrice": "{{$pro->getPrice()}}",
|
||
|
"offerCount": "{{$pro->stock_quantity}}"
|
||
|
},
|
||
|
"aggregateRating": {
|
||
|
"@type": "AggregateRating",
|
||
|
"ratingValue": "{{$pro->average_rating}}",
|
||
|
"ratingCount": "{{$pro->rating_count}}",
|
||
|
"reviewCount": "{{$commentCount}}"
|
||
|
},
|
||
|
"review": [@foreach($pro->comments()->where('status',1)->get() as $k => $c){
|
||
|
"@type": "Review",
|
||
|
"name": "Comment {{$pro->name}}",
|
||
|
"reviewBody": "{{$c->body}}",
|
||
|
"reviewRating": {
|
||
|
"@type": "Rating",
|
||
|
"ratingValue": "5"
|
||
|
},
|
||
|
"datePublished": "{{$c->created_at}}",
|
||
|
"author": {"@type": "Person", "name": "{{$c->name}}"}
|
||
|
}@if($k+2 < $commentCount),@endif
|
||
|
@endforeach
|
||
|
]
|
||
|
}
|
||
|
|
||
|
|
||
|
</script>
|
||
|
<div class="">
|
||
|
<section id="product">
|
||
|
<div class="container shadow corner">
|
||
|
<div aria-label="breadcrumb">
|
||
|
<ol class="breadcrumb">
|
||
|
<li class="breadcrumb-item">
|
||
|
<a href="{{route('welcome')}}">
|
||
|
{{config('app.name')}}
|
||
|
</a>
|
||
|
</li>
|
||
|
<li class="breadcrumb-item">
|
||
|
<a href="{{route('products')}}">محصولات</a>
|
||
|
</li>
|
||
|
@if ($cat->parent != null)
|
||
|
<li class="breadcrumb-item">
|
||
|
<a href="{{route('cat',$cat->parent->slug)}}">{{$cat->parent->name}}</a>
|
||
|
</li>
|
||
|
@endif
|
||
|
<li class="breadcrumb-item">
|
||
|
<a href="{{route('cat',$cat->slug)}}">{{$cat->name}}</a>
|
||
|
</li>
|
||
|
<li class="breadcrumb-item active" aria-current="page">
|
||
|
{{$pro->name}}
|
||
|
</li>
|
||
|
</ol>
|
||
|
</div>
|
||
|
<div class="row" style="background: #FFFFFF">
|
||
|
<div class="col-md-5 ">
|
||
|
|
||
|
{{-- <div class='zoom' id='ex1'>--}}
|
||
|
{{-- <img src='{{$pro->imgurl()}}' width='555' height='320' alt='Daisy on the Ohoopee'/>--}}
|
||
|
{{-- </div>--}}
|
||
|
|
||
|
<a href="images/image-1.jpg" data-lightbox="img-1" id="lightbx" data-title="{{$pro->title}}">
|
||
|
<img class="xzoom img-fluid" src="{{$pro->thumburl()}}" xoriginal="{{$pro->imgurl()}}"/>
|
||
|
</a>
|
||
|
<div class="xzoom-thumbs owl-carousel owl-theme" id="thumbs">
|
||
|
@foreach ($pro->getMedia() as $k => $media)
|
||
|
<a href="{{$media->getUrl('product-image')}}" class="mt-2 d-inline-block">
|
||
|
<img alt="{{$pro->title}}" class="xzoom-gallery" width="100"
|
||
|
src="{{$media->getUrl('product-thumb')}}">
|
||
|
</a>
|
||
|
@endforeach
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
<div class="col-md-7 detail">
|
||
|
<h1>
|
||
|
{{$pro->name}}
|
||
|
</h1>
|
||
|
<hr>
|
||
|
|
||
|
<div class="row">
|
||
|
<div class="col-md-8">
|
||
|
<h2>
|
||
|
اطلاعات محصول:
|
||
|
</h2>
|
||
|
<table class="table table-hover product-table" id="product-table">
|
||
|
<tr>
|
||
|
<th>
|
||
|
نام محصول
|
||
|
</th>
|
||
|
<td>
|
||
|
{{$pro->name}}
|
||
|
</td>
|
||
|
</tr>
|
||
|
<tr>
|
||
|
<th>
|
||
|
کد محصول
|
||
|
</th>
|
||
|
<td >
|
||
|
{{$pro->getCode()}}
|
||
|
</td>
|
||
|
</tr>
|
||
|
@if($pro->stock_quantity > 0)
|
||
|
<tr>
|
||
|
<th>
|
||
|
انتخاب سایز
|
||
|
</th>
|
||
|
<td id="size-pick">
|
||
|
|
||
|
</td>
|
||
|
</tr>
|
||
|
<tr>
|
||
|
<th>
|
||
|
انتخاب رنگ
|
||
|
</th>
|
||
|
<td>
|
||
|
<div class="color-pick">
|
||
|
|
||
|
<small style="color: gray">برای نمایش رنگ روی سایز دلخواه کلیک
|
||
|
کنید</small>
|
||
|
</div>
|
||
|
</td>
|
||
|
</tr>
|
||
|
|
||
|
|
||
|
<tr>
|
||
|
<th>
|
||
|
قیمت
|
||
|
</th>
|
||
|
<td class="main-price">
|
||
|
<b>
|
||
|
<span id="last-pricex">
|
||
|
{{$pro->getPrice()}}
|
||
|
</span>
|
||
|
{{config('app.currency_type')}}
|
||
|
</b>
|
||
|
</td>
|
||
|
</tr>
|
||
|
<tr>
|
||
|
<th style="vertical-align: middle">
|
||
|
تعداد
|
||
|
</th>
|
||
|
<td>
|
||
|
<div id="counting" class="text-muted float-start mt-2"></div>
|
||
|
<div class="product-count d-inline-block">
|
||
|
<div class="btn btn-info count-inc" style="padding: 2px 5px">
|
||
|
<i class="fa fa-plus"></i>
|
||
|
</div>
|
||
|
<input type="number" id="single-count" class="product-count" value="1" max="1">
|
||
|
<div class="btn btn-info count-dec" style="padding: 2px 5px">
|
||
|
<i class="fa fa-minus"></i>
|
||
|
</div>
|
||
|
</div>
|
||
|
</td>
|
||
|
</tr>
|
||
|
@endif
|
||
|
<tr>
|
||
|
<th>
|
||
|
جنس
|
||
|
</th>
|
||
|
<td>
|
||
|
<b>{!! \App\Helpers\showMetaValue('material',$pro->getMeta('material')) !!}</b>
|
||
|
</td>
|
||
|
</tr>
|
||
|
<tr>
|
||
|
<th>
|
||
|
امتیاز
|
||
|
</th>
|
||
|
<td>
|
||
|
<div class="star-rating js-star-rating" dir="ltr">
|
||
|
<input class="star-rating__input" type="radio" name="rating"
|
||
|
value="1"><i
|
||
|
class="star-rating__star"></i>
|
||
|
<input class="star-rating__input" type="radio" name="rating"
|
||
|
value="2"><i
|
||
|
class="star-rating__star"></i>
|
||
|
<input class="star-rating__input" type="radio" name="rating"
|
||
|
value="3"><i
|
||
|
class="star-rating__star"></i>
|
||
|
<input class="star-rating__input" type="radio" name="rating"
|
||
|
value="4"><i
|
||
|
class="star-rating__star"></i>
|
||
|
<input class="star-rating__input" type="radio" name="rating"
|
||
|
value="5"><i
|
||
|
class="star-rating__star"></i>
|
||
|
<div
|
||
|
class="current-rating current-rating--{{round($pro->average_rating)}} js-current-rating">
|
||
|
<i class="star-rating__star">AAA</i></div>
|
||
|
</div>
|
||
|
</td>
|
||
|
</tr>
|
||
|
</table>
|
||
|
<div class="row mt-3">
|
||
|
<div class="col">
|
||
|
<div class="box border-0" style="margin-top: -7px;">
|
||
|
<div class="fav @if($pro->isFav()) liked @endif" data-id="{{$pro->slug}}">
|
||
|
<i class="far fa-heart fa-3x"></i>
|
||
|
<i class="fa fa-heart fa-3x"></i>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
{{-- <div class="col">--}}
|
||
|
{{-- <a href="{{route('compare.add',$pro->slug)}}" class="btn btn-warning w-75"--}}
|
||
|
{{-- data-wow-delay="1.5s"--}}
|
||
|
{{-- data-wow-duration="2s">--}}
|
||
|
{{-- <i class="fa fa-compass"></i>--}}
|
||
|
{{-- --}}
|
||
|
{{-- مقایسه کالا--}}
|
||
|
{{-- </a>--}}
|
||
|
{{-- </div>--}}
|
||
|
@if($pro->stock_quantity > 0)
|
||
|
<div class="col">
|
||
|
<a href="{{route('card.addq',['',''])}}"
|
||
|
class="add-to-card-q btn btn-primary float-end">
|
||
|
<i class="icofont-shopping-cart"></i>
|
||
|
|
||
|
افزودن به سبد خرید
|
||
|
</a>
|
||
|
|
||
|
</div>
|
||
|
@else
|
||
|
<div class="col text-end">
|
||
|
<div class="text-muted">
|
||
|
ناموجود
|
||
|
</div>
|
||
|
</div>
|
||
|
@endif
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
<div class="col-md-4">
|
||
|
<div class="w-100">
|
||
|
<p class="alert mb-4 p-2 alert-danger">
|
||
|
به علت متفاوت بودن قواره تولیدی ها، سانت محصول حتما چک شود
|
||
|
</p>
|
||
|
<a class="alert pe-1 ps-1 alert-light sizeInfo" href="#my-tabs"
|
||
|
onclick="$(`[data-content='tab-gu']`).click();">
|
||
|
<img src="{{asset('images/mahi/size.png')}}" alt="">
|
||
|
<span>
|
||
|
راهنمای انتخاب سایز
|
||
|
</span>
|
||
|
</a>
|
||
|
<a class="alert pe-1 ps-1 alert-light sizeInfo mt-2" onclick="$(`[data-content='tab-analyze']`).click();" href="#my-tabs">
|
||
|
<img src="{{asset('images/mahi/list.svg')}}" alt="">
|
||
|
<span>
|
||
|
مشخصات محصول
|
||
|
</span>
|
||
|
</a>
|
||
|
@if(auth('customer')->user()->colleague??null)
|
||
|
<a class="alert pe-1 ps-1 alert-light sizeInfo mt-2" id="cp-deteail">
|
||
|
<img src="{{asset('images/mahi/size.png')}}" alt="">
|
||
|
<span>
|
||
|
کپی توضیحات
|
||
|
</span>
|
||
|
</a>
|
||
|
@endif
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
<div class="col-12">
|
||
|
<div class="row d-md-block d-none mt-4">
|
||
|
<ul class="trust d-md-flex justify-content-around align-items-center p-3">
|
||
|
<li>
|
||
|
<i class="icofont-shield icofont-2x"></i>
|
||
|
پرداخت مطمئن
|
||
|
</li>
|
||
|
<li>
|
||
|
<i class="icofont-diamond icofont-2x"></i>
|
||
|
اصالت محصول
|
||
|
</li>
|
||
|
<li>
|
||
|
<i class="icofont-rocket-alt-1 icofont-2x"></i>
|
||
|
ارسال سریع
|
||
|
</li>
|
||
|
<li>
|
||
|
<i class="icofont-support icofont-2x"></i>
|
||
|
پشتیبانی سریع
|
||
|
</li>
|
||
|
</ul>
|
||
|
</div>
|
||
|
<hr>
|
||
|
<div class="wow fadeInRight">
|
||
|
<h4 class="mt-3">
|
||
|
محصولات مشابه
|
||
|
</h4>
|
||
|
<div class="owl-carousel owl-sq">
|
||
|
@foreach ($cat->products()->where('stock_quantity','>', 0)->limit(10)->get() as $p)
|
||
|
<div class="item ">
|
||
|
@include('website.component.pro',['p' => $p])
|
||
|
</div>
|
||
|
@endforeach
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
<div class="col-12">
|
||
|
|
||
|
|
||
|
<ul class="tabs cl" id="my-tabs">
|
||
|
{{-- <li class="active lc" data-content="tab-detail">مشخصات فنی</li>--}}
|
||
|
<li class="lc active" data-content="tab-analyze">
|
||
|
مشخصات
|
||
|
</li>
|
||
|
<li class="lc" data-content="tab-gu">راهنمای سایز</li>
|
||
|
<li class="lc" data-content="tab-comment"> دیدگاه کاربران</li>
|
||
|
<li class="lc" data-content="tab-question"> پرسش و پاسخ</li>
|
||
|
{{-- <li class="lc" data-content="tab-chart">نمودار قیمت</li>--}}
|
||
|
</ul>
|
||
|
<div class="tab-container">
|
||
|
{{-- <div id="tab-detail" class="active">--}}
|
||
|
{{-- <table class="table table-bordered attribute ">--}}
|
||
|
{{-- @foreach($pro->getAllMeta() as $k => $meta)--}}
|
||
|
{{-- @if($k != 'color' && $k != 'warranty')--}}
|
||
|
{{-- <tr>--}}
|
||
|
{{-- <td>--}}
|
||
|
{{-- {{\App\Helpers\getPropLabel($k)}}--}}
|
||
|
{{-- </td>--}}
|
||
|
{{-- <td>--}}
|
||
|
{{-- {!! \App\Helpers\showMeta($k,$meta) !!}--}}
|
||
|
{{-- </td>--}}
|
||
|
{{-- </tr>--}}
|
||
|
{{-- @endif--}}
|
||
|
{{-- @endforeach--}}
|
||
|
{{-- </table>--}}
|
||
|
{{-- </div>--}}
|
||
|
<div id="tab-analyze" class="active">
|
||
|
<div class="content ">
|
||
|
{!! $pro->description !!}
|
||
|
</div>
|
||
|
</div>
|
||
|
<div id="tab-comment">
|
||
|
<!-- Contenedor Principal -->
|
||
|
<div class="comments-container">
|
||
|
<ul id="comments-list" class="comments-list">
|
||
|
@foreach($comments as $c)
|
||
|
@include('starter-kit::component.comment',['c'=>$c])
|
||
|
@endforeach
|
||
|
</ul>
|
||
|
{{$comments->links()}}
|
||
|
</div>
|
||
|
<div class="comments-container non-print">
|
||
|
<div class="alert" id="comment-form">
|
||
|
@include('starter-kit::component.err')
|
||
|
<h5>
|
||
|
ارسال دیدگاه
|
||
|
</h5>
|
||
|
<form class="xsumbmiter non-print" method="post" id="comment-form-body"
|
||
|
action="no-action">
|
||
|
<input type="hidden" id="smt"
|
||
|
value="{{route('n.comment.product',$pro->slug)}}">
|
||
|
@csrf
|
||
|
<input type="hidden" id="reply" name="parent" value="">
|
||
|
<div class="row mb-3">
|
||
|
<div class="col-md-12 mt-3">
|
||
|
<div class="form-group">
|
||
|
<label for="comment-message">
|
||
|
</label>
|
||
|
|
||
|
<textarea required="" minlength="10" id="comment-message"
|
||
|
name="body" class="form-control " placeholder="پیام"
|
||
|
rows="4"></textarea>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="col-md-6 mt-3">
|
||
|
<div class="form-group">
|
||
|
|
||
|
<input name="name" required="" minlength="2" type="text"
|
||
|
class="form-control " placeholder="نام" value=""
|
||
|
id="name">
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="col-md-6 mt-3">
|
||
|
<div class="form-group">
|
||
|
|
||
|
<input required="" name="email" id="email" type="email"
|
||
|
class="form-control " placeholder="ایمیل" value="">
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div class="col-md-12">
|
||
|
<label> </label>
|
||
|
<input name="" type="submit" class="btn btn-primary mt-2"
|
||
|
value="ارسال دیدگاه">
|
||
|
</div>
|
||
|
</div>
|
||
|
</form>
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
</div>
|
||
|
<div id="tab-question">
|
||
|
<ul class="list-group container-sm mt-3">
|
||
|
@foreach($pro->quesions_asnwered as $q)
|
||
|
<li class="list-group-item">
|
||
|
<span class="badge bg-secondary">
|
||
|
پرسش
|
||
|
</span>
|
||
|
{{$q->body}}
|
||
|
<hr>
|
||
|
<span class="badge bg-info">
|
||
|
پاسخ
|
||
|
</span>
|
||
|
<b>
|
||
|
{{$q->answer}}
|
||
|
</b>
|
||
|
</li>
|
||
|
@endforeach
|
||
|
</ul>
|
||
|
@if( !Auth::guard('customer')->check() )
|
||
|
<h2 class="text-center p-4">
|
||
|
شما برای ارسال سوال باید وارد حساب کاربری خود شوید
|
||
|
</h2>
|
||
|
@else
|
||
|
<div class="comment-containerx">
|
||
|
<div class="meta">
|
||
|
<img
|
||
|
src="https://gravatar.com/avatar/{{md5(Auth::guard('customer')->user()->email)}}?s=80"
|
||
|
class="avatar">
|
||
|
<span class="name">نام کاربر</span>
|
||
|
</div>
|
||
|
<form id="question-form">
|
||
|
<textarea class="form-control" dir="rtl" name="body"
|
||
|
placeholder="سوال شما..."></textarea>
|
||
|
<input type="hidden" name="product_id" value="{{$pro->id}}">
|
||
|
</form>
|
||
|
<div class="btn btn-primary mt-3" id="question-send"
|
||
|
data-url="{{route('question.send')}}">
|
||
|
ارسال پرسش
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
@endif
|
||
|
</div>
|
||
|
<div id="tab-gu">
|
||
|
<div class="text-center">
|
||
|
<img src="{{asset('images/sizeGuid.jpg')}}" style="width: 85%;margin: auto;" alt="">
|
||
|
</div>
|
||
|
</div>
|
||
|
<div id="tab-chart">
|
||
|
<!-- chart-->
|
||
|
<div>
|
||
|
<div class="chartjs-size-monitor">
|
||
|
<div class="chartjs-size-monitor-expand">
|
||
|
<div class=""></div>
|
||
|
</div>
|
||
|
<div class="chartjs-size-monitor-shrink">
|
||
|
<div class=""></div>
|
||
|
</div>
|
||
|
</div>
|
||
|
{!! \App\Helpers\makeChart($pro) !!}
|
||
|
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
|
||
|
<input type="hidden" id="qn" value="">
|
||
|
<input type="hidden" id="qnt" value='{!! $pro->quantities()->orderBy('price')->get();!!}'>
|
||
|
<input type="hidden" id="colors" value='{!! json_encode( \App\Helpers\getColors()) !!}'>
|
||
|
@endsection
|
||
|
|