@viur/shop-components 0.4.2 → 0.4.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -66,14 +66,7 @@
|
|
|
66
66
|
|
|
67
67
|
<div class="viur-shop-cart-leaf-unitprice">
|
|
68
68
|
<div class="viur-shop-cart-leaf-label">{{$t('viur.shop.unit_price')}}</div>
|
|
69
|
-
<
|
|
70
|
-
class="viur-shop-cart-leaf-value viur-shop-cart-leaf-value--unitprice"
|
|
71
|
-
lang="de"
|
|
72
|
-
type="currency"
|
|
73
|
-
currency="EUR"
|
|
74
|
-
:value="item.price.current"
|
|
75
|
-
>
|
|
76
|
-
</sl-format-number>
|
|
69
|
+
<price-box :item="item"></price-box>
|
|
77
70
|
</div>
|
|
78
71
|
|
|
79
72
|
<div class="viur-shop-cart-leaf-availability">
|
|
@@ -87,14 +80,7 @@
|
|
|
87
80
|
|
|
88
81
|
<div class="viur-shop-cart-leaf-price">
|
|
89
82
|
<div class="viur-shop-cart-leaf-label">{{ $t('viur.shop.total_price') }}</div>
|
|
90
|
-
<
|
|
91
|
-
class="viur-shop-cart-leaf-value viur-shop-cart-leaf-value--price"
|
|
92
|
-
lang="de"
|
|
93
|
-
type="currency"
|
|
94
|
-
currency="EUR"
|
|
95
|
-
:value="item.price.current * item.quantity"
|
|
96
|
-
>
|
|
97
|
-
</sl-format-number>
|
|
83
|
+
<price-box :item="item" :amount="item.quantity" :retail="false"></price-box>
|
|
98
84
|
</div>
|
|
99
85
|
|
|
100
86
|
|
|
@@ -109,6 +95,7 @@ import { useDebounceFn } from '@vueuse/core'
|
|
|
109
95
|
import { getImage } from '../utils';
|
|
110
96
|
import { useCart } from '../composables/cart';
|
|
111
97
|
import dialogButton from './dialogButton.vue';
|
|
98
|
+
import PriceBox from "./PriceBox.vue";
|
|
112
99
|
|
|
113
100
|
const {addItem, removeItem, state:cartState, getValue} = useCart()
|
|
114
101
|
|
|
@@ -52,27 +52,13 @@
|
|
|
52
52
|
|
|
53
53
|
<div class="viur-shop-cart-leaf-unitprice">
|
|
54
54
|
<div class="viur-shop-cart-leaf-label">{{$t('viur.shop.unit_price')}}</div>
|
|
55
|
-
<
|
|
56
|
-
class="viur-shop-cart-leaf-value viur-shop-cart-leaf-value--unitprice"
|
|
57
|
-
lang="de"
|
|
58
|
-
type="currency"
|
|
59
|
-
currency="EUR"
|
|
60
|
-
:value="item.price.current"
|
|
61
|
-
>
|
|
62
|
-
</sl-format-number>
|
|
55
|
+
<price-box :item="item"></price-box>
|
|
63
56
|
</div>
|
|
64
57
|
|
|
65
58
|
|
|
66
59
|
<div class="viur-shop-cart-leaf-price">
|
|
67
60
|
<div class="viur-shop-cart-leaf-label">{{ $t('viur.shop.total_price') }}</div>
|
|
68
|
-
<
|
|
69
|
-
class="viur-shop-cart-leaf-value viur-shop-cart-leaf-value--price"
|
|
70
|
-
lang="de"
|
|
71
|
-
type="currency"
|
|
72
|
-
currency="EUR"
|
|
73
|
-
:value="item.price.current * item.quantity"
|
|
74
|
-
>
|
|
75
|
-
</sl-format-number>
|
|
61
|
+
<price-box :item="item" :amount="item.quantity" :retail="false"></price-box>
|
|
76
62
|
</div>
|
|
77
63
|
</sl-card>
|
|
78
64
|
<div class="loading" v-if="cartState.isUpdating">
|
|
@@ -85,6 +71,7 @@ import { useDebounceFn } from '@vueuse/core'
|
|
|
85
71
|
import { getImage } from '../utils';
|
|
86
72
|
import { useCart } from '../composables/cart';
|
|
87
73
|
import dialogButton from './dialogButton.vue';
|
|
74
|
+
import PriceBox from "./PriceBox.vue";
|
|
88
75
|
|
|
89
76
|
const {addItem, removeItem, state:cartState, getValue} = useCart()
|
|
90
77
|
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div style="display:flex;gap:10px;">
|
|
3
|
+
<sl-format-number
|
|
4
|
+
class="viur-shop-cart-leaf-value viur-shop-cart-leaf-value--unitprice"
|
|
5
|
+
lang="de"
|
|
6
|
+
type="currency"
|
|
7
|
+
currency="EUR"
|
|
8
|
+
:value="item.price.current * amount"
|
|
9
|
+
:class="{pricetag_current:!retail}"
|
|
10
|
+
>
|
|
11
|
+
</sl-format-number>
|
|
12
|
+
<div style="position: relative;" v-if="retail">
|
|
13
|
+
<sl-format-number
|
|
14
|
+
class="viur-shop-cart-leaf-value viur-shop-cart-leaf-value--unitprice pricetag_old"
|
|
15
|
+
lang="de"
|
|
16
|
+
type="currency"
|
|
17
|
+
currency="EUR"
|
|
18
|
+
:value="item.price.retail * amount"
|
|
19
|
+
>
|
|
20
|
+
</sl-format-number>
|
|
21
|
+
</div>
|
|
22
|
+
</div>
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
</template>
|
|
26
|
+
<script setup>
|
|
27
|
+
|
|
28
|
+
const props = defineProps({
|
|
29
|
+
item:{
|
|
30
|
+
type:Object
|
|
31
|
+
},
|
|
32
|
+
amount:{
|
|
33
|
+
type:Number,
|
|
34
|
+
default:1
|
|
35
|
+
},
|
|
36
|
+
retail:{
|
|
37
|
+
type:Boolean,
|
|
38
|
+
default:true
|
|
39
|
+
}
|
|
40
|
+
})
|
|
41
|
+
|
|
42
|
+
</script>
|
|
43
|
+
|
|
44
|
+
<style scoped>
|
|
45
|
+
:is(.pricetag_old):before {
|
|
46
|
+
content: " ";
|
|
47
|
+
border-bottom: 2px solid var(--sl-color-primary-500);
|
|
48
|
+
width: 100%;
|
|
49
|
+
display: block;
|
|
50
|
+
position: absolute;
|
|
51
|
+
top:calc(0.7rem);
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.pricetag_old{
|
|
55
|
+
font-size: 0.8rem;
|
|
56
|
+
|
|
57
|
+
}
|
|
58
|
+
.pricetag_current{
|
|
59
|
+
margin-left:auto;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
</style>
|
|
64
|
+
<script setup lang="ts">
|
|
65
|
+
</script>
|