新的IDE好像只能有三个文件夹,所以更改了json库的位置 完成cart的商品列表显示,可以修改数量,删除购物车物品 把 cartItems 的数据格式改的简单了些,先不考虑那么多了,本地方便就好wechat_user_type
parent
e8bdd2c2c2
commit
8ae4eea501
9 changed files with 169 additions and 14 deletions
@ -1,10 +1,47 @@ |
|||||||
<view wx:if="{{ address }}" bindtap="bindTapAddress"> |
<view class="address-container" wx:if="{{ address }}" bindtap="bindTapAddress"> |
||||||
|
<view class="receiver"> |
||||||
|
收货人:<text>{{address.name}}</text> |
||||||
|
<text>{{address.mobile}}</text> |
||||||
|
</view> |
||||||
|
<view class="address"> |
||||||
<text>{{address.province}} {{address.city}} {{address.county}} {{address.detail}}</text> |
<text>{{address.province}} {{address.city}} {{address.county}} {{address.detail}}</text> |
||||||
<view> |
</view> |
||||||
<text>修改地址</text> |
<view class="button"> |
||||||
|
<button type='primary'>修改地址</button> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view wx:else bindtap="bindTapAddress"> |
<view wx:else bindtap="bindTapAddress"> |
||||||
<text>填写收货地址</text> |
<button class="button" type='primary'>填写收货地址</button> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view wx:if="{{cartItems}}"> |
||||||
|
<block wx:for="{{cartItems}}" wx:for-item="item"> |
||||||
|
<view class="item" data-id="{{item.id}}"> |
||||||
|
<view class="image" bindtap="bindTapOnItem" data-id="{{item.id}}"> |
||||||
|
<image class="head-img" src="{{item.product['image-url']}}" mode="aspectFit"></image> |
||||||
|
</view> |
||||||
|
<view class="item-right"> |
||||||
|
<view class="title" bindtap="bindTapOnItem" data-id="{{item.id}}"> |
||||||
|
<text> {{item.product.name}} </text> |
||||||
|
</view> |
||||||
|
<view class="numbers"> |
||||||
|
<text class="price" bindtap="bindTapOnItem" data-id="{{item.id}}"> ¥{{item.product.price}} / 件 </text> |
||||||
|
<view class="pull-right"> |
||||||
|
<text>购买数量:</text> |
||||||
|
<input class="quantity" value="{{item.quantity}}" bindChange="bindChangeQuantity"></input> |
||||||
|
</view> |
||||||
</view> |
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</block> |
||||||
|
</view> |
||||||
|
|
||||||
|
|
||||||
|
<view class="billing-btn"> |
||||||
|
<button class="button" type='warn'> 去支付 </button> |
||||||
|
</view> |
||||||
|
|
||||||
|
|
||||||
|
<modal title="删除该商品" confirm-text="我不要它了" cancel-text="别删" hidden="{{deleteModalHidden}}" bindconfirm="deleteModalChange" bindcancel="deleteModalChange"> |
||||||
|
是否要删除购物车中的这件商品? |
||||||
|
</modal> |
@ -0,0 +1,77 @@ |
|||||||
|
.button button { |
||||||
|
border-radius: 0; |
||||||
|
} |
||||||
|
|
||||||
|
.address-container { |
||||||
|
margin: 15rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.item { |
||||||
|
height: 180rpx; |
||||||
|
padding: 15rpx; |
||||||
|
background-color: #fff; |
||||||
|
border-top: 1px solid #e4e4e4; |
||||||
|
color: #787878; |
||||||
|
display:flex; |
||||||
|
align-items:center; |
||||||
|
} |
||||||
|
|
||||||
|
.item image { |
||||||
|
display: block; |
||||||
|
width: 300rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.item-right { |
||||||
|
display: block; |
||||||
|
margin-left: 11px; |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
|
||||||
|
.title { |
||||||
|
padding-bottom: 15px; |
||||||
|
} |
||||||
|
|
||||||
|
.title text { |
||||||
|
font-size: 16px; |
||||||
|
color: #787878; |
||||||
|
white-space: pre-wrap; |
||||||
|
line-height: 17px; |
||||||
|
} |
||||||
|
|
||||||
|
text { |
||||||
|
font-size: 15px; |
||||||
|
color: #444; |
||||||
|
} |
||||||
|
|
||||||
|
.numbers { |
||||||
|
display: flex; |
||||||
|
} |
||||||
|
|
||||||
|
.numbers text, input { |
||||||
|
display: block; |
||||||
|
} |
||||||
|
|
||||||
|
.pull-right { |
||||||
|
margin: auto; |
||||||
|
font-size: 15px; |
||||||
|
display: flex; |
||||||
|
} |
||||||
|
|
||||||
|
.numbers input { |
||||||
|
border: 1rpx solid lightgrey; |
||||||
|
width: 60rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.numbers text { |
||||||
|
padding: 10rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.billing-btn { |
||||||
|
position: fixed; |
||||||
|
bottom: 0; |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
|
||||||
|
.billing-btn .button { |
||||||
|
border-radius: 0; |
||||||
|
} |
Loading…
Reference in new issue