Differential D1423 Diff 4972 src/resources/vue/App.vue

Changeset View

Standalone View

src/resources/vue/App.vue

<template>		<template>
<router-view v-if="!isLoading && !routerReloading"></router-view>		<router-view v-if="!isLoading && !routerReloading" :key="key" @hook:mounted="childMounted"></router-view>
</template>		</template>

<script>		<script>
export default {		export default {
		computed: {
		key() {
		// The 'key' property is used to reload the Page component
		// whenever a route changes. Normally vue does not do that.
		return this.$route.name == '404' ? this.$route.path : 'static'
		}
		},
data() {		data() {
return {		return {
isLoading: true,		isLoading: true,
routerReloading: false		routerReloading: false
}		}
},		},
mounted() {		mounted() {
const token = localStorage.getItem('token')		const token = localStorage.getItem('token')
Show All 15 Lines	export default {
this.$root.errorHandler(error)		this.$root.errorHandler(error)
})		})
} else {		} else {
this.$root.stopLoading()		this.$root.stopLoading()
this.isLoading = false		this.isLoading = false
}		}
},		},
methods: {		methods: {
		childMounted() {
		this.$root.updateBodyClass()
		this.getFAQ()
		},
		getFAQ() {
		let page = this.$route.path

		if (page == '/' \|\| page == '/login') {
		return
		}

		axios.get('/content/faq' + page, { ignoreErrors: true })
		.then(response => {
		const result = response.data.faq
		$('#faq').remove()
		if (result && result.length) {
		let faq = $('<div id="faq" class="faq mt-3"><h5>FAQ</h5><ul class="pl-4"></ul></div>')
		let list = []

		result.forEach(item => {
		list.push($('<li>').append($('<a>').attr('href', item.href).text(item.title)))

		// Handle internal links with the vue-router
		if (item.href.charAt(0) == '/') {
		list[list.length-1].find('a').on('click', event => {
		event.preventDefault()
		this.$router.push(item.href)
		})
		}
		})

		faq.find('ul').append(list)
		$(this.$el).append(faq)
		}
		})
		},
routerReload() {		routerReload() {
// Together with beforeRouteUpdate even on a route component		// Together with beforeRouteUpdate even on a route component
// allows us to force reload the component. So it is possible		// allows us to force reload the component. So it is possible
// to jump from/to page that uses currently loaded component.		// to jump from/to page that uses currently loaded component.
this.routerReloading = true		this.routerReloading = true
this.$nextTick().then(() => {		this.$nextTick().then(() => {
this.routerReloading = false		this.routerReloading = false
})		})
}		}
}		}
}		}
</script>		</script>