@viur/shop-components 0.0.1-dev.6 → 0.0.1-dev.60

package/src/stores/cart.js

@@ -1,40 +1,93 @@
-import { reactive } from "vue";
-import { Request, ListRequest } from "@viur/vue-utils";
+import { reactive, computed, watch } from "vue";
 import { defineStore } from "pinia";
 import { ViURShopClient } from "@viur/viur-shop-client";
 
 export const useCartStore = defineStore("cartstore", () => {
   const shopClient = new ViURShopClient({
-    host_url: window.location.origin === "http://localhost:8081"
-      ? "http://localhost:8080"
-      : window.location.origin,
+    host_url:
+      window.location.origin === "http://localhost:8081"
+        ? "http://localhost:8080"
+        : window.location.origin,
   });
-
+  let isFetching = false;
+  const waitForFetching = [];
+  const waitForFetchingResolver = [];
   const state = reactive({
-    basket: "",
-    carts: {},
+    basketRootNode: {},
+    basket: [],
+    wishlistRootNodes: [],
+    childrenByNode: {},
     structure: { address: {}, cart: {} },
+    paymentProviders: {},
+    billingAddressList: [],
+    shippingAddressList: [],
+    cloneBilling: true,
+    activeBillingAddress: {},
+    activeShippingAddress: {},
+    selectedPaymentProvider: {},
+    selectedPaymentProviderName: "",
+    customer: {},
+    isLoggedIn: false,
+    placeholder: "",
   });
 
-  async function init() {
-    await getCarts();
-  }
+  async function init(placeholder = "") {
+    if (!isFetching) {
+      isFetching = true;
+      await getRootNodes();
+      await getCustomer();
+      await getAddress();
+      await getBasket();
 
-  async function getCarts() {
-    let carts = await shopClient.cart_list();
-    carts.forEach(async (cart) => {
-      state.carts[cart.key] = {};
-      state.carts[cart.key].info = cart;
-      if (cart.cart_type === "basket") {
-        state.basket = cart.key;
+      isFetching = false;
+      for (const waiter of waitForFetchingResolver) {
+        waiter();
       }
-      await getCartItems(cart.key);
-    });
+      waitForFetchingResolver.splice(0, waitForFetchingResolver.length);
+      waitForFetching.splice(0, waitForFetchingResolver.length);
+    } else {
+      const p = new Promise((resolve, reject) => {
+        waitForFetchingResolver.push(resolve);
+      });
+      waitForFetching.push(p);
+      return p;
+    }
+    state.placeholder = placeholder;
+  }
+
+  async function getCustomer() {
+    try {
+      const resp = await shopClient.user_view();
+      state.customer = resp;
+      state.isLoggedIn = true;
+    } catch (e) {
+      state.isLoggedIn = false;
+    }
+
+    console.log("passiert", state.customer);
   }
+  async function getBasket() {
+    state.basket = await shopClient.basket_list();
+  }
+
+  async function getChildren(parentKey) {
+    return await shopClient.cart_list({ cart_key: parentKey });
+  }
+
+  async function getRootNodes() {
+    let resp = await shopClient.cart_list();
 
-  async function getCartItems(cartKey) {
-    let cartItems = await shopClient.cart_list({ cart_key: cartKey });
-    state.carts[cartKey].items = cartItems;
+    resp.forEach(async (rootNode) => {
+      if (rootNode.is_root_node) {
+        if (rootNode.cart_type === "basket") {
+          state.basketRootNode = rootNode;
+          const rootChildren = await getChildren(rootNode.key);
+          state.childrenByNode[rootNode.key] = rootChildren;
+        } else {
+          state.whishlistRootNodes.push(rootNode);
+        }
+      }
+    });
   }
 
   async function addToCart(articleKey, cartKey) {
@@ -43,7 +96,7 @@ export const useCartStore = defineStore("cartstore", () => {
       parent_cart_key: cartKey,
     });
 
-    await updateCart(cartKey);
+    // await updateCart(cartKey);
     console.log("addToCart", resp); //TODO: Errorhandling as soon as shop module works again
   }
 
@@ -62,42 +115,204 @@ export const useCartStore = defineStore("cartstore", () => {
       parent_cart_key: cartKey,
     });
 
-    await updateCart(cartKey);
-
     console.log("remove Resp", resp); //TODO: Errorhandling as soon as shop module works again
   }
 
   async function updateItem(articleKey, cartKey, quantity) {
-    let resp = await shopClient.article_update({
+    const resp = await shopClient.article_update({
       article_key: articleKey,
       parent_cart_key: cartKey,
       quantity: quantity,
       quantity_mode: "replace",
     });
 
-    if (quantity === 0) {
-      await updateCart(cartKey);
-    }
     console.log("update Resp", resp); //TODO: Errorhandling as soon as shop module works again
   }
 
-  async function updateCart(cartKey) {
-    await getCartItems(cartKey);
+  // async function updateCart(cartKey) {
+  //   await getChildren(cartKey);
+  // }
+
+  async function getAddressStructure() {
+    const structure = await shopClient.address_structure();
+    state.structure.address = struct2dict(structure.addSkel);
+  }
+
+  function getDefaultAddress() {
+    if (!!state.billingAddressList) {
+      state.billingAddressList.forEach((address) => {
+        if (address.is_default) {
+          state.activeBillingAddress = address;
+        }
+      });
+    } else {
+      state.activeBillingAddress = setAddressValues("billing");
+    }
+    if (!!state.shippingAddressList) {
+      state.shippingAddressList.forEach((address) => {
+        if (address.is_default && !state.cloneBilling) {
+          state.activeShippingAddress = address;
+        }
+      });
+    } else {
+      if (state.cloneBilling) {
+        state.activeShippingAddress = { ...state.activeBillingAddress };
+      } else {
+        state.activeShippingAddress = setAddressValues("shipping");
+      }
+    }
+  }
+
+  function setAddressValues(mode) {
+    let structure = state.structure.address;
+    let skel = {};
+
+    Object.entries(structure).forEach(([boneName, boneValue]) => {
+      if (boneName === "customer") {
+        skel[boneName] = state.customer.key;
+      } else if (boneName === "address_type") {
+        skel[boneName] = mode;
+      } else {
+        skel[boneName] = boneValue.emptyvalue;
+      }
+    });
+
+    return skel;
+  }
+
+  async function getAddress() {
+    if (!state.isLoggedIn) {
+      return;
+    }
+    try {
+      const addressList = await shopClient.address_list();
+    } catch (e) {
+      console.log("error", e);
+      return;
+    }
+
+    const addressList = await shopClient.address_list();
+    state.billingAddressList = [];
+    state.shippingAddressList = [];
+
+    for (const address of addressList) {
+      if (address.address_type === "billing") {
+        console.log("add to bill address ?", address);
+        state.billingAddressList.push(address);
+      }
+      if (address.address_type === "shipping") {
+        state.shippingAddressList.push(address);
+      }
+    }
+
+    getDefaultAddress();
+  }
+
+  async function addDiscount(code) {
+    await shopClient.discount_add({ code });
+  }
+
+  async function addNode(
+    parentCart,
+    cartType = "whishlist",
+    cartName = undefined,
+    comment = undefined,
+    shipping_key = undefined,
+    shipping_address_key = undefined,
+    discount_key = undefined,
+  ) {
+    return await shopClient.cart_add({
+      parent_cart_key: parentCart,
+      // cart_type: cartType, // "basket" for main cart, "whishlist" for everything else
+      // name: cartName,
+      // customer_comment: comment,
+      // shipping_address_key: shipping_address_key,
+      // shipping_key: shipping_key,
+      // discount_key: discount_key,
+    });
+  }
+
+  async function getShippingData() {
+    return await shopClient.shipping_list({
+      cart_key: state.basketRootNode.key,
+    });
+  }
+  async function setShiping() {
+    return await shopClient.shipping_set();
+  }
+
+  async function getPaymentProviders() {
+    const paymentProvieders = await shopClient.payment_providers_list();
+    state.paymentProviders = paymentProvieders;
+    //select first paymentprovider as default
+    state.selectedPaymentProvider =
+      paymentProvieders[Object.keys(paymentProvieders)[0]];
+    state.selectedPaymentProviderName = Object.keys(paymentProvieders)[0];
   }
 
-  async function getAdressStructure() {
-    let addSkel = await shopClient.address_structure()
-    state.structure.address = addSkel.addSkel
+  function struct2dict(structure) {
+    if (!Array.isArray(structure)) {
+      return structure;
+    }
 
-    console.log("adress add", state.structure.address);
+    let result = {};
+    structure.forEach((bone) => (result[bone[0]] = bone[1]));
 
-    // Request.getStructure("shop.address").then(async (resp) => {
-    //   let data = await resp.json();
-    //   state.structure.address = data.addSkel;
+    return result;
+  }
 
-    //   console.log("adress add", state.structure.address);
-    // });
+  async function orderAdd() {
+    const order = await shopClient.order_add({
+      cart_key: state.basketRootNode.key,
+      payment_provider: state.selectedPaymentProviderName,
+      billing_address_key: state.activeBillingAddress["key"],
+      customer_key: state.customer["key"],
+    });
+    return order;
   }
+  async function setShipping() {
+    const shipping_skel = shopClient;
+  }
+
+  watch(
+    () => state.activeBillingAddress,
+    (newValue, oldValue) => {
+      if (oldValue) {
+        const isAddress = (address) => address.key === newValue.key;
+
+        let index = state.billingAddressList.findIndex(isAddress);
+
+        state.billingAddressList[index] = newValue;
+      }
+      if (state.cloneBilling) {
+        state.activeShippingAddress = newValue;
+      }
+    },
+  );
+
+  watch(
+    () => state.activeShippingAddress,
+    (newValue, oldValue) => {
+      if (oldValue) {
+        const isAddress = (address) => address.key === newValue.key;
+
+        let index = state.shippingAddressList.findIndex(isAddress);
+
+        state.shippingAddressList[index] = newValue;
+      }
+    },
+  );
+
+  watch(
+    () => state.cloneBilling,
+    (newValue, oldValue) => {
+      if (newValue) {
+        let temp = { ...state.activeBillingAddress };
+        temp.address_type = "shipping";
+        state.activeShippingAddress = { ...temp };
+      }
+    },
+  );
 
   return {
     state,
@@ -106,6 +321,16 @@ export const useCartStore = defineStore("cartstore", () => {
     removeItem,
     updateItem,
     init,
-    getAdressStructure,
+    getAddressStructure,
+    getChildren,
+    addDiscount,
+    getPaymentProviders,
+    getAddress,
+    addNode,
+    getShippingData,
+    getDefaultAddress,
+    orderAdd,
+    getBasket,
+    setShiping,
   };
 });

package/src/style/ignite/.editorconfig

@@ -0,0 +1,20 @@
+# editorconfig.org
+# source: https://gist.github.com/sveneberth/b30d6639067177a31b5ab68af63a23e9
+
+root = true
+
+[*]
+indent_style = tab
+tab_width = 4
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+max_line_length = 120
+
+[*.{css,less,yml,yaml,json}]
+indent_style = space
+indent_size = 2
+
+[*.md]
+trim_trailing_whitespace = false

package/src/style/ignite/.github/workflows/ignite.yml

@@ -0,0 +1,64 @@
+name: Build Ignite
+
+on:
+  push:
+    tags:
+      - "v5.*"
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [16.x]
+
+    steps:
+    - uses: actions/checkout@v2
+      with:
+        submodules: true
+        path: "app/sources"
+
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v2
+      with:
+        node-version: ${{ matrix.node-version }}
+        cache: 'npm'
+        cache-dependency-path: 'package-lock.json'
+    - run: npm install
+    - run: npm run build
+    - uses: actions/upload-artifact@master
+      with:
+        name: buildfiles
+        path: dist
+
+
+  release:
+    runs-on: ubuntu-latest
+    needs: [ build ]
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - uses: actions/download-artifact@master
+        with:
+          name: buildfiles
+          path: ./dist
+
+      - name: archive
+        run: cd ./dist && zip viur-ignite.zip -r ./*
+
+      - name: Get version from tag
+        id: tag_name
+        run: |
+          echo ::set-output name=current_version::${GITHUB_REF#refs/tags/v}
+
+      - name: create release
+        uses: softprops/action-gh-release@v1
+        with:
+          files: ./dist/viur-ignite.zip
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+

package/src/style/ignite/.github/workflows/node.yml

@@ -0,0 +1,30 @@
+name: Node.js CI
+
+on:
+  push:
+    tags:
+      - "v5.*"
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [16.x]
+
+    steps:
+    - uses: actions/checkout@v2
+      with:
+        submodules: true
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v2
+      with:
+        node-version: ${{ matrix.node-version }}
+        cache: 'npm'
+    - run: npm install
+    - run: npm run build
+    - uses: JS-DevTools/npm-publish@v1
+      with:
+        access: "public"
+        token: ${{ secrets.NPM_TOKEN }}

package/src/style/ignite/.postcssrc.cjs

@@ -0,0 +1,25 @@
+const enableBuild = process.env.mode === 'build'
+
+module.exports = ({ ctx }) => ({
+	map: enableBuild ? false : 'inline',
+	plugins: {
+		'postcss-discard-comments': enableBuild ? {} : false,
+		'@csstools/postcss-bundler': {},
+		'postcss-preset-env': {
+			stage: 3,
+			minimumVendorImplementations: 2,
+			autoprefixer: {},
+			debug: true,
+			features: {
+    			'color-mix': true,
+				'nesting-rules': true,
+				'oklab-function': true,
+                //'cascade-layers': true,
+                'custom-media-queries': true,
+  			}
+		},
+		'postcss-focus': {},
+		'postcss-sort-media-queries': {},
+		'cssnano': enableBuild ? {} : false,
+	}
+})