import './bootstrap';

//import { createApp } from "vue";
import { createApp, defineAsyncComponent} from "vue";


import vuetify from "./vuetify";
import { DotLottiePlayer } from '@aarsteinmedia/dotlottie-player'


const Login = defineAsyncComponent(() => import('./components/auth/Login.vue'));
const Navigation = defineAsyncComponent(() => import('./components/Navigation.vue'));
const Home = defineAsyncComponent(() => import('./components/Home/Home.vue'));

const Department = defineAsyncComponent(() => import('./components/department/Department.vue'));
const Request = defineAsyncComponent(() => import('./components/request/Request.vue'));
const accessmanager = defineAsyncComponent(() => import('./components/access_manager/AccessManager.vue'));
const usersmanager = defineAsyncComponent(() => import('./components/users/Users.vue'));
const activate = defineAsyncComponent(() => import('./components/users/Activate.vue'));
const processuser = defineAsyncComponent(() => import('./components/access_manager/ProcessUser.vue'));
const globalsnackbar = defineAsyncComponent(() => import('./components/GlobalSnackbar.vue'));
const globaloverlay = defineAsyncComponent(() => import('./components/GlobalOverlay.vue'));
const globaloverlayemp = defineAsyncComponent(() => import('./components/GlobalOverlayWithoutLoading.vue'));

const adminmain = defineAsyncComponent(() => import('./components/admin/adminMain.vue'));

//Modals



const app = createApp({
    components: {
        Login,
        Navigation,
        Home,
        Department,
        Request,
        accessmanager,
        usersmanager,
        processuser,
        activate,
        globalsnackbar,
        globaloverlay,
        adminmain,
        globaloverlayemp
    },
    delimiters: ['%%', '%%'],

    data: () => ({
        csrfToken: '',
        error: {
            display: false,
            message: '',
            type: 'success'
        }
    }),

    methods: {
        axiosPost(url, data, params, showSnackBar = true) {
            let snackbar = this.$refs.snackbar;
            return new Promise((resolve, reject) => {
                return axios.post(url, data, {params: params}).then(response => {
                    if(response.data.message && showSnackBar) {
                        snackbar.showMessage(response.data.message, response.data.status);
                    }
                    setTimeout(() => { resolve({ response }) },300);
                }).catch(function (error) {
                    snackbar.showMessage(error+ '. Please Conatct DEV', 'Error');
                });
            });
        },

        axiosGet(url, showSnackBar = true) {
            let snackbar = this.$refs.snackbar;
            return new Promise((resolve, reject) => {
                return axios.get(url).then(response => {
                    if(response.data.message && showSnackBar) {
                        snackbar.showMessage(response.data.message, response.data.status);
                    }
                    setTimeout(() => { resolve({ response }) },300);
                }).catch(function (error) {
                    snackbar.showMessage(error+ '. Please Conatct DEV', 'Error');
                });
            });
        }
    },
    
    mounted() {
        this.csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
    },
});
app.component('DotLottiePlayer', DotLottiePlayer)
app.use(vuetify).mount("#app");
