浏览代码

1. 我的订单,路径

guo 2 年之前
父节点
当前提交
0d6a8276eb
共有 5 个文件被更改,包括 814 次插入34 次删除
  1. 3 3
      pages.json
  2. 806 0
      pages/user/myOrder/mallOrderDetail.vue
  3. 0 0
      pages/user/myOrder/myOrder.vue
  4. 0 22
      pages/user/orderDetail/mallOrderDetail.vue
  5. 5 9
      pages/user/user.vue

+ 3 - 3
pages.json

@@ -151,11 +151,11 @@
             
         }
         ,{
-            "path" : "pages/user/myOrder",
+            "path" : "pages/user/myOrder/myOrder",
             "style" :                                                                                    
             {
                 "navigationBarTitleText": "我的订单",
-                "enablePullDownRefresh": true
+                "enablePullDownRefresh": false
             }
             
         },{
@@ -167,7 +167,7 @@
             
         }
         ,{
-            "path" : "pages/user/orderDetail/mallOrderDetail",
+            "path" : "pages/user/myOrder/mallOrderDetail",
             "style" :                                                                                    
             {
                 "navigationBarTitleText": "订单详情",

+ 806 - 0
pages/user/myOrder/mallOrderDetail.vue

@@ -0,0 +1,806 @@
+<template>
+	<view class="box">
+
+		<view class="top">
+			<view class="orderState">
+				<image src="../../static/img/icon_order_def.png" mode="" style="width: 44rpx;height: 44rpx;"></image>
+				
+		
+				<view class="SheetState" v-if="orderData.orderSheet.sheetState == 0">待确认</view>
+				<view class="SheetState" v-if="orderData.orderSheet.sheetState == 1">预约中</view>
+				<view class="SheetState" v-if="orderData.orderSheet.sheetState == 2">已到店</view>
+				<view class="SheetState" v-if="orderData.orderSheet.sheetState == 3">已取消</view>
+			</view>
+
+
+		</view>
+
+		<!-- 店铺信息 -->
+		<view class="shopBox">
+			<image src="../../static/img/icon_store.png" mode="" class="shopBoximg"></image>
+			<view class="shopCont">
+				<view class="shopName">{{orderData.shopInfo.shopName}}</view>
+				<view class="Address">{{orderData.shopInfo.province}}{{orderData.shopInfo.city}}{{orderData.shopInfo.area}}{{orderData.shopInfo.address}}</view>
+
+			</view>
+			<view class="shopRightBox" @click="map">
+
+				<image src="../../static/img/icon_ditu.png" mode="" class="shopRightImg"></image>
+
+				<view class="shopRihgtTxt">地图</view>
+			</view>
+			<view class="shopsx"></view>
+			<view class="shopRightBox" @click="call">
+
+				<image src="../../static/img/icon_phone.png" mode="" class="shopRightImg"></image>
+
+				<view class="shopRihgtTxt">电话</view>
+			</view>
+		</view>
+
+
+		<!-- 订单信息 -->
+		<view class="information">
+			<view class="detailedTitle">基本信息</view>
+			<view class="informationLine">
+				<view class="informationTxt">车牌号:</view>
+				<view class="informationNum">{{orderData.orderSheet.plateNumber}}</view>
+			</view>
+			<view class="informationLine">
+				<view class="informationTxt">手机号:</view>
+				<view class="informationNum">{{orderData.orderSheet.mobilePhone}}</view>
+			</view>
+			<view class="informationLine">
+				<view class="informationTxt">预约时间:</view>
+				<view class="informationNum">{{orderData.orderSheet.billDate}}</view>
+			</view>
+			<view class="informationLine">
+				<view class="informationTxt">单号:</view>
+				<view class="informationNum">{{orderData.orderSheet.code}}</view>
+			</view>
+			<view class="informationLine">
+				<view class="informationTxt">备注:</view>
+				<view class="informationNum">{{orderData.orderSheet.comment}}</view>
+			</view>
+
+		</view>
+
+		<!-- 项目明细 -->
+		<view class="detailedBox itemBox" v-if=" orderData.orderDetails.length!=0">
+			<view class="detailedTitle">预约项目</view>
+			<view class="detailedLineBox">
+				<view class="detailedLine" v-for="(v,index) in orderData.orderDetails">
+						<view class="detailedName">{{v.itemName}}</view>
+						<span>¥{{v.amountMoney}}</span>
+				</view>
+				<view class="detailedLine" v-if=" orderData.orderDetails.length!=0">
+						<view class="detailedName">预估总价</view>
+						<span v-if="orderData.sumMoney>0">¥{{orderData.sumMoney}}</span>
+				</view>
+				<view class="content">温馨提示:该报价仅为参考价格,实际以门店为准(不同品牌和车型费用会不同)</view>
+			</view>
+		</view>
+
+		
+		<view class="bottom" v-if="(orderData.orderSheet.sheetState == 0)||(orderData.orderSheet.sheetState == 1)">
+		
+			<view class="cancel" @click="cancelBespeak" >取消预约</view>
+			<view class="defer" @click="cktime">延期</view>
+		</view>
+		
+		<!-- 预约时间 -->
+		<timeSelect ref="timeSelect" :timedata="timedata" @changeTime="changeTime"></timeSelect>	
+
+	</view>
+</template>
+
+<script>
+	import timeSelect from '@/components/timeSelect/timeSelect.vue'
+	export default {
+		components: {
+			timeSelect
+		},
+	
+		data() {
+			return {
+				location: '',
+				id: '',
+				orderData: '',
+				timedata:'',
+				billDate:'',
+
+			}
+		},
+		onLoad(opt) {
+			
+			this.id = opt.id
+			
+			if (this.id) {
+				this.getData()
+			}
+
+		},
+		
+		methods: {
+			changeTime(data){
+				console.log(data)
+				this.billDate=data
+				this.upTime();
+			},
+			cktime(){
+				 this.$refs.timeSelect.open();
+			},
+			upTime() {
+				uni.showLoading({
+					title: '加载中'
+				})
+				var that = this
+				this.$http('openreservation/carOwner/updateTimeOfAppointment', {
+			
+					id: this.id,
+					shopId: this.orderData.shopInfo.id,
+					billDate:this.billDate
+				}, 'POST').then(res => {
+					uni.hideLoading();
+					// var list = res.data.Items
+					var list = res.data
+					console.log("result+=",res.data);
+					uni.showToast({
+						title: '延期成功',
+						icon: 'none',
+						duration: 2000
+					});
+					setTimeout(function() {
+						that.getData();
+					}, 1000);
+					
+			
+				})
+			},
+			cancelBespeak() {
+				uni.showLoading({
+					title: '加载中'
+				})
+				var that = this
+				this.$http('openreservation/carOwner/updateState', {
+			
+					id: this.id,
+					shopId: this.orderData.shopInfo.id,
+					sheetState:3
+				}, 'POST').then(res => {
+					uni.hideLoading();
+					// var list = res.data.Items
+					var list = res.data
+					uni.showToast({
+						title: '取消成功',
+						icon: 'none',
+						duration: 2000
+					});
+					setTimeout(function() {
+						that.getData();
+					}, 1000);
+				})
+			},
+			map() {
+				console.log("打开地图")
+				var that = this;
+				if (!that.orderData.shopInfo.lat || !that.orderData.shopInfo.lng) {
+					uni.showToast({
+						title: '该店铺未设置定位',
+						icon: 'none',
+						duration: 3000
+					});
+				} else {
+					uni.openLocation({
+						latitude: Number(that.orderData.shopInfo.lat),
+						longitude: Number(that.orderData.shopInfo.lng),
+						name: that.orderData.shopInfo.shopName,
+						address: that.orderData.shopInfo.province+that.orderData.shopInfo.city+that.orderData.shopInfo.area+that.orderData.shopInfo.address,
+						success: function() {
+							console.log('success');
+						},
+						fail(err) {
+							console.log(err)
+						}
+					});
+				}
+
+			},
+
+			call() {
+				uni.makePhoneCall({
+					phoneNumber: this.orderData.orderSheet.mobilePhone
+				});
+			},
+
+
+			getData() {
+				uni.showLoading({
+					title: '加载中'
+				});
+
+				this.$http('openreservation/orderSheetDetails', {
+					// lat: this.location.lat,
+					// lng: this.location.lng,
+					id: this.id,
+				}, 'GET').then(res => {
+					uni.hideLoading();
+					this.orderData = res.data;
+
+					
+					
+				})
+			},
+			
+			goback() {
+
+				uni.navigateBack({})
+
+
+			},
+			
+		},
+		onPullDownRefresh() {
+			
+			this.getData()
+			setTimeout(function() {
+				uni.stopPullDownRefresh();
+			}, 1000);
+		},
+
+	}
+</script>
+
+<style scoped>
+	.box {
+		min-height: 100vh;
+		background: #F4F5F7;
+
+	}
+
+	.top {
+		height: 190rpx;
+		background-color: #FF0000;
+
+	}
+
+	.orderState {
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		padding-top: 40rpx;
+	}
+
+	.SheetState {
+		display: flex;
+		justify-content: center;
+		font-size: 36rpx;
+		font-weight: 500;
+		color: #FFFFFF;
+		margin-left: 15rpx;
+
+	}
+
+
+
+	.timeEditImg {
+		width: 25rpx;
+		height: 25rpx;
+		padding-left: 20rpx;
+	}
+
+
+
+	.shopBoximg {
+		width: 40rpx;
+		height: 40rpx;
+	}
+
+	.shopRightImg {
+		width: 44rpx;
+		height: 45rpx;
+	}
+
+	.shopsx {
+		width: 1px;
+		height: 50rpx;
+		background: #EEEEEE;
+		margin-top: 30rpx;
+		margin-left: 28rpx;
+	}
+
+	.shopBox {
+
+		display: flex;
+		padding: 30rpx 20rpx;
+		margin: 0rpx 24rpx;
+		margin-top: -60rpx;
+		background-color: #FFFFFF;
+		border-radius: 10rpx;
+
+	}
+
+	.shopCont {
+		width: 405rpx;
+		padding-left: 20rpx;
+
+	}
+
+	.shopName {
+		font-size: 30rpx;
+		font-weight: bold;
+		color: #3C3C3C;
+		line-height: 42rpx;
+	}
+
+	.Address {
+		color: #999999;
+		font-size: 24rpx;
+		margin-top: 10rpx;
+	}
+
+	.shopRihgtTxt {
+		color: #999999;
+		font-size: 24rpx;
+
+	}
+
+	.shopRightBox {
+		
+		padding-left: 28rpx;
+	}
+
+	.peopleCont {
+		font-size: 28rpx;
+		color: #3C3C3C;
+		padding-left: 20rpx;
+	}
+
+	.people {
+		display: flex;
+		padding-left: 20rpx;
+		padding-top: 30rpx;
+		padding-bottom: 36rpx;
+	}
+
+	.PlateNumberBox {
+		display: flex;
+		padding-left: 20rpx;
+		padding-bottom: 30rpx;
+	}
+
+	.PlateNumbercx {
+		font-size: 28rpx;
+
+		color: #3C3C3C;
+		padding-left: 20rpx;
+	}
+
+	.PlateNumber {
+		width: 130rpx;
+		height: 32rpx;
+		border-radius: 4rpx;
+		border: 1px solid #F19D01;
+		line-height: 32rpx;
+		text-align: center;
+		font-size: 22rpx;
+		color: #F19D01;
+		margin-left: 26rpx;
+	}
+
+	.PlateNumberBoxTop {
+		display: flex;
+	}
+
+	.CarModel {
+		font-size: 26rpx;
+		color: #999999;
+		padding-left: 20rpx;
+		padding-top: 6rpx;
+		padding-right: 20rpx;
+		padding-bottom: 15rpx;
+		width: 600rpx;
+	}
+
+	.detailedBox {
+
+		background: #FFFFFF;
+		border-radius: 10px;
+		margin: 20rpx 24rpx;
+		padding-bottom: 20rpx;
+	}
+
+	.itemBox {
+		margin-top: 20rpx;
+	}
+
+	.carMes {
+		padding: 23rpx 20rpx;
+		display: flex;
+		align-items: center;
+		justify-content: flex-start;
+		border-bottom: 1rpx solid #EEEEEE;
+	}
+
+	.plate {
+		font-size: 30rpx;
+		color: #3C3C3C;
+		font-weight: bold;
+		margin-right: 20rpx;
+	}
+
+	.mileage {
+		font-size: 24rpx;
+		color: #F19D01;
+		padding: 0rpx 10rpx;
+		border: 1rpx solid #F19D01;
+		border-radius: 4rpx;
+		height: 36rpx;
+	}
+
+	.detailedTitle {
+		padding: 23rpx 20rpx;
+		display: flex;
+		text-align: center;
+		align-content: flex-start;
+		border-bottom: 1rpx solid #EEEEEE;
+
+		font-size: 30rpx;
+		font-weight: bold;
+		color: #3C3C3C;
+	}
+
+
+	.detailedLine {
+		display: flex;
+		padding: 20rpx 20rpx 0rpx;
+		justify-content: space-between;
+	}
+
+	.detailedImg {
+		width: 120rpx;
+		height: 120rpx;
+		border-radius: 10rpx;
+	}
+
+	
+
+	.detailedName {
+		font-size: 26rpx;
+		color: #3C3C3C;
+	}
+
+	span{
+		font-size: 26rpx;
+		color: #999999;
+	}
+
+	.goodscost {
+		width: 702rpx;
+		background: #FFFFFF;
+		border-radius: 10px;
+		margin-left: 24rpx;
+		margin-top: 20rpx;
+		padding: 15rpx 0;
+	}
+
+	.goodscostLine {
+		display: flex;
+		justify-content: space-between;
+		font-size: 28rpx;
+		padding: 20rpx 20rpx;
+		color: #666666;
+	}
+
+	.goodsCostNum {
+		color: #3C3C3C;
+	}
+
+	.information {
+		width: 702rpx;
+		background: #FFFFFF;
+		border-radius: 10px;
+		margin-left: 24rpx;
+		margin-top: 20rpx;
+		padding: 0rpx 0 15rpx 0;
+	}
+
+	.informationLine {
+		display: flex;
+		font-size: 26rpx;
+		padding: 15rpx 20rpx;
+	}
+
+	.informationTxt {
+		width: 190rpx;
+		color: #999999;
+	}
+
+	.informationNum {
+		color: #333333;
+	}
+
+	.copyBtn {
+		width: 86rpx;
+		height: 40rpx;
+		background: #F4F5F7;
+		border-radius: 20rpx;
+		font-size: 24rpx;
+		color: #333333;
+		text-align: center;
+		line-height: 40rpx;
+		margin-left: 20rpx;
+	}
+
+	.orderBottom {
+		width: 750rpx;
+		height: 98rpx;
+		background: #FFFFFF;
+		position: fixed;
+		left: 0;
+		bottom: 0;
+		display: flex;
+		justify-content: flex-end;
+	}
+
+	.cancelBtn {
+		width: 150rpx;
+		height: 56rpx;
+		border-radius: 36rpx;
+		border: 2rpx solid #DDDDDD;
+		text-align: center;
+		line-height: 56rpx;
+		font-size: 28rpx;
+		color: #3C3C3C;
+		margin-top: 21rpx;
+		margin-right: 16rpx;
+		margin-left: 20rpx;
+	}
+
+	.payBtn {
+		width: 150rpx;
+		height: 56rpx;
+		border-radius: 36rpx;
+		border: 2rpx solid #FF4F00;
+		text-align: center;
+		line-height: 56rpx;
+		font-size: 28rpx;
+		color: #FF4F00;
+		margin-top: 21rpx;
+		margin-right: 16rpx;
+		margin-left: 20rpx;
+	}
+
+	.timeBox2 {
+		width: 100vw;
+		height: 100vh;
+		background: rgba(0, 0, 0, 0.5);
+		position: fixed;
+		top: 0;
+		left: 0;
+	}
+
+	.timeLeftActive {
+		background: #FFFFFF;
+	}
+
+	.timeMain {
+		width: 100vw;
+		height: 70vh;
+		margin-top: 30vh;
+		background: #FFFFFF;
+		border-radius: 24rpx 24rpx 0px 0px;
+	}
+
+	.timesfNo {
+		background: #F5F5F5;
+	}
+
+	.timesfActive {
+		background: #FF4F00;
+
+	}
+
+	.timesfActive .timeSfNum {
+		color: #FFFFFF;
+	}
+
+	.timesfActive .timeyy {
+		color: #FFFFFF;
+	}
+
+	
+
+	.timeTop {
+		display: flex;
+		line-height: 90rpx;
+		padding-left: 24rpx;
+		padding-right: 24rpx;
+		justify-content: space-between;
+	}
+
+	.timeTopTitle {
+		font-size: 30rpx;
+		font-family: PingFangSC-Medium, PingFang SC;
+		font-weight: 600;
+		color: #3C3C3C;
+	}
+
+	.close {
+		color: #999999;
+		font-size: 30rpx;
+		padding-left: 30rpx;
+	}
+
+	.timeCont {
+		height: calc(70vh - 210rpx);
+	}
+
+	.timeSv {
+		height: calc(70vh - 210rpx);
+	}
+
+	.timeLeft2 {
+		width: 162rpx;
+		background: #F4F5F7;
+		border-top: 1px soid #F4F5F7;
+		border-right: 1px soid #F4F5F7;
+	}
+
+	.timeRight2 {
+		width: 588rpx;
+	}
+
+	.timesf {
+		width: 165rpx;
+		height: 98rpx;
+		border-radius: 7rpx;
+		border: 2rpx solid #EEEEEE;
+		text-align: center;
+		margin-left: 20rpx;
+		margin-bottom: 24rpx;
+	}
+
+	.timeBottom {
+		width: 750rpx;
+		height: 120rpx;
+		background: #FFFFFF;
+		box-shadow: 0px -2px 20rpx 0px rgba(153, 153, 153, 0.2);
+		display: flex;
+		align-items: center;
+
+	}
+
+	.timerightBox {
+		display: flex;
+		flex-wrap: wrap;
+	}
+
+	.timeCont {
+		display: flex;
+	}
+
+	.timeSfNum {
+		color: #666666;
+		font-size: 28rpx;
+		padding-top: 15rpx;
+	}
+
+	.timeyy {
+		font-size: 24rpx;
+		color: #999999;
+	}
+
+	.timecomplete {
+		width: 690rpx;
+		height: 74rpx;
+		background: linear-gradient(124deg, #FF8700 0%, #FF4F00 100%);
+		border-radius: 37rpx;
+		line-height: 74rpx;
+		text-align: center;
+		font-size: 30rpx;
+		color: #FFFFFF;
+		margin-left: 30rpx;
+	}
+
+	.timeleftLine {
+		font-size: 30rpx;
+		color: #999999;
+		text-align: center;
+		padding: 28rpx 10rpx;
+		border-bottom: 1px solid #EEEEEE;
+	}
+
+	.yuyueBox {
+
+		background: #FFFFFF;
+		border-radius: 10rpx;
+		margin-left: 24rpx;
+		margin-right: 24rpx;
+
+	}
+
+	.yuyueTime {
+		display: flex;
+		padding-left: 20rpx;
+		padding-top: 30rpx;
+		padding-bottom: 36rpx;
+		align-items: center;
+	}
+
+	.yuyueState {
+		display: flex;
+		padding-left: 20rpx;
+		padding-top: 30rpx;
+		padding-bottom: 36rpx;
+	}
+
+	.maBox {
+		display: flex;
+		justify-content: space-between;
+		padding: 24rpx 20rpx;
+	}
+
+	.querenMa {
+
+		margin: 20rpx 0;
+		padding-bottom: 30rpx;
+	}
+
+	.maBoximg {
+		width: 308rpx;
+		height: 308rpx;
+		margin: 30rpx 197rpx;
+
+
+	}
+
+	.rightShou {
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+	}
+	.content{
+		background-color: #F4F5F7;
+		border-radius: 10rpx;
+		padding: 16rpx;
+		color: #999999;
+		font-size: 24rpx;
+		margin: 20rpx;
+	}
+	.bottom {
+		display: flex;
+		justify-content: flex-end;
+		padding: 20rpx;
+		background-color: #FFFFFF;
+		align-items: center;
+		height: 98rpx;
+		width: 100vw;
+		position: fixed;
+		bottom: 0rpx;
+	}
+	.cancel{
+		color: #3C3C3C;
+		font-size: 28rpx;
+		width: 150rpx;
+		height: 56rpx;
+		border-radius: 36rpx;
+		border: 1rpx solid #DDDDDD;
+		text-align: center;
+		line-height: 56rpx;
+		margin-right: 40rpx;
+	}
+	.defer {
+		color: #D53533;
+		font-size: 28rpx;
+		width: 150rpx;
+		height: 56rpx;
+		border-radius: 36rpx;
+		border: 1rpx solid #D53533;
+		text-align: center;
+		line-height: 56rpx;
+		margin-right: 40rpx;
+	}
+	
+	
+</style>

pages/user/myOrder.vue → pages/user/myOrder/myOrder.vue


+ 0 - 22
pages/user/orderDetail/mallOrderDetail.vue

@@ -1,22 +0,0 @@
-<template>
-	<view>
-		
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
-</script>
-
-<style>
-
-</style>

+ 5 - 9
pages/user/user.vue

@@ -259,14 +259,10 @@
 
 			goorder(num) {
 				uni.navigateTo({
-					url: 'myOrder?num=' + num
-				})
-			},
-			login() {
-				uni.navigateTo({
-					url: '../login/login'
+					url: './myOrder/myOrder?num=' + num
 				})
 			},
+			
 			queryMyDetail() {
 				uni.showLoading({
 					title: '加载中'
@@ -290,9 +286,9 @@
 			signOut() {
 				//uni.clearStorageSync();
 				uni.removeStorageSync('logodata');
-				uni.navigateTo({
-					url: '../login/login'
-				})
+				// uni.navigateTo({
+				// 	url: '../login/login'
+				// })
 			},
 
 		},