Feat(购物车)：购物车调整（完成）
This commit is contained in:
modendeveloper
@@ -131,17 +131,25 @@ each(@colors, {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.v12-justify-start{
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
}
|
||||
.v12-d-grid-columns-2 {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
/*==============v12 按钮样式======================*/
|
||||
|
||||
.v12-text-right{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.v12-text-left{
|
||||
text-align: left;
|
||||
}
|
||||
.v12-text-center{
|
||||
text-align: center;
|
||||
}
|
||||
.v12-btn{
|
||||
width: 136rpx;
|
||||
height: 50rpx;
|
||||
|
||||
+114
-8
@@ -6,10 +6,9 @@
|
||||
class="pages-cart tabbar-page"
|
||||
>
|
||||
<u-navbar
|
||||
:left-icon="selectCount > 0 ? 'trash' : ''"
|
||||
:left-icon="selectCount > 0 ? '' : ''"
|
||||
title="购物车"
|
||||
fixed
|
||||
@leftClick="remove"
|
||||
/>
|
||||
<view v-if="isLoad">
|
||||
<view
|
||||
@@ -23,6 +22,16 @@
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
</view>
|
||||
<view class="v12-justify-between v12-px-2">
|
||||
<view class="v12-font-28 v12-dark-text v12-align-center" @click="show = true">
|
||||
<image :src="webUrl+'/orderIcon/map.png'" style="width: 30rpx;height: 30rpx" class="v12-mr-1"/>
|
||||
<text>{{ addressInfo.city }}</text>
|
||||
<view class="v12-ml-1" style="margin-top: 2px;">
|
||||
<u-icon name="arrow-down"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="v12-font-28 v12-font-bold v12-dark-text" @click="editCart">{{ isEdit ? '完成' : '管理' }}</view>
|
||||
</view>
|
||||
<view
|
||||
v-for="(item, index) in list"
|
||||
:key="index"
|
||||
@@ -30,12 +39,12 @@
|
||||
>
|
||||
<view class="flex jc-between">
|
||||
<view class="flex ai-center mer-left">
|
||||
<CheckboxIcon
|
||||
<!-- <CheckboxIcon
|
||||
:default-state="item['state']"
|
||||
:mark="[index]"
|
||||
style="margin-right: 24rpx;"
|
||||
@change="onChange"
|
||||
/>
|
||||
/> -->
|
||||
<image
|
||||
:src="item['merAvatar']"
|
||||
class="store-cover"
|
||||
@@ -151,13 +160,20 @@
|
||||
/>
|
||||
<text class="v12-dark-text v12-font-32 v12-font-bold">全选({{ selectCount }})</text>
|
||||
</view>
|
||||
<view class="flex ai-center">
|
||||
<view class="flex ai-center" v-if="!isEdit">
|
||||
<view >
|
||||
<text class="v12-font-24 v12-dark-text v12-font-weight-550"> 合计:</text>
|
||||
<text class="v12-font-22 v12-primary-text v12-font-bold">￥</text>
|
||||
<text class="v12-font-26 v12-primary-text v12-font-bold">{{ total }}</text>
|
||||
</view>
|
||||
<view class="btn-submit v12-mx-3 bold flex jc-center ai-center v12-radius-80 v12-primary" @click="submit">结算</view>
|
||||
<view class="btn-submit v12-mx-3 flex jc-center ai-center v12-radius-80 v12-primary" @click="submit">结算</view>
|
||||
</view>
|
||||
<view class="flex ai-center" v-else>
|
||||
<view @click="clearCart" class="v12-justify-between v12-align-center">
|
||||
<view style="margin-top: 1px"><u-icon name="trash"></u-icon> </view>
|
||||
<view>清空</view>
|
||||
</view>
|
||||
<view @click="remove" class="btn-submit v12-mx-3 flex jc-center ai-center v12-radius-80 v12-primary">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
@@ -225,11 +241,35 @@
|
||||
v-else
|
||||
:show-avatar="false"
|
||||
/>
|
||||
<u-popup :show="show " @close="closePopup" closeable>
|
||||
<view class="v12-secondary-dark-text v12-font-32 v12-text-center v12-py-4">收货地址</view>
|
||||
<view class="v12-px-3 v12-mb-3 v12-font-32 v12-justify-start v12-align-center">
|
||||
<view style="opacity: 0; width: 28px">
|
||||
<image :src="webUrl+'/orderIcon/map.png'" style="width: 30rpx;height: 30rpx" class="v12-mr-1"/>
|
||||
</view>
|
||||
<view>收货人：{{ addressInfo.realName }} {{ addressInfo.phone }}</view>
|
||||
|
||||
</view>
|
||||
<view class="v12-px-3 v12-mb-3 v12-font-28 v12-justify-between v12-align-start">
|
||||
<view style="width: 30px;">
|
||||
<image :src="webUrl+'/orderIcon/map.png'" style="width: 30rpx;height: 30rpx" class="v12-mr-1"/>
|
||||
</view>
|
||||
<view style="margin-bottom: 4px;width: 100%" class="more-t v12-text-left">{{ addressInfo.province }}{{ addressInfo.city }}{{ addressInfo.district }}{{ addressInfo.detail }}</view>
|
||||
<view style="width: 50px;" @click="editAddress">
|
||||
<image :src="webUrl+'/icon/icon-setting.png'" style="width: 30rpx;height: 30rpx" class="v12-mr-1"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class=" v12-px-3">
|
||||
<view class="v12-py-2 v12-primary-text v12-font-28 v12-radius-60 v12-text-center plus-btn" @click="addNewAddress">+ 添加新地址</view>
|
||||
</view>
|
||||
|
||||
</u-popup>
|
||||
<xdd-tabbar :curr-index="2" />
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import XddTabbar from '@/components/xdd-tabbar'
|
||||
import {getAddressList} from "@/api/user";
|
||||
import {
|
||||
changeCartNum,
|
||||
getCartGroup,
|
||||
@@ -247,6 +287,8 @@ export default {
|
||||
mixins: [pageListenMixins],
|
||||
data() {
|
||||
return {
|
||||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||
show: false,
|
||||
statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
|
||||
isLoad: false,
|
||||
list: [],
|
||||
@@ -258,7 +300,10 @@ export default {
|
||||
productValueArr: []
|
||||
},
|
||||
showAttr: false,
|
||||
pageKeyId: Object.freeze('landmarkGoodsIndex')
|
||||
pageKeyId: Object.freeze('landmarkGoodsIndex'),
|
||||
isEdit: false,
|
||||
addressList:[],
|
||||
addressInfo: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -283,6 +328,12 @@ export default {
|
||||
},
|
||||
created() {
|
||||
this.getCart()
|
||||
this.getAddress()
|
||||
},
|
||||
onLoad() {
|
||||
uni.$on('chooseAddress', (res) => {
|
||||
this.addressInfo = res;
|
||||
})
|
||||
},
|
||||
onShow() {
|
||||
if (!this.isLoad) {
|
||||
@@ -295,6 +346,57 @@ export default {
|
||||
this.pageToHideHandle()
|
||||
},
|
||||
methods: {
|
||||
closePopup() {
|
||||
this.show = false
|
||||
},
|
||||
editAddress() {
|
||||
this.$yrouter.push({
|
||||
path: "/pages/user/address/AddressManagement/index",
|
||||
query: {
|
||||
choosMode: 1
|
||||
}
|
||||
});
|
||||
},
|
||||
addNewAddress() {
|
||||
this.$yrouter.push({
|
||||
path: "/pages/user/address/AddAddress/index"
|
||||
});
|
||||
},
|
||||
getAddress() {
|
||||
getAddressList({page: 1, limit: 9999}).then(res => {
|
||||
this.addressList = res.data
|
||||
this.addressInfo = res.data.find(e => e.isDefault == 1) || {}
|
||||
});
|
||||
},
|
||||
clearCart() {
|
||||
const ids = this.list.map(l => {
|
||||
return l.carts.map(g => g.id)
|
||||
}).flat()
|
||||
uni.showModal({
|
||||
title: '确定清空购物车吗?',
|
||||
content: '',
|
||||
showCancel: true,
|
||||
cancelText: '取消',
|
||||
confirmText: '确认',
|
||||
success: async (result) => {
|
||||
if (result.confirm) {
|
||||
uni.showLoading()
|
||||
postCartDel(ids).then(res => {
|
||||
const { success } = res
|
||||
if (success) {
|
||||
this.getCart()
|
||||
}
|
||||
}).finally(() => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
editCart() {
|
||||
this.isEdit = !this.isEdit
|
||||
},
|
||||
async getCart() {
|
||||
const res = await getCartGroup()
|
||||
if (res.success) {
|
||||
@@ -553,8 +655,9 @@ export default {
|
||||
submit() {
|
||||
const ids = this.handleIds()
|
||||
if (ids.length === 0) return
|
||||
uni.$emit('chooseAddress1', this.addressInfo)
|
||||
uni.navigateTo({
|
||||
url: '/pages/order/OrderSubmission/index?id=' + ids.join(',')
|
||||
url: '/pages/order/OrderSubmission/index?id=' + ids.join(',') + '&address=' + JSON.stringify(this.addressInfo)
|
||||
})
|
||||
}
|
||||
}
|
||||
@@ -562,6 +665,9 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.plus-btn{
|
||||
background: rgba(197,39,51,0.2);
|
||||
}
|
||||
.v12-minus-btn{
|
||||
border-radius: 28rpx 0rpx 0rpx 28rpx;
|
||||
border: 1px solid #E6E6E6;
|
||||
|
||||
@@ -442,7 +442,11 @@ export default {
|
||||
_this.usePointsCheck = true
|
||||
_this.usePointsNumber = data.maxPoints
|
||||
}
|
||||
if(_this.$yroute.query.address !== undefined ) {
|
||||
_this.addressInfo = JSON.parse(_this.$yroute.query.address) || {}
|
||||
} else {
|
||||
_this.addressInfo = data.addressInfo || {}
|
||||
}
|
||||
_this.systemStore = data.systemStore || {}
|
||||
_this.storeSelfMention = data.storeSelfMention
|
||||
_this.computedPrice()
|
||||
|
||||
Reference in New Issue
Block a user