Merge branch 'dev'

client-app/src/common/constants.ts

@@ -8,6 +8,10 @@ export const baseUrl = window.BASE_URL.replace(`/${storeName}`, "/")
   .replace(`/${locale}`, "/")
   .replace(/[/]+$/, "");
 
+export const fullBaseUrl = `${baseUrl}/${storeName}/${locale}/`;
+export const loginUrl = `${fullBaseUrl}account/login`;
+export const accessDeniedUrl = `${fullBaseUrl}error/AccessDenied`;
+
 // Other constants can be placed here
 export const pageSizes = [10, 20, 50, 100]
 export const defaultPageSize = 10;

client-app/src/common/permissions.ts

@@ -0,0 +1,11 @@
+export default class StorefrontPermissions {
+  static CanSeeOrganizationDetail = "storefront:organization:view";
+  static CanEditOrganization = "storefront:organization:edit";
+  static CanInviteUsers = "storefront:user:invite";
+  static CanCreateUsers = "storefront:user:create";
+  static CanEditUsers = "storefront:user:edit";
+  static CanDeleteUsers = "storefront:user:delete";
+  static CanViewUsers = "storefront:user:view";
+  static CanViewOrders = "storefront:order:view";
+  static CanChangeOrderStatus = "storefront:order:changestatus";
+}

client-app/src/common/services/api-clients.service.ts

@@ -1,11 +1,12 @@
 import Vue from 'vue';
 import { ApiAccountClient, ApiCartClient, ApiCatalogClient, ApiOrderClient, ApiPricingClient } from '@common/api/api-clients';
 import { baseUrl } from '@common/constants';
+import axios from "@common/services/axios-instance";
 
 // There is globals instances of api clients fore shared usage.
 // Add here new global instance any api client class if you need.
-export const accountClient = new ApiAccountClient(baseUrl, Vue.axios);
-export const catalogClient = new ApiCatalogClient(baseUrl, Vue.axios);
-export const cartClient = new ApiCartClient(baseUrl, Vue.axios);
-export const orderClient = new ApiOrderClient(baseUrl, Vue.axios);
-export const pricingClient = new ApiPricingClient(baseUrl, Vue.axios);
+export const accountClient = new ApiAccountClient(baseUrl, axios);
+export const catalogClient = new ApiCatalogClient(baseUrl, axios);
+export const cartClient = new ApiCartClient(baseUrl, axios);
+export const orderClient = new ApiOrderClient(baseUrl, axios);
+export const pricingClient = new ApiPricingClient(baseUrl, axios);

client-app/src/common/services/axios-instance.ts

@@ -0,0 +1,25 @@
+import axios from "axios";
+import { baseUrl, loginUrl, accessDeniedUrl } from '@common/constants';
+
+const axiosInstance = axios.create();
+
+axiosInstance.defaults.baseURL = baseUrl;
+axiosInstance.interceptors.response.use(
+  function (response) {
+    return response;
+  },
+  function (error) {
+    if (error.response.status) {
+      switch(error.response.status){
+      case 401:
+        window.location.assign(loginUrl);
+        break;
+      case 403:
+        window.location.assign(accessDeniedUrl);
+        break;
+      }
+    }
+    return Promise.reject(error)
+  });
+
+export default axiosInstance;

client-app/src/common/services/initialization.service.ts

@@ -7,9 +7,8 @@ import Vuelidate from 'vuelidate';
 import { library, dom } from '@fortawesome/fontawesome-svg-core';
 import { faHeartBroken, faLock, faMeteor } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon, FontAwesomeLayers } from "@fortawesome/vue-fontawesome";
-import axios from "axios";
-import { ButtonPlugin, CollapsePlugin, PaginationPlugin, TablePlugin, ToastPlugin, ModalPlugin, CardPlugin, DropdownPlugin, FormCheckboxPlugin, FormGroupPlugin, FormDatepickerPlugin, FormInputPlugin, FormPlugin, FormSelectPlugin, InputGroupPlugin, TooltipPlugin } from 'bootstrap-vue'
-import { baseUrl } from "@common/constants";
+import { ButtonPlugin, CollapsePlugin, PaginationPlugin, TablePlugin, ToastPlugin, ModalPlugin, CardPlugin, DropdownPlugin, FormCheckboxPlugin, FormGroupPlugin, FormDatepickerPlugin, FormInputPlugin, FormPlugin, FormSelectPlugin, InputGroupPlugin, TooltipPlugin } from 'bootstrap-vue';
+import axios from "@common/services/axios-instance";
 
 export default class InitializationService {
   static initializeCommon() {
@@ -24,12 +23,10 @@ export default class InitializationService {
       }
     };
 
+    //plugins
     Vue.use(VueRx);
-
     Vue.use(VueAxios, axios);
-    Vue.axios.defaults.baseURL = baseUrl;
 
-    //plugins
     // workaround because of unstable build caused by broken .d.ts
     // eslint-disable-next-line @typescript-eslint/no-var-requires
     Vue.use(require("vue-moment"));

client-app/src/common/services/url.service.ts

@@ -0,0 +1,15 @@
+import { baseUrl, locale, storeName, defaultPageSize } from "@common/constants";
+
+export default class UrlService{
+  static get fullBaseUrl(){
+    return `${baseUrl}/${storeName}/${locale}/`
+  }
+
+  static get loginUrl() {
+    return `${this.fullBaseUrl}account/login`;
+  }
+
+  static get accessDeniedUrl() {
+    return `${this.fullBaseUrl}error/AccessDenied`;
+  }
+}

client-app/src/pages/account/App.vue

@@ -10,15 +10,15 @@
           {{ $t('account.menu_titles.home') }}
         </router-link>
       </li>
-      <li class="nav-item">
+      <li v-if="$can($permissions.CanViewOrders)" class="nav-item">
         <router-link to="orders"
                      active-class="border-bottom-0 border-primary"
                      tag="a"
                      class="nav-link">
           {{ $t('account.menu_titles.orders') }}
         </router-link>
       </li>
-      <li class="nav-item">
+      <li v-if="$can($permissions.CanViewUsers)" class="nav-item">
         <router-link to="users"
                      active-class="border-bottom-0 border-primary"
                      tag="a"
@@ -27,15 +27,17 @@
         </router-link>
       </li>
       <li class="nav-item">
-        <router-link to="invoices"
+        <router-link v-if="$can($permissions.CanViewOrders)"
+                     to="invoices"
                      active-class="border-bottom-0 border-primary"
                      tag="a"
                      class="nav-link">
           {{ $t('account.menu_titles.invoices') }}
         </router-link>
       </li>
       <li class="nav-item">
-        <router-link to="payments"
+        <router-link v-if="$can($permissions.CanViewOrders)"
+                     to="payments"
                      active-class="border-bottom-0 border-primary"
                      tag="a"
                      class="nav-link">
@@ -50,11 +52,15 @@
 <script lang="ts">
 import Vue from "vue";
 import Component from "vue-class-component";
+import { namespace } from "vuex-class";
+
 
 @Component({
   name: "home"
 })
 export default class App extends Vue {
+
+  // todo: remove
   throwError() {
     throw new Error();
   }

client-app/src/pages/account/main.ts

@@ -1,15 +1,24 @@
 import Vue from "vue";
 import i18n from "@i18n";
+import { AuthorizationPlugin } from "plugins/authorization/authorization.plugin";
+import { FETCH_PROFILE } from "plugins/authorization/store-profile/definitions";
 import App from "@account/App.vue";
 import router from "@account/router";
 import store from "@account/store";
-import InitializationService from '@common/services/initialization.service';
+import InitializationService from "@common/services/initialization.service";
 
 InitializationService.initializeCommon();
 
-new Vue({
-  i18n,
-  router,
-  store,
-  render: h => h(App)
-}).$mount("#app");
+//custom plugins
+Vue.use(AuthorizationPlugin, {store});
+
+store.dispatch(`profileModule/${FETCH_PROFILE}`).then(() =>{
+
+  new Vue({
+    i18n,
+    router,
+    store,
+    render: h => h(App)
+  }).$mount("#app");
+
+});

client-app/src/pages/account/router/index.ts

@@ -1,32 +1,73 @@
 import Vue from "vue";
 import VueRouter from "vue-router";
+import i18n from "@i18n";
 import AccountInfo from "@account/views/account-info/index.vue";
 import AccountInvoices from '@account/views/account-invoices/index.vue';
 import AccountOrders from "@account/views/account-orders/index.vue";
 import AccountPayments from '@account/views/account-payments/index.vue';
 import AccountUsers from "@account/views/account-users/index.vue";
+import { accessDeniedUrl } from '@common/constants';
+import Permissions from "@common/permissions"
 
 Vue.use(VueRouter);
 
+
+const beforeEnterWithPermissions = (to: any, from: any, next: any, ...permissions: string[]) => {
+  const authResult = Vue.$can( ...permissions);
+  if(authResult){
+    next();
+  } else {
+    window.location.assign(accessDeniedUrl);
+  }
+}
+
 const routes = [
   {
     path: "/",
-    component: AccountInfo },
+    component: AccountInfo,
+    meta: {
+      title: i18n.t('account.menu_titles.home')
+    }
+  },
   {
     path: "/orders",
-    component: AccountOrders
+    component: AccountOrders,
+    meta: {
+      title: i18n.t('account.menu_titles.orders')
+    },
+    beforeEnter: (to: any, from: any, next: any) => {
+      beforeEnterWithPermissions(to,from,next, Permissions.CanViewOrders);
+    }
   },
   {
     path: "/users",
-    component: AccountUsers
+    component: AccountUsers,
+    meta: {
+      title: i18n.t('account.menu_titles.users')
+    },
+    beforeEnter: (to: any, from: any, next: any) => {
+      beforeEnterWithPermissions(to,from,next, Permissions.CanViewUsers);
+    }
   },
   {
     path: "/invoices",
-    component: AccountInvoices
+    component: AccountInvoices,
+    meta: {
+      title: i18n.t('account.menu_titles.invoices')
+    },
+    beforeEnter: (to: any, from: any, next: any) => {
+      beforeEnterWithPermissions(to,from,next, Permissions.CanViewOrders);
+    }
   },
   {
     path: "/payments",
-    component: AccountPayments
+    component: AccountPayments,
+    meta: {
+      title: i18n.t('account.menu_titles.payments')
+    },
+    beforeEnter: (to: any, from: any, next: any) => {
+      beforeEnterWithPermissions(to,from,next, Permissions.CanViewOrders);
+    }
   }
 ];
 
@@ -36,4 +77,10 @@ const router = new VueRouter({
   routes
 });
 
+router.beforeEach((toRoute, fromRoute, next) => {
+  window.document.title = toRoute.meta && toRoute.meta.title ?
+    toRoute.meta.title : i18n.t('account.menu_titles.home');
+  next();
+})
+
 export default router;

client-app/src/pages/account/store/index.ts

@@ -3,9 +3,9 @@ import Vuex, { Store, StoreOptions } from "vuex";
 import invoicesListModule from "@account/store/modules/invoices-list";
 import ordersListModule from "@account/store/modules/orders-list";
 import paymentsListModule from "@account/store/modules/payments-list";
-import profileModule from "@account/store/modules/profile";
 import usersListModule from "@account/store/modules/users-list";
-import { RootState } from "./types";
+import { RootState } from './types';
+
 
 const debug = process.env.NODE_ENV !== "production";
 
@@ -16,14 +16,13 @@ const store: StoreOptions<RootState> = {
     isLoading : false,
     loaded : false
   },
+  strict: debug,
   modules: {
-    ordersListModule,
-    profileModule,
-    usersListModule,
     invoicesListModule,
-    paymentsListModule
-  },
-  strict: debug
+    ordersListModule,
+    paymentsListModule,
+    usersListModule
+  }
 };
 
 export default new Store<RootState>(store);

client-app/src/pages/account/store/modules/invoices-list/actions.ts

@@ -1,10 +1,10 @@
 import { ActionTree } from "vuex";
+import { RootState } from '@account/store/types';
 import { PaymentSearchCriteria } from '@common/api/api-clients';
 import { storeName, locale } from '@common/constants';
 import { orderClient } from '@common/services/api-clients.service';
-import { RootState } from "../../types";
-import { FETCH_INVOICES, SET_INVOICES_LIST_CONFIG, GET_INVOICE_PDF } from "./definitions";
-import { SET_INVOICES, SET_INVOICE_PDF } from "./mutations"
+import { FETCH_INVOICES, SET_INVOICES_LIST_CONFIG } from "./definitions";
+import { SET_INVOICES } from "./mutations"
 import { InvoicesListState, InvoicesListConfig } from "./types";
 
 
@@ -26,10 +26,5 @@ export const actions: ActionTree<InvoicesListState, RootState> = {
   async [SET_INVOICES_LIST_CONFIG](context , payload: InvoicesListConfig) {
     context.commit(SET_INVOICES_LIST_CONFIG, payload);
     context.dispatch(FETCH_INVOICES);
-  },
-  async [GET_INVOICE_PDF](context, payload: string) {
-    context.commit(FETCH_INVOICES);
-    await orderClient.getInvoicePdf(payload, storeName, locale);
-    context.commit(SET_INVOICE_PDF);
   }
 };

client-app/src/pages/account/store/modules/invoices-list/definitions.ts

@@ -1,4 +1,3 @@
 export const FETCH_INVOICES = "fetchInvoices";
-export const GET_INVOICE_PDF = "getInvoicePdf";
 
 export const SET_INVOICES_LIST_CONFIG = "setInvoicesListConfig";

client-app/src/pages/account/store/modules/invoices-list/getters.ts

@@ -1,6 +1,6 @@
 import { GetterTree } from "vuex";
+import { RootState } from '@account/store/types';
 import { PaymentIn } from "@common/api/api-clients";
-import { RootState } from "../../types";
 import { InvoicesListState, InvoicesList } from "./types";
 
 // getters