require('./bootstrap');
require('@thyrith/momentkh')(moment);
window.Vue = require('vue').default;
window.Fire = new Vue;
Vue.config.productionTip = false;
import App from './App.vue';
import VueI18n from 'vue-i18n';
import { router } from './router';
import store from "./store/index";
import mixin from "./mixins";
import Form from 'vform'
import Multiselect from '@vueform/multiselect/dist/multiselect.vue2.js'
import '@vueform/multiselect/themes/default.css';
import Toast from "vue-toastification";
import "vue-toastification/dist/index.css";
import VueConfirmDialog from 'vue-confirm-dialog'
import Suggestions from 'v-suggestions'
import 'v-suggestions/dist/v-suggestions.css'
import DatePicker from 'vue2-datepicker';
import 'vue2-datepicker/index.css';
import moment from 'moment'
import VueProgressBar from 'vue-progressbar'
import SortFilter from "./components/SortFilter.vue";

// import VueLoading from 'vuejs-loading-plugin'
import InputTag from 'vue-input-tag'
import Vue2Filters from 'vue2-filters';
import Vue from 'vue';
import VueHtmlToPaper from 'vue-html-to-paper';
import VueApexCharts from 'vue-apexcharts';
import funLoading from './loading.js';

Vue.use(funLoading);

const options = {
    name: '_blank',
    specs: [
        'fullscreen=yes',
        'titlebar=yes',
        'scrollbars=yes'
    ],
    styles: [
        './css/app.css',
        '/css/style-print.css'
    ],
    timeout: 1000,
    autoClose: true,
    windowTitle: window.document.title,
}
Vue.component("SortFilter", SortFilter);
Vue.use(VueHtmlToPaper, options);

window.Form = Form;
Vue.use(VueI18n);
Vue.use(Vue2Filters);
Vue.use(VueApexCharts);
Vue.component('apexchart', VueApexCharts)
Vue.use(Toast);
Vue.use(VueConfirmDialog)
Vue.component('vue-confirm-dialog', VueConfirmDialog.default)
Vue.component('pagination', require('laravel-vue-pagination'));
Vue.component("Multiselect", Multiselect);
Vue.component('suggestions', Suggestions)
Vue.component('input-tag', InputTag)
Vue.mixin(mixin);
Vue.use(DatePicker);
// Vue.use(moment);
Vue.use(VueProgressBar, {
    color: '#43AF82',
    failedColor: '#DC3545',
    thickness: '4px',
    transition: {
        speed: '0.2s',
        opacity: '0.6s',
        termination: 300
    },
    autoRevert: true,
    location: 'top',
    inverse: false
})

Vue.filter('onlyDate', function (value) {
    if (value) {
        return moment(String(value), "YYYY-MM-DD HH:mm:ss").format('DD/MM/YYYY')
    }
});
Vue.filter('dateTime', function(value) {
    if (value) {
        return moment(String(value)).format('DD-MM-YYYY hh:mm a')
    }
});
Vue.filter('numberFomartValue', function(value) {
    if (value) {
        return value.toLocaleString();
    } else {
        return 0;
    }
});
Vue.filter('onlyDay', function(value) {
    if (value) {
      return moment(String(value)).format('DD')
    }
});
Vue.filter('onlyMonth', function (value) {
    if (value) {
      const khmerMonths = {
        Jan: 'មករា',
        Feb: 'កុម្ភៈ',
        Mar: 'មីនា',
        Apr: 'មេសា',
        May: 'ឧសភា',
        Jun: 'មិថុនា',
        Jul: 'កក្កដា',
        Aug: 'សីហា',
        Sep: 'កញ្ញា',
        Oct: 'តុលា',
        Nov: 'វិច្ឆិកា',
        Dec: 'ធ្នូ'
      };
      const monthAbbr = moment(String(value)).format('MMM'); // Get the short month name
      return khmerMonths[monthAbbr] || monthAbbr; // Return Khmer month name or fallback
    }
    return ''; // Fallback if value is falsy
  });
  Vue.filter('onlyYear', function(value) {
      if (value) {
        return moment(String(value)).format('YYYY')
      }
  });
  Vue.filter('onlyMonthKh', function (value) {
    if (value) {
      const khmerMonths = {
        Jan: 'បុស្ស',
        Feb: 'មាឃ',
        Mar: 'ផល្គុន',
        Apr: 'ចេត្រ',
        May: 'ពិសាខ',
        Jun: 'ជេស្ឋ',
        Jul: 'អាសាធ',
        Aug: 'ស្រាពណ៌',
        Sep: 'ភទ្របទ',
        Oct: 'អស្សុជ',
        Nov: 'កត្តិក',
        Dec: 'មិគសិរ'
      };
      const monthAbbr = moment(String(value)).format('MMM');
      return khmerMonths[monthAbbr] || monthAbbr; // Return Khmer month name or fallback
    }
    return value;
  });
  Vue.filter('khmerYear', function(year) {
    if (!year) return year;
    const khmerYear = year + 543; // Add 543 to convert to Khmer year
    const khmerNumbers = ["០", "១", "២", "៣", "៤", "៥", "៦", "៧", "៨", "៩"]; // Khmer digits
    const khmerYearString = khmerYear.toString().split('').map(digit => khmerNumbers[parseInt(digit)]).join('');

    return `ឆ្នាំរោង ព.ស ${khmerYearString}`; // Returning the full Khmer year string
  });

const i18n = new VueI18n({
    locale: localStorage.getItem("lang") || "km",
    messages: {
        en: require("./assets/i18n/en"),
        km: require("./assets/i18n/km")
    }
});
Vue.mixin({
  data(){
    return{
      // company: "",
      user_branch :'',
      user_type : '',
    //   branch_name : '',
    }
  },
  methods:{
    // funGetCompany() {
    //     axios.get("admin-api/get-company-info").then((res) => {
    //         this.company = res.data;
    //         localStorage.setItem("company", JSON.stringify(res.data));
    //     });
    // },
    funComUserBranch(){
      axios.get('system/com-user-branch').then((res) => {
        this.user_branch = res.data.branch_id;
        this.user_type = res.data.user_type;
        localStorage.user_branch = JSON.stringify(res.data);
      });
    },
    // funBranchName(){
    //   axios.get('system/user-branch-name').then((res) => {
    //     this.branch_name = res.data.data.name;
    //     alert(res.data.data.name);
    //   });
    // }
  }
})
new Vue({
    el: '#app',
    router,
    store,
    i18n,
    render: h => h(App),
});
