@viur/shop-components/src/composables/cart.js

Frontend Vue components for the shop module of ViUR

import {computed, reactive, watch} from 'vue';
import {Request} from '@viur/vue-utils'
import { removeUndefinedValues} from '../utils'

import { useViurShopStore } from '../shop'

export function useCart() {
    const shopStore = useViurShopStore()
    const state = reactive({
        isLoading:computed(()=>shopStore.state.cartIsLoading), // not used anymore
        isUpdating:computed(()=>shopStore.state.cartIsUpdating)// not used anymore
    })

    function getValue(value){
        if (value !== null &&
            typeof value === 'object' &&
            !Array.isArray(value) &&
            Object.keys(value).includes(shopStore.state.language)
        ){
            return value[shopStore.state.language]
        }
        return value
    }

    function createCart(){
        Request.post(shopStore.state.shopApiUrl+'/cart_add',{dataObj:{
            parent_cart_key:shopStore.state.cartRoot['key'],
            cart_type:"wishlist"
        }}).then(async( resp)=>{
            let data = await resp.json()
            console.log(data)
        })


    }


    function fetchCart() {
      //first fetch root then fetchItems for this root
      shopStore.state.cartIsLoading = true;
      if (shopStore.state.order != null && shopStore.state.order?.cart?.dest.key) {
        // shopStore.state.cartRoot = {};
        shopStore.state.cartRoot = shopStore.state.order.cart.dest;

        return fetchCartItems(shopStore.state.cartRoot["key"]).then(() => {  // TODO: duplicate code
          shopStore.state.cartIsLoading = false;
          shopStore.state.cartReady = true;
        });
      }
      shopStore.state.discounts = {}
      return fetchCartRoot().then(() => {
        if (!shopStore.state.cartRoot?.["key"]) return 0;
        fetchCartItems(shopStore.state.cartRoot["key"]).then(() => {  // TODO: duplicate code
          shopStore.state.cartIsLoading = false;
          shopStore.state.cartReady = true;
        });
      });
    }

    function fetchCartRoot(){
        // fetch list of Rootnodes and saves the first one
        return Request.get(`${shopStore.state.shopUrl}/cart/listRootNodes`).then(async (resp)=>{
            let data = await resp.clone().json()
            shopStore.state.cartRoot = data.filter(i=>i['cart_type']==='basket')?.[0] ? data.filter(i=>i['cart_type']==='basket')[0]:[]
            if (shopStore.state.cartRoot.discount){
              shopStore.state.discounts = {[shopStore.state.cartRoot.discount.dest.key]:shopStore.state.cartRoot.discount}
            }
            return resp
        })
    }

    function fetchCartItems(key, parentKey=null){
        //fetch cart items
        if (key === shopStore.state.cartRoot["key"]){ // initial
          shopStore.state.cartList = []
        }
        return Request.get(`${shopStore.state.shopApiUrl}/cart_list`,{dataObj:{
            cart_key:key
        }}).then(async( resp) =>{
            let data = await resp.clone().json()

            let currentLeafs = []
            for (const item of data){
              if (item["skel_type"]==="leaf"){
                currentLeafs.push(item)
              }else{
                if(item.discount){
                  shopStore.state.discounts[item.discount.dest.key] = item.discount
                }
                await fetchCartItems(item['key'], parentKey=true)
              }
            }
            if (parentKey){
              shopStore.state.cartList=shopStore.state.cartList.concat(currentLeafs)
            }else{
              shopStore.state.cartList=currentLeafs
            }

            return resp
        })
    }

    function updateCart({
                    cart_key,
                    cart_type,
                    name,
                    customer_comment,
                    shipping_address_key,
                    shipping_key,
                    discount_key,
                    commission
                } = {}){

        let data= {
            cart_type:cart_type?cart_type:shopStore.state.cartRoot['cart_type'],
            name:name?name:shopStore.state.cartRoot['name'],
            customer_comment:customer_comment?customer_comment:shopStore.state.cartRoot['customer_comment'],
            shipping_address_key:shipping_address_key?shipping_address_key:shippingAddressKey.value,
            shipping_key: shipping_key, // only after explicit user selection
            discount_key:discount_key?discount_key:shopStore.state.cartRoot?.['discount']?.['dest']?.['key'],
            cart_key:cart_key ? cart_key : shopStore.state.cartRoot['key'],
        }

        if (commission) { // TODO: that's not standard, must be more generic!
          data.commission = commission
        }

        return Request.post(`${shopStore.state.shopApiUrl}/cart_update`, {
            dataObj: removeUndefinedValues(data)
        }).then(async (resp)=>{
            fetchCart()
            return resp
        })
    }

    function addItem(key, quantity=1, cart=null, quantity_mode='replace'){
        //add Item to cart
        shopStore.state.cartIsUpdating = true
        return Request.post(`${shopStore.state.shopApiUrl}/article_add`, {dataObj:{
            article_key: key,
            parent_cart_key:cart?cart:shopStore.state.cartRoot['key'],
            quantity:quantity,
            quantity_mode:quantity_mode
        }}).then(async (resp)=>{
            shopStore.state.cartIsUpdating=false
            fetchCart()
        })

    }
    function removeItem(key, cart=null){
        shopStore.state.cartIsUpdating = true
        return Request.post(`${shopStore.state.shopApiUrl}/article_remove`, {dataObj:{
            article_key: key,
            parent_cart_key:cart?cart:shopStore.state.cartRoot['key']
        }}).then(async (resp)=>{
            shopStore.state.cartIsUpdating=false
            fetchCart()
        })
    }

    function addDiscount(code) {
        return new Promise((resolve, reject) => {
          Request.securePost(`${shopStore.state.shopApiUrl}/discount_add`, {
            dataObj: {
              code: code,
            },
          })
        .then(async (resp) => {
            let data = await resp.json();
            fetchCart()
            console.log("discount debug", data);
            resolve()
        })
        .catch((error) => {
            reject(error);
        });
    });
    }

    function removeDiscount(key) {
        return new Promise((resolve, reject) => {
          Request.securePost(`${shopStore.state.shopApiUrl}/discount_remove`, {
            dataObj: {
                discount_key: key,
            },
          })
        .then(async (resp) => {
            let data = await resp.json();
            fetchCart()
            console.log("discount debug", data);
            resolve()
        })
        .catch((error) => {
            reject(error);
        });
    });
    }

    const shippingAddressKey = computed(() => shopStore.state.cartRoot?.['shipping_address']?.['dest']?.['key']);

    return {
        state,
        fetchCartRoot,
        fetchCartItems,
        fetchCart,
        updateCart,
        addItem,
        removeItem,
        createCart,
        getValue,
        addDiscount,
        removeDiscount,
        shippingAddressKey,
    }
}