购物车 订单完成

This commit is contained in:
mactj 2021-01-19 14:02:55 +08:00
parent d8edac4483
commit fecca933bb
17 changed files with 551 additions and 236 deletions

View File

@ -6,8 +6,6 @@ import { baseUrl } from '../baseDefine'
* 订单相关接口
*/
class OrderApis {
/**
* 创建订单
* @param data
@ -22,11 +20,16 @@ class OrderApis {
getOrderList(data) {
return request.get({
url: baseUrl + 'winery/user_orders/list',
url: baseUrl + 'winery/order/list',
data: data
})
}
refundOrder(id) {
return request.post({
url: baseUrl + 'winery/detail/refund/' + id
})
}
}
export default new OrderApis()

View File

@ -102,7 +102,7 @@ pages: [
'pages/form5',
'pages/form6',
'pages/mall/goods-detail',
'pages/mall/goods/goods-detail',
'pages/mall/user/user-address',
'pages/mall/user/user-address-list',
'pages/mall/order/order-list',

View File

@ -44,7 +44,7 @@ class AppManager {
}
saveOpenid(openid) {
console.log('saveOpenid:' + openid)
// console.log('saveOpenid:' + openid)
store.dispatch('setOpenidAction', openid)
}
@ -56,10 +56,12 @@ class AppManager {
const mobile = wx.getStorageSync('mobile')
const openid = wx.getStorageSync('openid')
const userInfo = wx.getStorageSync('userInfo')
const shoppingCar = wx.getStorageSync('shoppingCar')
console.log('setCacheInfo:', mobile)
console.log('setCacheInfo:', openid)
console.log('setCacheInfo:', userInfo)
console.log('shoppingCar:', shoppingCar)
if (mobile) {
store.dispatch('setMobileAction', mobile)
@ -72,6 +74,9 @@ class AppManager {
if (userInfo) {
store.dispatch('setUserInfoAction', userInfo)
}
if (shoppingCar) {
store.dispatch('setShoppingCarAction', shoppingCar)
}
}
navigateTo(path) {

View File

@ -0,0 +1,108 @@
<style lang="less">
.van-card {
background-color: white !important;
}
</style>
<wxs module="filters" lang="babel">
const parseImage = (imageKey) => {
return 'https://winery-1257413599.cos.ap-beijing.myqcloud.com/' + imageKey
}
module.exports.parseImage = parseImage;
</wxs>
<template>
<div style="width: 100%;">
<van-loading wx:if="{{ !isInit }}" style="margin-top: 20px;"></van-loading>
<view wx:else>
<div v-if="records.length < 1" style="display: flex;flex-direction: column;align-items: center;width: 100%;">
<van-empty description="暂无订单" />
</div>
<div v-for="(item,index) in records" style="width: 100%;">
<van-card
:num="item.goodsPrice"
tag="标签"
price="10.00"
desc="描述信息"
:title="item.goodsName"
:thumb="filters.parseImage(item.goodsFaceImg)"
>
<view slot="footer">
<van-button size="mini" plain @tap="onRefund(item)">申请退款</van-button>
<van-button size="mini" plain @tap="onDetail(item)" style="margin-left: 10px;">查看详情</van-button>
</view>
</van-card>
</div>
</view>
</div>
</template>
<script>
import wepy from '@wepy/core'
import store from '@/store'
import { mapActions, mapState } from '@wepy/x'
import defaultMix from '../../../mixins/defaultMix'
import appManager from '../../../appManager'
import orderApis from '../../../apis/orderApis'
wepy.component({
store,
hooks: {},
data: {
records: [],
isInit: false
},
mixins: [defaultMix],
computed: {
...mapState({
'imageDefine': state => state.imageDefine,
'user': state => state.user,
'navDefine': state => state.navDefine,
'userAddress': state => state.userAddress
})
},
methods: {
onRefund(item) {
},
onDetail(item) {
},
async init() {
this.isInit = false
const req = await orderApis.getOrderList()
if (req.code === 200) {
this.records = req.rows
}
this.isInit = true
}
},
ready() {
this.init()
},
onShow() {
this.init()
}
})
</script>
<config>
{
navigationBarTitleText: ''
}
</config>

View File

@ -1,5 +1,22 @@
<style lang="less">
page {
background-color: #eeeeee;
}
.fream {
border-radius: 25px;
width: 660rpx;
margin-top: 20px;
background-color: white;
//box-shadow: 4px 4px 10px #eeeeee;
padding: 10px 10px 10px 10px;
display: flex;
flex-direction: column;
}
.van-card {
background-color: #ffffff !important;
}
</style>
@ -7,7 +24,39 @@
const parseImage = (imageKey) => {
return 'https://winery-1257413599.cos.ap-beijing.myqcloud.com/' + imageKey
}
const parseOrderStatus = (status) => {
let result = '未知状态'
switch(status) {
case 0:
result = '未支付'
break
case 1:
result = '已取消'
break
case 2:
result = '已支付'
break
case 3:
result = '待收货'
break
case 4:
result = '交易完成'
break
default:
break
}
console.log("123:",status)
console.log("123:",result)
return result
}
module.exports.parseImage = parseImage;
module.exports.parseOrderStatus = parseOrderStatus;
</wxs>
<template>
@ -15,9 +64,7 @@ module.exports.parseImage = parseImage;
<div style="width: 100%;">
<van-loading wx:if="{{ !isInit }}" style="margin-top: 20px;"></van-loading>
<view wx:else>
<view class="contianer" style="margin: 10px;" wx:else>
<div v-if="records.length < 1" style="display: flex;flex-direction: column;align-items: center;width: 100%;">
@ -25,24 +72,26 @@ module.exports.parseImage = parseImage;
</div>
<div class="fream" v-for="(row,index) in records" >
<span style="display: flex;justify-content: flex-end;margin-right: 10px;font-size: 14px; color: #AC1630;">{{filters.parseOrderStatus(row.status)}}</span>
<div v-for="(item,index) in row.orderDetailList" style="width: 100%;">
<div v-for="(item,index) in records" style="width: 100%;">
<van-card
:num="item.goodsPrice"
tag="标签"
price="10.00"
desc="描述信息"
:title="item.goodsName"
:thumb="filters.parseImage(item.goodsFaceImg)"
<van-card
:num="item.goodsCount"
:price="item.goodsCount"
:desc="'描述信息'"
:title="item.goodsId"
:thumb="filters.parseImage(item.goodsFaceImg)"
>
<view slot="footer">
<van-button size="mini" plain @tap="onRefund(item)">申请退款</van-button>
<van-button size="mini" plain @tap="onDetail(item)" style="margin-left: 10px;">查看详情</van-button>
</view>
</van-card>
>
<view slot="footer">
<van-button v-if="row.status === 2 || row.status === 4" size="mini" plain @tap="onRefund(item)">申请退款</van-button>
<van-button size="mini" plain @tap="onDetail(item)" style="margin-left: 10px;">查看详情</van-button>
</view>
</van-card>
</div>
</div>
</view>
</div>
@ -58,10 +107,15 @@ import defaultMix from '../../../mixins/defaultMix'
import appManager from '../../../appManager'
import orderApis from '../../../apis/orderApis'
import { goodsDetailPage } from '../../../store/constant/nav/pages'
wepy.component({
store,
hooks: {},
props: {
status: ''
},
data: {
records: [],
isInit: false
@ -80,14 +134,23 @@ wepy.component({
methods: {
onRefund(item) {
// 申请退款
orderApis.refundOrder(item.id)
},
onDetail(item) {
appManager.navigateTo(goodsDetailPage + '?id=' + item.goods.id)
},
async init() {
this.isInit = false
const req = await orderApis.getOrderList()
let data
if (this.status) {
data = {
status: this.status
}
}
const req = await orderApis.getOrderList(data)
if (req.code === 200) {
this.records = req.rows
@ -98,9 +161,11 @@ wepy.component({
},
ready() {
console.log('ready')
this.init()
},
onShow() {
console.log('onShow')
this.init()
}
})

View File

@ -1,64 +0,0 @@
<style lang="less">
</style>
<wxs module="filters" lang="babel">
const parseImage = (imageKey) => {
return 'https://winery-1257413599.cos.ap-beijing.myqcloud.com/' + imageKey
}
module.exports.parseImage = parseImage;
</wxs>
<template>
<van-card
:num="item.goodsCount"
:price="item.goodsPrice"
desc="描述信息"
:title="item.goodsName"
>
<view slot="thumb" style="display: flex; align-items: center;">
<van-checkbox :value="item.isChecked" bind:change="onCheck" />
<van-image width="60px" height="60px" :src="filters.parseImage(item.goodsFaceImg)"
style="margin-left: 5px;" />
</view>
<view slot="footer">
<van-stepper :value="item.goodsCount" @change="onGoodsCount" />
</view>
</van-card>
</template>
<script>
import wepy from '@wepy/core'
import store from '@/store'
import { mapActions } from '@wepy/x'
wepy.component({
store,
hooks: {},
props: {
item: {}
},
data: {},
computed: {},
methods: {
onGoodsCount(e) {
this.$emit('changeGoodsCount', this.item, e.$wx.detail)
},
onCheck(e) {
this.$emit('changeGoodsSelect', this.item, e.$wx.detail)
}
}
})
</script>
<config>
{
}
</config>

View File

@ -27,13 +27,13 @@ module.exports.parseImage = parseImage;
</van-row>
<div style="display: flex;flex-wrap: wrap;">
<div class="filter-button" v-for="(item,index) in filterButtons">
<van-button round size="small" :color=" currentFilter === item ? '#7232dd' : '#7232dd' "
:plain="currentFilter === item ? false : true" @tap="onFilterBtn(item)">{{item}}
</van-button>
</div>
</div>
<div style="display: flex;flex-wrap: wrap;">
<div class="filter-button" v-for="(item,index) in filterButtons">
<van-button round size="small" :color=" currentFilter === item ? '#7232dd' : '#7232dd' "
:plain="currentFilter === item ? false : true" @tap="onFilterBtn(item)">{{item}}
</van-button>
</div>
</div>
<view v-for="(item, index) in records" :key="index"
@ -45,9 +45,9 @@ module.exports.parseImage = parseImage;
:thumb="filters.parseImage(item.goodsFaceImg)"
@tap="onItem(item)"
>
<!-- <view slot="num" style="float:right;">-->
<!-- <div>{{'已优惠¥xx元'}}</div>-->
<!-- </view>-->
<!-- <view slot="num" style="float:right;">-->
<!-- <div>{{'已优惠¥xx元'}}</div>-->
<!-- </view>-->
</van-card>
@ -66,6 +66,7 @@ import { mapActions, mapState } from '@wepy/x'
import appManager from '../../../appManager'
import mailApis from '../../../apis/mailApis'
import defaultMix from '../../../mixins/defaultMix'
import { goodsDetailPage } from '../../../store/constant/nav/pages'
wepy.component({
store,
@ -90,7 +91,7 @@ wepy.component({
methods: {
onItem(item) {
appManager.navigateTo(`goods-detail?id=${item.id}`)
appManager.navigateTo(goodsDetailPage + `?id=${item.id}`)
},
onFilterBtn(item) {

View File

@ -1,5 +1,9 @@
<style lang="less">
img {
width: 100%;
display: block;
}
</style>
@ -17,13 +21,13 @@ module.exports.parseImage = parseImage;
<van-loading v-if="!goodsItem" style="margin-top: 20px;" />
<div v-else>
<div v-else style="margin-bottom: 80px;">
<swiper indicator-dots="true" autoplay="true" interval="3000" style="height: 750rpx;">
<block v-for="(item,index) in goodsImages" wx:key="index">
<swiper-item>
<view class="swiper-item">
<image :src="filters.parseImage(item)" style="width: 100%;height: 750rpx;" mode="scaleToFill" />
<image :src="filters.parseImage(item)" style="width: 100%;height: 750rpx;" mode="aspectFit" />
</view>
</swiper-item>
</block>
@ -36,8 +40,9 @@ module.exports.parseImage = parseImage;
<div style="margin: 10px 15px;">
<span>商品详情</span>
<div style="margin-top: 10px;">
<div style="margin-top: 10px;width:100%;">
<rich-text :nodes="goodsItem.goodsDesc" />
</div>
</div>
@ -76,16 +81,16 @@ module.exports.parseImage = parseImage;
</van-row>
<van-button round type="danger" size="small" style="float:right;margin-top:10px;margin-right: 10px;"
@tap="onSubmit()">下一步
@tap="onSubmit">下一步
</van-button>
</van-popup>
<van-goods-action>
<van-goods-action-icon icon="cart-o" text="购物车" info="5" />
<van-goods-action-icon icon="shop-o" text="酒庄" />
<van-goods-action-button color="#be99ff" text="加入购物车" type="warning" @tap="onShowSpec" />
<van-goods-action-button color="#7232dd" text="立即购买" @tap="onShowSpec" />
<van-goods-action-icon icon="cart-o" text="购物车" :info="shoppingCar.length" @tap="onShppingCar" />
<van-goods-action-icon icon="shop-o" text="酒庄" @tap="onWinery" />
<van-goods-action-button color="#be99ff" text="加入购物车" type="warning" @tap="onShowSpec('shoppingCar')" />
<van-goods-action-button color="#7232dd" text="立即购买" @tap="onShowSpec('order')" />
</van-goods-action>
</div>
</div>
@ -96,29 +101,29 @@ module.exports.parseImage = parseImage;
import wepy from '@wepy/core'
import store from '@/store'
import { mapActions, mapState } from '@wepy/x'
import mailApis from '../../apis/mailApis'
import orderApis from '../../apis/orderApis'
import appManager from '../../appManager'
import { navDefine, orderCheck, orderListPage } from '../../store/constant/navDefine'
import { defaultOrder } from '../../store/constant/orderDefine'
import mailApis from '../../../apis/mailApis'
import { navDefine } from '../../../store/constant/navDefine'
import appManager from '../../../appManager'
import { shoppingCarList } from '../../../store/constant/nav/pages'
wepy.page({
store,
hooks: {},
data: {
detail: '<p style=\'color: #AC1630\'>富文本详情</p>',
isShowSpec: false,
count: 1,
goodsItem: null,
goodsSpec: null
goodsSpec: null,
submitMode: 'order'
},
computed: {
...mapState({
'order': state => state.order
'order': state => state.order,
'shoppingCar': state => state.shoppingCar
}),
goodsImages() {
if (!this.goodsItem || !this.goodsItem.goodsImg) {
@ -132,7 +137,8 @@ wepy.page({
methods: {
...mapActions([
'setOrderAction'
'setOrderAction',
'setShoppingCarAction'
]),
handleViewTap() {
console.log('handleVieTap clicked')
@ -141,14 +147,16 @@ wepy.page({
},
onShowSpec() {
onShowSpec(mode) {
this.isShowSpec = true
this.submitMode = mode
},
onCloseSpec() {
this.isShowSpec = false
},
onChangeCount(e) {
console.log(e)
this.count = e.$wx.detail
},
callAppLaunch() {
@ -156,17 +164,14 @@ wepy.page({
async init(id) {
const goodsReq = await mailApis.getGoodsById(id)
this.goodsItem = goodsReq.data
const ids = this.goodsItem.goodsSpec.split(',')
console.log(ids)
const goodsSpecReq = await mailApis.getGoodsSpecByIds(ids)
// const ids = this.goodsItem.goodsSpec.split(',')
// console.log(ids)
// const goodsSpecReq = await mailApis.getGoodsSpecByIds(ids)
this.goodsSpec = goodsSpecReq.rows[0]
// this.goodsSpec = goodsSpecReq.rows[0]
},
onSubmit() {
console.log(123)
// wx.showLoading({ title: '正在生成订单.', mask: true })
const item = this.goodsItem
let orderItem = {
@ -178,15 +183,45 @@ wepy.page({
goodsPrice: item.goodsPrice,
goodsCount: this.count
}
this.isShowSpec = false
switch (this.submitMode) {
case 'order':
this.nextOrder(orderItem)
break
case 'shoppingCar':
this.addShoppingCar(orderItem)
break
}
},
nextOrder(item) {
console.log('订单:', item)
let order = defaultOrder
let order = {
addressId: '',
orderDetailList: [],
remark: ''
}
defaultOrder.orderDetailList.push(orderItem)
order.orderDetailList.push(item)
this.setOrderAction(order)
appManager.navigateTo(navDefine.ORDER_CHECK)
},
addShoppingCar(item) {
this.shoppingCar.push(item)
this.setShoppingCarAction(this.shoppingCar)
},
onWinery() {
appManager.showToast('建设中')
},
onShppingCar() {
appManager.navigateTo(shoppingCarList)
}
},
@ -203,9 +238,9 @@ wepy.page({
{
navigationBarTitleText: '',
usingComponents: {
"van-goods-action": "../../vant/goods-action/index",
"van-goods-action-icon": "../../vant/goods-action-icon/index",
"van-goods-action-button": "../../vant/goods-action-button/index"
"van-goods-action": "../../../vant/goods-action/index",
"van-goods-action-icon": "../../../vant/goods-action-icon/index",
"van-goods-action-button": "../../../vant/goods-action-button/index"
}
}
</config>

View File

@ -28,8 +28,8 @@ return `${hour}:${mins}:${sec}.${milli}`;
module.exports.getTime = getTime;
</wxs>
<template>
<van-tabbar active="{{ pageIndex }}" bind:change="onChange" fixed>
<van-tabbar-item info="3">
<van-tabbar active="{{ pageIndex }}" bind:change="onChange" fixed active-color="#AC1630">
<van-tabbar-item info="3" >
<image
slot="icon"
:src="imageDefine.TAP_BAR_ICON1_OFF"

View File

@ -16,12 +16,6 @@ page {
flex-direction: column;
}
.van-card {
background-color: white !important;
}
</style>
<wxs module="filters" lang="babel">
@ -36,70 +30,78 @@ module.exports.parseImage = parseImage;
<div class="contianer" style="width: 100%;margin:15px;">
<div v-if="!currentAddress" style="display: flex;flex-direction: column;align-items: center;width: 100%;">
<van-empty description="您还没有添加收货地址" />
<div style="width: 600rpx;">
<van-button round type="info" size="large" @tap="onAdd">点击添加</van-button>
</div>
</div>
<div v-else class="fream" @tap="onSelectAddress">
<van-loading v-if="!isInit" style="margin-top: 20px;justify-content: center;"></van-loading>
<view wx:else>
<div style="display: flex; justify-content: space-between;">
<van-icon name="home-o" size="60rpx" />
<div style="display: flex;flex-direction: column;">
<div style="display: flex;align-items: center;">
<span style="font-size: 16px;font-weight: bold;">{{currentAddress.name}}</span>
<span style="color: #999;font-size: 12px;margin-left: 10px;">{{currentAddress.mobile}}</span>
</div>
<div style="display: flex; flex-direction: column; font-size: 14px; width: 500rpx;margin-top: 10px;">
<span>{{currentAddress.region}}</span>
<span style="margin-top: 5px;">{{currentAddress.address}}</span>
</div>
<div v-if="!currentAddress" style="display: flex;flex-direction: column;align-items: center;width: 100%;">
<van-empty description="您还没有添加收货地址" />
<div style="width: 600rpx;">
<van-button round type="info" size="large" @tap="onAdd">点击添加</van-button>
</div>
<van-icon name="arrow" />
</div>
<div style="display: flex; justify-content:flex-end;margin: 10px;">
<van-button round size="small" color="#98002E" type="info" plain style="margin-left: 20px;"
@tap="onEditAddress()">编辑
</van-button>
<div v-else class="fream" @tap="onSelectAddress">
<div style="display: flex; justify-content: space-between;">
<van-icon name="home-o" size="60rpx" />
<div style="display: flex;flex-direction: column;">
<div style="display: flex;align-items: center;">
<span style="font-size: 16px;font-weight: bold;">{{currentAddress.name}}</span>
<span style="color: #999;font-size: 12px;margin-left: 10px;">{{currentAddress.mobile}}</span>
</div>
<div style="display: flex; flex-direction: column; font-size: 14px; width: 500rpx;margin-top: 10px;">
<span>{{currentAddress.region}}</span>
<span style="margin-top: 5px;">{{currentAddress.address}}</span>
</div>
</div>
<van-icon name="arrow" />
</div>
<div style="display: flex; justify-content:flex-end;margin: 10px;">
<van-button round size="small" color="#98002E" type="info" plain style="margin-left: 20px;"
@tap="onEditAddress()">编辑
</van-button>
</div>
</div>
</div>
<div class="fream">
<van-card
<div class="fream">
v-for="(item,index) in order.orderDetailList"
:title="item.goodsName"
:desc="item.specDesc"
:price="item.goodsPrice"
:thumb="filters.parseImage(item.goodsFaceImg)"
>
<view slot="num" style="display: flex;justify-content: flex-end;align-items: center;">
<span style="font-size: 15px;margin-right: 5px;">数量:</span>
<van-stepper id="{{item.goodsId}}" name="{{item.goodsId}}" value="{{item.goodsCount}}"
@change="onGoodsCount" />
</view>
<van-card
</van-card>
v-for="(item,index) in order.orderDetailList"
:title="item.goodsName"
:desc="item.specDesc"
:price="item.goodsPrice"
:thumb="filters.parseImage(item.goodsFaceImg)"
>
<view slot="num" style="float:right;">
<van-stepper id="{{item.goodsId}}" name="{{item.goodsId}}" value="{{item.goodsCount}}" @change="onGoodsCount" />
</view>
</div>
</van-card>
</div>
<van-submit-bar
:price="totalPrice"
button-text="提交订单"
bind:submit="onSubmit"
:tip="false"
>
<!-- <view slot="tip">您的收货地址不支持同城送,-->
<!-- <text>修改地址</text>-->
<!-- </view>-->
</van-submit-bar>
</view>
</div>
<van-submit-bar
price="10"
button-text="提交订单"
bind:submit="onSubmit"
:tip="false"
>
<!-- <view slot="tip">您的收货地址不支持同城送,-->
<!-- <text>修改地址</text>-->
<!-- </view>-->
</van-submit-bar>
</template>
@ -113,14 +115,16 @@ import appManager from '../../../appManager'
import addressApis from '../../../apis/addressApis'
import { userAddressPage } from '../../../store/constant/nav/home'
import orderApis from '../../../apis/orderApis'
import { navDefine, orderListPage, userAddressListPage } from '../../../store/constant/navDefine'
import { navDefine } from '../../../store/constant/navDefine'
import { userAddressListPage } from '../../../store/constant/nav/pages'
wepy.page({
store,
hooks: {},
data: {
currentAddress: null,
order: null
order: null,
isInit: false
},
mixins: [defaultMix],
@ -131,7 +135,14 @@ wepy.page({
'navDefine': state => state.navDefine,
'userAddress': state => state.userAddress,
'order': state => state.order
})
}),
totalPrice() {
let result = 0.0
this.order.orderDetailList.forEach(x => {
result += (x.goodsPrice * x.goodsCount)
})
return result * 100
}
},
methods: {
@ -139,7 +150,12 @@ wepy.page({
'setOrderAction'
]),
async init() {
this.isInit = false
const addressRsp = await addressApis.getAddressList()
this.isInit = true
if (addressRsp.code === 200 && addressRsp.rows.length > 0) {
this.currentAddress = addressRsp.rows.filter(x => x.isDefault)[0]
@ -156,11 +172,10 @@ wepy.page({
},
onGoodsCount(e) {
this.order.orderDetailList.filter(x => x.goodsId === e.target.goodsId)[0].goodsCount = e.$wx.detail
this.order.orderDetailList.filter(x => x.goodsId === e.target.id)[0].goodsCount = e.$wx.detail
},
onSubmit() {
orderApis.createOrder(this.order).then(r => {
wx.hideLoading()

View File

@ -21,17 +21,17 @@ module.exports.parseImage = parseImage;
<van-tab title="全部">
<order-list-body />
</van-tab>
<van-tab title="待付">
<order-list-body />
<van-tab title="待付">
<order-list-body status="0" />
</van-tab>
<van-tab title="待收货">
<order-list-body />
<order-list-body status="2" />
</van-tab>
<van-tab title="完成">
<order-list-body />
<van-tab title="交易完成">
<order-list-body status="3" />
</van-tab>
<van-tab title="已取消">
<order-list-body />
<order-list-body status="1" />
</van-tab>
</van-tabs>
@ -73,7 +73,7 @@ wepy.page({
methods: {
onChangeTab(e) {
this.activeTab = e.$wx.event.detail.name
this.activeTab = e.$wx.detail.index
},
async init() {
// this.isInit = false
@ -100,7 +100,8 @@ wepy.page({
navigationBarTitleText: '',
usingComponents: {
'order-list-body': '../../../components/mall/order/order-list-body'
'order-list-body': '../../../components/mall/order/order-list-body',
'order-detail-body': '../../../components/mall/order/order-detail-body'
}

View File

@ -20,17 +20,16 @@ module.exports.parseImage = parseImage;
<view wx:else>
<div v-if="records.length < 1" style="display: flex;flex-direction: column;align-items: center;width: 100%;">
<div v-if="shoppingCar.length < 1" style="display: flex;flex-direction: column;align-items: center;width: 100%;">
<van-empty description="暂无内容" />
</div>
<van-checkbox-group value="{{ checkList }}" bind:change="onChangeCheckbox">
<div v-for="(item,index) in records" style="width: 100%;">
<div v-for="(item,index) in shoppingCar" style="width: 100%;">
<van-card
:num="item.goodsCount"
:price="item.goodsPrice"
desc="描述信息"
:desc="item.remark"
:title="item.goodsName"
>
@ -40,8 +39,12 @@ module.exports.parseImage = parseImage;
<van-image width="60px" height="60px" :src="filters.parseImage(item.goodsFaceImg)"
style="margin-left: 5px;" />
</view>
<view slot="footer">
<van-stepper id="{{item.id}}" name="{{item.id}}" value="{{item.goodsCount}}" @change="onGoodsCount" />
<view slot="num">
<div style="display: flex;align-items: center;justify-content: flex-end;">
<span style="font-size: 15px;margin-right: 5px;">数量:</span>
<van-stepper id="{{item.goodsId}}" name="{{item.goodsId}}" value="{{item.goodsCount}}"
@change="onGoodsCount" />
</div>
</view>
</van-card>
@ -81,14 +84,14 @@ import store from '@/store'
import { mapActions, mapState } from '@wepy/x'
import defaultMix from '../../../mixins/defaultMix'
import orderApis from '../../../apis/orderApis'
import { navDefine } from '../../../store/constant/navDefine'
import appManager from '../../../appManager'
wepy.page({
store,
hooks: {},
data: {
records: [],
isInit: false,
isCheckedAll: true,
checkList: []
@ -100,13 +103,15 @@ wepy.page({
'imageDefine': state => state.imageDefine,
'user': state => state.user,
'navDefine': state => state.navDefine,
'userAddress': state => state.userAddress
'userAddress': state => state.userAddress,
'shoppingCar': state => state.shoppingCar
}),
totalPrice() {
let temp = this.records.filter(x => this.checkList.indexOf(x.goodsId) > -1)
let temp = this.shoppingCar.filter(x => this.checkList.indexOf(x.goodsId) > -1)
let result = 0.0
temp.forEach(x => {
result += x.goodsPrice
result += (x.goodsPrice * x.goodsCount)
})
console.log('总计:', result)
return result * 100
@ -115,30 +120,39 @@ wepy.page({
events: {},
methods: {
...mapActions([
'setOrderAction',
'setShoppingCarAction'
]),
onChangeCheckbox(e) {
this.checkList = e.$wx.detail
this.isCheckedAll = this.checkList.length === this.records.length
this.isCheckedAll = this.checkList.length === this.shoppingCar.length
},
onSubmit() {
let order = {
addressId: '',
orderDetailList: [],
remark: ''
}
order.orderDetailList = this.shoppingCar
this.setOrderAction(order)
appManager.navigateTo(navDefine.ORDER_CHECK)
},
onCheckedAll(e) {
this.isCheckedAll = e.$wx.detail
this.checkList = this.isCheckedAll ? this.records.map(x => x.goodsId) : []
this.checkList = this.isCheckedAll ? this.shoppingCar.map(x => x.goodsId) : []
},
onGoodsCount(e) {
this.records.filter(x => x.id === e.target.id)[0].goodsCount = e.$wx.detail
this.shoppingCar.filter(x => x.goodsId === e.target.id)[0].goodsCount = e.$wx.detail
this.setShoppingCarAction(this.shoppingCar)
},
async init() {
this.isInit = false
const req = await orderApis.getOrderList()
if (req.code === 200) {
this.records = req.rows
this.checkList = this.records.map(x => x.goodsId)
}
this.checkList = this.shoppingCar.map(x => x.goodsId)
this.isInit = true
}
},
@ -156,7 +170,6 @@ wepy.page({
navigationBarTitleText: '',
usingComponents: {
'shopping-car-item': '../../../components/mall/shopping-car/shopping-car-item'
}

View File

@ -82,7 +82,7 @@
/>
<div style="display: flex; justify-content:flex-end;margin: 10px;">
<van-button round v-if="item.isDefault !== 1" color="#98002E" size="small" type="info" plain
<van-button round v-if="item.isDefault !== 1 && !isSelectMode" color="#98002E" size="small" type="info" plain
@tap="onSetDefault(item)">设为默认
</van-button>
<van-button round size="small" color="#98002E" type="info" plain style="margin-left: 20px;"

View File

@ -2,3 +2,4 @@ export const shoppingCarList = '/pages/mall/shopping-car/shopping-car-list'
export const orderListPage = '/pages/mall/order/order-list'
export const orderCheck = '/pages/mall/order/order-check'
export const userAddressListPage = '/pages/mall/user/user-address-list'
export const goodsDetailPage = '/pages/mall/goods/goods-detail'

View File

@ -1,12 +1 @@
export const defaultOrder = {
addressId: '',
orderDetailList:[],
remark: ''
}
export const currentOrder = {
addressId: '',
orderDetailList:[],
remark: ''
}

View File

@ -4,7 +4,6 @@ import { imageDefine } from './constant/imageDefine'
import { navDefine } from './constant/navDefine'
import { wineryDefine } from './constant/wineryDefine'
import { userAddress } from './constant/userAddress'
import { currentOrder } from './constant/orderDefine'
export default new Vuex.Store({
state: {
@ -19,7 +18,9 @@ export default new Vuex.Store({
company: '企业名称'
},
// 订单
order: currentOrder,
order: {},
// 购物车
shoppingCar: [],
wineryForm,
imageDefine,
navDefine,
@ -48,6 +49,11 @@ export default new Vuex.Store({
},
setOrder(state, order) {
state.order = order
},
setShoppingCar(state, shoppingCar) {
state.shoppingCar = shoppingCar
}
},
@ -75,6 +81,10 @@ export default new Vuex.Store({
},
setOrderAction({commit}, order) {
commit('setOrder', order)
},
setShoppingCarAction({commit}, shoppingCar) {
wx.setStorageSync('shoppingCar', shoppingCar)
commit('setShoppingCar', shoppingCar)
}
}

View File

@ -1 +1,134 @@
@import '../common/index.wxss';.van-card{position:relative;box-sizing:border-box;padding:8px 16px;padding:var(--card-padding,8px 16px);font-size:12px;font-size:var(--card-font-size,12px);color:#323233;color:var(--card-text-color,#323233);background-color:#fafafa;background-color:var(--card-background-color,#fafafa)}.van-card__header{display:-webkit-flex;display:flex}.van-card__header--center{-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center}.van-card__thumb{position:relative;-webkit-flex:none;flex:none;width:88px;width:var(--card-thumb-size,88px);height:88px;height:var(--card-thumb-size,88px);margin-right:8px;margin-right:var(--padding-xs,8px)}.van-card__thumb:empty{display:none}.van-card__img{width:100%;height:100%;border-radius:8px;border-radius:var(--border-radius-lg,8px)}.van-card__content{position:relative;display:-webkit-flex;display:flex;-webkit-flex:1;flex:1;-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:space-between;justify-content:space-between;min-width:0;min-height:88px;min-height:var(--card-thumb-size,88px)}.van-card__content--center{-webkit-justify-content:center;justify-content:center}.van-card__desc,.van-card__title{word-wrap:break-word}.van-card__title{font-weight:700;line-height:16px;line-height:var(--card-title-line-height,16px)}.van-card__desc{line-height:20px;line-height:var(--card-desc-line-height,20px);color:#646566;color:var(--card-desc-color,#646566)}.van-card__bottom{line-height:20px}.van-card__price{display:inline-block;font-weight:700;color:#ee0a24;color:var(--card-price-color,#ee0a24);font-size:12px;font-size:var(--card-price-font-size,12px)}.van-card__price-integer{font-size:16px;font-size:var(--card-price-integer-font-size,16px)}.van-card__price-decimal,.van-card__price-integer{font-family:Avenir-Heavy,PingFang SC,Helvetica Neue,Arial,sans-serif;font-family:var(--card-price-font-family,Avenir-Heavy,PingFang SC,Helvetica Neue,Arial,sans-serif)}.van-card__origin-price{display:inline-block;margin-left:5px;text-decoration:line-through;font-size:10px;font-size:var(--card-origin-price-font-size,10px);color:#646566;color:var(--card-origin-price-color,#646566)}.van-card__num{float:right}.van-card__tag{position:absolute!important;top:2px;left:0}.van-card__footer{-webkit-flex:none;flex:none;width:100%;text-align:right}
@import '../common/index.wxss';
.van-card {
position: relative;
box-sizing: border-box;
padding: 8px 16px;
padding: var(--card-padding, 8px 16px);
font-size: 12px;
font-size: var(--card-font-size, 12px);
color: #323233;
color: var(--card-text-color, #323233);
}
.van-card__header {
display: -webkit-flex;
display: flex
}
.van-card__header--center {
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center
}
.van-card__thumb {
position: relative;
-webkit-flex: none;
flex: none;
width: 88px;
width: var(--card-thumb-size, 88px);
height: 88px;
height: var(--card-thumb-size, 88px);
margin-right: 8px;
margin-right: var(--padding-xs, 8px)
}
.van-card__thumb:empty {
display: none
}
.van-card__img {
width: 100%;
height: 100%;
border-radius: 8px;
border-radius: var(--border-radius-lg, 8px)
}
.van-card__content {
position: relative;
display: -webkit-flex;
display: flex;
-webkit-flex: 1;
flex: 1;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: space-between;
justify-content: space-between;
min-width: 0;
min-height: 88px;
min-height: var(--card-thumb-size, 88px)
}
.van-card__content--center {
-webkit-justify-content: center;
justify-content: center
}
.van-card__desc, .van-card__title {
word-wrap: break-word
}
.van-card__title {
font-weight: 700;
line-height: 16px;
line-height: var(--card-title-line-height, 16px)
}
.van-card__desc {
line-height: 20px;
line-height: var(--card-desc-line-height, 20px);
color: #646566;
color: var(--card-desc-color, #646566)
}
.van-card__bottom {
line-height: 20px
}
.van-card__price {
display: inline-block;
font-weight: 700;
color: #ee0a24;
color: var(--card-price-color, #ee0a24);
font-size: 12px;
font-size: var(--card-price-font-size, 12px)
}
.van-card__price-integer {
font-size: 16px;
font-size: var(--card-price-integer-font-size, 16px)
}
.van-card__price-decimal, .van-card__price-integer {
font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;
font-family: var(--card-price-font-family, Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif)
}
.van-card__origin-price {
display: inline-block;
margin-left: 5px;
text-decoration: line-through;
font-size: 10px;
font-size: var(--card-origin-price-font-size, 10px);
color: #646566;
color: var(--card-origin-price-color, #646566)
}
.van-card__num {
float: right
}
.van-card__tag {
position: absolute !important;
top: 2px;
left: 0
}
.van-card__footer {
-webkit-flex: none;
flex: none;
width: 100%;
text-align: right
}