@meeovi/layer-commerce 1.0.6 → 1.0.7

package/app/pages/cart.vue

@@ -1,142 +0,0 @@
-<!-- pages/cart.vue -->
-<template>
-    <div class="cartPage">
-      <h2>Shopping Cart</h2>
-      
-      <div v-if="cart.items.length === 0" class="empty-cart">
-        Your cart is empty
-      </div>
-      
-      <div v-else>
-        <div v-for="item in cart.items" :key="item.id" class="cart-item">
-          <div class="item-details">
-            <h3>{{ item.name }}</h3>
-            <p>Price: ${{ item.price }}</p>
-            <p>Quantity: {{ item.quantity }}</p>
-          </div>
-          <v-btn @click="cart.removeItem(item.id)" color="error">
-            Remove
-          </v-btn>
-        </div>
-        
-        <div class="cart-total">
-          <h3>Total: ${{ cart.total }}</h3>
-        </div>
-
-        <!-- Shipping selection -->
-        <div class="cart-shipping my-4">
-          <ShippingOptions v-model="selectedShipping" />
-        </div>
-
-        <div class="cart-actions mt-4">
-          <v-btn
-            color="primary"
-            :disabled="cart.items.length === 0 || loading"
-            @click="startCheckout"
-          >
-            <span v-if="!loading">Checkout</span>
-            <span v-else>Preparing...</span>
-          </v-btn>
-
-          <PayPalButtons
-            @payment-success="handlePaymentSuccess"
-            @payment-error="handlePaymentError"
-          />
-        </div>
-      </div>
-    </div>
-  </template>
-  
-  <script setup>
-  import { useCartStore } from '~/stores/cart'
-  
-  import ShippingOptions from '../components/catalog/product/shippingOptions.vue'
-  import { ref, computed } from 'vue'
-
-  const cart = useCartStore()
-  const loading = ref(false)
-
-  const selectedShipping = computed({
-    get: () => cart.cart?.shipping_method_id ?? cart.cart?.shipping_method ?? null,
-    set: async (val) => {
-      try {
-        // Let the component/composable persist to the cart store; call store as a fallback
-        if (cart && cart.setShippingOption) {
-          await cart.setShippingOption({ id: val })
-        }
-      } catch (e) {
-        // eslint-disable-next-line no-console
-        console.warn('Failed to set shipping from cart page', e)
-      }
-    }
-  })
-
-  const handlePaymentSuccess = (order) => {
-    console.log('Payment successful:', order)
-  }
-
-  const handlePaymentError = (error) => {
-    console.error('Payment failed:', error)
-  }
-
-  const startCheckout = async () => {
-    if (!cart || !cart.createCheckoutSession) return
-    try {
-      loading.value = true
-      const data = await cart.createCheckoutSession(cart.cart?.id)
-      const url = data?.url || (data?.id ? `https://checkout.stripe.com/pay/${data.id}` : null)
-      if (url) {
-        window.location.href = url
-      } else if (data && data.id) {
-        // fallback: use injected Stripe instance from plugin if available
-        const nuxtApp = useNuxtApp()
-        const injectedStripe = nuxtApp?.$stripe || null
-        if (injectedStripe && typeof injectedStripe.redirectToCheckout === 'function') {
-          await injectedStripe.redirectToCheckout({ sessionId: data.id })
-        } else if (window && window.Stripe) {
-          // last-resort: use global Stripe if present
-          const publishable = (useRuntimeConfig() || {}).public?.stripe?.publishableKey || null
-          if (publishable) {
-            const stripe = window.Stripe(publishable)
-            await stripe.redirectToCheckout({ sessionId: data.id })
-          } else {
-            console.warn('No Stripe publishable key available for client-side redirect')
-          }
-        } else {
-          console.warn('No client Stripe instance available for redirect')
-        }
-      } else {
-        console.warn('No checkout url returned from server')
-      }
-    } catch (e) {
-      console.error('Failed to start checkout', e)
-    } finally {
-      loading.value = false
-    }
-  }
-  </script>
-  
-  <style scoped>
-  .cartPage {
-    padding: 20px;
-  }
-  
-  .cart-item {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 15px;
-    border-bottom: 1px solid #eee;
-  }
-  
-  .cart-total {
-    margin-top: 20px;
-    text-align: right;
-  }
-  
-  .empty-cart {
-    text-align: center;
-    padding: 50px;
-  }
-  </style>
-  

package/app/pages/compare.vue

@@ -1,166 +0,0 @@
-<template>
-  <div class="compare-page">
-    <div class="container mx-auto px-4 py-8">
-      <h1 class="text-3xl font-bold mb-8">Compare Products</h1>
-      
-      <div v-if="loading" class="text-center">
-        <p>Loading products...</p>
-      </div>
-      
-      <div v-else-if="error" class="text-center text-red-500">
-        <p>Error loading products: {{ error.message }}</p>
-      </div>
-      
-      <div v-else-if="!products.length" class="text-center">
-        <p>No products selected for comparison. Add products to your compare list to see them here.</p>
-        <NuxtLink to="/" class="mt-4 inline-block text-blue-500 hover:text-blue-700">
-          Continue Shopping
-        </NuxtLink>
-      </div>
-      
-      <div v-else>
-        <productCompareTable 
-          :products="products" 
-          @remove-product="handleRemoveProduct"
-        />
-        
-        <div class="mt-8 flex justify-between">
-          <button 
-            @click="clearCompareList" 
-            class="px-4 py-2 bg-red-500 text-white rounded hover:bg-red-600"
-          >
-            Clear Compare List
-          </button>
-          <NuxtLink 
-            to="/" 
-            class="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600"
-          >
-            Continue Shopping
-          </NuxtLink>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, onMounted, computed } from 'vue';
-import { useQuery, useMutation } from '@vue/apollo-composable';
-import gql from 'graphql-tag';
-import productCompareTable from '~/components/catalog/product/productCompareTable.vue';
-
-// GraphQL query to get compared products
-const COMPARED_PRODUCTS_QUERY = gql`
-  query GetComparedProducts {
-    customer {
-      compare_list {
-        items {
-          product {
-            uid
-            sku
-            name
-            image {
-              url
-            }
-            price_range {
-              minimum_price {
-                regular_price {
-                  currency
-                  value
-                }
-              }
-            }
-            categories {
-              name
-            }
-            rating_summary
-            review_count
-            reviews_summary
-            price_history
-            custom_attributes
-            features
-          }
-        }
-      }
-    }
-  }
-`;
-
-// GraphQL mutation to clear compare list
-const CLEAR_COMPARE_LIST_MUTATION = gql`
-  mutation ClearCompareList {
-    clearCompareList {
-      compare_list {
-        items {
-          product {
-            uid
-          }
-        }
-      }
-    }
-  }
-`;
-
-// GraphQL mutation to remove a single product from compare list
-const REMOVE_PRODUCT_MUTATION = gql`
-  mutation RemoveFromCompareList($productId: ID!) {
-    removeProductsFromCompareList(input: { product_ids: [$productId] }) {
-      compare_list {
-        items {
-          product {
-            uid
-          }
-        }
-      }
-    }
-  }
-`;
-
-const { result, loading, error, refetch } = useQuery(COMPARED_PRODUCTS_QUERY);
-const { mutate: clearCompareListMutation } = useMutation(CLEAR_COMPARE_LIST_MUTATION);
-const { mutate: removeProductMutation } = useMutation(REMOVE_PRODUCT_MUTATION);
-
-const products = computed(() => {
-  return result.value?.customer?.compare_list?.items?.map(item => item.product) || [];
-});
-
-const clearCompareList = async () => {
-  try {
-    await clearCompareListMutation();
-    await refetch();
-  } catch (error) {
-    console.error('Failed to clear compare list:', error);
-  }
-};
-
-const handleRemoveProduct = async (productId) => {
-  try {
-    await removeProductMutation({
-      variables: {
-        productId
-      }
-    });
-    await refetch();
-  } catch (error) {
-    console.error('Failed to remove product from compare list:', error);
-  }
-};
-
-onMounted(async () => {
-  await refetch();
-});
-</script>
-
-<style scoped>
-.compare-page {
-  min-height: 100vh;
-  background-color: #f9fafb;
-}
-
-@media (max-width: 768px) {
-  .container {
-    padding-left: 1rem;
-    padding-right: 1rem;
-  }
-}
-</style>