商城页面

app.json

@@ -44,7 +44,8 @@
         "subpages/goodsaddress/goodsaddress",
         "subpages/goodsorder/goodsorder",
         "subpages/addshopaddress/addshopaddress",
-        "subpages/editshopaddress/editshopaddress"
+        "subpages/editshopaddress/editshopaddress",
+        "subpages/orderconfirm/orderconfirm"
     ],
     "subPackages": [
         {

subpages/goodsaddress/goodsaddress.js

@@ -75,7 +75,15 @@ Page({
     },
     doDel(e) {
         var id = e.currentTarget.dataset.id;
+        var item = e.currentTarget.dataset.item;
         var _self = this;
+        if (1 == item.shopAddressDefault) {
+            wx.showToast({
+                icon: 'none',
+                title: '请先设置默认地址',
+            })
+            return;
+        }
         wx.showModal({
             title: '警告',
             content: '确定要删除该收货地址吗?',

subpages/goodsaddress/goodsaddress.wxml

@@ -10,7 +10,7 @@
             </view>
             <view class="address-control-box">
                 <image src="/subpages/images/ic_edit_icon.png" mode="scaleToFill" class="edit-icon" bindtap="doEdit" data-id="{{item.shopAddressId}}"></image>
-                <image src="/images/delete.png" mode="scaleToFill" class="del-icon" bindtap="doDel" data-id="{{item.shopAddressId}}"></image>
+                <image src="/images/delete.png" mode="scaleToFill" class="del-icon" bindtap="doDel" data-id="{{item.shopAddressId}}" data-item="{{item}}"></image>
             </view>
         </view>
     </view>

subpages/goodscar/goodscar.js

@@ -99,5 +99,10 @@ Page({
         _self.setData({
             totalPrice: tempCount
         })
+    },
+    toConfirmOrder() {
+        wx.navigateTo({
+            url: '/subpages/orderconfirm/orderconfirm',
+        })
     }
 })

subpages/goodscar/goodscar.wxss

@@ -149,6 +149,11 @@
 
 }
 
+.goods-price {
+    color: #9f1512;
+    font-size: 40rpx;
+}
+
 .bottom-content {
     display: flex;
     flex-direction: row;
@@ -231,4 +236,5 @@
     border-radius: 10rpx;
     margin-left: 20rpx;
     font-size: 32rpx;
-}
+}
+

subpages/orderconfirm/orderconfirm.js

@@ -0,0 +1,103 @@
+// subpages/orderconfirm/orderconfirm.js
+var app = getApp();
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        token: '',
+        imgUrl: app.shopImgUrl,
+        addressBean: {},
+        hidePageLoading: false,
+        goodsList: [],
+        imgUrl: app.shopImgUrl,
+        remark: '',
+        totalPrice: 0
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+        var _self = this;
+        _self.getToken().then(result => {
+            _self.getDefaultAddress();
+            _self.getGoodsCar();
+        })
+    },
+    getToken() {
+        var self = this;
+        return new Promise(resolve => {
+            wx.getStorage({
+                key: 'token',
+                success(res) {
+                    self.setData({
+                        token: res.data
+                    })
+                    return resolve();
+                }
+            })
+        })
+    },
+    //获取默认地址
+    getDefaultAddress() {
+        var _self = this;
+        app.restAjax.get(app.restAjax.path('{shopUrl}/app/shopaddress/getdefault', [app.shopUrl]), null, {
+            headers: {
+                token: _self.data.token
+            }
+        }, function (code, data) {
+            wx.hideLoading()
+            if (code == 200) {
+                _self.setData({
+                    addressBean: data,
+                    hidePageLoading: true
+                })
+            }
+        }, function (code, data) {
+            app.dialog.msg(data.msg)
+            _self.setData({
+                hidePageLoading: true
+            })
+        });
+    },
+    getGoodsCar() {
+        var _self = this;
+        var tempPrice = 0;
+        try {
+            var carList = wx.getStorageSync('carlist');
+            console.log(carList)
+            if (carList) {
+                for (let i = 0; i < carList.length; i++) {
+                    const item = carList[i];
+                    if (item.isCheck) {
+                        _self.data.goodsList.push(item);
+                        tempPrice = item.carAmount * item.goodsPrice + tempPrice;
+                    }
+                }
+                _self.setData({
+                    goodsList: _self.data.goodsList,
+                    totalPrice: tempPrice
+                })
+            }
+        } catch (error) {
+
+        }
+    },
+    inputRemark(e) {
+        var value = e.detail.value
+        this.setData({
+            remark: value
+        })
+    },
+    doSelAddress() {
+        //选择地址
+    },
+    checkParams() {
+
+    },
+    doSave() {
+
+    }
+})

subpages/orderconfirm/orderconfirm.json

@@ -0,0 +1,4 @@
+{
+    "usingComponents": {},
+    "navigationBarTitleText": "订单确认"
+}

subpages/orderconfirm/orderconfirm.wxml

@@ -0,0 +1,51 @@
+<!--subpages/orderconfirm/orderconfirm.wxml-->
+<scroll-view class="container-box" wx:if="{{addressBean.areaName}}">
+    <!-- 收货地址 -->
+    <view class="address-box">
+        <view class="address-title">收货地址</view>
+        <view class="address-area-name">{{addressBean.areaName}}</view>
+        <view class="address-area-content">
+            <view>{{addressBean.shopAddressContent}}</view>
+            <image src="/subpages/images/ic_arrow_cir.png" mode="scaleToFill" class="icon"></image>
+        </view>
+        <view class="address-phone">
+            <view>{{addressBean.shopAddressName}} {{addressBean.shopAddressPhone}}</view>
+        </view>
+        <image src="/subpages/images/ic_divid_line_bottom.png" mode="scaleToFill" class="line-img" />
+    </view>
+    <!-- 购买商品 -->
+    <view class="goods-box">
+        <view class="goods-title">确认商品</view>
+        <block wx:for="{{goodsList}}" wx:for-item="item" wx:for-index="index" wx:key="index">
+            <view class="goods-item">
+                <image class="goods-img" src="{{item.goodsIcon=='' ? '/images/address.png' : imgUrl+item.goodsIcon}}" mode="scaleToFill" bindtap="selSelect" data-index="{{index}}"></image>
+                <view class="goods-content">
+                    <rich-text class="goods-name" nodes="{{item.goodsName}}" bindtap="selSelect" data-index="{{index}}"></rich-text>
+                    <view class="goods-price" bindtap="selSelect" data-index="{{index}}">¥{{item.goodsPrice}}</view>
+                    <view class="goods-standard" bindtap="selSelect" data-index="{{index}}">{{item.goodsStandarName}}</view>
+                    <view class="goods-type-box">
+                        <view class="type-box" bindtap="selSelect" data-index="{{index}}">
+                            <view class="goods-type">销量{{item.goodsSalesVolume}}</view>
+                            <view class="goods-type">{{item.goodsNotFreight ==1 ? '不包邮':'包邮'}}</view>
+                        </view>
+                        <view class="goods-count">数量:{{item.carAmount}}</view>
+                    </view>
+                </view>
+            </view>
+        </block>
+        <view class="remark-box">
+            <view>留言</view>
+            <textarea class="remark-input" bindinput="inputRemark" placeholder="请输入留言"></textarea>
+        </view>
+    </view>
+    <view class="bottom-box">
+        <view class="bottom-content">
+            <view class="bottom-price">
+                <view class="price-icon">¥</view>
+                <view class="price-content">{{totalPrice}}</view>
+            </view>
+            <view class="car-add" bindtap="doConfirmOrder">提交订单</view>
+        </view>
+    </view>
+</scroll-view>
+<page-loading wx:else></page-loading>

subpages/orderconfirm/orderconfirm.wxss

@@ -0,0 +1,310 @@
+/* subpages/orderconfirm/orderconfirm.wxss */
+page {
+    background: #f2f2f2;
+}
+
+.container-box {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    padding-bottom: 120rpx;
+}
+
+.address-box {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: flex-start;
+    box-shadow: 10rpx 10rpx 20rpx #f2f2f2;
+    border-radius: 15rpx;
+    padding: 20rpx;
+    margin: 10rpx;
+    background: white;
+}
+
+.address-area-name {
+    font-size: 32rpx;
+    margin-top: 20rpx;
+}
+
+.address-area-content {
+    display: flex;
+    margin-top: 20rpx;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 40rpx;
+    width: 100%;
+}
+
+.address-area-content .icon {
+    width: 48rpx;
+    height: 48rpx;
+}
+
+.address-phone {
+    font-size: 32rpx;
+    margin-top: 20rpx;
+}
+
+.line-img {
+    width: 100%;
+    height: 5rpx;
+    margin-top: 10rpx;
+}
+
+.address-title {
+    font-size: 38rpx;
+    font-weight: bold;
+}
+
+.goods-box {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: flex-start;
+    box-shadow: 10rpx 10rpx 20rpx #f2f2f2;
+    border-radius: 15rpx;
+    padding: 20rpx;
+    margin: 10rpx;
+    background: white;
+}
+
+.goods-title {
+    font-size: 38rpx;
+    font-weight: bold;
+}
+
+
+
+.goods {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    margin-left: 20rpx;
+}
+
+.goods-img {
+    width: 180rpx;
+    height: 160rpx;
+}
+
+.goods-item {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    margin-top: 15rpx;
+}
+
+.goods-content {
+    margin: 0rpx 10rpx;
+    flex: 1;
+}
+
+.goods-price {
+    color: #9f1512;
+    font-size: 40rpx;
+}
+
+.goods-count {
+    color: #9f1512;
+    font-size: 40rpx;
+}
+
+.goods-name {
+    font-size: 32rpx;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+}
+
+.goods-unit-price {
+    font-size: 40rpx;
+    color: #9f1512;
+    margin-top: 10rpx;
+}
+
+.goods-standard {
+    margin-top: 10rpx;
+    font-size: 32rpx;
+    border: 1rpx solid #9f1512;
+    border-radius: 3rpx;
+    color: #9f1512;
+    width: fit-content;
+    max-width: fit-content;
+    padding: 0rpx 10rpx;
+}
+
+.goods-type-box {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    margin-top: 20rpx;
+}
+
+.goods-type-box image {
+    width: 48rpx;
+    height: 48rpx;
+}
+
+.goods-type {
+    color: #9f1512;
+    font-size: 25rpx;
+    border: 1rpx solid #9f1512;
+    padding: 0rpx 10rpx;
+    text-align: center;
+}
+
+.goods-type:last-child {
+    margin-left: 20rpx;
+}
+
+.type-box {
+    display: flex;
+    flex-direction: row;
+    width: 50%;
+    justify-content: flex-start;
+    align-items: center;
+}
+
+.add-del-box {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+}
+
+.add-del-box .txt {
+    font-size: 35rpx;
+    padding: 0rpx 15rpx;
+}
+
+.control-box {
+    width: 50%;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+}
+
+
+.remark-box {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    font-size: 32rpx;
+}
+
+.remark-input {
+    height: 180rpx;
+    background: #f2f2f2;
+    border-radius: 20rpx;
+    margin-top: 20rpx;
+    padding-top: 10rpx;
+}
+
+
+
+.bottom-box {
+    display: flex;
+    flex-direction: column;
+    background: white;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+
+}
+
+.goods-price {
+    color: #9f1512;
+    font-size: 40rpx;
+}
+
+.bottom-content {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    margin: 15rpx 25rpx 15rpx 25rpx;
+}
+
+.bottom-price {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    align-items: baseline;
+    color: #e70606;
+    text-align: center;
+    font-weight: bold;
+}
+
+.price-icon {
+    font-size: 30rpx;
+}
+
+.price-content {
+    font-size: 55rpx;
+}
+
+
+.icon-btn {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+}
+
+.car-icon {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    font-size: 30rpx;
+}
+
+.car-icon image {
+    width: 48rpx;
+    height: 48rpx;
+    align-items: center;
+    align-self: center;
+    margin-left: 25rpx;
+    margin-top: 10rpx;
+}
+
+.car {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+}
+
+.car-num {
+    position: relative;
+    right: 10rpx;
+    top: -10rpx;
+    background: #e70606;
+    color: white;
+    width: 48rpx;
+    height: 48rpx;
+    border-radius: 50%;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    font-size: 25rpx;
+}
+
+.car-add {
+    background: linear-gradient(to right bottom, rgb(245, 74, 74), rgb(221, 5, 5) 70px);
+    color: white;
+    padding: 15rpx;
+    border-radius: 10rpx;
+    margin-left: 20rpx;
+    font-size: 32rpx;
+}