All Scripts Are Moved To Footer
This commit is contained in:
devansh bawari
parent
891ae5c085
commit
44b489dded
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><circle cx="12" cy="12" r="3.2"/><path d="M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/></svg>
|
||||
|
After Width: | Height: | Size: 324 B |
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"/js/velocity.js": "/js/velocity.js?id=1163ad750316d05c0869",
|
||||
"/css/velocity-admin.css": "/css/velocity-admin.css?id=612d35e452446366eef7",
|
||||
"/css/velocity.css": "/css/velocity.css?id=8b1c7e45d2b61caa923a"
|
||||
"/css/velocity-admin.css": "/css/velocity-admin.css?id=4322502d80a0e4a0affd",
|
||||
"/css/velocity.css": "/css/velocity.css?id=3e4dedf3dd293f2a3389"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><circle cx="12" cy="12" r="3.2"/><path d="M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/></svg>
|
||||
|
After Width: | Height: | Size: 324 B |
|
|
@ -1528,7 +1528,7 @@
|
|||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.instructions {
|
||||
.instructions {
|
||||
margin-top: 5px;
|
||||
margin-left: -13px;
|
||||
|
||||
|
|
@ -2566,13 +2566,6 @@
|
|||
height: 24px !important;
|
||||
}
|
||||
|
||||
.camera-icon {
|
||||
width: 24px;
|
||||
display: inline-block;
|
||||
background-size: cover;
|
||||
background-image: url(/vendor/webkul/ui/assets/images/Camera.svg);
|
||||
}
|
||||
|
||||
.image-search-result {
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
|
|
|
|||
|
|
@ -6,6 +6,13 @@
|
|||
background-image: url("../images/Icon-Velocity.svg");
|
||||
}
|
||||
|
||||
.camera-icon {
|
||||
background-image: url("../images/Camera.svg");
|
||||
width: 24px;
|
||||
display: inline-block;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.router-link-active,
|
||||
.active {
|
||||
.velocity-icon {
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,448 +1,446 @@
|
|||
<style>
|
||||
.camera-icon {
|
||||
background-image: url("{{ asset('/vendor/webkul/ui/assets/images/Camera.svg') }}");
|
||||
}
|
||||
</style>
|
||||
@push('scripts')
|
||||
<script type="text/x-template" id="cart-btn-template">
|
||||
<button
|
||||
type="button"
|
||||
id="mini-cart"
|
||||
@click="toggleMiniCart"
|
||||
:class="`btn btn-link disable-box-shadow ${itemCount == 0 ? 'cursor-not-allowed' : ''}`">
|
||||
|
||||
<script type="text/x-template" id="cart-btn-template">
|
||||
<button
|
||||
type="button"
|
||||
id="mini-cart"
|
||||
@click="toggleMiniCart"
|
||||
:class="`btn btn-link disable-box-shadow ${itemCount == 0 ? 'cursor-not-allowed' : ''}`">
|
||||
<div class="mini-cart-content">
|
||||
<i class="material-icons-outlined text-down-3">shopping_cart</i>
|
||||
<span class="badge" v-text="itemCount" v-if="itemCount != 0"></span>
|
||||
<span class="fs18 fw6 cart-text">{{ __('velocity::app.minicart.cart') }}</span>
|
||||
</div>
|
||||
<div class="down-arrow-container">
|
||||
<span class="rango-arrow-down"></span>
|
||||
</div>
|
||||
</button>
|
||||
</script>
|
||||
|
||||
<div class="mini-cart-content">
|
||||
<i class="material-icons-outlined text-down-3">shopping_cart</i>
|
||||
<span class="badge" v-text="itemCount" v-if="itemCount != 0"></span>
|
||||
<span class="fs18 fw6 cart-text">{{ __('velocity::app.minicart.cart') }}</span>
|
||||
<script type="text/x-template" id="close-btn-template">
|
||||
<button type="button" class="close disable-box-shadow">
|
||||
<span class="white-text fs20" @click="togglePopup">×</span>
|
||||
</button>
|
||||
</script>
|
||||
|
||||
<script type="text/x-template" id="quantity-changer-template">
|
||||
<div :class="`quantity control-group ${errors.has(controlName) ? 'has-error' : ''}`">
|
||||
<label class="required">{{ __('shop::app.products.quantity') }}</label>
|
||||
<button type="button" class="decrease" @click="decreaseQty()">-</button>
|
||||
|
||||
<input
|
||||
:value="qty"
|
||||
class="control"
|
||||
:name="controlName"
|
||||
:v-validate="validations"
|
||||
data-vv-as=""{{ __('shop::app.products.quantity') }}""
|
||||
readonly />
|
||||
|
||||
<button type="button" class="increase" @click="increaseQty()">+</button>
|
||||
|
||||
<span class="control-error" v-if="errors.has(controlName)">@{{ errors.first(controlName) }}</span>
|
||||
</div>
|
||||
<div class="down-arrow-container">
|
||||
<span class="rango-arrow-down"></span>
|
||||
</div>
|
||||
</button>
|
||||
</script>
|
||||
|
||||
<script type="text/x-template" id="close-btn-template">
|
||||
<button type="button" class="close disable-box-shadow">
|
||||
<span class="white-text fs20" @click="togglePopup">×</span>
|
||||
</button>
|
||||
</script>
|
||||
|
||||
<script type="text/x-template" id="quantity-changer-template">
|
||||
<div :class="`quantity control-group ${errors.has(controlName) ? 'has-error' : ''}`">
|
||||
<label class="required">{{ __('shop::app.products.quantity') }}</label>
|
||||
<button type="button" class="decrease" @click="decreaseQty()">-</button>
|
||||
|
||||
<input
|
||||
:value="qty"
|
||||
class="control"
|
||||
:name="controlName"
|
||||
:v-validate="validations"
|
||||
data-vv-as=""{{ __('shop::app.products.quantity') }}""
|
||||
readonly />
|
||||
|
||||
<button type="button" class="increase" @click="increaseQty()">+</button>
|
||||
|
||||
<span class="control-error" v-if="errors.has(controlName)">@{{ errors.first(controlName) }}</span>
|
||||
</div>
|
||||
</script>
|
||||
</script>
|
||||
@endpush
|
||||
|
||||
@include('velocity::UI.header')
|
||||
|
||||
<script type="text/x-template" id="logo-template">
|
||||
<a
|
||||
:class="`left ${addClass}`"
|
||||
href="{{ route('shop.home.index') }}">
|
||||
@push('scripts')
|
||||
<script type="text/x-template" id="logo-template">
|
||||
<a
|
||||
:class="`left ${addClass}`"
|
||||
href="{{ route('shop.home.index') }}">
|
||||
|
||||
@if ($logo = core()->getCurrentChannel()->logo_url)
|
||||
<img class="logo" src="{{ $logo }}" />
|
||||
@else
|
||||
<img class="logo" src="{{ asset('themes/velocity/assets/images/logo-text.png') }}" />
|
||||
@endif
|
||||
</a>
|
||||
</script>
|
||||
@if ($logo = core()->getCurrentChannel()->logo_url)
|
||||
<img class="logo" src="{{ $logo }}" />
|
||||
@else
|
||||
<img class="logo" src="{{ asset('themes/velocity/assets/images/logo-text.png') }}" />
|
||||
@endif
|
||||
</a>
|
||||
</script>
|
||||
|
||||
<script type="text/x-template" id="searchbar-template">
|
||||
<div class="row no-margin right searchbar">
|
||||
<div class="col-lg-5 col-md-12 no-padding input-group">
|
||||
<form
|
||||
method="GET"
|
||||
role="search"
|
||||
id="search-form"
|
||||
action="{{ route('velocity.search.index') }}">
|
||||
<script type="text/x-template" id="searchbar-template">
|
||||
<div class="row no-margin right searchbar">
|
||||
<div class="col-lg-5 col-md-12 no-padding input-group">
|
||||
<form
|
||||
method="GET"
|
||||
role="search"
|
||||
id="search-form"
|
||||
action="{{ route('velocity.search.index') }}">
|
||||
|
||||
<div
|
||||
class="btn-toolbar full-width"
|
||||
role="toolbar">
|
||||
<div
|
||||
class="btn-toolbar full-width"
|
||||
role="toolbar">
|
||||
|
||||
<div class="btn-group full-width">
|
||||
<div class="selectdiv">
|
||||
<select class="form-control fs13 styled-select" name="category" @change="focusInput($event)">
|
||||
<option value="">
|
||||
{{ __('velocity::app.header.all-categories') }}
|
||||
</option>
|
||||
|
||||
<template v-for="(category, index) in $root.sharedRootCategories">
|
||||
<option
|
||||
:key="index"
|
||||
selected="selected"
|
||||
:value="category.id"
|
||||
v-if="(category.id == searchedQuery.category)">
|
||||
@{{ category.name }}
|
||||
<div class="btn-group full-width">
|
||||
<div class="selectdiv">
|
||||
<select class="form-control fs13 styled-select" name="category" @change="focusInput($event)">
|
||||
<option value="">
|
||||
{{ __('velocity::app.header.all-categories') }}
|
||||
</option>
|
||||
|
||||
<option :key="index" :value="category.id" v-else>
|
||||
@{{ category.name }}
|
||||
</option>
|
||||
</template>
|
||||
</select>
|
||||
<template v-for="(category, index) in $root.sharedRootCategories">
|
||||
<option
|
||||
:key="index"
|
||||
selected="selected"
|
||||
:value="category.id"
|
||||
v-if="(category.id == searchedQuery.category)">
|
||||
@{{ category.name }}
|
||||
</option>
|
||||
|
||||
<div class="select-icon-container">
|
||||
<span class="select-icon rango-arrow-down"></span>
|
||||
<option :key="index" :value="category.id" v-else>
|
||||
@{{ category.name }}
|
||||
</option>
|
||||
</template>
|
||||
</select>
|
||||
|
||||
<div class="select-icon-container">
|
||||
<span class="select-icon rango-arrow-down"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="full-width">
|
||||
|
||||
<input
|
||||
required
|
||||
name="term"
|
||||
type="search"
|
||||
class="form-control"
|
||||
placeholder="{{ __('velocity::app.header.search-text') }}"
|
||||
:value="searchedQuery.term ? searchedQuery.term.split('+').join(' ') : ''" />
|
||||
|
||||
<image-search-component></image-search-component>
|
||||
|
||||
<button class="btn" type="submit" id="header-search-icon">
|
||||
<i class="fs16 fw6 rango-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="full-width">
|
||||
|
||||
<input
|
||||
required
|
||||
name="term"
|
||||
type="search"
|
||||
class="form-control"
|
||||
placeholder="{{ __('velocity::app.header.search-text') }}"
|
||||
:value="searchedQuery.term ? searchedQuery.term.split('+').join(' ') : ''" />
|
||||
|
||||
<image-search-component></image-search-component>
|
||||
|
||||
<button class="btn" type="submit" id="header-search-icon">
|
||||
<i class="fs16 fw6 rango-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-7 col-md-12">
|
||||
{!! view_render_event('bagisto.shop.layout.header.cart-item.before') !!}
|
||||
@include('shop::checkout.cart.mini-cart')
|
||||
{!! view_render_event('bagisto.shop.layout.header.cart-item.after') !!}
|
||||
<div class="col-lg-7 col-md-12">
|
||||
{!! view_render_event('bagisto.shop.layout.header.cart-item.before') !!}
|
||||
@include('shop::checkout.cart.mini-cart')
|
||||
{!! view_render_event('bagisto.shop.layout.header.cart-item.after') !!}
|
||||
|
||||
@php
|
||||
$showCompare = core()->getConfigData('general.content.shop.compare_option') == "1" ? true : false
|
||||
@endphp
|
||||
@php
|
||||
$showCompare = core()->getConfigData('general.content.shop.compare_option') == "1" ? true : false
|
||||
@endphp
|
||||
|
||||
{!! view_render_event('bagisto.shop.layout.header.compare.before') !!}
|
||||
@if ($showCompare)
|
||||
<a
|
||||
class="compare-btn unset"
|
||||
@auth('customer')
|
||||
href="{{ route('velocity.customer.product.compare') }}"
|
||||
@endauth
|
||||
{!! view_render_event('bagisto.shop.layout.header.compare.before') !!}
|
||||
@if ($showCompare)
|
||||
<a
|
||||
class="compare-btn unset"
|
||||
@auth('customer')
|
||||
href="{{ route('velocity.customer.product.compare') }}"
|
||||
@endauth
|
||||
|
||||
@guest('customer')
|
||||
href="{{ route('velocity.product.compare') }}"
|
||||
@endguest
|
||||
>
|
||||
@guest('customer')
|
||||
href="{{ route('velocity.product.compare') }}"
|
||||
@endguest
|
||||
>
|
||||
|
||||
<i class="material-icons">compare_arrows</i>
|
||||
<div class="badge-container" v-if="compareCount > 0">
|
||||
<span class="badge" v-text="compareCount"></span>
|
||||
<i class="material-icons">compare_arrows</i>
|
||||
<div class="badge-container" v-if="compareCount > 0">
|
||||
<span class="badge" v-text="compareCount"></span>
|
||||
</div>
|
||||
<span>{{ __('velocity::app.customer.compare.text') }}</span>
|
||||
</a>
|
||||
@endif
|
||||
{!! view_render_event('bagisto.shop.layout.header.compare.after') !!}
|
||||
|
||||
{!! view_render_event('bagisto.shop.layout.header.wishlist.before') !!}
|
||||
<a class="wishlist-btn unset" :href="`${isCustomer ? '{{ route('customer.wishlist.index') }}' : '{{ route('velocity.product.guest-wishlist') }}'}`">
|
||||
<i class="material-icons">favorite_border</i>
|
||||
<div class="badge-container" v-if="wishlistCount > 0">
|
||||
<span class="badge" v-text="wishlistCount"></span>
|
||||
</div>
|
||||
<span>{{ __('velocity::app.customer.compare.text') }}</span>
|
||||
<span>{{ __('shop::app.layouts.wishlist') }}</span>
|
||||
</a>
|
||||
@endif
|
||||
{!! view_render_event('bagisto.shop.layout.header.compare.after') !!}
|
||||
|
||||
{!! view_render_event('bagisto.shop.layout.header.wishlist.before') !!}
|
||||
<a class="wishlist-btn unset" :href="`${isCustomer ? '{{ route('customer.wishlist.index') }}' : '{{ route('velocity.product.guest-wishlist') }}'}`">
|
||||
<i class="material-icons">favorite_border</i>
|
||||
<div class="badge-container" v-if="wishlistCount > 0">
|
||||
<span class="badge" v-text="wishlistCount"></span>
|
||||
</div>
|
||||
<span>{{ __('shop::app.layouts.wishlist') }}</span>
|
||||
</a>
|
||||
{!! view_render_event('bagisto.shop.layout.header.wishlist.after') !!}
|
||||
{!! view_render_event('bagisto.shop.layout.header.wishlist.after') !!}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/mobilenet"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/mobilenet"></script>
|
||||
|
||||
<script type="text/x-template" id="image-search-component-template">
|
||||
<div class="d-inline-block">
|
||||
<label class="image-search-container" for="image-search-container">
|
||||
<i class="icon camera-icon"></i>
|
||||
<script type="text/x-template" id="image-search-component-template">
|
||||
<div class="d-inline-block">
|
||||
<label class="image-search-container" for="image-search-container">
|
||||
<i class="icon camera-icon"></i>
|
||||
|
||||
<input
|
||||
type="file"
|
||||
class="d-none"
|
||||
ref="image_search_input"
|
||||
id="image-search-container"
|
||||
v-on:change="uploadImage()" />
|
||||
<input
|
||||
type="file"
|
||||
class="d-none"
|
||||
ref="image_search_input"
|
||||
id="image-search-container"
|
||||
v-on:change="uploadImage()" />
|
||||
|
||||
<img
|
||||
class="d-none"
|
||||
id="uploaded-image-url"
|
||||
:src="uploadedImageUrl" />
|
||||
</label>
|
||||
</div>
|
||||
</script>
|
||||
<img
|
||||
class="d-none"
|
||||
id="uploaded-image-url"
|
||||
:src="uploadedImageUrl" />
|
||||
</label>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
(() => {
|
||||
Vue.component('cart-btn', {
|
||||
template: '#cart-btn-template',
|
||||
<script type="text/javascript">
|
||||
(() => {
|
||||
Vue.component('cart-btn', {
|
||||
template: '#cart-btn-template',
|
||||
|
||||
props: ['itemCount'],
|
||||
props: ['itemCount'],
|
||||
|
||||
methods: {
|
||||
toggleMiniCart: function () {
|
||||
let modal = $('#cart-modal-content')[0];
|
||||
if (modal)
|
||||
modal.classList.toggle('hide');
|
||||
methods: {
|
||||
toggleMiniCart: function () {
|
||||
let modal = $('#cart-modal-content')[0];
|
||||
if (modal)
|
||||
modal.classList.toggle('hide');
|
||||
|
||||
let accountModal = $('.account-modal')[0];
|
||||
if (accountModal)
|
||||
accountModal.classList.add('hide');
|
||||
let accountModal = $('.account-modal')[0];
|
||||
if (accountModal)
|
||||
accountModal.classList.add('hide');
|
||||
|
||||
event.stopPropagation();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('close-btn', {
|
||||
template: '#close-btn-template',
|
||||
|
||||
methods: {
|
||||
togglePopup: function () {
|
||||
$('#cart-modal-content').hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('quantity-changer', {
|
||||
template: '#quantity-changer-template',
|
||||
inject: ['$validator'],
|
||||
props: {
|
||||
controlName: {
|
||||
type: String,
|
||||
default: 'quantity'
|
||||
},
|
||||
|
||||
quantity: {
|
||||
type: [Number, String],
|
||||
default: 1
|
||||
},
|
||||
|
||||
minQuantity: {
|
||||
type: [Number, String],
|
||||
default: 1
|
||||
},
|
||||
|
||||
validations: {
|
||||
type: String,
|
||||
default: 'required|numeric|min_value:1'
|
||||
}
|
||||
},
|
||||
|
||||
data: function() {
|
||||
return {
|
||||
qty: this.quantity
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
quantity: function (val) {
|
||||
this.qty = val;
|
||||
|
||||
this.$emit('onQtyUpdated', this.qty)
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
decreaseQty: function() {
|
||||
if (this.qty > this.minQuantity)
|
||||
this.qty = parseInt(this.qty) - 1;
|
||||
|
||||
this.$emit('onQtyUpdated', this.qty)
|
||||
},
|
||||
|
||||
increaseQty: function() {
|
||||
this.qty = parseInt(this.qty) + 1;
|
||||
|
||||
this.$emit('onQtyUpdated', this.qty)
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('logo-component', {
|
||||
template: '#logo-template',
|
||||
props: ['addClass'],
|
||||
});
|
||||
|
||||
Vue.component('searchbar-component', {
|
||||
template: '#searchbar-template',
|
||||
data: function () {
|
||||
return {
|
||||
compareCount: 0,
|
||||
wishlistCount: 0,
|
||||
searchedQuery: [],
|
||||
isCustomer: '{{ auth()->guard('customer')->user() ? "true" : "false" }}' == "true",
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
'$root.headerItemsCount': function () {
|
||||
this.updateHeaderItemsCount();
|
||||
}
|
||||
},
|
||||
|
||||
created: function () {
|
||||
let searchedItem = window.location.search.replace("?", "");
|
||||
searchedItem = searchedItem.split('&');
|
||||
|
||||
let updatedSearchedCollection = {};
|
||||
|
||||
searchedItem.forEach(item => {
|
||||
let splitedItem = item.split('=');
|
||||
updatedSearchedCollection[splitedItem[0]] = decodeURI(splitedItem[1]);
|
||||
});
|
||||
|
||||
if (updatedSearchedCollection['image-search'] == 1) {
|
||||
updatedSearchedCollection.term = '';
|
||||
}
|
||||
|
||||
this.searchedQuery = updatedSearchedCollection;
|
||||
|
||||
this.updateHeaderItemsCount();
|
||||
},
|
||||
|
||||
methods: {
|
||||
'focusInput': function (event) {
|
||||
$(event.target.parentElement.parentElement).find('input').focus();
|
||||
},
|
||||
|
||||
'updateHeaderItemsCount': function () {
|
||||
if (! this.isCustomer) {
|
||||
let comparedItems = this.getStorageValue('compared_product');
|
||||
let wishlistedItems = this.getStorageValue('wishlist_product');
|
||||
|
||||
if (wishlistedItems) {
|
||||
this.wishlistCount = wishlistedItems.length;
|
||||
}
|
||||
|
||||
if (comparedItems) {
|
||||
this.compareCount = comparedItems.length;
|
||||
}
|
||||
} else {
|
||||
this.$http.get(`${this.$root.baseUrl}/items-count`)
|
||||
.then(response => {
|
||||
this.compareCount = response.data.compareProductsCount;
|
||||
this.wishlistCount = response.data.wishlistedProductsCount;
|
||||
})
|
||||
.catch(exception => {
|
||||
console.log(this.__('error.something_went_wrong'));
|
||||
});
|
||||
event.stopPropagation();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
Vue.component('image-search-component', {
|
||||
template: '#image-search-component-template',
|
||||
data: function() {
|
||||
return {
|
||||
uploadedImageUrl: ''
|
||||
Vue.component('close-btn', {
|
||||
template: '#close-btn-template',
|
||||
|
||||
methods: {
|
||||
togglePopup: function () {
|
||||
$('#cart-modal-content').hide();
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
methods: {
|
||||
uploadImage: function() {
|
||||
var imageInput = this.$refs.image_search_input;
|
||||
Vue.component('quantity-changer', {
|
||||
template: '#quantity-changer-template',
|
||||
inject: ['$validator'],
|
||||
props: {
|
||||
controlName: {
|
||||
type: String,
|
||||
default: 'quantity'
|
||||
},
|
||||
|
||||
if (imageInput.files && imageInput.files[0]) {
|
||||
if (imageInput.files[0].type.includes('image/')) {
|
||||
this.$root.showLoader();
|
||||
quantity: {
|
||||
type: [Number, String],
|
||||
default: 1
|
||||
},
|
||||
|
||||
var formData = new FormData();
|
||||
minQuantity: {
|
||||
type: [Number, String],
|
||||
default: 1
|
||||
},
|
||||
|
||||
formData.append('image', imageInput.files[0]);
|
||||
validations: {
|
||||
type: String,
|
||||
default: 'required|numeric|min_value:1'
|
||||
}
|
||||
},
|
||||
|
||||
axios.post(
|
||||
"{{ route('shop.image.search.upload') }}",
|
||||
formData,
|
||||
{
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
data: function() {
|
||||
return {
|
||||
qty: this.quantity
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
quantity: function (val) {
|
||||
this.qty = val;
|
||||
|
||||
this.$emit('onQtyUpdated', this.qty)
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
decreaseQty: function() {
|
||||
if (this.qty > this.minQuantity)
|
||||
this.qty = parseInt(this.qty) - 1;
|
||||
|
||||
this.$emit('onQtyUpdated', this.qty)
|
||||
},
|
||||
|
||||
increaseQty: function() {
|
||||
this.qty = parseInt(this.qty) + 1;
|
||||
|
||||
this.$emit('onQtyUpdated', this.qty)
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('logo-component', {
|
||||
template: '#logo-template',
|
||||
props: ['addClass'],
|
||||
});
|
||||
|
||||
Vue.component('searchbar-component', {
|
||||
template: '#searchbar-template',
|
||||
data: function () {
|
||||
return {
|
||||
compareCount: 0,
|
||||
wishlistCount: 0,
|
||||
searchedQuery: [],
|
||||
isCustomer: '{{ auth()->guard('customer')->user() ? "true" : "false" }}' == "true",
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
'$root.headerItemsCount': function () {
|
||||
this.updateHeaderItemsCount();
|
||||
}
|
||||
},
|
||||
|
||||
created: function () {
|
||||
let searchedItem = window.location.search.replace("?", "");
|
||||
searchedItem = searchedItem.split('&');
|
||||
|
||||
let updatedSearchedCollection = {};
|
||||
|
||||
searchedItem.forEach(item => {
|
||||
let splitedItem = item.split('=');
|
||||
updatedSearchedCollection[splitedItem[0]] = decodeURI(splitedItem[1]);
|
||||
});
|
||||
|
||||
if (updatedSearchedCollection['image-search'] == 1) {
|
||||
updatedSearchedCollection.term = '';
|
||||
}
|
||||
|
||||
this.searchedQuery = updatedSearchedCollection;
|
||||
|
||||
this.updateHeaderItemsCount();
|
||||
},
|
||||
|
||||
methods: {
|
||||
'focusInput': function (event) {
|
||||
$(event.target.parentElement.parentElement).find('input').focus();
|
||||
},
|
||||
|
||||
'updateHeaderItemsCount': function () {
|
||||
if (! this.isCustomer) {
|
||||
let comparedItems = this.getStorageValue('compared_product');
|
||||
let wishlistedItems = this.getStorageValue('wishlist_product');
|
||||
|
||||
if (wishlistedItems) {
|
||||
this.wishlistCount = wishlistedItems.length;
|
||||
}
|
||||
|
||||
if (comparedItems) {
|
||||
this.compareCount = comparedItems.length;
|
||||
}
|
||||
} else {
|
||||
this.$http.get(`${this.$root.baseUrl}/items-count`)
|
||||
.then(response => {
|
||||
this.compareCount = response.data.compareProductsCount;
|
||||
this.wishlistCount = response.data.wishlistedProductsCount;
|
||||
})
|
||||
.catch(exception => {
|
||||
console.log(this.__('error.something_went_wrong'));
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('image-search-component', {
|
||||
template: '#image-search-component-template',
|
||||
data: function() {
|
||||
return {
|
||||
uploadedImageUrl: ''
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
uploadImage: function() {
|
||||
var imageInput = this.$refs.image_search_input;
|
||||
|
||||
if (imageInput.files && imageInput.files[0]) {
|
||||
if (imageInput.files[0].type.includes('image/')) {
|
||||
this.$root.showLoader();
|
||||
|
||||
var formData = new FormData();
|
||||
|
||||
formData.append('image', imageInput.files[0]);
|
||||
|
||||
axios.post(
|
||||
"{{ route('shop.image.search.upload') }}",
|
||||
formData,
|
||||
{
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
}
|
||||
}
|
||||
}
|
||||
).then(response => {
|
||||
var net;
|
||||
var self = this;
|
||||
this.uploadedImageUrl = response.data;
|
||||
).then(response => {
|
||||
var net;
|
||||
var self = this;
|
||||
this.uploadedImageUrl = response.data;
|
||||
|
||||
|
||||
async function app() {
|
||||
var analysedResult = [];
|
||||
async function app() {
|
||||
var analysedResult = [];
|
||||
|
||||
var queryString = '';
|
||||
var queryString = '';
|
||||
|
||||
net = await mobilenet.load();
|
||||
net = await mobilenet.load();
|
||||
|
||||
const imgElement = document.getElementById('uploaded-image-url');
|
||||
const imgElement = document.getElementById('uploaded-image-url');
|
||||
|
||||
try {
|
||||
const result = await net.classify(imgElement);
|
||||
try {
|
||||
const result = await net.classify(imgElement);
|
||||
|
||||
result.forEach(function(value) {
|
||||
queryString = value.className.split(',');
|
||||
result.forEach(function(value) {
|
||||
queryString = value.className.split(',');
|
||||
|
||||
if (queryString.length > 1) {
|
||||
analysedResult = analysedResult.concat(queryString)
|
||||
} else {
|
||||
analysedResult.push(queryString[0])
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
self.$root.hideLoader();
|
||||
|
||||
window.showAlert(
|
||||
`alert-danger`,
|
||||
this.__('shop.general.alert.error'),
|
||||
"{{ __('shop::app.common.error') }}"
|
||||
);
|
||||
}
|
||||
|
||||
localStorage.searchedImageUrl = self.uploadedImageUrl;
|
||||
|
||||
queryString = localStorage.searched_terms = analysedResult.join('_');
|
||||
|
||||
if (queryString.length > 1) {
|
||||
analysedResult = analysedResult.concat(queryString)
|
||||
} else {
|
||||
analysedResult.push(queryString[0])
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
self.$root.hideLoader();
|
||||
|
||||
window.showAlert(
|
||||
`alert-danger`,
|
||||
this.__('shop.general.alert.error'),
|
||||
"{{ __('shop::app.common.error') }}"
|
||||
);
|
||||
window.location.href = "{{ route('shop.search.index') }}" + '?term=' + queryString + '&image-search=1';
|
||||
}
|
||||
|
||||
localStorage.searchedImageUrl = self.uploadedImageUrl;
|
||||
app();
|
||||
}).catch(() => {
|
||||
this.$root.hideLoader();
|
||||
|
||||
queryString = localStorage.searched_terms = analysedResult.join('_');
|
||||
window.showAlert(
|
||||
`alert-danger`,
|
||||
this.__('shop.general.alert.error'),
|
||||
"{{ __('shop::app.common.error') }}"
|
||||
);
|
||||
});
|
||||
} else {
|
||||
imageInput.value = '';
|
||||
|
||||
self.$root.hideLoader();
|
||||
|
||||
window.location.href = "{{ route('shop.search.index') }}" + '?term=' + queryString + '&image-search=1';
|
||||
}
|
||||
|
||||
app();
|
||||
}).catch(() => {
|
||||
this.$root.hideLoader();
|
||||
|
||||
window.showAlert(
|
||||
`alert-danger`,
|
||||
this.__('shop.general.alert.error'),
|
||||
"{{ __('shop::app.common.error') }}"
|
||||
);
|
||||
});
|
||||
} else {
|
||||
imageInput.value = '';
|
||||
|
||||
alert('Only images (.jpeg, .jpg, .png, ..) are allowed.');
|
||||
alert('Only images (.jpeg, .jpg, .png, ..) are allowed.');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
})()
|
||||
</script>
|
||||
});
|
||||
})()
|
||||
</script>
|
||||
@endpush
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
@php
|
||||
$velocityHelper = app('Webkul\Velocity\Helpers\Helper');
|
||||
$velocityMetaData = $velocityHelper->getVelocityMetaData();
|
||||
|
||||
|
||||
view()->share('velocityMetaData', $velocityMetaData);
|
||||
@endphp
|
||||
|
||||
|
|
@ -31,22 +31,6 @@
|
|||
<link rel="icon" sizes="16x16" href="{{ asset('/themes/velocity/assets/images/static/v-icon.png') }}" />
|
||||
@endif
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="{{ asset('themes/velocity/assets/js/jquery.min.js') }}">
|
||||
</script>
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
baseUrl="{{ url()->to('/') }}"
|
||||
src="{{ asset('themes/velocity/assets/js/velocity.js') }}">
|
||||
</script>
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="{{ asset('themes/velocity/assets/js/jquery.ez-plus.js') }}">
|
||||
</script>
|
||||
|
||||
@yield('head')
|
||||
|
||||
@section('seo')
|
||||
|
|
@ -204,6 +188,22 @@
|
|||
})();
|
||||
</script>
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="{{ asset('themes/velocity/assets/js/jquery.min.js') }}">
|
||||
</script>
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="{{ asset('themes/velocity/assets/js/jquery.ez-plus.js') }}">
|
||||
</script>
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
baseUrl="{{ url()->to('/') }}"
|
||||
src="{{ asset('themes/velocity/assets/js/velocity.js') }}">
|
||||
</script>
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="{{ asset('vendor/webkul/ui/assets/js/ui.js') }}">
|
||||
|
|
|
|||
|
|
@ -16,6 +16,8 @@ mix
|
|||
"js/velocity.js"
|
||||
)
|
||||
|
||||
.copy(__dirname + "/src/Resources/assets/images", publicPath + "/images")
|
||||
|
||||
.sass(
|
||||
__dirname + '/src/Resources/assets/sass/admin.scss',
|
||||
__dirname + '/' + publicPath + '/css/velocity-admin.css'
|
||||
|
|
|
|||
Loading…
Reference in New Issue