Differential D925 Diff 2176 src/resources/js/app.js

Changeset View

Standalone View

src/resources/js/app.js

	/**			/**
	* First we will load all of this project's JavaScript dependencies which			* First we will load all of this project's JavaScript dependencies which
	* includes Vue and other libraries. It is a great starting point when			* includes Vue and other libraries. It is a great starting point when
	* building robust, powerful web applications using Vue and Laravel.			* building robust, powerful web applications using Vue and Laravel.
	*/			*/

	require('./bootstrap')			require('./bootstrap')

	window.Vue = require('vue')			window.Vue = require('vue')

	import AppComponent from '../vue/components/App'			import AppComponent from '../vue/components/App'
	import MenuComponent from '../vue/components/Menu'			import MenuComponent from '../vue/components/Menu'
	import router from '../vue/js/routes.js'			import router from '../vue/js/routes.js'
				import store from '../vue/js/store'
	import VueToastr from '@deveodk/vue-toastr'			import VueToastr from '@deveodk/vue-toastr'

	// Add a response interceptor for general/validation error handler			// Add a response interceptor for general/validation error handler
	// This have to be before Vue and Router setup. Otherwise we would			// This have to be before Vue and Router setup. Otherwise we would
	// not be able to handle axios responses initiated from inside			// not be able to handle axios responses initiated from inside
	// components created/mounted handlers (e.g. signup code verification link)			// components created/mounted handlers (e.g. signup code verification link)
	window.axios.interceptors.response.use(			window.axios.interceptors.response.use(
	response => {			response => {
	Show All 38 Lines
	)			)

	const app = new Vue({			const app = new Vue({
	el: '#app',			el: '#app',
	components: {			components: {
	'app-component': AppComponent,			'app-component': AppComponent,
	'menu-component': MenuComponent			'menu-component': MenuComponent
	},			},
				store,
	router,			router,
				data() {
				return {
				isLoading: true
				}
				},
	mounted() {			mounted() {
	this.$root.$on('clearFormValidation', (form) => {			this.$root.$on('clearFormValidation', (form) => {
	this.clearFormValidation(form)			this.clearFormValidation(form)
	})			})
	},			},
	methods: {			methods: {
	clearFormValidation: form => {			// Clear (bootstrap) form validation state
				clearFormValidation(form) {
	$(form).find('.is-invalid').removeClass('is-invalid')			$(form).find('.is-invalid').removeClass('is-invalid')
	$(form).find('.invalid-feedback').remove()			$(form).find('.invalid-feedback').remove()
				},
				// Set user state to "logged in"
				loginUser(token) {
				store.commit('loginUser')
				localStorage.setItem('token', token)
				axios.defaults.headers.common.Authorization = 'Bearer ' + token
				router.push({ name: 'dashboard' })
				},
				// Set user state to "not logged in"
				logoutUser() {
				store.commit('logoutUser')
				localStorage.setItem('token', '')
				delete axios.defaults.headers.common.Authorization
				router.push({ name: 'login' })
				},
				// Display "loading" overlay (to be used by route components)
				startLoading() {
				this.isLoading = true
				// Lock the UI with the 'loading...' element
				$('#app').append($('<div class="app-loader"><div class="spinner-border" role="status"><span class="sr-only">Loading</span></div></div>'))
				},
				// Hide "loading" overlay
				stopLoading() {
				$('#app > .app-loader').fadeOut()
				this.isLoading = false
	}			}
	}			}
	})			})

	Vue.use(VueToastr, {			Vue.use(VueToastr, {
	defaultPosition: 'toast-bottom-right',			defaultPosition: 'toast-bottom-right',
	defaultTimeout: 50000			defaultTimeout: 50000
	})			})