feat uni 完成了订单确认页面的样式

yudao-ui-admin-uniapp/pages.json

@@ -66,6 +66,18 @@
 			}
 		},
 		{
+			"path": "pages/restaurant/confirmOrder",
+			"style": {
+				"navigationBarTitleText": "确认订单"
+			},
+			"meta": {
+				"sync": true,
+				"title": "确认订单",
+				"group": "商城"
+			}
+		},
+		
+		{
 			"path": "pages/index/login",
 			"style": {
 				"navigationBarTitleText": "登录"

yudao-ui-admin-uniapp/pages/restaurant/confirmOrder.vue

@@ -0,0 +1,265 @@
+<template>
+    <view style="margin-top: 40px;">
+        <view style="background-color: #fff;">
+           <view class="cu-bar bg-white ">
+               <view class="action">
+                   <text class="cuIcon-titles text-orange"></text> 配送方式
+               </view>
+           </view>
+            <scroll-view scroll-x class="bg-white nav">
+			<view class="flex text-center">
+				<view class="cu-item flex-sub" :class="TabCur=='1'?'text-orange cur':''"  @tap="tabSelect" :data-id="1">
+					配送
+				</view>
+                <view class="cu-item flex-sub" :class="TabCur=='2'?'text-orange cur':''"  @tap="tabSelect" :data-id="2">
+					到店
+				</view>
+			</view>
+		</scroll-view>
+		<uni-datetime-picker  type="datetime" v-model="datetimesingle" placeholder="预计时间" />
+        </view>
+        <view style="background-color: #fff;">
+            <!-- <view style="font-size: 25px;padding:10px; border-bottom: 1px solid black;width: 100%;">收货地址</view><br /> -->
+            <view class="cu-bar bg-white ">
+                <view class="action">
+                    <text class="cuIcon-titles text-orange"></text> 收货地址
+                </view>
+            </view>
+            <view style="width: 100%;padding:10px;" class="ss-flex">
+                <view style="width: 40%;font-size: 20px;">{{ addressList.name }}</view>
+                <view style="width: 50%;font-size: 20px;">{{ addressList.phone }}</view>
+            </view>
+            <view style="width: 100%;padding:10px;">{{ addressList.address }}</view>
+            <button style="margin: 20px;" type="primary"
+                @tap="sheep.$router.go('/pages/user/address/edit')">修改地址</button>
+        </view>
+        <view style="height: 50vh;">
+            <view class="cu-bar bg-white ">
+                <view class="action">
+                    <text class="cuIcon-titles text-orange"></text> 购物车
+                </view>
+            </view>
+            <view style="height: 50vh;overflow-y: auto;background-color: #fff;">
+                <view v-for="(i, j) in nowCartList" :key="j" class="minmi" style="width: 100vw;">
+                    <image class="imgPic" :src="i.url" mode=""></image>
+                    <view class="rightContainer">
+                        <view class="foodName">
+                            {{ i.name }}
+                        </view>
+                        <view class="foodPrice">
+                            <view class="priceflex">
+                                <text class="zero">￥</text>
+                                {{ i.price }}
+                            </view>
+                            <view class="shopCar iconfont-themeColor-write" v-show="i.num == 0" @tap="addcart(i)">
+                                <text class="lg text-white cuIcon-add"></text>
+                            </view>
+                            <view class="" v-if="i.num > 0">
+                                <!-- <text class="lg text-white cuIcon-minus" @tap="addcart(i)" ></text> -->
+                                <!-- <uni-number-box :min="0" :max="100" :step="1" v-model="i.num" @tap="chengeCart(i)"  /> -->
+                                <text>{{ i.num }}</text>
+
+                            </view>
+                        </view>
+                    </view>
+                </view>
+            </view>
+            <button class="bg-red submit" @click="handleOk()">立即支付</button>
+        </view>
+    </view>
+</template>
+
+<script setup>
+import sheep from '@/sheep';
+import { onLaunch, onShow, onError } from '@dcloudio/uni-app';
+import { computed, reactive, ref } from 'vue';
+import goodsApi from '@/sheep/api/restaurant/goods'
+
+const cart = sheep.$store('cart');
+const TabCur = ref(1)
+const datetimesingle = ref('')
+const nowCartList= computed(() => cart.list)
+const addressList = computed(() => {
+		let addressList = sheep.$store('user').addressList
+		console.log('restaurant', addressList)
+			return addressList
+	})
+const handleOk= async () =>{
+	await goodsApi.createOrder({
+        name: addressList.name,
+        phone: addressList.phone,
+        address: addressList.address,
+		useTime:datetimesingle.value,
+		type: TabCur.value,
+		goodsList:nowCartList
+    }).then(res => {
+		console.log(res)
+    })
+    
+    
+}
+const tabSelect= (e) =>{
+	console.log(e.currentTarget.dataset.id)
+    TabCur.value = e.currentTarget.dataset.id;
+}
+</script>
+
+<style scoped lang="scss">
+  .title{
+    width: 99%;
+    text-align: left;
+    padding-left: 10px;
+    border-left: 5px solid red;
+    font-size: 18px;
+    margin-left: 20px;
+    margin-top: 10px;
+    font-weight: 800;
+    }
+	.active {
+		font-size: 30upx;
+		color: #F9BE3E;
+	}
+
+	.active2 {
+		font-size: 30upx;
+	}
+
+	.min {
+		display: flex;
+		flex-direction: row;
+		justify-content: space-around;
+		flex-wrap: wrap;
+		// margin: 20px 0;
+		background-color: white;
+        padding-bottom: 20px;
+	}
+
+	.minmi {
+		display: flex;
+		width: 592upx;
+		margin-left: 25upx;
+		padding-top: 51upx;
+
+		.imgPic {
+			width: 208upx;
+			height: 167upx;
+			border-radius: 10upx;
+			margin-left: 20upx;
+		}
+
+		.rightContainer {
+			display: flex;
+			flex-direction: column;
+			height: 167upx;
+			box-sizing: border-box;
+			justify-content: space-between;
+			align-items: flex-start;
+			padding-left: 18upx;
+			padding-right: 18upx;
+			padding-top: 18upx;
+			// padding-bottom: 18upx;
+			flex: 1;
+
+			.foodName {
+				font-weight: 700;
+				font-size: 25upx;
+			}
+
+			.foodPrice {
+				display: flex;
+				justify-content: space-between;
+				width: 375upx;
+				color: #F9BE3E;
+
+				.priceflex {
+					display: flex;
+					align-items: center;
+
+					.zero {
+						font-size: 15upx;
+					}
+				}
+
+				.shopCar {
+					background-color: #F9BE3E;
+					border-radius: 45upx;
+					width: 112upx;
+					height: 45upx;
+					font-size: 25upx;
+					text-align: center;
+					line-height: 46upx;
+				}
+			}
+		}
+	}
+
+	.aside-main {
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		justify-content: space-between;
+		box-sizing: border-box;
+	}
+
+	.scroll-Y1 {
+		flex: 1;
+		box-sizing: border-box;
+	}
+
+	.scroll-Y1 view {
+		text-align: center;
+		padding-top: 33upx;
+		// padding-bottom: 33upx;
+	}
+
+	.scroll-Y2 {
+		flex: 3;
+		box-sizing: border-box;
+		// padding-bottom: 170upx;
+	}
+
+	.scroll-Y2 view {
+		text-align: center;
+		/* margin:20upx; */
+	}
+
+	.icon {
+		width: 50upx;
+		height: 50upx;
+		margin-top: 10upx;
+	}
+
+	.icon1 {
+		width: 30upx;
+		height: 30upx;
+		position: absolute;
+		top: 15upx;
+		left: 10upx;
+	}
+
+	.btn {
+		width: 140upx;
+		height: 60upx;
+		line-height: 60upx;
+		margin: 0;
+		padding: 0;
+		font-size: 30upx;
+	}
+
+	.serch {
+		height: 60upx;
+		flex: 2;
+		margin-left: 20upx;
+		margin-right: 20upx;
+		box-sizing: border-box;
+		border: solid 1upx #ccc;
+		border-radius: 10upx;
+		position: relative;
+	}
+
+	.serch input {
+		height: 60upx;
+
+		margin-left: 60upx;
+	}
+    </style>

yudao-ui-admin-uniapp/pages/restaurant/order.vue

@@ -59,7 +59,7 @@
                     </view>
                   
                 </view>
-				<view class="bg-red submit">立即下单</view>
+				<view class="bg-red submit" @click="toggle()">立即下单</view>
 		</view>
 		<uni-popup ref="popup" background-color="#fff" type="bottom" >
 			<view style="height: 40vh;">
@@ -93,7 +93,7 @@
 							</view>
 					</view>
 				</view>
-				<button class="bg-red submit">立即下单</button>
+				<button class="bg-red submit" @click="handleOk()">立即下单</button>
 			</view>
 		</uni-popup>
 	</view>
@@ -103,13 +103,14 @@
 	import goodsApi from '@/sheep/api/restaurant/goods'
 	import uniNumberBox from '@/uni_modules/uni-number-box/components/uni-number-box/uni-number-box.vue';
 	import { onShow } from '@dcloudio/uni-app';
+	import sheep  from '@/sheep';
 
 	import {
 		ref,
 		onMounted,
 		getCurrentInstance
 	} from 'vue'
-	
+	const cart = sheep.$store('cart');
 	const popup = ref(null);
     const nowCartList = ref([])
     const nowCartPrice = ref(0)
@@ -127,6 +128,15 @@
 	const toggle = () =>{
 		popup.value.open()
 }
+	const handleOk = ()=>{
+		if (nowCartList.value.length === 0) {
+			sheep.$helper.toast('请选择商品');
+			return;
+		}
+		cart.list = nowCartList.value
+		// store.commit('setParam',nowCartList );
+		uni.navigateTo({ url: '/pages/restaurant/confirmOrder' });
+	}
     // 分类数据
         const categorizeItems = (items) => {
             asideList.value = {};

yudao-ui-admin-uniapp/sheep/api/restaurant/goods.js

@@ -9,6 +9,14 @@ const goodsApi = {
       method: 'POST',
     });
   },
+  createOrder: (params) => {
+    return request({
+      url: '/restaurant/order/create',
+      method: 'POST',
+      params
+    });
+  },
+  
 };
 
 export default goodsApi;