@viur/shop-components 0.1.19 → 0.1.21

package/package.json

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

package/src/Shop.vue

@@ -110,7 +110,7 @@ const state = reactive({
 onBeforeMount(()=>{
     getTranslations([props.language], "viur.shop.*").then((resp)=>{
       state.translationsLoaded = true
-    }) 
+    })
     shopStore.state.language = props.language
     shopStore.state.showNodes = props.showCartNodes
     shopStore.state.debug = props.debug
@@ -213,6 +213,11 @@ watch(()=>shopStore.state.currentTab, (newVal,oldVal)=>{
     display: flex;
     flex-direction: column;
     grid-column: auto / span 12;
+
+    &.full-width {
+      grid-column: auto / span 12;
+    }
+
     @media (min-width: 1024px) {
       grid-column: auto / span var(--shop-main-columns);
     }
@@ -247,9 +252,7 @@ watch(()=>shopStore.state.currentTab, (newVal,oldVal)=>{
     grid-row-start: 2;
   }
 
-  .full-width {
-    grid-column: auto / span 12;
-  }
+
 
   .last-row {
     grid-row-start: 3;

package/src/ShopSummary.vue

@@ -27,16 +27,6 @@
       <sl-format-number lang="de" type="currency" currency="EUR" :value="state.shippingTotal">
       </sl-format-number>
     </div>
-    <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>
-        {{
-          shopStore.state.order?.cart?.dest?.shipping?.dest?.delivery_time_range ?
-            shopStore.state.order?.cart?.dest?.shipping?.dest?.delivery_time_range :
-            0
-        }} {{ shopStore.state.order?.cart?.dest?.shipping?.dest?.delivery_time_range === 1 ? "Tag" : "Tage" }}
-      </span>
-    </div>
     <div class="viur-shop-cart-sidebar-info" v-if="shopStore.state.cartRoot.discount">
       <span v-html="$t('viur.shop.summary_discount')"></span>
       <sl-format-number lang="de" type="currency" currency="EUR" :value="state.discount">
@@ -58,6 +48,17 @@
       <sl-format-number lang="de" type="currency" currency="EUR" :value="vatObj.value">
       </sl-format-number>
     </div>
+    <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>
+        {{
+          shopStore.state.order?.cart?.dest?.shipping?.dest?.delivery_time_range ?
+            shopStore.state.order?.cart?.dest?.shipping?.dest?.delivery_time_range :
+            0
+        }} {{ shopStore.state.order?.cart?.dest?.shipping?.dest?.delivery_time_range === 1 ? "Tag" : "Tage" }}
+      </span>
+    </div>
+
     <slot name="action-buttons" >
       <div class="viur-shop-cart-sidebar-btn-wrap" v-if="false && !shopStore.state.order?.['is_paid']">
         <sl-button variant="success" size="large">{{ $t("shop.summary_checkout") }}</sl-button>

package/src/Steps/ShopOrderConfirm.vue

@@ -76,7 +76,7 @@
   </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,11 @@ onBeforeMount(()=>{
     state.selection = shopStore.state.order?.['payment_provider']
   })
 })
-</script>
+</script>
+
+<style scoped>
+  sl-radio-group {
+    margin-bottom: var(--ignt-spacing-medium);
+    margin-top: var(--ignt-spacing-medium);
+  }
+</style>

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"
     >
@@ -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

@@ -51,12 +51,14 @@ onMounted(()=>{
 
 <style scoped>
 sl-radio-group {
-  margin-top: var(--ignt-spacing-small);
+  margin-bottom: var(--ignt-spacing-medium);
+  margin-top: var(--ignt-spacing-medium);
 }
 
 sl-card {
   width: calc(100% - 6px);
   margin-left: 3px;
+  margin-top: var(--ignt-spacing-small);
   &[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);

package/src/components/PaymentOption.vue

@@ -55,21 +55,25 @@
 </script>
 
 <style scoped>
-.payment-selection{
+sl-details {
+  margin-top: var(--ignt-spacing-small);
+}
+
+.payment-selection {
   display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  flex-direction: row;
+  align-content: center;
+  justify-content: space-between;
+  width: 100%;
+
+  .start {
+    display: flex;
     align-items: center;
     flex-wrap: nowrap;
-    flex-direction: row;
-    align-content: center;
-    justify-content: space-between;
-    width: 100%;
-
-    .start{
-      display: flex;
-      align-items: center;
-      flex-wrap: nowrap;
-      gap:10px;
-    }
+    gap:10px;
+  }
 }
 
 .simple::part(content){

package/src/components/PaymentSelector.vue

@@ -11,7 +11,7 @@
                       @change="optionChanged"
 
       >
-        
+
       </payment-option>
 
     </sl-details-group>
@@ -51,5 +51,7 @@ function optionChanged(type){
 </script>
 
 <style scoped>
-
+  sl-radio-group {
+    margin-bottom: var(--ignt-spacing-small);
+  }
 </style>

package/src/translations/de.js

@@ -15,14 +15,17 @@ export default {
       'order_ready_to_ship': 'Ihre Bestellung ist fertig für den Versand.',
       'cart_empty': 'Es befinden sich noch keine Artikel im Warenkorb.',
       'order_summary': 'Bestellzusammenfassung',
-      'deliverytime': 'Lieferzeit',
+      'deliverytime': 'Voraussichtliche Lieferzeit',
       'day': 'Tag | Tage',
       'availability': 'Verfügbarkeit',
       'quantity': 'Anzahl',
       'unit_price': 'Stückpreis',
       'total_price': 'Gesamtpreis',
       'article_number': 'Artikelnummer',
+      'payment': 'Zahlung',
       'pay': 'Bezahlen',
+      'next': 'weiter',
+      'edit': 'bearbeiten',
       'add_discount': 'Hinzufügen',
       'add_discount_placeholder': 'Dein Rabattcode',
       'use_shipping_as_billing_address': 'Lieferung zur Rechnungsadresse',
@@ -55,12 +58,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,69 @@
 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',
+      'edit': 'edit',
+      '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,22 +22,25 @@ export default {
       'unit_price': 'Prix par pièce',
       'total_price': 'Montant total',
       'article_number': 'Numéro d\'article',
+      'payment': 'Paiement',
       'pay': 'Payer',
+      'next': 'continuer',
+      'edit': 'éditer',
       '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',
-      'summary_vat': 'TVA incluse ({vat_percentage})',
+      'summary_vat': 'TVA incluse ({percentage})',
       'discount_not_found': 'Ce code promo n’existe pas.',
       'discount_not_active': 'Ce code promo n’est pas actif.',
       'discount_not_available': 'Ce code promo n’est pas valable pour ce pays.',
@@ -46,15 +49,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.',
   },
 };