shipping-portal/resources/assets/vue/app.js

/** Dependencies */
import Vue from 'vue'
import store from './vuex/store';
import VueGtag from 'vue-gtag'

window.route = require('./general/functions/router');

/** Guards */
import guards from './general/mixins/guards';

/** Validation **/
import vuelidate from 'vuelidate';

/** Input Mask **/
import VueTheMask from 'vue-the-mask';


/** Mixins */
import request from './general/mixins/request';
import crudHandler from './general/mixins/crudHandler';

/** Directives */
import closable from './general/directives/closable';

import Avatar from 'vue-avatar';

// define global variable
Vue.prototype.$qr_code_img_url = 'https://qrcode.tec-it.com/API/QRCode?data=';

/** Application Injections */
Vue.use(vuelidate);
Vue.use(VueTheMask);
Vue.directive('closable', closable);
Vue.directive('tooltip', function(el, binding){
    $(el).tooltip({
        title: binding.value,
        placement: binding.arg,
        trigger: 'hover'
    })
})
Vue.mixin({
    methods: {
        route: route
    },
    mixins: [request, crudHandler]
});

/** Components Registrations */
Vue.component(Avatar);

const files = require.context('./', true, /\.vue$/i);
files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default));

// Google Analytics 4 (GA4) Integration
Vue.use(VueGtag, {
    property: {
        id: 'G-SP04J05142',
        params: {
            user_id: store.getters.getUserId
        }
    }
});

const app = new Vue({
    el: '#app',
    store,
    created(){
        this.routesGuard();
    },
    methods: {
        route: route
    },
    mixins: [guards]
});