izyim/resources/assets/vue/app.js

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

window.Vue = require('vue');

import Avatar from 'vue-avatar';
Vue.component('user-avatar', Avatar);

import SlideUpDown from 'vue-slide-up-down';
Vue.component('slide-up-down', SlideUpDown);

/**
 * Next, we will create a fresh Vue application instance and attach it to
 * the page. Then, you may begin adding components to this application
 * or customize the JavaScript scaffolding to fit your unique needs.
 */

//general elements

Vue.component('order-search-component', require('./components/common/OrdersSearchComponent.vue'));

Vue.component('loading-component', require('./components/common/LoadingComponent.vue'));
Vue.component('pagination-component', require('./components/common/PaginationComponent.vue'));
Vue.component('modal-component', require('./components/common/ModalComponent.vue'));
Vue.component('confirm-modal-component', require('./components/common/ConfirmModalComponent.vue'));
Vue.component('warning-message-component', require('./components/common/WarningMessageComponent.vue'));
Vue.component('accounts-search-component', require('./components/common/AccountsSearchComponent.vue'));
Vue.component('date-picker-component', require('./components/common/DatePickerComponent.vue'))

//form elements
Vue.component('file-selector', require('./components/form_elements/FileSelectorComponent.vue'));
Vue.component('select-component', require('./components/form_elements/SelectComponent.vue'));
Vue.component('address-component', require('./components/form_elements/AddressComponent.vue'));

//lists

Vue.component('search-order-list-component',require('./components/order/lists/SearchOrdersComponent.vue'));

Vue.component('invite-account-list-component',require('./components/account/lists/AccountsInviteListComponent.vue'));

Vue.component('accounts-list-component', require('./components/account/lists/AccountsListComponent.vue'));
Vue.component('invite-account-list-component', require('./components/account/lists/AccountsInviteListComponent.vue'));


Vue.component('companies-list-component', require('./components/company/lists/CompaniesListComponenet.vue'));
Vue.component('address-book-list-component', require('./components/company/lists/AddressListComponenet.vue'));

Vue.component('contact-list-component', require('./components/contact/list/ContactListComponenet.vue'));

Vue.component('warehouses-list-component', require('./components/warehouse/lists/WarehousesListComponenet.vue'));

Vue.component('orders-list-component', require('./components/order/lists/OrdersListComponent.vue'));
Vue.component('orders-select-list-component', require('./components/order/lists/OrdersSelectListComponent.vue'));

//elements

Vue.component('search-order-component', require('./components/order/elements/SearchOrderComponent.vue'));


Vue.component('invite-account-component',require('./components/account/elements/AccountInviteComponent.vue'));
Vue.component('account-component', require('./components/account/elements/AccountComponent.vue'));
Vue.component('invite-account-component', require('./components/account/elements/AccountInviteComponent.vue'));

Vue.component('company-profile-component', require('./components/company/elements/CompanyProfileComponenet.vue'));
Vue.component('company-summary-component', require('./components/company/elements/CompanySummaryComponenet.vue'));
Vue.component('company-component', require('./components/company/elements/CompanyComponenet.vue'));
Vue.component('address-book-component', require('./components/company/elements/AddressBookComponenet.vue'));
Vue.component('contact-component', require('./components/contact/elements/ContactComponenet.vue'));

Vue.component('warehouse-profile-component', require('./components/warehouse/elements/WarehouseProfileComponenet.vue'));
Vue.component('warehouse-component', require('./components/warehouse/elements/WarehouseComponenet.vue'));
Vue.component('warehouse-summary-component', require('./components/warehouse/elements/WarehouseSummaryComponenet.vue'));

Vue.component('order-page-component', require('./components/order/elements/OrdersPageComponent.vue'));

Vue.component('order-select-component', require('./components/order/elements/OrderSelectComponent.vue'));

Vue.component('order-component', require('./components/order/elements/OrderComponenet.vue'));
Vue.component('order-profile-component', require('./components/order/elements/OrderProfileComponent.vue'));
Vue.component('order-header-component', require('./components/order/elements/OrderHeaderComponenet.vue'));
Vue.component('order-action-component', require('./components/order/elements/OrderActionComponenet.vue'));
Vue.component('order-delivery-address-component', require('./components/order/elements/OrderDeliveryAddressComponenet.vue'));
Vue.component('order-history-component', require('./components/order/elements/OrderHistoryComponenet.vue'));
Vue.component('order-quick-view-component', require('./components/order/elements/OrderQuickViewComponenet.vue'));


Vue.component('action-date-component', require('./components/order/elements/steps/ActionDateComponenet.vue'));

Vue.component('confirm-order-component', require('./components/order/elements/steps/ConfirmOrderComponent.vue'));
Vue.component('receive-step-component', require('./components/order/elements/steps/ReceiveStepComponenet.vue'));
Vue.component('packing-step-component', require('./components/order/elements/steps/PackingStepComponenet.vue'));
Vue.component('supplier-packing-step-component', require('./components/order/elements/steps/SupplierPackingStepComponenet.vue'));
Vue.component('shipping-step-component', require('./components/order/elements/steps/ShippingStepComponenet.vue'));
Vue.component('arrival-step-component', require('./components/order/elements/steps/ArrivalStepComponenet.vue'));
Vue.component('unpacking-step-component', require('./components/order/elements/steps/UnpackingStepComponenet.vue'));
Vue.component('delivery-step-component', require('./components/order/elements/steps/DeliveryStepComponenet.vue'));

//forms
Vue.component('invite-account-form-component', require('./components/account/forms/InviteAccountFormComponent.vue'));

Vue.component('company-form-component', require('./components/company/forms/CompanyFormComponent.vue'));
Vue.component('address-book-form-component', require('./components/company/forms/AddressBookFormComponent.vue'));

Vue.component('contact-form-component', require('./components/contact/forms/ContactFormComponent.vue'));

Vue.component('warehouse-form-component', require('./components/warehouse/forms/WarehouseFormComponent.vue'));

Vue.component('order-form-component', require('./components/order/forms/OrderFormComponent.vue'));
Vue.component('addon-order-form-component', require('./components/order/forms/AddonOrderFormComponent.vue'));
Vue.component('warehouse-receive-note-form-component', require('./components/order/forms/WarehouseReceiveNoteFormComponent.vue'));
Vue.component('packing-list-form-component', require('./components/order/forms/PackingFormComponenet.vue'));
Vue.component('shipping-arrangement-form-component', require('./components/order/forms/ShippingArrangmentFormComponenet.vue'));
Vue.component('delivery-arrangement-form-component', require('./components/order/forms/DeliveryArrangmentFormComponenet.vue'));


Vue.component('notification-component', require('./components/common/NotificationComponent.vue'));
Vue.component('company-error-notification-component', require('./components/company/notifications/CompanyErrorComponent.vue'));


Vue.component('cbm-order-chart-component', require('./components/dashboard/elements/CbmVsOrdersChartComponent.vue'));
Vue.component('customer-chart-component', require('./components/dashboard/elements/CustomerChartComponent.vue'));
Vue.component('order-status-chart-component', require('./components/dashboard/elements/OrderStatusChartComponent.vue'));


window.Event = new Vue();

if($('#header').length >0 ) {
    const header = new Vue({
        el: '#header'
    });
}

if($('#app').length >0 ) {
    const app = new Vue({
        el: '#app',
        provide() {
            const countriesList = {};
            Object.defineProperty(countriesList, 'countries', {
                enumerable: true,
                get: () => this.countries
            });
            return {
                countriesList
            }
        },
        data() {
            return {
                countries: []
            }
        },
        created() {
            this.fetchCountries();
        },
        methods: {
            fetchCountries() {
                fetch(route('api.service.list.countries')).then(response => response.json())
                    .then(response => {
                        this.countries = $.map(response, function (value, key) {
                            return {'id': value.name, 'text': value.name};
                        });
                    })
                    .catch(error => console.log(error))
            }
        }
    });
}