@viur/shop-components 0.1.18 → 0.1.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viur/shop-components",
-  "version": "0.1.18",
+  "version": "0.1.20",
   "description": "Frontend Vue components for the shop module of ViUR",
   "repository": {
     "type": "git",

package/src/Shop.vue

@@ -3,7 +3,7 @@
         <div class="viur-shop-stepper-wrap"
             :class="{ 'full-width': (!summary || summary==='bottom' || shopStore.state.currentTab==='complete') }"
         >
-            <shop-order-stepper >
+            <shop-order-stepper>
               <template #template_cart>
                 <slot name="template_cart"></slot>
               </template>
@@ -53,7 +53,7 @@
           paid: {{ shopStore.state.order?.['is_paid'] }}<br><br>
 
           OrderObject: {{shopStore.state.order}}
-        
+
       </sl-details>
     </template>
     <div id="dialogs"></div>

package/src/ShopSummary.vue

@@ -27,7 +27,7 @@
       <sl-format-number lang="de" type="currency" currency="EUR" :value="state.shippingTotal">
       </sl-format-number>
     </div>
-    <div class="viur-shop-cart-shipping-item" v-if="shopStore.state.order?.cart?.dest?.shipping">
+    <div class="viur-shop-cart-sidebar-info viur-shop-cart-shipping-item" v-if="shopStore.state.order?.cart?.dest?.shipping">
       <span v-html="$t('viur.shop.summary_delivery_time')"></span>
       <span>
         {{
@@ -94,11 +94,9 @@ const state = reactive({
   }),
   shippingTotal: computed(() => {
     let total = 0
-
-    // let hasOrder = Object.keys(shopStore.state.order).length ? true : false
-    // let hasShipping = Object.keys(shopStore.state.order.cart.dest.shipping).length ? true : false
-
-    if( shopStore.state?.order?.cart?.dest?.shipping?.dest?.shipping_cost > 0 ) {
+    if (shopStore.state.cartRoot.shipping?.dest?.shipping_cost>=0 ){
+      total += shopStore.state.cartRoot.shipping?.dest?.shipping_cost
+    }else if( shopStore.state?.order?.cart?.dest?.shipping?.dest?.shipping_cost) {
       total += shopStore.state.order.cart.dest.shipping.dest.shipping_cost
     }
 
@@ -150,7 +148,7 @@ function calc_percent(val){
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
-  span {
+  span:first-of-type {
     margin-right: auto;
   }
 }

package/src/Steps/ShopCart.vue

@@ -65,7 +65,6 @@ onBeforeMount(()=>{
 async function nextStep(){
     try{
         let resp = await addOrUpdateOrder()
-        console.log(resp)
         return true
 
     } catch(error){

package/src/Steps/ShopOrderConfirm.vue

@@ -71,12 +71,12 @@
   <component :is="params['additionalComponent']" v-if="params['additionalComponent']" ref="additionalComponent">
   </component>
 
-  <div class="wrapper">
-    <sl-button size="small" @click="startCheckout" :disabled="!shopStore.state.canCheckout" variant="success">{{ $t('viur.shop.order_pay') }}</sl-button>
-  </div>
+  <sl-bar class="wrapper">
+    <sl-button slot="right" size="large" @click="startCheckout" :disabled="!shopStore.state.canCheckout" variant="success">{{ $t('viur.shop.order_pay') }}</sl-button>
+  </sl-bar>
 
   <template v-if="shopStore.state.order?.['payment_provider'] !== null && shopStore.state.order?.['payment_provider'].startsWith('unzer-')">
-    <sl-dialog v-if="state.paymentPopup" label="Zahlung" :open="state.paymentPopup" @sl-after-hide="state.paymentPopup=false">
+    <sl-dialog v-if="state.paymentPopup" :label="$t('viur.shop.order_pay')" :open="state.paymentPopup" @sl-after-hide="state.paymentPopup=false">
         <payment-provider-unzer @cancel="paymentCanceled"></payment-provider-unzer>
     </sl-dialog>
   </template>

package/src/Steps/ShopPaymentProvider.vue

@@ -1,6 +1,6 @@
 <template>
   <slot name="top_actions"  v-if="shopStore.state.topActions"
-      nextName="weiter"
+      :nextName="$t('viur.shop.next')"
       :activefunction="()=>shopStore.state.order?.['payment_provider']"
       :nextfunction="()=>true"
   >
@@ -27,7 +27,7 @@
   </slot>
 
   <slot
-      nextName="weiter"
+      :nextName="$t('viur.shop.next')"
       :activefunction="()=>shopStore.state.order?.['payment_provider']"
       :nextfunction="()=>true"
   >
@@ -67,4 +67,4 @@ onBeforeMount(()=>{
     state.selection = shopStore.state.order?.['payment_provider']
   })
 })
-</script>
+</script>

package/src/Steps/ShopShippingMethod.vue

@@ -1,6 +1,6 @@
 <template>
   <slot name="top_actions"  v-if="shopStore.state.topActions"
-        nextName="weiter"
+        :nextName="$t('viur.shop.next')"
         :activefunction="()=>shopStore.state.cartRoot?.['shipping']"
         :nextfunction="()=>nextStep"
     >
@@ -13,7 +13,7 @@
                     @change="updateShippingMethod"
     >
       <template v-slot="{option, index}">
-          <img slot="image">
+          <!--<img slot="image">-->
 
           <sl-format-number lang="de" type="currency" currency="EUR" :value=" option['dest']['shipping_cost']" v-if="option['dest']['shipping_cost']">
           </sl-format-number>
@@ -27,7 +27,7 @@
   </slot>
 
   <slot
-        nextName="weiter"
+        :nextName="$t('viur.shop.next')"
         :activefunction="()=>shopStore.state.cartRoot?.['shipping']"
         :nextfunction="nextStep"
     >

package/src/Steps/ShopUserDataGuest.vue

@@ -1,6 +1,6 @@
 <template>
     <slot name="top_actions" v-if="shopStore.state.topActions"
-        nextName="weiter"
+        :nextName="$t('viur.shop.next')"
         :activefunction="()=>true"
         :nextfunction="nextStep"
         :hint="$t('messages.order_check_later')"
@@ -32,7 +32,7 @@
     </slot>
 
     <slot
-        nextName="weiter"
+        :nextName="$t('viur.shop.next')"
         :activefunction="()=>true"
         :nextfunction="nextStep"
         :hint="$t('messages.order_check_later')"

package/src/components/CardSelector.vue

@@ -37,7 +37,7 @@ function changeSelection(i){
         state.currentSelection = i
         selection.value = props.options[i]
     }
-    emits("change", selection.value)
+    emits("change", props.options[i])
 }
 
 onMounted(()=>{
@@ -50,19 +50,24 @@ onMounted(()=>{
 </script>
 
 <style scoped>
-sl-card{
-    width: 100%;
-    &[selected]::part(base){
-        border:1px solid var(--sl-color-primary-500);
-        box-shadow: 0 0 0 var(--sl-focus-ring-width) var(--sl-input-focus-ring-color);
-    }
+sl-radio-group {
+  margin-top: var(--ignt-spacing-small);
+}
 
-   &::part(body){
-     display:flex;
-     flex-direction: row;
-        justify-content: space-between;
-        align-items: center;
-   }
+sl-card {
+  width: calc(100% - 6px);
+  margin-left: 3px;
+  &[selected]::part(base){
+    border:1px solid var(--sl-color-primary-500);
+    box-shadow: 0 0 0 var(--sl-focus-ring-width) var(--sl-input-focus-ring-color);
+  }
+
+  &::part(body){
+    display:flex;
+    flex-direction: row;
+      justify-content: space-between;
+      align-items: center;
+  }
 }
 
-</style>
+</style>

package/src/components/CartItemSmall.vue

@@ -183,17 +183,18 @@ function removeArticle(){
   }
 
   .viur-shop-cart-leaf-article-number {
-    align-self: center;
+    align-self: flex-end;
     grid-column: span 2;
   }
 
   .viur-shop-cart-leaf-quantity {
-    align-self: center;
+    align-self: flex-end;
   }
 
   .viur-shop-cart-leaf-unitprice {
-    align-self: center;
+    align-self: flex-end;
     grid-column: 4 / span 1;
+    text-align: right;
   }
 
   .viur-shop-cart-leaf-label,

package/src/translations/de.js

@@ -22,7 +22,9 @@ export default {
       'unit_price': 'Stückpreis',
       'total_price': 'Gesamtpreis',
       'article_number': 'Artikelnummer',
+      'payment': 'Zahlung',
       'pay': 'Bezahlen',
+      'next': 'weiter',
       'add_discount': 'Hinzufügen',
       'add_discount_placeholder': 'Dein Rabattcode',
       'use_shipping_as_billing_address': 'Lieferung zur Rechnungsadresse',
@@ -55,12 +57,12 @@ export default {
     },
   },
   messages: {
-    loading: 'Daten werden abgefragt...',
-    updating: 'Daten werden aktualisiert...',
-    wait_for_payment: 'Warte auf Zahlung...',
+    loading: 'Daten werden abgefragt …',
+    updating: 'Daten werden aktualisiert …',
+    wait_for_payment: 'Warte auf Zahlung …',
     remove_article_from_cart: 'Wollen sie den Artikel wirklich entfernen?',
     order_check_later: 'Sie können Ihre Bestellung am Ende noch einmal überprüfen.',
     email_equal_error: 'E-Mail-Adressen stimmen nicht überein.',
-    phone_equal_error: "Telefonnummern stimmen nicht überein."
+    phone_equal_error: 'Telefonnummern stimmen nicht überein.',
   },
 };

package/src/translations/en.js

@@ -1,5 +1,68 @@
 export default {
-    actions:{
-        add: "Add"
-    }
-}
+  actions: {
+    add: 'Add',
+    cancel: 'Cancel',
+    delete: 'Delete',
+  },
+  viur: {
+    shop: {
+      'check_order': 'Review and submit',
+      'order_pay': 'Place binding order',
+      'order_number': 'Your order number',
+      'order_thanks': 'Thank you for your order',
+      'order_message': 'We have received your order and will process it as soon as possible.<br /> You will receive a confirmation email in a few minutes.',
+      'order_paid': 'Your payment has been received.',
+      'order_ready_to_ship': 'Your order is ready for shipping.',
+      'cart_empty': 'Your cart is currently empty.',
+      'order_summary': 'Order summary',
+      'deliverytime': 'Delivery time',
+      'day': 'Day | Days',
+      'availability': 'Availability',
+      'quantity': 'Quantity',
+      'unit_price': 'Unit price',
+      'total_price': 'Total price',
+      'article_number': 'Article number',
+      'payment': 'Payment',
+      'pay': 'Pay',
+      'next': 'next',
+      'add_discount': 'Add',
+      'add_discount_placeholder': 'Your discount code',
+      'use_shipping_as_billing_address': 'Use shipping address as billing address',
+      'no_valid_shipping_found': 'No valid shipping methods found.',
+      'error_message': 'An error has occurred.',
+      'free_shipping': 'Free shipping',
+      'proceed-checkout': 'Proceed to checkout',
+      'summary_headline': 'Summary',
+      'summary_subtotal': 'Subtotal',
+      'summary_shipping_total': 'Shipping and handling',
+      'summary_delivery_time': 'Delivery time',
+      'summary_discount': 'You save during the promotion period',
+      'summary_checkout': 'Proceed to checkout',
+      'summary_total': 'Total amount',
+      'summary_vat': 'incl. {percentage} VAT',
+      'discount_not_found': 'This discount code does not exist.',
+      'discount_not_active': 'This discount code is not active.',
+      'discount_not_available': 'This discount code is not available for this country.',
+      'discount_already_used': 'This discount code has already been used.',
+      'discount_invalid_period': 'The discount period has not yet started or has already ended.',
+      'discount_minimum_not_reached': 'The minimum order value of {{minimum_order_value}} € has not been reached.',
+      'discount_no_sale_article': 'The discount code cannot be applied to already discounted items.',
+      'discount_scope_not_satisfied': 'The discount code cannot be applied to this cart or these items.',
+      'order_step_cart': 'Cart',
+      'order_step_data': 'Details',
+      'order_step_shipping': 'Shipping method',
+      'order_step_payment': 'Payment method',
+      'order_step_verify': 'Review order',
+      'order_step_complete': 'Order complete',
+    },
+  },
+  messages: {
+    loading: 'Fetching data …',
+    updating: 'Updating data …',
+    wait_for_payment: 'Waiting for payment …',
+    remove_article_from_cart: 'Do you really want to remove this item?',
+    order_check_later: 'You will be able to review your order at the end.',
+    email_equal_error: 'Email addresses do not match.',
+    phone_equal_error: 'Phone numbers do not match.',
+  },
+};

package/src/translations/fr.js

@@ -1,8 +1,8 @@
 export default {
   actions: {
-    add: 'Hinzufügen',
-    cancel: 'Abbrechen',
-    delete: 'Löschen',
+    add: 'Ajouter',
+    cancel: 'Annuler',
+    delete: 'Supprimer',
   },
   viur: {
     shop: {
@@ -10,9 +10,9 @@ export default {
       'order_pay': 'Valider',
       'order_number': 'N° de commande',
       'order_thanks': 'Merci pour votre commande et l’intérêt porté à notre société.',
-      'order_message': 'Wir haben Ihre Bestellung erhalten und werden diese schnellstmöglich bearbeiten.<br /> Sie erhalten in wenigen Minuten eine Bestätigung per E-Mail.',
-      'order_paid': 'Ihre Zahlung ist bei uns eingegangen.',
-      'order_ready_to_ship': 'Ihre Bestellung ist fertig für den Versand.',
+      'order_message': 'Nous avons bien reçu votre commande et nous allons la traiter dans les plus brefs délais.<br /> Vous recevrez une confirmation par e-mail dans quelques minutes',
+      'order_paid': 'Nous avons bien reçu votre paiement',
+      'order_ready_to_ship': 'Votre commande est prête à être expédiée',
       'cart_empty': 'Votre panier est vide.',
       'order_summary': 'Envoyer la commande',
       'deliverytime': 'Délai de livraison',
@@ -22,18 +22,20 @@ export default {
       'unit_price': 'Prix par pièce',
       'total_price': 'Montant total',
       'article_number': 'Numéro d\'article',
+      'payment': 'Paiement',
       'pay': 'Payer',
+      'next': 'continuer',
       'add_discount': 'Valider',
       'add_discount_placeholder': 'Votre code promo',
-      'use_shipping_as_billing_address': 'Lieferung zur Rechnungsadresse',
-      'no_valid_shipping_found': 'Keine passenden Versandarten gefunden.',
-      'error_message': 'Eine Fehler ist aufgetreten.',
+      'use_shipping_as_billing_address': 'Livraison à l\'adresse de facturation',
+      'no_valid_shipping_found': 'Aucun mode d\'expédition correspondant trouvé.',
+      'error_message': 'Une erreur s\'est produite.',
       'free_shipping': 'Livraison gratuite',
       'proceed-checkout': 'Acheter cet article',
       'summary_headline': 'Résumé',
       'summary_subtotal': 'Sous-total',
       'summary_shipping_total': 'Emballage et envoi',
-      'summary_delivery_time': '',
+      'summary_delivery_time': 'Délai de livraison',
       'summary_discount': 'Vous économisez sur votre achat',
       'summary_checkout': 'Acheter cet article',
       'summary_total': 'Montant total',
@@ -46,15 +48,21 @@ export default {
       'discount_minimum_not_reached': 'Le montant minimum de commande de {{minimum_order_value}} € n’a pas été atteint.',
       'discount_no_sale_article': 'Bon d’achat non cumulable avec d’autres promotions en cours.',
       'discount_scope_not_satisfied': 'Le code promo n’est pas applicable pour ce panier / cet ou ces article(s).',
+      'order_step_cart': 'Panier',
+      'order_step_data': 'Données',
+      'order_step_shipping': 'Mode de livraison',
+      'order_step_payment': 'Mode de paiement',
+      'order_step_verify': 'Vérifier la commande',
+      'order_step_complete': 'Commande terminée',
     },
   },
   messages: {
-    loading: 'Daten werden abgefragt...',
-    updating: 'Daten werden aktualisiert...',
-    wait_for_payment: 'Warte auf Zahlung...',
+    loading: 'Données en cours de consultation …',
+    updating: 'Données en cours de mise à jour …',
+    wait_for_payment: 'Attente de paiement …',
     remove_article_from_cart: 'Désirez-vous vraiment supprimer cet article du panier?',
     order_check_later: 'Vous pourrez revérifier vos données avant de valider votre commande.',
-    email_equal_error: "Les adresses e-mail ne correspondent pas.",
-    phone_equal_error: "Les numéros de téléphone ne correspondent pas."
+    email_equal_error: 'Les adresses e-mail ne correspondent pas.',
+    phone_equal_error: 'Les numéros de téléphone ne correspondent pas.',
   },
 };