Skip to content

Commit 3ba68f7

Browse files
aigorlaxyaigorlaxy
authored
Update CartQuickview.html
1 parent 8bbc5c5 commit 3ba68f7

File tree

1 file changed

+156
-127
lines changed

1 file changed

+156
-127
lines changed

‎template/js/custom-js/components/CartQuickview.html‎

Lines changed: 156 additions & 127 deletions
Original file line numberDiff line numberDiff line change
@@ -1,92 +1,31 @@
1-
<div class="minicart">
2-
<a-backdrop
3-
:is-visible="isVisible"
4-
@hide="toggle(false)"
5-
/>
6-
7-
<transition
8-
enter-active-class="animated slideInRight"
9-
leave-active-class="animated slideOutRight"
10-
>
11-
<aside
12-
v-show="isVisible"
13-
class="minicart__aside card shadow"
1+
<div class="cart">
2+
<transition-group enter-active-class="animated fadeInDown">
3+
<div
4+
class="row"
5+
v-if="cart.items.length"
6+
key="list"
147
>
15-
<slot name="header">
16-
<header class="card-header">
17-
{{ i19myShoppingCart }}
18-
<button
19-
type="button"
20-
class="close"
21-
:aria-label="i19close"
22-
@click="toggle"
23-
>
24-
<span aria-hidden="true">&times;</span>
25-
</button>
26-
</header>
27-
</slot>
28-
29-
<article class="minicart__body card-body">
30-
<slot name="list-prepend"></slot>
31-
<transition-group enter-active-class="animated fadeIn slow">
32-
<div
33-
class="minicart__list"
34-
v-if="cart.items.length"
35-
key="list"
8+
<div class="col-md-7 col-lg-8">
9+
<div class="cart__list">
10+
<slot
11+
name="list"
12+
v-bind="{ items: cart.items }"
3613
>
37-
<slot
38-
name="list"
39-
v-bind="{ items: cart.items }"
14+
<transition-group
15+
enter-active-class="animated fadeInDown"
16+
leave-active-class="animated fadeOutUp faster position-absolute"
4017
>
41-
<transition-group
42-
enter-active-class="animated fadeInDown"
43-
leave-active-class="animated fadeOutUp faster position-absolute"
44-
>
45-
<cart-item
46-
v-for="item in cart.items"
47-
:key="item._id"
48-
:origin="'sidecart'"
49-
:item="item"
50-
/>
51-
</transition-group>
52-
</slot>
53-
</div>
54-
55-
<div
56-
v-else
57-
class="minicart__empty"
58-
key="empty"
59-
>
60-
<slot name="empty">
61-
<p class="lead text-muted">
62-
{{ i19emptyCart }} ...
63-
</p>
64-
<a
65-
class="btn btn-block btn-primary"
66-
href="#"
67-
@click.prevent="toggle"
68-
>
69-
<i class="i-arrow-left mr-1"></i>
70-
{{ i19continueShopping }}
71-
</a>
72-
</slot>
73-
</div>
74-
75-
<div
76-
class="minicart__shipping"
77-
v-if="cart.items.length && hasShippingCalculator"
78-
key="shipping"
79-
>
80-
<hr>
81-
<shipping-calculator
82-
class="minicart__shipping-calculator"
83-
:can-select-services="true"
84-
:shipped-items="cart.items"
85-
@select-service="selectShippingService"
86-
/>
87-
</div>
88-
</transition-group>
89-
<div class="gift-list-subscription the-cart p-3 mb-3">
18+
<cart-item
19+
v-for="item in cart.items"
20+
:key="item._id"
21+
:origin="'cart'"
22+
:item="item"
23+
:name-max-length="80"
24+
/>
25+
</transition-group>
26+
</slot>
27+
</div>
28+
<div class="gift-list-subscription the-cart p-3 mb-3">
9029
<!-- <h4 style="color: #df507c;font-weight: 600;">Promo Progressiva de Vestuário: Como Participar</h4>
9130
<p style="font-size: 0.875rem !important">
9231
<span style="color: #9db4cb;font-weight: 600;">Insira no carrinho 5, 8 ou 10 moletons, camisetas adultas ou infantis à sua escolha que o desconto correspondente aparece sozinho na finalização do pedido :D
@@ -107,58 +46,148 @@ <h4 style="color: #df507c;font-weight: 600;">
10746
3. O desconto dado será o de um caderno A5 100 fls de qualquer pauta (R$ 59,90), porém você pode inserir outro que seja mais caro, mas aí precisará pagar a diferença, tudo bem? :D
10847
</div>
10948
<div style="color: #df507c;font-weight: 500;" class="mb-1">
110-
4. Você pode combar quantas vezes quiser essa promo. Um carrinho de R$ 400* te dá direito ao desconto no valor de 2 cadernos A5 100 fls. R$ 300* te dá 3. Basta o carrinho original ter o valor necessário para ativar a promo e você posteriormente inserir os cadernos.
49+
4. Você pode combar quantas vezes quiser essa promo. Um carrinho de R$ 400 te dá direito ao desconto no valor de 2 cadernos A5 100 fls. R$ 600 te dá 3. Basta o carrinho original ter o valor necessário para ativar a promo e você posteriormente inserir os cadernos.
11150
</div>
11251
<div style="color: #9db4cb;font-weight: 500;" class="mb-1">
11352
5. Qualquer dúvida, clica no botão flutuando do WhatsApp e manda uma mensagem! ^^
11453
</div>
11554
<!-- <div style="color: #df507c; font-weight: 50">*Importante: O valor para ativar a promo precisa ser em produtos tirando os cadernos que vão ser o brinde. Por exemplo, se você colocar R$ 200 em produtos e dentro desse valor contiver o caderno que vai ser dado como presente, a promo não vai ser ativada. Precisa ser R$ 200 + o caderno.
11655
</div> -->
11756
</p>
57+
</div>p>
11858
</div>
119-
</article>
120-
121-
<slot name="footer">
122-
<footer
123-
class="card-footer"
124-
v-if="cart.subtotal || cart.items.length"
125-
>
126-
<div class="minicart__summary">
127-
<span>{{ i19subtotal }}</span>
128-
<div class="minicart__subtotal">
129-
<a-prices
130-
:product="{ price: total || cart.subtotal }"
131-
:is-literal="true"
132-
/>
59+
<div id="image-gift-modal" class="gift-modal">
60+
<span class="close-gift-modal">&times;</span>
61+
<img class="gift-modal-content" id="giftExpandedImage">
62+
<div id="gift-modal-caption"></div>
13363
</div>
64+
<earn-points-progress
65+
class="my-3"
66+
:cart-subtotal="cart.subtotal"
67+
/>
68+
69+
<recommended-items col-class-name="col-6 col-lg-3"/>
70+
71+
<slot name="back-shopping">
72+
<div class="cart__back d-none d-md-block my-4">
73+
<a
74+
class="cart__btn-back btn btn-link"
75+
role="button"
76+
href="/"
77+
>
78+
<i class="i-arrow-left mr-1"></i>
79+
{{ i19continueShopping }}
80+
</a>
13481
</div>
82+
</slot>
83+
</div>
13584

136-
<a-link
137-
class="minicart__btn-checkout btn btn-block btn-primary"
138-
role="button"
139-
:href="checkoutUrl"
140-
>
141-
<i class="i-check mr-1"></i>
142-
{{ i19checkout }}
143-
</a-link>
144-
<a-link
145-
class="minicart__btn-cart btn btn-block btn-outline-secondary"
146-
role="button"
147-
:href="cartUrl"
148-
>
149-
{{ i19seeCart }}
150-
</a-link>
85+
<div class="col-md-5 col-lg-4 mt-3 mt-md-0">
86+
<div class="cart__info">
87+
<slot name="info">
88+
<div
89+
class="cart__summary-row"
90+
:data-subtotal="cart.subtotal.toFixed(2)"
91+
>
92+
<span>Subtotal</span>
93+
<div>{{ formatMoney(cart.subtotal) }}</div>
94+
</div>
15195

152-
<button
153-
type="button"
154-
class="minicart__btn-back btn btn-block btn-sm btn-link d-md-none"
155-
@click="toggle"
156-
>
157-
<i class="i-arrow-left mr-1"></i>
158-
{{ i19continueShopping }}
159-
</button>
160-
</footer>
96+
<template v-if="isValidCart">
97+
<transition enter-active-class="animated fadeInDown">
98+
<div
99+
class="cart__summary-row mt-1"
100+
v-if="amount.discount"
101+
:data-discount="amount.discount.toFixed(2)"
102+
>
103+
<span>
104+
<i class="i-tag mr-1"></i>
105+
{{ i19discount }}
106+
</span>
107+
<div>{{ formatMoney(amount.discount) }}</div>
108+
</div>
109+
</transition>
110+
111+
<shipping-calculator
112+
class="cart__shipping"
113+
:can-select-services="true"
114+
:shipped-items="cart.items"
115+
:zip-code.sync="localZipCode"
116+
@select-service="selectShippingService"
117+
/>
118+
119+
<div
120+
class="cart__summary-row cart__total"
121+
:data-total="(amount.total || cart.subtotal).toFixed(2)"
122+
>
123+
<span>Total</span>
124+
<a-prices
125+
:product="{ price: amount.total || cart.subtotal }"
126+
:discount-option="{ value: amount.discount }"
127+
:is-literal="true"
128+
:is-amount-total="true"
129+
/>
130+
</div>
131+
</template>
132+
133+
<slot name="checkout">
134+
<a
135+
v-if="isValidCart"
136+
class="cart__btn-checkout btn btn-lg btn-block btn-success"
137+
role="button"
138+
:href="checkoutUrl"
139+
>
140+
<span class="mr-1">
141+
<i class="i-shopping-bag"></i>
142+
</span>
143+
{{ i19checkout }}
144+
</a>
145+
146+
<a
147+
class="cart__btn-back btn btn-block btn-outline-secondary"
148+
:class="isValidCart ? 'd-md-none' : 'mt-3'"
149+
role="button"
150+
href="/"
151+
>
152+
<i class="i-arrow-left mr-1"></i>
153+
{{ i19continueShopping }}
154+
</a>
155+
</slot>
156+
</slot>
157+
</div>
158+
159+
<discount-applier
160+
v-if="isValidCart && canApplyDiscount"
161+
class="cart__discount"
162+
:amount="amount"
163+
:is-coupon-applied="isCouponApplied"
164+
:coupon-code.sync="localDiscountCoupon"
165+
@set-discount-rule="setDiscountRule"
166+
:modules-payload="modulesPayload"
167+
/>
168+
</div>
169+
</div>
170+
171+
<div
172+
v-else
173+
class="cart__empty"
174+
key="empty"
175+
>
176+
<slot name="empty">
177+
<p class="lead text-muted">
178+
{{ i19emptyCart }} ...
179+
</p>
180+
<a
181+
class="btn btn-primary"
182+
href="/"
183+
>
184+
<span class="mr-1">
185+
<i class="i-arrow-left"></i>
186+
</span>
187+
{{ i19continueShopping }}
188+
</a>
161189
</slot>
162-
</aside>
163-
</transition>
190+
</div>
191+
</transition-group>
192+
164193
</div>

0 commit comments

Comments
 (0)