@lancom/shared 0.0.325 → 0.0.327

package/assets/js/api/admin.js

@@ -146,6 +146,9 @@ export default {
   markShipmentAsDispatched(order, shipment) {
     return _post(`admin/shop/${order.shop?._id || order.shop}/order/${order._id}/shipment/${shipment._id || shipment.guid}/dispatched`, shipment);
   },
+  markShipmentAsHasException(order, shipment) {
+    return _post(`admin/shop/${order.shop?._id || order.shop}/order/${order._id}/shipment/${shipment._id || shipment.guid}/has-exception`, shipment);
+  },
   markSubOrderAsDispatched(order, subOrder) {
     return _post(`admin/shop/${order.shop?._id || order.shop}/order/${order._id}/sub-order/${subOrder._id}/dispatched`, subOrder);
   },
@@ -197,6 +200,18 @@ export default {
   removePage(id) {
     return _delete(`admin/pages/${id}`);
   },
+  fetchCategories(params) {
+    return _get('admin/categories', params);
+  },
+  fetchCategoryById(id) {
+    return _get(`admin/categories/${id}`);
+  },
+  saveCategory(category) {
+    return category._id ? _put(`admin/categories/${category._id}`, category) : _post('admin/categories', category);
+  },
+  removeCategory(id) {
+    return _delete(`admin/categories/${id}`);
+  },
   fetchPackages() {
     return _get('admin/packages');
   },
@@ -728,5 +743,8 @@ export default {
   },
   findResources(query) {
     return _get(`admin/order/resources?search=${query || ''}`);
-  }
+  },
+  getReOrderReport(params) {
+    return _get(`admin/reports/re-order`, params);
+  },
 };

package/assets/js/utils/product.js

@@ -98,12 +98,24 @@ export function filterBigSize(simpleProducts) {
 //   };
 // };
 
-export function generateProductsLink($route, data) {
-  let { type, brand, text, sort } = data;
-  type = (type || type === null) ? type : ($route && $route.params.type);
-  brand = (brand || brand === null) ? brand : ($route && $route.params.brand);
-  text = (text || text === '') ? text : ($route && $route.query.text);
-  sort = (sort || sort === '') ? sort : ($route && $route.query.sort);
+function getCategoryPathFromRoute(routeParams) {
+  const categories = [];
+  for (let i = 5; i >= 0; i--) {
+    const category = routeParams?.[`category${!i ? '' : i}`];
+    if (category) {
+      categories.push(category);
+    }
+  }
+  return categories.join('/');
+}
+
+export function generateProductsLink($route, data, skipParams = false) {
+  let { type, category, brand, text, sort } = data;
+  category = (category || category === null) ? generateCategoryPath(category) : getCategoryPathFromRoute($route?.params);
+  type = (type || type === null) ? type : ($route?.params?.type || $route?.query?.type);
+  brand = (brand || brand === null) ? brand : ($route?.params?.brand || $route?.query?.brand);
+  text = (text || text === '') ? text : $route?.query?.text;
+  sort = (sort || sort === '') ? sort : $route?.query?.sort;
 
   const params = [];
 
@@ -120,7 +132,8 @@ export function generateProductsLink($route, data) {
   }
 
   Object.keys({ ...(($route && $route.query) || {}), ...data }).forEach(key => {
-    if (!['text', 'sort', 'page', 'type', 'brand'].includes(key)) {
+    const rootKeys = ['text', 'sort', 'page', 'category', 'type', 'brand'];
+    if (!rootKeys.includes(key)) {
       let items = ($route && $route.query[key]) ? $route.query[key].split(',') : [];
       items = (data[key] ? (items.includes(data[key]) ? items.filter(c => c !== data[key]) : [...items, data[key]]) : items).join(',');
       if (items) {
@@ -128,16 +141,48 @@ export function generateProductsLink($route, data) {
       }
     }
   });
+  if (category) {
+    if (brand) {
+      params.push(`brand=${brand}`);
+    }
+    if (type) {
+      params.push(`type=${type}`);
+    }
+  }
 
-  const typeRoute = type ? `/${type}` : '';
-  const brandRoute = brand ? `/brand/${brand}` : '';
+  const categoryRoute = category ? `/c/${category}` : '';
+  const typeRoute = (!category && type) ? `/${type}` : '';
+  const brandRoute = (!category && brand) ? `/brand/${brand}` : '';
 
-  return `/products${typeRoute}${brandRoute}${params.length ? `?${params.join('&')}` : ''}`;
+  const baseRoute = categoryRoute || `/products${typeRoute}${brandRoute}`;
+  return `${baseRoute}${(params.length && !skipParams) ? `?${params.join('&')}` : ''}`;
+}
+
+export function generateCategoryPath(cat) {
+  let category = cat;
+  const categories = [];
+  while (category) {
+    categories.unshift(category.alias);
+    category = category.parent;
+  }
+  let baseLink = '';
+  if (categories.length) {
+    baseLink = `${categories.join('/')}`;
+  }
+  return baseLink;
 }
 
 export function generateProductLink(product, color, toEditor = false) {
   const baseLink = `/${product.brand?.alias}/${product.productType?.alias}/${product.alias}`;
-  return `${toEditor ? `${baseLink}/editor` : baseLink}${color ? `?color=${color.alias}` : ''}`;
+  let link = toEditor ? `${baseLink}/editor` : baseLink;
+  if (product.useTaxonomyUrl) {
+    const categoryPath = generateCategoryPath(product.category);
+    if (categoryPath) {
+      const categoryBaseLink = `/c/${categoryPath}/${product.alias}/${product.SKU.toLowerCase()}`;
+      link = toEditor ? `${categoryBaseLink}.html` : `${categoryBaseLink}/info.html`;
+    }
+  }
+  return `${link}${color ? `?color=${color.alias || color}` : ''}`;
 }
 
 export function getProductColorImages(product, color, skipDefault = false) {

package/components/products/products_brands/products-brands.vue

@@ -54,7 +54,7 @@ export default {
       return this.brands;
     },
     currentBrand() {
-      return this.$route.params.brand;
+      return this.$route.params.brand || this.$route.query.brand;
     }
   }
 };

package/components/products/products_link/products-link.vue

@@ -12,6 +12,9 @@ import { generateProductsLink } from '@lancom/shared/assets/js/utils/product';
 export default {
   name: 'ProductsLink',
   props: {
+    category: {
+      type: String
+    },
     type: {
       type: String
     },
@@ -37,6 +40,7 @@ export default {
   computed: {
     link() {
       const params = {
+        category: this.category,
         type: this.type,
         brand: this.brand,
         tags: this.tags,

package/components/products/products_types/products-types.vue

@@ -8,9 +8,9 @@
         :class="{
           'ProductsTypes__item--active': type.alias === currentType
         }">
-        <a
-          :href="`/products${type.alias === currentType ? '' : `/${type.alias}`}`"
-          class="ProductsTypes__more">
+        <products-link
+          class="ProductsTypes__more"
+          :type="type.alias === currentType ? null : type.alias">
           <checked-icon
             v-if="hasSelectedIcon"
             :checked="type.alias === currentType"
@@ -25,7 +25,7 @@
             v-else-if="hasThumbs"
             :class="`icon-${type.alias}`"></i>
           {{ type.name }}
-        </a>
+        </products-link>
       </div>
     </toggle-content>
   </div>
@@ -35,12 +35,14 @@
 import { mapGetters } from 'vuex';
 import ToggleContent from '@lancom/shared/components/common/toggle-content';
 import CheckedIcon from '@lancom/shared/components/common/checked-icon';
+import ProductsLink from '@lancom/shared/components/products/products_link/products-link';
 
 export default {
   name: 'ProductsTypes',
   components: {
     ToggleContent,
-    CheckedIcon
+    CheckedIcon,
+    ProductsLink
   },
   props: {
     hasSelectedIcon: {
@@ -59,7 +61,7 @@ export default {
   computed: {
     ...mapGetters('products', ['types']),
     currentType() {
-      return this.$route.params.type;
+      return this.$route.params.type || this.$route.query.type;
     }
   }
 };

package/layouts/products.vue

@@ -98,27 +98,51 @@
     computed: {
       ...mapGetters('page', ['routeInfo']),
       ...mapGetters(['notificationBar', 'shop', 'country', 'currency']),
-      ...mapGetters('products', ['brands', 'types', 'tags', 'loadError', 'count', 'products', 'minPrice', 'maxPrice']),
+      ...mapGetters('products', ['category', 'categories', 'brands', 'types', 'tags', 'loadError', 'count', 'products', 'minPrice', 'maxPrice']),
+      pageItemCanonical() {
+        return this.breadcrumbs[this.breadcrumbs.length - 1]?.to;
+      },
       currentBrand() {
         return this.findByRouteParam(this.brands, 'brand');
       },
       currentTag() {
-        return this.findByRouteParam(this.tags, 'category');
+        return this.findByRouteParam(this.tags, 'tag');
       },
       currentProductType() {
         return this.findByRouteParam(this.types, 'type');
       },
+      currentCategory() {
+        return this.category;
+      },
       breadcrumbs() {
         const breadcrumbs = [{
           to: '/products',
           text: 'Products'
         }];
-  
+        if (this.currentCategory) {
+          const categoriesBreadcrumbs = [];
+          let category = this.currentCategory;
+          console.log('category: ', category);
+          while (category) {
+            categoriesBreadcrumbs.unshift({
+              to: generateProductsLink(this.$route, {
+                type: null,
+                brand: null,
+                tag: null,
+                category
+              }, true),
+              text: category.name
+            });
+            category = category.parent;
+          }
+          breadcrumbs.push(...categoriesBreadcrumbs);
+        }
         if (this.currentProductType) {
           breadcrumbs.push({
             to: generateProductsLink(this.$route, {
               type: this.currentProductType.alias,
               brand: null,
+              tag: null,
               category: null
             }),
             text: this.currentProductType.name
@@ -129,8 +153,9 @@
           breadcrumbs.push({
             to: generateProductsLink(this.$route, {
               type: this.currentProductType?.alias,
-              category: this.currentTag?.alias,
-              brand: null
+              tag: this.currentTag?.alias,
+              brand: null,
+              category: null
             }),
             text: this.currentTag.name
           });
@@ -140,8 +165,9 @@
           breadcrumbs.push({
             to: generateProductsLink(this.$route, {
               type: this.currentProductType?.alias,
-              category: this.currentTag?.alias,
-              brand: this.currentBrand?.alias
+              tag: this.currentTag?.alias,
+              brand: this.currentBrand?.alias,
+              category: this.currentCategory?.alias
             }),
             text: this.currentBrand.name
           });
@@ -155,6 +181,9 @@
         }
   
         const items = ['Products'];
+        if (this.currentCategory) {
+          items.push(this.currentCategory.name);
+        }
         if (this.currentProductType) {
           items.push(this.currentProductType.name);
         }
@@ -304,7 +333,8 @@
       fillWithItemData(text = '') {
         text = this.currentBrand ? text.replace(/{{brandName}}/g, this.currentBrand.name) : text;
         text = this.currentProductType ? text.replace(/{{typeName}}/g, this.currentProductType.name) : text;
-        text = this.currentTag ? text.replace(/{{categoryName}}/g, this.currentTag.name) : text;
+        text = this.currentTag ? text.replace(/{{tagName}}/g, this.currentTag.name) : text;
+        text = this.currentCategory ? text.replace(/{{categoryName}}/g, this.currentCategory.name) : text;
         return text;
       },
       async openAside() {

package/mixins/meta-info.js

@@ -19,7 +19,7 @@ const metaInfo = {
   },
   methods: {
     getCanonical() {
-      return this.$route.path === '/' ? '' : this.$route.path;
+      return this.$route.path === '/' ? '' : (this.pageItemCanonical || this.$route.path);
     },
     generateTitleFromRoute() {
       return this.$route.path

package/mixins/product-view.js

@@ -7,17 +7,17 @@ import { tax, staticLink, inRange } from '@lancom/shared/assets/js/utils/filters
 import { getProductLargeCover } from '@lancom/shared/assets/js/utils/colors';
 import metaInfo from '@lancom/shared/mixins/meta-info';
 import { STORE_CODES } from '@/constants/store';
-
+import { generateProductLink, generateProductsLink } from '@lancom/shared/assets/js/utils/product';
 const { mapActions, mapMutations } = createNamespacedHelpers('product');
 
-export default (IS_PRODUCT_PRESET_PRINT_PRICING) => ({
+export default (IS_PRODUCT_PRESET_PRINT_PRICING, isEditor = false) => ({
   mixins: [metaInfo],
   transition(to, from) {
     if (from && from.name === 'brand-tees-slug') { return 'slide-left-to-right'; };
     if (to && to.name === 'brand-tees-slug') { return 'slide-right-to-left'; };
     return 'fade';
   },
-  async asyncData({ store, params, error, query }) {
+  async asyncData({ store, params, error, query, redirect }) {
     try {
       const { print, color, colour } = query;
       const { shop, country, currency } = store.getters;
@@ -29,10 +29,20 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING) => ({
         print,
         defaultColor: color || colour
       };
+
       await store.dispatch('product/fetchProduct', data);
       await store.dispatch('product/fetchProductDetails', data);
 
       const product = store.getters['product/product'];
+
+      if ((product.useTaxonomyUrl && !params.sku) || (!product.useTaxonomyUrl && params.sku)) {
+        const redirectUrl = generateProductLink(product, data.defaultColor, isEditor);
+        return redirect(301, redirectUrl);
+      }
+      
+      if (params.sku && params.sku !== product?.SKU?.toLowerCase()) {
+        return error({ statusCode: 404, message: 'Product not found' });
+      }
       if (IS_PRODUCT_PRESET_PRINT_PRICING) {
         const printType = product.printTypes[0];
         store.commit('product/setSelectedPrintType', printType);
@@ -69,6 +79,9 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING) => ({
     pageItemImage() {
       return this.mainProductImageSrc;
     },
+    pageItemCanonical() {
+      return generateProductLink(this.product);
+    },
     hasImages() {
       return this.images.length > 0;
     },
@@ -181,7 +194,7 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING) => ({
       }
     },
     fillBreadcrumbs() {
-      this.breadcrumbs = [{
+      const breadcrumbs = [{
         to: '/products',
         text: 'Products'
       }, {
@@ -190,6 +203,19 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING) => ({
       }, {
         text: this.product.name
       }];
+      if (this.product.useTaxonomyUrl && this.product.category) {
+        const categoriesBreadcrumbs = [];
+        let category = this.product.category;
+        while (category) {
+          categoriesBreadcrumbs.unshift({
+            to: generateProductsLink(null, { category }, true),
+            text: category.name
+          });
+          category = category.parent;
+        }
+        breadcrumbs.splice(1, 1, ...categoriesBreadcrumbs);
+      }
+      this.breadcrumbs = breadcrumbs;
     }
   },
   getRoute() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lancom/shared",
-  "version": "0.0.325",
+  "version": "0.0.327",
   "description": "lancom common scripts",
   "author": "e.tokovenko <e.tokovenko@gmail.com>",
   "repository": {

package/routes/index.js

@@ -1,5 +1,80 @@
 module.exports = function(routes, resolve) {
   return [{
+    name: 'product-taxonomy-view-level1',
+    path: '/c/:category/:slug/:sku/info.html',
+    component: resolve('@/pages/_brand/_type/_slug/index.vue'),
+    chunkName: 'pages/product/view/level1'
+  }, {
+    name: 'product-taxonomy-view-level2',
+    path: '/c/:category1/:category/:slug/:sku/info.html',
+    component: resolve('@/pages/_brand/_type/_slug/index.vue'),
+    chunkName: 'pages/product/view/level2'
+  }, {
+    name: 'product-taxonomy-view-level3',
+    path: '/c/:category2/:category1/:category/:slug/:sku/info.html',
+    component: resolve('@/pages/_brand/_type/_slug/index.vue'),
+    chunkName: 'pages/product/view/level3'
+  }, {
+    name: 'product-taxonomy-view-level4',
+    path: '/c/:category3/:category2/:category1/:category/:slug/:sku/info.html',
+    component: resolve('@/pages/_brand/_type/_slug/index.vue'),
+    chunkName: 'pages/product/view/level4'
+  }, {
+    name: 'product-taxonomy-view-level5',
+    path: '/c/:category4/:category3/:category2/:category1/:category/:slug/:sku/info.html',
+    component: resolve('@/pages/_brand/_type/_slug/index.vue'),
+    chunkName: 'pages/product/view/level5'
+  }, {
+    name: 'product-taxonomy-editor-level1',
+    path: '/c/:category/:slug/:sku.html',
+    component: resolve('@/pages/_brand/_type/_slug/editor/index.vue'),
+    chunkName: 'pages/product/editor/level1'
+  }, {
+    name: 'product-taxonomy-editor-level2',
+    path: '/c/:category1/:category/:slug/:sku.html',
+    component: resolve('@/pages/_brand/_type/_slug/editor/index.vue'),
+    chunkName: 'pages/product/editor/level2'
+  }, {
+    name: 'product-taxonomy-editor-level3',
+    path: '/c/:category2/:category1/:category/:slug/:sku.html',
+    component: resolve('@/pages/_brand/_type/_slug/editor/index.vue'),
+    chunkName: 'pages/product/editor/level3'
+  }, {
+    name: 'product-taxonomy-editor-level4',
+    path: '/c/:category3/:category2/:category1/:category/:slug/:sku.html',
+    component: resolve('@/pages/_brand/_type/_slug/editor/index.vue'),
+    chunkName: 'pages/product/editor/level4'
+  }, {
+    name: 'product-taxonomy-editor-level5',
+    path: '/c/:category4/:category3/:category2/:category1/:category/:slug/:sku.html',
+    component: resolve('@/pages/_brand/_type/_slug/editor/index.vue'),
+    chunkName: 'pages/product/editor/level5'
+  }, {
+    name: 'products-taxonomy-catalog-level1',
+    path: '/c/:category',
+    component: resolve('@/pages/products/index.vue'),
+    chunkName: 'pages/products/catalog/level1'
+  }, {
+    name: 'products-taxonomy-catalog-level2',
+    path: '/c/:category1/:category',
+    component: resolve('@/pages/products/index.vue'),
+    chunkName: 'pages/products/catalog/level2'
+  }, {
+    name: 'products-taxonomy-catalog-level3',
+    path: '/c/:category2/:category1/:category',
+    component: resolve('@/pages/products/index.vue'),
+    chunkName: 'pages/products/catalog/level3'
+  }, {
+    name: 'products-taxonomy-catalog-level4',
+    path: '/c/:category3/:category2/:category1/:category',
+    component: resolve('@/pages/products/index.vue'),
+    chunkName: 'pages/products/catalog/level4'
+  }, {
+    name: 'products-taxonomy-catalog-level5',
+    path: '/c/:category4/:category3/:category2/:category1/:category',
+    component: resolve('@/pages/products/index.vue'),
+    chunkName: 'pages/products/catalog/level5'
+  }, {
     name: 'order-view',
     path: '/order/:token',
     component: resolve('@lancom/shared/pages/order/_token/index.vue'),

package/store/products.js

@@ -10,6 +10,8 @@ export const state = () => ({
   types: [],
   colors: [],
   brands: [],
+  category: null,
+  categories: [],
   tags: [],
   attributes: [],
   loadError: null,
@@ -21,6 +23,8 @@ export const getters = {
   types: ({ types }) => types || [],
   colors: ({ colors }) => colors || [],
   brands: ({ brands }) => brands || [],
+  categories: ({ categories }) => categories || [],
+  category: ({ category }) => category,
   tags: ({ tags }) => tags || [],
   attributes: ({ attributes }) => attributes || [],
   page: ({ page }) => page,
@@ -46,7 +50,7 @@ export const actions = {
       commit('setLoadError', null);
       const {
         products, count, page, perPage, productTypes, colors, brands, tags, attributes,
-        minPrice, maxPrice
+        categories, minPrice, maxPrice, category
       } = await api.fetchProducts(shop, params);
       commit('setProducts', products);
       commit('setPage', page);
@@ -55,6 +59,8 @@ export const actions = {
       commit('setTypes', productTypes);
       commit('setColors', colors);
       commit('setBrands', brands);
+      commit('setCategories', categories);
+      commit('setCategory', category);
       commit('setTags', tags);
       commit('setAttributes', attributes);
       commit('setMinPrice', minPrice);
@@ -104,6 +110,12 @@ export const mutations = {
   setBrands(state, brands) {
     state.brands = brands;
   },
+  setCategories(state, categories) {
+    state.categories = categories;
+  },
+  setCategory(state, category) {
+    state.category = category;
+  },
   setTags(state, tags) {
     state.tags = tags;
   },