not launching vue on commerce pages

This commit is contained in:
Bachir Soussi Chiadmi 2019-10-07 17:32:14 +02:00
parent d5a6194727
commit dc3d0d1ca3
6 changed files with 72 additions and 127 deletions

File diff suppressed because one or more lines are too long

View File

@ -24,7 +24,7 @@ import { mapState } from 'vuex'
// require('theme/assets/styles/main.scss'); // require('theme/assets/styles/main.scss');
import 'theme/assets/styles/main.scss' import 'theme/assets/styles/main.scss'
(function(Drupal, drupalSettings) { (function(Drupal, drupalSettings, drupalDecoupled) {
var MaterioTheme = function(){ var MaterioTheme = function(){
@ -33,6 +33,7 @@ import 'theme/assets/styles/main.scss'
, _v_main_content; , _v_main_content;
var _is_front = drupalSettings.path.isFront; var _is_front = drupalSettings.path.isFront;
console.log('drupalSettings', drupalSettings); console.log('drupalSettings', drupalSettings);
// ___ _ _ // ___ _ _
@ -44,7 +45,14 @@ import 'theme/assets/styles/main.scss'
initVues() initVues()
} }
function checkNoVuePages(){
return drupalDecoupled.sys_path != '/cart'
&& drupalDecoupled.sys_path.indexOf('checkout') != 1;
}
function initVues(){ function initVues(){
// only launch views if we are not in commerce pages
if(checkNoVuePages()){
initVRouter(); initVRouter();
initVSiteBrandingBlock() initVSiteBrandingBlock()
initVPagetitleBlock() initVPagetitleBlock()
@ -53,6 +61,7 @@ import 'theme/assets/styles/main.scss'
initVMainContent() initVMainContent()
initVSearchBlock() initVSearchBlock()
} }
}
function initVRouter(){ function initVRouter(){
// we need this to update the title and body classes while using history nav // we need this to update the title and body classes while using history nav
@ -252,4 +261,4 @@ import 'theme/assets/styles/main.scss'
var materiotheme = new MaterioTheme(); var materiotheme = new MaterioTheme();
})(Drupal, drupalSettings); })(Drupal, drupalSettings, drupalDecoupled);

View File

@ -31,7 +31,7 @@
:styles="{width:'500px', height:'100%'}" :styles="{width:'500px', height:'100%'}"
> >
<h2>Please login or register before continue.</h2> <h2>Please login or register before continue.</h2>
<LoginRegister @onLogedIn="logedIn" /> <LoginRegister @onLogedIn="logedIn" @onRegistered="registered" />
</Modal> </Modal>
</article> </article>
@ -85,7 +85,11 @@ export default {
}, },
logedIn () { logedIn () {
console.log('Product: logedIn'); console.log('Product: logedIn');
this.closeModal() this.addtocart()
},
registered () {
console.log('Product: registered');
this.addtocart()
}, },
addtocart () { addtocart () {
console.log("addtocart") console.log("addtocart")
@ -97,9 +101,11 @@ export default {
}]) }])
.then(({ data }) => { .then(({ data }) => {
console.log('product add to cart REST: data', data) console.log('product add to cart REST: data', data)
this.closeModal()
// TODO: redirect to /cart
}) })
.catch(( error ) => { .catch(( error ) => {
console.warn('Issue with pricing', error) console.warn('Issue with product add to cart', error)
Promise.reject(error) Promise.reject(error)
}) })

View File

@ -1,45 +0,0 @@
<template>
<div id="cart">
<div class="loading" v-if="!false">
<span>Loading ...</span>
</div>
<div class="">
This the cart
</div>
</div>
</template>
<script>
// import Showroom from 'vuejs/components/Content/Showroom'
// import { mapState, mapActions } from 'vuex'
export default {
name: "cart",
// data() {
// return {
// items:[],
// page:0
// }
// },
// computed: {
// ...mapState({
// items: state => state.Showrooms.items
// })
// },
created(){
// if(!this.items.length)
// this.getItems()
},
methods: {
// ...mapActions({
// getItems: 'Showrooms/getItems'
// })
},
// components: {
// Showroom
// }
}
</script>
<style lang="scss" scoped>
</style>

View File

@ -0,0 +1,35 @@
<script>
import Vue from 'vue'
export default {
props: ['html'], // get the html from parent with props
data() {
return {
template: null // compiled template from html used in render
}
},
beforeMount() {
// console.log('Home beforeMount');
// compile the html src (coming from parent with props or from ajax call)
if(this.html){
console.log('html', this.html);
this.template = Vue.compile(this.html)
this.$options.staticRenderFns = []
this._staticTrees = []
this.template.staticRenderFns.map(fn => (this.$options.staticRenderFns.push(fn)))
}
},
render(h) {
if(!this.template){
return h('span', 'Loading ...')
}else{
return this.template.render.call(this)
}
}
}
</script>
<style lang="scss" scoped>
</style>

View File

@ -7,7 +7,7 @@ import Blabla from 'vuejs/components/Pages/Blabla'
import Article from 'vuejs/components/Pages/Article' import Article from 'vuejs/components/Pages/Article'
import Showrooms from 'vuejs/components/Pages/Showrooms' import Showrooms from 'vuejs/components/Pages/Showrooms'
import Pricing from 'vuejs/components/Pages/Pricing' import Pricing from 'vuejs/components/Pages/Pricing'
import Cart from 'vuejs/components/Pages/Cart' // import Cart from 'vuejs/components/Pages/Cart'
Vue.use(VueRouter) Vue.use(VueRouter)
@ -80,12 +80,12 @@ const routes = [
name:'pricing', name:'pricing',
path: `${basePath}pricing`, path: `${basePath}pricing`,
component: Pricing component: Pricing
},
{
name:'cart',
path: `${basePath}cart`,
component: Cart
} }
// {
// name:'cart',
// path: `${basePath}cart`,
// component: Cart
// }
] ]
export default new VueRouter({ export default new VueRouter({