require('./bootstrap');
const routes = require('./routes');

import Vue from 'vue';
import IforcComponent from "./components/IforcComponent";
import moment from 'moment';
import VueRouter from 'vue-router';
import FooterWidget from './widgets/FooterWidget';
import NavbarWidget from './widgets/NavbarWidget';
import SidebarWidget from './widgets/SidebarWidget';
import VueSelect from '@desislavsd/vue-select'
import { DataTables } from 'vue-data-tables'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

import lang from 'element-ui/lib/locale/lang/es';
import locale from 'element-ui/lib/locale';
import VueDatePicker from '@mathieustan/vue-datepicker';
import '@mathieustan/vue-datepicker/dist/vue-datepicker.min.css';




Vue.use(VueSelect, {
    name: 'vueSelect',
    mixin: {}
});

locale.use(lang)
const PluginLaravelPermissions = {
    install(Vue, options) {
        Vue.prototype.LaravelPermission = window.LaravelPermission;
    },
}

const PluginAccessToken = {
    install(Vue, options) {
        Vue.prototype.AccessToken = window.AT;
    },
}

const PluginUserData = {
    install(Vue, options) {
        Vue.prototype.UserData = window.localStorage.getItem('userDataIF') ? JSON.parse(window.localStorage.getItem('userDataIF')) : null;
    },
}

Vue.filter('formatDate', function (value) {
    if (value) {
        return moment(String(value)).format('DD/MM/YYYY hh:mm A')
    }
});

Vue.filter('formatDateSimple', function (value) {
    if (value) {
        return moment(String(value)).format('DD/MM/YYYY')
    }
});

Vue.use(VueDatePicker);
Vue.use(ElementUI);
Vue.use(DataTables);
Vue.use(VueRouter);
Vue.use(PluginLaravelPermissions);
Vue.use(PluginAccessToken);
Vue.use(PluginUserData);
Vue.use(VueSelect, {
    name: 'vueSelect',
    mixin: {}
});

Vue.prototype.$appName = 'Administración web de Escuelas de Partición';

const router = new VueRouter({
    routes: routes.routes,
    mode: 'history',
    history: true,
    linkActiveClass: "active"
});




const app = new Vue({
    el: '#iforc',
    router: router,
    data: {},
    components: {
        NavbarWidget,
        FooterWidget,
        SidebarWidget,
        VueDatePicker,
        IforcComponent,
        vueSelect: VueSelect.vueSelect
    }
});