cart product list fixes

This commit is contained in:
User 2023-06-20 18:24:22 +05:30
parent 2e612c4527
commit de75485193
2 changed files with 30 additions and 21 deletions

View File

@ -13,8 +13,9 @@
v-for="(product, index) in cartItems.slice().reverse()" v-for="(product, index) in cartItems.slice().reverse()"
v-bind:key="index" v-bind:key="index"
> >
<v-row class="mx-1 mt-4"> <v-row class="mx-1 mt-1 p-2">
<v-col cols="4"> <!-- img column -->
<v-col cols="8" sm="4" md="4" lg="4" >
<div v-if="product.customAttributes.isPersonalize == 1"> <div v-if="product.customAttributes.isPersonalize == 1">
<div v-if="product.personalizeDetails"> <div v-if="product.personalizeDetails">
<div v-if="checkThumbnails(product.personalizeDetails)"> <div v-if="checkThumbnails(product.personalizeDetails)">
@ -278,14 +279,14 @@
</v-row> </v-row>
</div> </div>
</v-col> </v-col>
<!---------------------------cart page---------------------------------------------> <!-------------img description qty price -------------------------->
<v-col cols="8" class="py-0" v-show="cartProductPage"> <v-col cols="4" sm="8" md="8" lg="8" class="py-0" v-show="cartProductPage">
<v-row class="my-3"> <v-row class="my-3">
<v-col cols="12" sm="6" md="5" lg="6"> <v-col cols="12" sm="6" md="5" lg="6">
<v-row> <v-row>
<p <p
class=" mt-4 class=" md-mt-4 lg-mt-4
mb-6 mb-2
fontsize-14 fontsize-14
text-black text-black
float-left float-left
@ -296,7 +297,7 @@
</v-row> </v-row>
<v-row> <v-row>
<p <p
class="fontsize-14 mb-6 text-uppercase" class="fontsize-14 mb-2 text-uppercase"
v-show="cartProductPage" v-show="cartProductPage"
> >
Sku {{ product.sku }} Sku {{ product.sku }}
@ -304,7 +305,7 @@
</v-row> </v-row>
<v-row> <v-row>
<p <p
class=" fontsize-14 mb-6 text-uppercase" class=" fontsize-14 mb-2 text-uppercase"
v-show="cartProductPage" v-show="cartProductPage"
> >
UPC {{ product.customAttributes.upc }} UPC {{ product.customAttributes.upc }}
@ -318,7 +319,7 @@
</v-col> </v-col>
<v-col cols="12" sm="6" md="7" lg="6"> <v-col cols="12" sm="6" md="7" lg="6">
<v-row align="center"> <v-row align="center">
<v-col cols="8" sm="8" md="9" lg="7" class="pb-0"> <v-col cols="8" sm="8" md="9" lg="9" class="pb-0">
<v-row <v-row
v-if="product.customAttributes.isPersonalize == 1" v-if="product.customAttributes.isPersonalize == 1"
align="center" align="center"
@ -378,12 +379,12 @@
</v-hover> </v-hover>
</v-col> </v-col>
</v-row> </v-row>
<v-row align="center" class="mt-n2" v-else> <!-- qty and price field -->
<v-col cols="auto" class="pr-1 py-0"> <v-row class="m-0" v-else >
<p class="fontsize-14 mb-0 pb-10">Qty.</p> <v-col cols="12" sm="4" md="4" lg="4" class="pl-0 ml-0 ">
<p class="fontsize-14 mb-0 ">Qty.</p>
</v-col> </v-col>
<v-col class="pl-0 pt-0"> <v-col cols="12" sm="8" md="8" lg="8" class="px-0 py-0 ">
<v-hover v-slot:default="{ isHovering, props }"> <v-hover v-slot:default="{ isHovering, props }">
<v-select <v-select
:items=" :items="
@ -397,7 +398,7 @@
class=" class="
fontsize-16 fontsize-16
line-height-21 line-height-21
ls-n009 ls-n00 pr-2
font-weight-400 font-weight-400
cartproductlist-select-button cartproductlist-select-button
" "
@ -434,8 +435,9 @@
</v-col> </v-col>
</v-row> </v-row>
</v-col> </v-col>
<v-col cols="4" sm="4" md="3" lg="5" class="pb-0"> <!-- product price -->
<p class="fontsize-14 float-right mb-12"> <v-col cols="4" sm="4" md="3" lg="3" class="mb-sm-4 mb-md-4 mb-lg-4 pb-0 pl-8 ">
<p class="fontsize-14 float-right ">
${{ priceFormatter(product.rowTotal) }} ${{ priceFormatter(product.rowTotal) }}
</p> </p>
</v-col> </v-col>
@ -475,8 +477,8 @@
</v-row> </v-row>
</v-col> </v-col>
<!-------------------------------------------------------------------------------------> <!---------------------------Remove button----------------->
<v-row class="ma-0 pb-4 pt-5" v-show="checkOut"> <v-row class="mt-auto pb-2 pt-2" v-show="checkOut">
<v-col align="right"> <v-col align="right">
<a <a
@ -499,7 +501,9 @@
</v-row> </v-row>
</v-row> </v-row>
<v-row> <v-row>
<div class="hr-line" v-show="cartProductPage && cartItems.length > 1"></div> <div class="hrDivider my-4" v-if="cartProductPage && cartItems.length > 1">
</div>
</v-row> </v-row>
</v-card> </v-card>
<v-col class="text-center mb-12" v-if="isGateModulePage"> <v-col class="text-center mb-12" v-if="isGateModulePage">
@ -1382,5 +1386,10 @@ export default {
.cartproductlist-expansion .v-expansion-panel-content__wrap { .cartproductlist-expansion .v-expansion-panel-content__wrap {
padding: 0 0px 0px !important; padding: 0 0px 0px !important;
} }
.hrDivider{
height: 1px;
width: 100%;
background: rgb(24, 24, 24);
}
</style> </style>
<style src="./CartProductList.scss" lang="scss" scoped/> <style src="./CartProductList.scss" lang="scss" scoped/>

View File

@ -68,7 +68,7 @@
</v-col> </v-col>
<v-divider class="hidden-md-and-up"></v-divider> <v-divider class="hidden-md-and-up"></v-divider>
<v-row> <v-row>
<v-col cols="12" sm="12" md="12" class="mt-5"> <v-col cols="12" sm="12" md="12" class="mt-1">
<CartProductList <CartProductList
:checkOut="chekoutFlag" :checkOut="chekoutFlag"
:cartItems="cartProductsItem" :cartItems="cartProductsItem"