订单模块重新对接

src/api/client/business.js

@@ -186,3 +186,20 @@ export function generateConfirmOrder(data) {
   });
 }
 
+/**
+ * 订单接口 - 根据购物车信息生成订单
+ * @param {*} data
+ * @returns
+ */
+export function generateOrder(data) {
+  return request({
+    url: `/maintain/generateOrder`,
+    method: 'post',
+    data: data,
+    header: {
+      'Content-Type': 'application/json',
+    },
+  });
+}
+
+

src/components/settleBottomBtn/settleBottomBtn.vue

@@ -4,11 +4,11 @@
       <view class="item-left">
         <image class="img" src="@/static/images/shopCarts.png"></image>
         <view class="edge-box">
-          <u-badge class="edge" type="warning" max="99" value="12"></u-badge>
+          <u-badge class="edge" type="warning" max="99" :value="allNumb"></u-badge>
         </view>
         <view class="left-price">
           <p class="price">
-            <span class="price-symbal">￥</span><span class="price-text1">100.2</span>
+            <span class="price-symbal">￥</span><span class="price-text1">{{ allPrice }}</span>
             <span class="price-text2">￥219</span>
           </p>
         </view>
@@ -19,71 +19,119 @@
 </template>
 
 <script>
-  export default{
-    data(){
-      return{
-
+  import {
+    addShoppingCart
+  } from '@/api/client/business.js';
+  export default {
+    data() {
+      return {}
+    },
+    props: {
+      goodsCateList: {
+        type: Array,
+        default: []
+      }
+    },
+    computed: {
+      allPrice() {
+        let sum = 0
+        this.goodsCateList.map(rs => {
+          sum += Number((rs.price).toFixed(2))
+        })
+        console.log('@@@@sum', sum);
+        return sum
+      },
+      allNumb() {
+        return this.goodsCateList.length
       }
     },
-    methods:{
+    methods: {
       // 结算按钮
-      handlerSettleBtn(){
-		uni.navigateTo({
-			url:"/pages/client/clientPackage/uptickOrder"
-		})
+      handlerSettleBtn() {
+        this.goodsCateList.map(rs => {
+          addShoppingCart(rs).then(res => {
+            if (res.code == 200) {
+              wx.showLoading({
+                title: '结算中',
+              })
+            } else {
+              uni.showToast({
+                title: res.message,
+                icon: 'none'
+              })
+              return
+            }
+          })
+        })
+        setTimeout(()=>{
+          wx.hideLoading()
+          this.goodsCateList = []
+          uni.navigateTo({
+          	url:"/pages/client/clientPackage/uptickOrder"
+          })
+        },1500)
       }
     }
   }
 </script>
 
 <style lang="scss" scoped>
-  .container{
-    .item-box{
+  .container {
+    .item-box {
       width: 90%;
-      height:80rpx;
+      height: 80rpx;
       margin: 0 auto;
       display: flex;
-      .item-left{
+
+      .item-left {
         background-color: #222426;
         width: 80%;
         border-radius: 40rpx 0 0 40rpx;
         display: flex;
         align-items: center;
         position: relative;
-        .img{
+
+        .img {
           position: absolute;
           width: 130rpx;
           height: 130rpx;
           left: 9%;
           top: -70%;
         }
-        .edge-box{
+
+        .edge-box {
           position: absolute;
           left: 25%;
           top: -55%;
         }
-        .left-price{
+
+        .left-price {
           margin-left: 30%;
-          .price{
+
+          .price {
             color: #fff;
             font-size: 28rpx;
             font-weight: bold;
-            .price-symbal{
+
+            .price-symbal {
               font-size: 28rpx;
             }
-            .price-text1{
+
+            .price-text1 {
               font-size: 34rpx;
             }
-            .price-text2{
+
+            .price-text2 {
               font-size: 24rpx;
               color: #999999;
               font-style: italic;
-              text-decoration:line-through;
+              text-decoration: line-through;
             }
           }
         }
       }
-      .item-right{
+
+      .item-right {
         background-color: #FFE339;
         width: 20%;
         border-radius: 0 40rpx 40rpx 0;

src/pages/client/clientPackage/storeDetail.vue

@@ -7,7 +7,7 @@
       <view class="carousel-item">
         <view class="mark">
           <view class="mark-item">{{ merchant.score }}分</view>
-          <u-rate :count="count" v-model="value" active-color="#fff" inactive-color="#fff" :size="12" />
+          <u-rate count="5" v-model="merchant.score"  active-color="#fff" readonly inactive-color="#fff" :size="12" />
         </view>
         <view class="good-item">近期有6266个购买者给了给好评</view>
       </view>
@@ -96,7 +96,7 @@
 
     <!-- 底部购物车 -->
     <view class="bottom-box">
-      <settleBottomBtn/>
+      <settleBottomBtn :goodsCateList.sync='goodsCateList'/>
     </view>
 
     <!-- 弹窗 -->
@@ -127,7 +127,7 @@
 </template>
 
 <script>
-  import { getSellsDetail, addReservation } from '@/api/client/business.js';
+  import { getSellsDetail, addReservation , addShoppingCart } from '@/api/client/business.js';
   import { getCurrentLocation, hotMerchant } from '@/api/client/home';
   import settleBottomBtn from "@/components/settleBottomBtn/settleBottomBtn.vue"
   export default {
@@ -138,38 +138,13 @@
       return {
         merchant: {},
         goods: [],
-        count: 5,
-        value: 3,
         swiperList: [
           'https://cdn.uviewui.com/uview/swiper/swiper3.png',
           'https://cdn.uviewui.com/uview/swiper/swiper2.png',
           'https://cdn.uviewui.com/uview/swiper/swiper1.png'
         ],
-        categoryList: [{
-            id: 1,
-            name: '全部',
-          },
-          {
-            id: 2,
-            name: '养车',
-          },
-          {
-            id: 2,
-            name: '维修',
-          },
-          {
-            id: 2,
-            name: '改装',
-          },
-          {
-            id: 2,
-            name: '补胎',
-          },
-          {
-            id: 2,
-            name: '其他',
-          },
-        ],
+        categoryList:[], // 分类列表
+        goodsCateList:[],
         queryParams: {
           //请求参数
           id: null, //商家ID
@@ -177,10 +152,8 @@
           longitude: null, //经度
           latitude: null, //纬度
         },
-        template_value: '',
         time_show: false,
         reserve_show: false,
-        value: '',
         addParams: {
           merchantId: '',
           mobile: '',
@@ -202,6 +175,7 @@
         }
       },
     },
+
     methods: {
       // 获取当前经纬度
       handlerInitLocation() {
@@ -231,6 +205,7 @@
       handlerInitList() {
         getSellsDetail(this.queryParams.id, this.queryParams).then(res => {
           this.merchant = res.data.merchant;
+          this.categoryList = res.data.categories
           this.goods = res.data.goods;
           this.swiperList = res.data.merchant.banners.map(h => h.url);
         });
@@ -315,7 +290,16 @@
       },
       // 添加购物车
       handlerAddCart(e){
-        console.log('@@@@e',e);
+        let params = {
+          merchantId:this.queryParams.id,
+          goodsId:e.id,
+          quantity:1,
+          price:e.specialPrice,
+          goodsName:e.name,
+          goodsPic:e.logo,
+          // goodsSubTitle:this.goods.description
+        }
+        this.goodsCateList.push(params)
       },
       formatter(type, value) {
         if (type === 'minute') {

src/pages/client/clientPackage/uptickOrder.vue

@@ -6,15 +6,15 @@
 				<view class="message-item">
 					<view class="item-left"> 订购人电话 </view>
 					<view class="item-right">
-						<u--input border='none' type='number' fontSize='14' placeholder="请输入您的订购电话"
-							v-model="value"></u--input>
+						<u--input border='none' type='number' maxlength='11' fontSize='14' placeholder="请输入您的订购电话"
+							v-model="phoneNumber"></u--input>
 					</view>
 				</view>
 				<u-line margin='20rpx 0'></u-line>
 				<view class="message-item">
 					<view class="item-left"> 备注 </view>
 					<view class="item-right">
-						<u--textarea v-model="value3" placeholder="请输入内容" autoHeight></u--textarea>
+						<u--textarea v-model="goodsRemark" placeholder="请输入备注内容" autoHeight></u--textarea>
 					</view>
 				</view>
 			</view>
@@ -33,21 +33,21 @@
 			<view class="message-box">
 				<view class="goods-title"> 猫牙米·卖瓜的(红雷店) </view>
 				<u-line margin='20rpx 0'></u-line>
-				<view class="goods-item" v-for="item of 3">
+				<view class="goods-item" v-for="(item,index) of init_list" :key='item.goodsId'>
 					<view class="item-left">
 						<image class="left-img" src="@/static/QR57a.jpg"></image>
 						<view class="left-text">
-							<view class="text-name">测试内容1233啊啊是s冲破阿斯玛阿松出门</view>
-							<view class="text-number">×1</view>
+							<view class="text-name">{{ item.goodsName }}</view>
+							<view class="text-number">×{{ item.quantity }}</view>
 							<view class="price-box">
-								<p class="price red-color"> <span style="font-size: 24rpx;">￥</span>21.2 </p><span
-									class="false-price">￥5.9</span>
+								<p class="price red-color"> <span style="font-size: 24rpx;">￥</span>{{ item.price }}</p><span
+									class="false-price">￥{{ item.price }}</span>
 							</view>
 						</view>
 					</view>
 
 					<view class="item-right">
-						<u-number-box v-model="numb"></u-number-box>
+						<u-number-box v-model="item.quantity"></u-number-box>
 					</view>
 				</view>
 			</view>
@@ -76,9 +76,9 @@
 			<view class="message-box">
 				<view class="message-item">
 					<view class="item-left"> 订单总价 </view>
-					<view class="item-right flex-end red-color">
-						<p style="margin-right: 20rpx; font-size: 36rpx; font-weight: bold;">￥9.9</p>
-						<p>( 已优惠￥1.2 )</p>
+					<view class=" flex-end red-color" style="align-items: center;">
+						<p style="margin-right: 20rpx; font-size: 36rpx; font-weight: bold;">￥{{ orderParams.allPrice.toFixed(2) }}</p>
+						<p>( 已优惠￥{{ orderParams.discountPrice.toFixed(2) }} )</p>
 					</view>
 				</view>
 			</view>
@@ -93,38 +93,42 @@
 			</view>
 		</view>
 
-		<u-popup :show="coupon_show" @close="coupon_show = false" mode='bottom' round='20'>
+		<u-popup :show="coupon_show" @close="coupon_show = false" mode='bottom' round='20' bgColor='#F4F4F4'>
 			<view class="pop-box">
 				<view class="pop-title"> 商家优惠券 </view>
 				<u-line margin='20rpx 0'></u-line>
-				<view class="pop-item">
-					<view class="item-box">
-						<view class="item-left">
-							<view class="img-box">
-								<image class="left-img" src="@/static/images/honglei.png"></image>
-							</view>
-							<view class="left-text">
-								<view class="text-title">
-									测试娜娜那是就擦拭破产马上
-								</view>
-								<view class="text">
-									有效期至2024.01.25
-								</view>
-							</view>
-						</view>
-						<view class="item-right">
-							<view class="price red-color">
-								<span class="price-symbol">￥</span> 26
-							</view>
-							<view class="text">
-								满减29可用
-							</view>
-						</view>
-					</view>
+
+				<view class="pop-coupon-box">
+				  <view class="pop-item" v-for="(item,index) of coupon_list" @click="handlerSelectCoupon(item,index)">
+				  	<view class="item-box">
+				  		<view class="item-left">
+				  			<view class="img-box">
+				  				<image class="left-img" :src="item.img"></image>
+				  			</view>
+				  			<view class="left-text">
+				  				<view class="text-title"> {{ item.name }} </view>
+				  				<view class="text"> {{ item.time_text }} </view>
+				  			</view>
+				  		</view>
+				  		<view class="item-right">
+				  			<view class="price red-color">
+				  				<span class="price-symbol">￥</span> {{ item.price }}
+				  			</view>
+				  			<view class="text"> {{ item.deduce_text }} </view>
+				  		</view>
+				  	</view>
+				    <view class="item-bottom">
+				      <span>{{ item.discript }}</span>
+				    </view>
+				  </view>
 				</view>
+
+        <view class="pop-bottom">
+          <button class='coupon-btn' >确定</button>
+        </view>
 			</view>
 		</u-popup>
-		
+
 		<view class="btn-box">
 			<view class="btn" @click="handlerSettleBtn">
 				结算
@@ -135,27 +139,93 @@
 </template>
 
 <script>
+  import { getShoppingCart ,generateOrder } from "@/api/client/business.js"
 	export default {
 		data() {
 			return {
-				value: '',
-				value3: '',
-				numb: 5,
-				coupon_show: false
-				
+				coupon_show: false,
+        coupon_list:[
+          {
+            id:1,
+            img:'../../../static/images/honglei.png',
+            name:'无反不做(无饭不做美工饭)',
+            time_text:'有效期至2024.02.32',
+            price:34,
+            deduce_text:'满23可用',
+            discript:'可以与其他活动共享，在线支付指定门店使用'
+          },
+          {
+            id:3,
+            img:'../../../static/images/honglei.png',
+            name:'我不知道叫啥名儿嗷',
+            time_text:'有效期至2024.03.01',
+            price:2,
+            deduce_text:'满5可用',
+            discript:'可以与其他活动共享，在线支付指定门店使用'
+          },
+          {
+            id:5,
+            img:'../../../static/images/honglei.png',
+            name:'红雷卖瓜',
+            time_text:'有效期至2024.03.01',
+            price:1,
+            deduce_text:'满65可用',
+            discript:'可以与其他活动共享，在线支付指定门店使用'
+          }
+        ],
+        init_list:[],
+        phoneNumber:null ,// 订购电话
+        goodsRemark:'' // 备注
 			}
 		},
+    mounted(){
+      this.handlerInitList()
+    },
+    computed: {
+      orderParams(){
+        let price = 0
+        let discountPrice = 0
+        let allPrice = 0
+        this.init_list.map(rs=>{
+          price += Number( rs.price * rs.quantity )
+          discountPrice += Number( rs.price * rs.quantity )
+        })
+        allPrice = price - discountPrice
+        return { allPrice , discountPrice }
+      }
+    },
 		methods:{
+      handlerInitList(){
+        getShoppingCart().then(res=>{
+          this.init_list = res.data
+        })
+      },
 			// 结算按钮
 			handlerSettleBtn(){
-				wx.showLoading({
-				  title: '结算中......',
-				})
-				
-				setTimeout(function () {
-				  wx.hideLoading()
-				}, 3000)
-			}
+        let params = {
+          payType:'2',
+          cartIds:[],
+          merchantId:null
+        }
+        this.init_list.map(rs=>{
+          params.cartIds.push(rs.goodsId)
+          params.merchantId = this.init_list[0].id
+        })
+        generateOrder(params).then(res=>{
+          console.log("@@@@res",res)
+        })
+				// wx.showLoading({
+				//   title: '结算中......',
+				// })
+
+				// setTimeout(function () {
+				//   wx.hideLoading()
+				// }, 3000)
+			},
+      // 选择优惠券
+      handlerSelectCoupon(){
+
+      }
 		}
 	}
 </script>
@@ -285,6 +355,7 @@
 
 				.message-text {
 					margin-top: 20rpx;
+          color: #bcbfc3;
 				}
 			}
 		}
@@ -303,31 +374,37 @@
 		border-style: none !important;
 	}
 
+
+
 	.pop-box {
-		height: 700rpx;
+		height: 850rpx;
 		background-color: #F4F4F4;
-
+    position: relative;
 		.pop-title {
 			font-weight: bold;
 			font-size: 36rpx;
 			text-align: center;
 			padding: 20rpx;
+      background: linear-gradient(to bottom,  #fff,#fff, #F4F4F4);
 		}
-
+    .pop-coupon-box{
+      max-height: 650rpx;
+      overflow-y: scroll;
+    }
 		.pop-item {
 			padding: 20rpx;
-
+      margin-bottom:10rpx;
 			.item-box {
 				padding: 20rpx;
-				border-radius: 20rpx;
+				border-radius: 20rpx 20rpx 0 0;
 				background-color: #fff;
 				display: flex;
 				align-items: center;
-
+        box-shadow: 0rpx 7rpx 20rpx 10rpx rgba(0,0,0,0.1);
+        background-image: radial-gradient(circle at left bottom, #F4F4F4, #F4F4F4 40rpx, transparent 16rpx), radial-gradient(circle at right bottom, #F4F4F4, #F4F4F4 55rpx, transparent 16rpx),radial-gradient(circle at right top, #F4F4F4, #F4F4F4 35rpx, transparent 16rpx);
 				.item-left {
 					display: flex;
 					width: 70%;
-
 					.img-box,
 					.left-img {
 						width: 160rpx;
@@ -374,21 +451,52 @@
 					}
 				}
 			}
+      .item-bottom{
+        padding: 20rpx 50rpx 20rpx 30rpx;
+        background-color: #fff;
+        border-radius: 0 0 20rpx 20rpx;
+        box-shadow: 0rpx 10rpx 15rpx 0rpx rgba(0,0,0,0.1);
+        background-image: radial-gradient(circle at left top, #F4F4F4, #F4F4F4 40rpx, transparent 16rpx), radial-gradient(circle at right top, #F4F4F4, #F4F4F4 55rpx, transparent 16rpx);
+        border-top: 1px dashed #F4F4F4;
+        color: #b1b4b9;
+        font-size:26rpx;
+        font-style:oblique;
+        text-indent:32.4px;
+      }
 		}
+
+    .pop-bottom{
+      position: absolute;
+      bottom: 0;
+      width: 100%;
+      display: flex;
+      justify-content: center;
+      .coupon-btn{
+        width: 100%;
+        background-color: #FFDE21 !important;
+        color: #000;
+        font-size:28rpx;
+        // height:80rpx;
+        // line-height: 80rpx;
+        border-radius: 20rpx;
+      }
+    }
 	}
-	
+
+
+
 	.btn-box{
 		width: 100%;
 		position: fixed;
 		bottom: 5%;
 		.btn{
 			width: 90%;
-			padding: 20rpx;
 			background: linear-gradient(to right, #1d4350, #a43931);
 			color: #fff;
 			border-radius: 40rpx;
 			text-align: center;
 			font-size: 32rpx;
+      padding: 20rpx;
 		}
 	}
-</style>
+</style>

src/pages/client/clientUser/cart/index.vue

@@ -41,7 +41,7 @@
           <text style="font-size: 22rpx">￥</text>
           <text style="font-size: 34rpx; font-weight: 800">{{ allPrice.sum }}</text>
         </view>
-        <view class="favorable chelvc-flex" >
+        <view class="favorable chelvc-flex">
           <text style="margin-right: 10rpx">
             已优惠
             <text style="font-weight: 800">￥255</text>
@@ -52,7 +52,8 @@
           </view>
         </view>
       </view>
-      <view class="settleAccount" @click="handlerSettleBill"> {{ !manageShow ? `结算( ${allPrice.goodsNumber} )` : `删除( ${allPrice.goodsNumber} ) ` }}  </view>
+      <view class="settleAccount" @click="handlerSettleBill">
+        {{ !manageShow ? `结算( ${allPrice.goodsNumber} )` : `删除( ${allPrice.goodsNumber} ) ` }} </view>
     </view>
 
     <u-popup :show="instructionShow" mode='bottom' @close="instructionShow = false" round='20'>
@@ -65,7 +66,10 @@
 
 <script>
   import {
-    getShoppingCart,deleteCartItem,editGoodsNumb,generateConfirmOrder
+    getShoppingCart,
+    deleteCartItem,
+    editGoodsNumb,
+    generateConfirmOrder
   } from "@/api/client/business.js"
   export default {
     data() {
@@ -74,9 +78,9 @@
         isAllSecect: [], //checkbox是否全选
         goodsCheckbox: [], //checkbox选择商品
         sumPrice: 0,
-        instructionShow:false ,// 底部优惠明细
+        instructionShow: false, // 底部优惠明细
 
-        manageShow:false
+        manageShow: false
       }
     },
     onShow() {
@@ -119,33 +123,32 @@
       },
       // 结算按钮
       handlerSettleBill() {
-        if(this.manageShow){
-          deleteCartItem({ids:this.goodsCheckbox}).then(res=>{
-            console.log('@@@@res',res)
+        if (this.manageShow) {
+          deleteCartItem({
+            ids: this.goodsCheckbox
+          }).then(res => {
+            console.log('@@@@res', res)
           })
-        }else{
-          // this.goodsCheckbox.map(rs=>{
-          //   this.init_list.map(rc=>{
-          //     if(rs == rc.goodsId){
-          //       console.log('rc',rc)
-          //     }
-          //   })
-          // })
-
-          generateConfirmOrder({cartIds:this.goodsCheckbox,payType:2}).then(res=>{
-            console.log('@@@@res',res)
-			if(res.code == 200){
-				uni.navigateTo({
-					url:'/pages/client/clientPackage/uptickOrder'
-				})
-			}
+        } else {
+          generateConfirmOrder({
+            cartIds: this.goodsCheckbox,
+            payType: 2
+          }).then(res => {
+            console.log('@@@@res', res)
+            if (res.code == 200) {
+              uni.navigateTo({
+                url: '/pages/client/clientPackage/uptickOrder'
+              })
+            }
           })
         }
       },
 
-      valChange(item,e) {
-        editGoodsNumb(item.goodsId,{ quantity:e.value }).then(res=>{
-          console.log('@@@2res',res)
+      valChange(item, e) {
+        editGoodsNumb(item.goodsId, {
+          quantity: e.value
+        }).then(res => {
+          console.log('@@@2res', res)
         })
       },
 
@@ -161,7 +164,7 @@
         }
       },
       // 管理按钮
-      handlerManage(){
+      handlerManage() {
         this.manageShow = !this.manageShow
         this.goodsCheckbox = []
       }
@@ -278,7 +281,7 @@
     }
   }
 
-  .pop-box{
+  .pop-box {
     min-height: 400rpx;
     padding: 20rpx;
   }