wuhui_zzw
/
wyyl
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

!104 Product Added Quick Preview 

* Added quick preview
This commit is contained in:
pushuo 2023-05-20 10:20:53 +00:00 committed by Edward Yang
parent 1574805a5a
commit b5cc1ba786
15 changed files with 218 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
resources/beike/admin/js/app.js vendored
View File

@ -3,7 +3,7 @@
* @link https://beikeshop.com * @link https://beikeshop.com
* @Author pu shuo <pushuo@guangda.work> * @Author pu shuo <pushuo@guangda.work>
* @Date 2022-08-26 18:18:22 * @Date 2022-08-26 18:18:22
* @LastEditTime 2023-02-08 15:35:25 * @LastEditTime 2023-05-18 15:33:10
*/ */
import http from "../../../js/http"; import http from "../../../js/http";
@ -92,7 +92,8 @@ const tinymceInit = () => {
toolbar_mode: 'wrap', toolbar_mode: 'wrap',
font_formats: font_formats:
"微软雅黑='Microsoft YaHei';黑体=黑体;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Georgia=georgia,palatino;Helvetica=helvetica;Times New Roman=times new roman,times;Verdana=verdana,geneva", "微软雅黑='Microsoft YaHei';黑体=黑体;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Georgia=georgia,palatino;Helvetica=helvetica;Times New Roman=times new roman,times;Verdana=verdana,geneva",
fontsize_formats: "10px 12px 14px 18px 24px 36px", fontsize_formats: "10px 12px 14px 18px 24px 36px 48px 56px 72px 96px",
lineheight_formats: "1 1.1 1.2 1.3 1.4 1.5 1.7 2.4 3 4",
setup: function(ed) { setup: function(ed) {
const height = ed.getElement().dataset.tinymceHeight; const height = ed.getElement().dataset.tinymceHeight;
// console.log(ed); // console.log(ed);

3
resources/beike/admin/views/pages/design/builder/component/rich_text_i18n.blade.php
View File

@ -104,7 +104,8 @@ Vue.component('rich-text-i18n', {
toolbar_mode: 'wrap', toolbar_mode: 'wrap',
font_formats: font_formats:
"微软雅黑='Microsoft YaHei';黑体=黑体;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Georgia=georgia,palatino;Helvetica=helvetica;Times New Roman=times new roman,times;Verdana=verdana,geneva", "微软雅黑='Microsoft YaHei';黑体=黑体;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Georgia=georgia,palatino;Helvetica=helvetica;Times New Roman=times new roman,times;Verdana=verdana,geneva",
fontsize_formats: "10px 12px 14px 18px 24px 36px", fontsize_formats: "10px 12px 14px 18px 24px 36px 48px 56px 72px 96px",
lineheight_formats: "1 1.1 1.2 1.3 1.4 1.5 1.7 2.4 3 4",
relative_urls : true, relative_urls : true,
// init_instance_callback: function (ed) { // init_instance_callback: function (ed) {
// let code = ed.getElement().dataset.code // let code = ed.getElement().dataset.code

18
resources/beike/shop/default/js/app.js vendored
View File

@ -3,7 +3,7 @@
* @link https://beikeshop.com * @link https://beikeshop.com
* @Author pu shuo <pushuo@guangda.work> * @Author pu shuo <pushuo@guangda.work>
* @Date 2022-08-29 17:32:51 * @Date 2022-08-29 17:32:51
* @LastEditTime 2023-02-02 11:06:01 * @LastEditTime 2023-05-18 10:18:09
*/ */
import http from "../../../../js/http"; import http from "../../../../js/http";
@ -19,22 +19,6 @@ import './header'
import './bootstrap-validation' import './bootstrap-validation'
$(document).ready(function ($) { $(document).ready(function ($) {
$(document).on('click', '.offcanvas-products-delete', function () {
const id = $(this).data('id');
$http.delete(`carts/${id}`).then((res) => {
$(this).parents('.product-list').remove();
if (!res.data.quantity) {
$('.cart-badge-quantity').hide();
} else {
$('.cart-badge-quantity').show().html(res.data.quantity > 99 ? '99+' : res.data.quantity);
}
$('.offcanvas-right-cart-count').text(res.data.quantity);
$('.offcanvas-right-cart-amount').text(res.data.amount_format);
})
})
if ($(window).width() > 992 && $('.x-fixed-top').length) { if ($(window).width() > 992 && $('.x-fixed-top').length) {
$('.x-fixed-top').scrollToFixed({ $('.x-fixed-top').scrollToFixed({
zIndex: 999, zIndex: 999,

21
resources/beike/shop/default/js/common.js vendored
View File

@ -3,7 +3,7 @@
* @link https://beikeshop.com * @link https://beikeshop.com
* @Author pu shuo <pushuo@guangda.work> * @Author pu shuo <pushuo@guangda.work>
* @Date 2022-09-09 19:16:39 * @Date 2022-09-09 19:16:39
* @LastEditTime 2023-05-17 13:49:44 * @LastEditTime 2023-05-18 09:02:44
*/ */
export default { export default {
@ -31,7 +31,7 @@ export default {
* @param {*} isBuyNow 是否立即购买 * @param {*} isBuyNow 是否立即购买
* @return {*} 返回Promise * @return {*} 返回Promise
*/ */
addCart({sku_id, quantity = 1, isBuyNow = false}, event) { addCart({sku_id, quantity = 1, isBuyNow = false}, event, callback) {
if (!config.isLogin && !config.guestCheckout) { if (!config.isLogin && !config.guestCheckout) {
this.openLogin() this.openLogin()
return; return;
@ -46,8 +46,9 @@ export default {
$http.post('/carts', {sku_id, quantity, buy_now: isBuyNow}, {hload: !!event}).then((res) => { $http.post('/carts', {sku_id, quantity, buy_now: isBuyNow}, {hload: !!event}).then((res) => {
this.getCarts(); this.getCarts();
layer.msg(res.message) layer.msg(res.message)
if (isBuyNow) {
location.href = 'checkout' if (callback) {
callback(res)
} }
}).finally(() => {$btn.html(btnHtml).prop('disabled', false)}) }).finally(() => {$btn.html(btnHtml).prop('disabled', false)})
}, },
@ -96,6 +97,18 @@ export default {
}); });
}, },
productQuickView(id, callback) {
layer.open({
type: 2,
title: '',
shadeClose: true,
scrollbar: false,
area: ['1000px', '600px'],
skin: 'login-pop-box',
content: `products/${id}?iframe=true`
});
},
getQueryString(name, defaultValue) { getQueryString(name, defaultValue) {
const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)'); const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
const r = window.location.search.substr(1).match(reg); const r = window.location.search.substr(1).match(reg);

31
resources/beike/shop/default/js/header.js vendored
View File

@ -3,7 +3,7 @@
* @link https://beikeshop.com * @link https://beikeshop.com
* @Author pu shuo <pushuo@guangda.work> * @Author pu shuo <pushuo@guangda.work>
* @Date 2022-08-16 18:47:18 * @Date 2022-08-16 18:47:18
* @LastEditTime 2023-03-16 17:30:20 * @LastEditTime 2023-05-18 10:27:58
*/ */
$(function () { $(function () {
@ -22,6 +22,35 @@ $(function () {
}); });
} }
// 购物车侧边栏弹出
$(document).on("click", ".btn-right-cart", function () {
const currentUrl = window.location.pathname;
if (currentUrl == '/checkout' || currentUrl == '/carts') {
return;
}
const offcanvasRightCart = new bootstrap.Offcanvas('#offcanvas-right-cart')
offcanvasRightCart.show()
});
// 侧边栏购物车删除商品
$(document).on('click', '.offcanvas-products-delete', function () {
const id = $(this).data('id');
$http.delete(`carts/${id}`).then((res) => {
$(this).parents('.product-list').remove();
if (!res.data.quantity) {
$('.cart-badge-quantity').hide();
$('.empty-cart').removeClass('d-none');
} else {
$('.cart-badge-quantity').show().html(res.data.quantity > 99 ? '99+' : res.data.quantity);
}
$('.offcanvas-right-cart-count').text(res.data.quantity);
$('.offcanvas-right-cart-amount').text(res.data.amount_format);
})
})
// 响应式下弹窗菜单交互 // 响应式下弹窗菜单交互
$(document).on("click", ".mobile-open-menu", function () { $(document).on("click", ".mobile-open-menu", function () {
const offcanvasMobileMenu = new bootstrap.Offcanvas('#offcanvas-mobile-menu') const offcanvasMobileMenu = new bootstrap.Offcanvas('#offcanvas-mobile-menu')

1
resources/lang/en/common.php
View File

@ -81,6 +81,7 @@ return [
'get_more' => 'Get More', 'get_more' => 'Get More',
'view_more' => 'View more', 'view_more' => 'View more',
'view_details' => 'Check Details', 'view_details' => 'Check Details',
'quick_view' => 'Quick View',
'id' => 'ID', 'id' => 'ID',
'created_at' => 'Created At', 'created_at' => 'Created At',

1
resources/lang/zh_cn/common.php
View File

@ -80,6 +80,7 @@ return [
'get_more' => '获取更多', 'get_more' => '获取更多',
'view_more' => '查看更多', 'view_more' => '查看更多',
'view_details' => '查看详情', 'view_details' => '查看详情',
'quick_view' => '快速预览',
'id' => 'ID', 'id' => 'ID',
'created_at' => '创建时间', 'created_at' => '创建时间',

1
resources/lang/zh_hk/common.php
View File

@ -80,6 +80,7 @@ return [
'get_more' => '獲取更多', 'get_more' => '獲取更多',
'view_more' => '查看更多', 'view_more' => '查看更多',
'view_details' => '查看詳情', 'view_details' => '查看詳情',
'quick_view' => '快速預覽',
'id' => 'ID', 'id' => 'ID',
'created_at' => '創建時間', 'created_at' => '創建時間',

33
themes/default/account/wishlist.blade.php
View File

@ -35,8 +35,9 @@
<td>{{ $item['price'] }}</td> <td>{{ $item['price'] }}</td>
<td class="text-end"> <td class="text-end">
<div class=""> <div class="">
<a class="btn btn-outline-secondary btn-sm add-cart" <a class="btn btn-outline-secondary btn-sm"
href="{{ shop_route('products.show', $item['product_id']) }}">{{ __('shop/account.wishlist.check_details') }}</a> href="{{ shop_route('products.show', $item['product_id']) }}">{{ __('shop/account.wishlist.check_details') }}</a>
<button class="btn btn-outline-secondary add-cart btn-sm">{{ __('shop/products.add_to_cart') }}</button>
<button class="btn btn-outline-danger btn-sm remove-wishlist"><i class="bi bi-x-lg"></i></button> <button class="btn btn-outline-danger btn-sm remove-wishlist"><i class="bi bi-x-lg"></i></button>
</div> </div>
</td> </td>
@ -60,21 +61,23 @@
@push('add-scripts') @push('add-scripts')
<script> <script>
$(document).ready(function() { $('.remove-wishlist').click(function() {
$('.remove-wishlist').click(function() { const product_id = $(this).closest('tr').data('id');
const product_id = $(this).closest('tr').data('id');
$http.delete('account/wishlist/' + product_id).then((res) => { $http.delete('account/wishlist/' + product_id).then((res) => {
if (res.status == 'success') { if (res.status == 'success') {
$(this).closest('tr').fadeOut(function() { $(this).closest('tr').fadeOut(function() {
$(this).remove(); $(this).remove();
if ($('.remove-wishlist').length == 0) { if ($('.remove-wishlist').length == 0) {
location.reload(); location.reload();
} }
}); });
} }
}) })
}); });
$('.add-cart').click(function() {
bk.productQuickView($(this).closest('tr').data('id'))
}); });
</script> </script>
@endpush @endpush

72
themes/default/cart/mini.blade.php
View File

@ -6,48 +6,48 @@
@php $check = 0 @endphp @php $check = 0 @endphp
@if ($carts) @if ($carts)
<div class="offcanvas-right-products"> <div class="offcanvas-right-products">
@foreach ($carts as $cart) @foreach ($carts as $cart)
@if ($cart['selected']) @php $check = $check + 1 @endphp @endif @if ($cart['selected']) @php $check = $check + 1 @endphp @endif
<div class="product-list d-flex align-items-center"> <div class="product-list d-flex align-items-center">
<div class="select-wrap"> <div class="select-wrap">
<i class="bi {{ $cart['selected'] ? 'bi-check-circle-fill' : 'bi-circle' }}" data-id="{{ $cart['cart_id'] }}"></i> <i class="bi {{ $cart['selected'] ? 'bi-check-circle-fill' : 'bi-circle' }}" data-id="{{ $cart['cart_id'] }}"></i>
</div> </div>
<div class="product-info d-flex align-items-center"> <div class="product-info d-flex align-items-center">
<div class="left"><a href="{{ shop_route('products.show', $cart['product_id']) }}" class="d-flex justify-content-between align-items-center h-100"><img src="{{ $cart['image_url'] ?: image_resize('', 160, 160) }}" class="img-fluid"></a></div> <div class="left"><a href="{{ shop_route('products.show', $cart['product_id']) }}" class="d-flex justify-content-between align-items-center h-100"><img src="{{ $cart['image_url'] ?: image_resize('', 160, 160) }}" class="img-fluid"></a></div>
<div class="right flex-grow-1"> <div class="right flex-grow-1">
<a href="{{ shop_route('products.show', $cart['product_id']) }}" class="name fs-sm fw-bold mb-2 text-dark text-truncate-2" title="{{ $cart['name'] }}">{{ $cart['name'] }}</a> <a href="{{ shop_route('products.show', $cart['product_id']) }}" class="name fs-sm fw-bold mb-2 text-dark text-truncate-2" title="{{ $cart['name'] }}">{{ $cart['name'] }}</a>
<div class="text-muted mb-1 text-size-min">{{ $cart['variant_labels'] }}</div> <div class="text-muted mb-1 text-size-min">{{ $cart['variant_labels'] }}</div>
<div class="product-bottom d-flex justify-content-between align-items-center"> <div class="product-bottom d-flex justify-content-between align-items-center">
<div class="price d-flex align-items-center"> <div class="price d-flex align-items-center">
{{ $cart['price_format'] }} x {{ $cart['price_format'] }} x
<input type="text" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" <input type="text" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"
data-id="{{ $cart['cart_id'] }}" data-sku="{{ $cart['sku_id'] }}" class="form-control p-1" value="{{ $cart['quantity'] }}"> data-id="{{ $cart['cart_id'] }}" data-sku="{{ $cart['sku_id'] }}" class="form-control p-1" value="{{ $cart['quantity'] }}">
</div>
<span class="offcanvas-products-delete" data-id="{{ $cart['cart_id'] }}"><i class="bi bi-x-lg"></i>
{{ __('common.delete') }}</span>
</div> </div>
<span class="offcanvas-products-delete" data-id="{{ $cart['cart_id'] }}"><i class="bi bi-x-lg"></i>
{{ __('common.delete') }}</span>
</div> </div>
</div> </div>
</div> </div>
@endforeach </div>
</div> @endforeach
@else </div>
<div class="d-flex justify-content-center align-items-center flex-column"> @endif
<div class="empty-cart-wrap text-center mt-5">
<div class="empty-cart-icon mb-3"> <div class="d-flex justify-content-center align-items-center flex-column empty-cart {{ $carts ? 'd-none' : '' }}">
<i class="bi bi-cart fs-1"></i> <div class="empty-cart-wrap text-center mt-5">
</div> <div class="empty-cart-icon mb-3">
<div class="empty-cart-text mb-3"> <i class="bi bi-cart fs-1"></i>
<h5>{{ __('shop/carts.cart_empty') }}</h5> </div>
<p class="text-muted">{{ __('shop/carts.go_buy') }}</p> <div class="empty-cart-text mb-3">
</div> <h5>{{ __('shop/carts.cart_empty') }}</h5>
<div class="empty-cart-action"> <p class="text-muted">{{ __('shop/carts.go_buy') }}</p>
<a href="{{ shop_route('home.index') }}" class="btn btn-primary">{{ __('shop/carts.go_shopping') }}</a> </div>
</div> <div class="empty-cart-action">
<a href="{{ shop_route('home.index') }}" class="btn btn-primary">{{ __('shop/carts.go_shopping') }}</a>
</div> </div>
</div> </div>
@endif </div>
</div> </div>
@if ($carts) @if ($carts)

65
themes/default/design/product.blade.php
View File

@ -1,3 +1,8 @@
@push('header')
<script src="{{ asset('vendor/swiper/swiper-bundle.min.js') }}"></script>
<link rel="stylesheet" href="{{ asset('vendor/swiper/swiper-bundle.min.css') }}">
@endpush
<section class="module-item {{ $design ? 'module-item-design' : ''}}" id="module-{{ $module_id }}"> <section class="module-item {{ $design ? 'module-item-design' : ''}}" id="module-{{ $module_id }}">
@include('design._partial._module_tool') @include('design._partial._module_tool')
@ -37,32 +42,44 @@
</div> </div>
<script> <script>
new Swiper ('.module-product-{{ $module_id }}', { function productSwiper() {
watchSlidesProgress: true, new Swiper ('.module-product-{{ $module_id }}', {
breakpoints:{ watchSlidesProgress: true,
320: { breakpoints:{
slidesPerView: 2, 320: {
slidesPerGroup: 2, slidesPerView: 2,
spaceBetween: 10, slidesPerGroup: 2,
spaceBetween: 10,
},
768: {
slidesPerView: 4,
slidesPerGroup: 4,
spaceBetween: 30,
},
}, },
768: { spaceBetween: 30,
slidesPerView: 4, // 如果需要分页器
slidesPerGroup: 4, pagination: {
spaceBetween: 30, el: '.module-product-{{ $module_id }}-pagination',
clickable: true,
}, },
},
spaceBetween: 30,
// 如果需要分页器
pagination: {
el: '.module-product-{{ $module_id }}-pagination',
clickable: true,
},
// 如果需要前进后退按钮 // 如果需要前进后退按钮
navigation: { navigation: {
nextEl: '.product-next', nextEl: '.product-next',
prevEl: '.product-prev', prevEl: '.product-prev',
}, },
}) })
}
@if ($design)
bk.loadStyle('{{ asset('vendor/swiper/swiper-bundle.min.css') }}');
bk.loadScript('{{ asset('vendor/swiper/swiper-bundle.min.js') }}', () => {
productSwiper();
})
@else
productSwiper();
@endif
</script> </script>
</section> </section>

17
themes/default/design/slideshow.blade.php
View File

@ -1,3 +1,8 @@
@push('header')
<script src="{{ asset('vendor/swiper/swiper-bundle.min.js') }}"></script>
<link rel="stylesheet" href="{{ asset('vendor/swiper/swiper-bundle.min.css') }}">
@endpush
<section class="module-item {{ $design ? 'module-item-design' : ''}}" id="module-{{ $module_id }}"> <section class="module-item {{ $design ? 'module-item-design' : ''}}" id="module-{{ $module_id }}">
@include('design._partial._module_tool') @include('design._partial._module_tool')
@ -18,8 +23,7 @@
</div> </div>
<script> <script>
bk.loadStyle('{{ asset('vendor/swiper/swiper-bundle.min.css') }}'); function slideshowSwiper() {
bk.loadScript('{{ asset('vendor/swiper/swiper-bundle.min.js') }}', () => {
new Swiper ('.module-swiper-{{ $module_id }}', { new Swiper ('.module-swiper-{{ $module_id }}', {
loop: '{{ count($content['images']) > 1 ? true : false }}', // 循环模式选项 loop: '{{ count($content['images']) > 1 ? true : false }}', // 循环模式选项
autoplay: true, autoplay: true,
@ -38,6 +42,15 @@
prevEl: '.slideshow-btnprev-{{ $module_id }}', prevEl: '.slideshow-btnprev-{{ $module_id }}',
}, },
}) })
}
@if ($design)
bk.loadStyle('{{ asset('vendor/swiper/swiper-bundle.min.css') }}');
bk.loadScript('{{ asset('vendor/swiper/swiper-bundle.min.js') }}', () => {
slideshowSwiper();
}) })
@else
slideshowSwiper();
@endif
</script> </script>
</section> </section>

10
themes/default/layout/header.blade.php
View File

@ -116,11 +116,15 @@
</li> </li>
@endhookwrapper @endhookwrapper
<li class="nav-item"> <li class="nav-item">
<a class="nav-link position-relative" {{ !equal_route('shop.carts.index') ? 'data-bs-toggle=offcanvas' : '' }} {{-- <a class="nav-link position-relative" {{ !equal_route('shop.carts.index') ? 'data-bs-toggle=offcanvas' : '' }}
href="{{ !equal_route('shop.carts.index') ? '#offcanvas-right-cart' : 'javascript:void(0);' }}" role="button" href="{{ !equal_route('shop.carts.index') ? '#offcanvas-right-cart' : 'javascript:void(0);' }}" role="button"
aria-controls="offcanvasExample"> aria-controls="offcanvasExample">
<i class="iconfont">&#xe634;</i> <i class="iconfont">&#xe634;</i>
<span class="cart-badge-quantity"></span> <span class="cart-badge-quantity"></span>
</a> --}}
<a class="nav-link position-relative btn-right-cart {{ equal_route('shop.carts.index') ? 'page-cart' : '' }}" href="javascript:void(0);" role="button">
<i class="iconfont">&#xe634;</i>
<span class="cart-badge-quantity"></span>
</a> </a>
</li> </li>
</ul> </ul>
@ -155,9 +159,7 @@
</div> </div>
</div> </div>
@if (!equal_route('shop.carts.index')) <div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvas-right-cart" aria-labelledby="offcanvasRightLabel"></div>
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvas-right-cart" aria-labelledby="offcanvasRightLabel"></div>
@endif
<div class="offcanvas offcanvas-top" tabindex="-1" id="offcanvas-search-top" aria-labelledby="offcanvasTopLabel"> <div class="offcanvas offcanvas-top" tabindex="-1" id="offcanvas-search-top" aria-labelledby="offcanvasTopLabel">
<div class="offcanvas-header"> <div class="offcanvas-header">

49
themes/default/product.blade.php
View File

@ -11,15 +11,21 @@
<link rel="stylesheet" href="{{ asset('vendor/swiper/swiper-bundle.min.css') }}"> <link rel="stylesheet" href="{{ asset('vendor/swiper/swiper-bundle.min.css') }}">
@endpush @endpush
@section('content') @php
<x-shop-breadcrumb type="product" :value="$product['id']" /> $iframeClass = request('iframe') ? 'd-none' : '';
@endphp
<div class="container" id="product-app" v-cloak> @section('content')
@if (!request('iframe'))
<x-shop-breadcrumb type="product" :value="$product['id']" />
@endif
<div class="container {{ request('iframe') ? 'pt-4' : '' }}" id="product-app" v-cloak>
<div class="row mb-5 mt-3 mt-md-0" id="product-top"> <div class="row mb-5 mt-3 mt-md-0" id="product-top">
<div class="col-12 col-lg-6 mb-3"> <div class="col-12 col-lg-6 mb-3">
<div class="product-image d-flex align-items-start"> <div class="product-image d-flex align-items-start">
@if(!is_mobile()) @if(!is_mobile())
<div class="left" v-if="images.length"> <div class="left {{ $iframeClass }}" v-if="images.length">
<div class="swiper" id="swiper"> <div class="swiper" id="swiper">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide" :class="!index ? 'active' : ''" v-for="image, index in images"> <div class="swiper-slide" :class="!index ? 'active' : ''" v-for="image, index in images">
@ -143,11 +149,14 @@
</button> </button>
@hook('product.detail.buy.after') @hook('product.detail.buy.after')
</div> </div>
@if (current_customer() || !request('iframe'))
<div class="add-wishlist"> <div class="add-wishlist">
<button class="btn btn-link ps-0 text-secondary" data-in-wishlist="{{ $product['in_wishlist'] }}" onclick="bk.addWishlist('{{ $product['id'] }}', this)"> <button class="btn btn-link ps-0 text-secondary" data-in-wishlist="{{ $product['in_wishlist'] }}" onclick="bk.addWishlist('{{ $product['id'] }}', this)">
<i class="bi bi-heart{{ $product['in_wishlist'] ? '-fill' : '' }} me-1"></i> {{ __('shop/products.add_to_favorites') }} <i class="bi bi-heart{{ $product['in_wishlist'] ? '-fill' : '' }} me-1"></i> {{ __('shop/products.add_to_favorites') }}
</button> </button>
</div> </div>
@endif
@else @else
<div class="text-danger"><i class="bi bi-exclamation-circle-fill"></i> {{ __('product.has_been_inactive') }}</div> <div class="text-danger"><i class="bi bi-exclamation-circle-fill"></i> {{ __('product.has_been_inactive') }}</div>
@endif @endif
@ -157,7 +166,7 @@
</div> </div>
</div> </div>
<div class="product-description"> <div class="product-description {{ $iframeClass }}">
<div class="nav nav-tabs nav-overflow justify-content-start justify-content-md-center border-bottom mb-3"> <div class="nav nav-tabs nav-overflow justify-content-start justify-content-md-center border-bottom mb-3">
<a class="nav-link fw-bold active fs-5" data-bs-toggle="tab" href="#product-description"> <a class="nav-link fw-bold active fs-5" data-bs-toggle="tab" href="#product-description">
{{ __('shop/products.product_details') }} {{ __('shop/products.product_details') }}
@ -193,7 +202,7 @@
</div> </div>
</div> </div>
@if ($relations) @if ($relations && !request('iframe'))
<div class="relations-wrap mt-5"> <div class="relations-wrap mt-5">
<div class="container position-relative"> <div class="container position-relative">
<div class="title text-center fs-1 mb-4">{{ __('admin/product.product_relations') }}</div> <div class="title text-center fs-1 mb-4">{{ __('admin/product.product_relations') }}</div>
@ -219,6 +228,7 @@
@push('add-scripts') @push('add-scripts')
<script> <script>
let swiperMobile = null; let swiperMobile = null;
const isIframe = bk.getQueryString('iframe', false);
let app = new Vue({ let app = new Vue({
el: '#product-app', el: '#product-app',
@ -273,9 +283,9 @@
}, },
methods: { methods: {
checkedVariableValue(variable_idnex, value_index, value) { checkedVariableValue(variable_index, value_index, value) {
$('.product-image .swiper .swiper-slide').eq(0).addClass('active').siblings().removeClass('active'); $('.product-image .swiper .swiper-slide').eq(0).addClass('active').siblings().removeClass('active');
this.source.variables[variable_idnex].values.forEach((v, i) => { this.source.variables[variable_index].values.forEach((v, i) => {
v.selected = i == value_index v.selected = i == value_index
}) })
@ -309,7 +319,26 @@
}, },
addCart(isBuyNow = false) { addCart(isBuyNow = false) {
bk.addCart({sku_id: this.product.id, quantity: this.quantity, isBuyNow}); bk.addCart({sku_id: this.product.id, quantity: this.quantity, isBuyNow}, null, () => {
if (isIframe) {
let index = parent.layer.getFrameIndex(window.name); //当前iframe层的索引
parent.bk.getCarts();
setTimeout(() => {
parent.layer.close(index);
if (isBuyNow) {
parent.location.href = 'checkout'
} else {
parent.$('.btn-right-cart')[0].click()
}
}, 400);
} else {
if (isBuyNow) {
location.href = 'checkout'
}
}
});
}, },
updateSelectedVariantsIndex() { updateSelectedVariantsIndex() {
@ -424,7 +453,5 @@
const selectedVariants = variables.map((variable, index) => { const selectedVariants = variables.map((variable, index) => {
return variable.values[selectedVariantsIndex[index]] return variable.values[selectedVariantsIndex[index]]
}); });
console.log(selectedVariants);
</script> </script>
@endpush @endpush

8
themes/default/shared/product.blade.php
View File

@ -11,6 +11,14 @@
</a> </a>
@if (!request('style_list') || request('style_list') == 'grid') @if (!request('style_list') || request('style_list') == 'grid')
<div class="button-wrap"> <div class="button-wrap">
<button
class="btn btn-dark text-light mx-1 rounded-3"
data-bs-toggle="tooltip"
data-bs-placement="top"
title="{{ __('common.quick_view') }}"
onclick="bk.productQuickView({{ $product['id'] }})">
<i class="bi bi-eye"></i>
</button>
<button <button
class="btn btn-dark text-light mx-1 rounded-3" class="btn btn-dark text-light mx-1 rounded-3"
data-bs-toggle="tooltip" data-bs-toggle="tooltip"