feat: change quantity from shopping cart

This commit is contained in:
Vlad Stan 2023-07-07 09:56:45 +03:00
parent a77f3772f6
commit 2b0664b613
3 changed files with 15 additions and 13 deletions

View file

@ -20,16 +20,14 @@
By <span v-text="cart.merchant?.profile?.name || cart.merchant?.publicKey"></span> By <span v-text="cart.merchant?.profile?.name || cart.merchant?.publicKey"></span>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
<q-item-section side>
</q-item-section>
</q-item> </q-item>
<q-separator /> <q-separator />
<q-card-section horizontal> <q-card-section horizontal>
<!-- <q-card-section >
xxx
</q-card-section>
<q-separator vertical /> -->
<q-card-section class="col-12"> <q-card-section class="col-12">
<q-list class="q-mt-md"> <q-list class="q-mt-md">
@ -53,9 +51,9 @@
<q-item-label><strong>{{ formatCurrency(product.price, product.currency)}}</strong></q-item-label> <q-item-label><strong>{{ formatCurrency(product.price, product.currency)}}</strong></q-item-label>
<q-item-label></q-item-label> <q-item-label></q-item-label>
</q-item-section> </q-item-section>
<!-- @change="addQty(p.id, p.quantity)" --> <!-- " -->
<q-item-section class="q-ma-sm"> <q-item-section class="q-ma-sm">
<q-input v-model.number="product.orderedQuantity" type="number" rounded outlined min="1" <q-input v-model.number="product.orderedQuantity" @change="quantityChanged(product)" type="number" rounded outlined min="1"
:max="product.quantity"></q-input> :max="product.quantity"></q-input>
</q-item-section> </q-item-section>
@ -78,10 +76,7 @@
<q-separator /> <q-separator />
<q-card-actions align="right"> <q-card-actions align="right">
<q-btn flat round icon="event" /> Total: <strong class="q-ma-md"> {{cartTotalFormatted(cart)}} </strong>
<q-btn flat>
7:30PM
</q-btn>
<q-btn flat color="primary"> <q-btn flat color="primary">
Proceed to Checkout Proceed to Checkout
</q-btn> </q-btn>

View file

@ -14,9 +14,16 @@ async function shoppingCartList(path) {
formatCurrency: function (value, unit) { formatCurrency: function (value, unit) {
return formatCurrency(value, unit) return formatCurrency(value, unit)
}, },
cartTotalFormatted(cart) {
if (!cart.products?.length) return ""
const total = cart.products.reduce((t, p) => p.price + t, 0)
return formatCurrency(total, cart.products[0].currency)
},
removeProduct: function (stallId, productId) { removeProduct: function (stallId, productId) {
console.log('### stallId, productId', stallId, productId)
this.$emit('remove-from-cart', { stallId, productId }) this.$emit('remove-from-cart', { stallId, productId })
},
quantityChanged: function (product) {
this.$emit('add-to-cart', product)
} }
}, },
created() { } created() { }

View file

@ -205,7 +205,7 @@
<market-config v-if="activePage === 'market-config'" :merchants="merchants" @add-merchant="addMerchant" <market-config v-if="activePage === 'market-config'" :merchants="merchants" @add-merchant="addMerchant"
@remove-merchant="removeMerchant"></market-config> @remove-merchant="removeMerchant"></market-config>
<shopping-cart-list v-else-if="activePage === 'shopping-cart-list'" :carts="shoppingCarts" <shopping-cart-list v-else-if="activePage === 'shopping-cart-list'" :carts="shoppingCarts"
@remove-from-cart="removeProductFromCart"></shopping-cart-list> @add-to-cart="addProductToCart" @remove-from-cart="removeProductFromCart"></shopping-cart-list>
<customer-stall v-else-if="!isLoading && activeStall" :stall="stalls.find(stall => stall.id == activeStall)" <customer-stall v-else-if="!isLoading && activeStall" :stall="stalls.find(stall => stall.id == activeStall)"
:products="filterProducts" :stall-products="products.filter(p => p.stall_id == activeStall)" :products="filterProducts" :stall-products="products.filter(p => p.stall_id == activeStall)"
:product-detail="activeProduct" :relays="relays" :account="account" :pool="pool" :styles="config?.opts ?? {}" :product-detail="activeProduct" :relays="relays" :account="account" :pool="pool" :styles="config?.opts ?? {}"