shunfengche-sfd/pages/placeOrder/placeOrders.vue

<!-- <template>
	<view style="padding-bottom: 100rpx;">
		#ifdef H5
		<u-sticky :h5-nav-height="0" @fixed="xdCheck" @unfixed="noXDCheck">
		#endif
			#ifndef H5
			<u-sticky @fixed="xdCheck" @unfixed="noXDCheck">
			#endif

				<view style="background: #FFFFFF;">
					<u-dropdown :menu-icon='menuicon' ref="uDropdown" @open="open" @close="close" menu-icon-size="18">
						<u-dropdown-item v-model="value1" :title="mrtitle">
							<view class="slot-content padding" style="background: #FFFFFF;">
								<view class="addbox bg" @click="goCFAddress(2)">
									<view class="add_cont">
										<view class="orgin"></view>
										<view class="add_tit" v-if="addlists.city === ''">选择出发地城市</view>
										<view class="add_tit" v-else>{{addlists.city}}</view>
									</view>
									<view>
										<image v-if="globalImages" :src="globalImages + 'imgs/static/image/go.png'" style="width: 16rpx;height: 25rpx;">
										</image>
									</view>
								</view>
								<view class="addbox bg" @click="goCFAddress(2)">
									<view class="add_cont">
										<u-input v-model="addlists.address" type="text" placeholder="请输入出发地地址"
											:border="true" :clearable="true"
											style="border: none;width: 610rpx;height: 100%;" />
									</view>
								</view>
								<view class="flex justify-between">
									<view class="qc_btn" @tap="goQC(2)">清除</view>
									<view class="sx_btn" @tap="goCX">查询</view>
								</view>
							</view>
						</u-dropdown-item>
						<u-dropdown-item v-model="value2" :title="carname">
							<view class="slot-content padding" style="background: #FFFFFF;">
								<view class="addbox bg" @click="goCFAddress(1)">
									<view class="add_cont">
										<view class="orgin"></view>
										<view class="add_tit" v-if="addlist.city === ''">选择目的地城市</view>
										<view class="add_tit" v-else>{{addlist.city}}</view>
									</view>
									<view>
										<image v-if="globalImages" :src="globalImages + 'imgs/static/image/go.png'" style="width: 16rpx;height: 25rpx;">
										</image>
									</view>
								</view>
								<view class="addbox bg" @click="goCFAddress(1)">
									<view class="add_cont">
										<u-input v-model="addlist.address" type="text" placeholder="请输入目的地地址"
											:border="true" :clearable="true"
											style="border: none;width: 610rpx;height: 100%;" />
									</view>
								</view>
								<view class="flex justify-between">
									<view class="qc_btn" @tap="goQC(1)">清除</view>
									<view class="sx_btn" @tap="goCX">查询</view>
								</view>
							</view>
						</u-dropdown-item>
					</u-dropdown>
				</view>
			</u-sticky>
			<view class="myOrder_itemView" v-for="(item,index) in orderList" @tap="goDetail(item)">
				<view style="padding: 30rpx 40rpx 30rpx;">
					<view class="flex justify-between align-center">
						<view class="item_title">{{item.appointmentStartTime}}</view>
						<view style="color: #346EF6;font-weight: bold;">等待接单中...</view>
					</view>
					<view class="flex align-center add_name" style="margin: 30rpx 6rpx 10rpx;">
						<view class="green"></view>出发地点：{{item.shipCity}} {{item.shipAddress}}
					</view>
					<image v-if="globalImages" :src="globalImages + 'imgs/static/upload/up.png'" class="order_up"></image>
					<view class="flex align-center add_name" style="margin-left: 6rpx;margin-top: 6rpx;">
						<view class="orgin"></view>到达地点：{{item.deliveryCity}} {{item.deliveryAddress}}
					</view>
					<view class="margin-top flex align-center justify-between">
						<view class="flex align-center">
							<image v-if="globalImages" :src="globalImages + 'imgs/static/upload/person.png'" style="width: 30rpx;height: 31rpx;"></image>
							<view style="margin-left: 16rpx;width: fit-content;" class="item_addName">
								{{item.appointmentNum}}人乘坐
							</view>
						</view>
						<view class="item_juli">订单里程{{item.kmDistance}}km</view>
					</view>
				</view>
				<u-line color="#E6E6E6" />
				<view style="padding: 30rpx 40rpx 0rpx;display: flex;justify-content: space-between;">
					<view class="item_money">一口价：<text style="font-size: 32rpx;">￥</text><text>{{item.driveMoney}}</text>
					</view>
					<view class="item_btn" @tap="save(item)">立即接单</view>
				</view>
			</view>
			<empty v-if="orderList.length == 0"></empty>

	</view>
</template> -->

// <script>
// 	import empty from '@/components/empty'
// 	import { waitForGlobalImages } from '@/utils/globalImageLoader'
// 	export default {
// 		components: {
// 			empty
// 		},
// 		data() {
// 			return {
// 				addlists: {
// 					city: '',
// 					address: ''
// 				},
// 				addlist: {
// 					city: '',
// 					address: ''
// 				},
// 				itemDetail: {},
// 				mrtitle: '筛选出发地',
// 				carname: '筛选目的地',
// 				menuicon: 'arrow-down-fill',
// 				value1: 1,
// 				value2: 2,
// 				page: 1,
// 				limit: 10,
// 				orderList: [],
// 				indentNumber: '',
// 				openLists: [],
// 				showpay: false,
// 				isDrop: false, //是否打开下拉筛选
// 				openWay: 1,
// 				globalImages: '',
// 			}
// 		},
// 		onLoad(d) {
// 			waitForGlobalImages().then((path) => {
// 				console.log('✅ 全局图片路径:', path)
// 				this.globalImages = path
// 			  })
// 			this.page = 1;
// 			this.getMyOrderList();
// 			this.getCityList();
// 		},
// 		onShow() {
// 			let userId = uni.getStorageSync('userId')
// 			if (!userId) {
// 				uni.navigateTo({
// 					url: '/pages/login/login'
// 				})
// 			}
// 		},
// 		methods: {
// 			open(index) {
// 				this.$refs.uDropdown.highlight();
// 				this.isDrop = true
// 			},
// 			close(index) {
// 				console.log('close', index)
// 				// 关闭的时候，给当前项加上高亮
// 				// 当然，您也可以通过监听dropdown-item的@change事件进行处理
// 				this.$refs.uDropdown.highlight(index);
// 				this.isDrop = false
// 			},
// 			goQC(index) {
// 				if (index == 1) {
// 					let addlist = {
// 						city: '',
// 						address: ''
// 					}
// 					this.addlist = addlist
// 				}

// 				if (index == 2) {
// 					let addlists = {
// 						city: '',
// 						address: ''
// 					}
// 					this.addlists = addlists
// 				}
// 				if (this.isDrop) {
// 					this.$refs.uDropdown.close();
// 				}
// 				this.page = 1;
// 				this.getMyOrderList();
// 			},
// 			goCX() {
// 				if (this.isDrop) {
// 					this.$refs.uDropdown.close();
// 				}
// 				this.page = 1;
// 				this.getMyOrderList();
// 			},
// 			goCFAddress(index) {
// 				let that = this
// 				uni.chooseLocation({
// 					success: function(res) {
// 						console.log('位置名称：' + res.name);
// 						console.log('详细地址：' + res.address);
// 						console.log('纬度：' + res.latitude);
// 						console.log('经度：' + res.longitude);
// 						if (index == 1) {
// 							that.addlist.address = res.name
// 							that.addlist.lng = res.longitude
// 							that.addlist.lat = res.latitude
// 							let data = {
// 								lat: res.latitude,
// 								lng: res.longitude
// 							}
// 							that.$Request.getT('/app/Login/selectCity', data).then(res => {
// 								if (res.code === 0) {
// 									that.addlist.province = res.data.province
// 									that.addlist.city = res.data.city
// 									that.addlist.district = res.data.district
// 								}
// 							});
// 						} else if (index == 2) {
// 							that.addlists.address = res.name
// 							that.addlists.lng = res.longitude
// 							that.addlists.lat = res.latitude
// 							let data = {
// 								lat: res.latitude,
// 								lng: res.longitude
// 							}
// 							that.$Request.getT('/app/Login/selectCity', data).then(res => {
// 								if (res.code === 0) {
// 									that.addlists.province = res.data.province
// 									that.addlists.city = res.data.city
// 									that.addlists.district = res.data.district
// 								}
// 							});
// 						}
// 					}
// 				});
// 			},
// 			getCityList() {
// 				this.$Request.getT('/app/fixedStroke/selectShipCityList').then(res => {
// 					if (res.code == 0) {

// 					}
// 				});


// 				this.$Request.getT('/app/fixedStroke/selectDeliveryCityList').then(res => {
// 					if (res.code == 0) {

// 					}
// 				});
// 			},
// 			save(item) {
// 				let userId = this.$queue.getData('userId');
// 				let that = this;
// 				uni.showModal({
// 					title: '提示',
// 					content: '确定抢单吗？',
// 					success: function(res) {
// 						if (res.confirm) {
// 							// console.log('用户点击确定');
// 							that.$Request.postT(
// 									'/app/orders/takingOrders?ordersId=' +
// 									item.ordersId + '&userId=' + userId)
// 								.then(res => {
// 									if (res.code == 0) {
// 										uni.showToast({
// 											title: '接单成功',
// 											icon: 'none'
// 										})
// 										that.page = 1;
// 										that.getMyOrderList();
// 										setTimeout(function() {
// 											uni.switchTab({
// 												url: '/pages/order/order'
// 											})
// 										}, 1000)
// 									} else {
// 										uni.showToast({
// 											title: res.msg,
// 											icon: 'none',
// 											duration: 1500
// 										})
// 									}
// 								});
// 						} else if (res.cancel) {
// 							// console.log('用户点击取消');
// 						}
// 					}
// 				});
// 			},
// 			getMyOrderList() {
// 				this.$queue.showLoading('加载中...')
// 				let userId = this.$queue.getData('userId');
// 				this.$Request.getT('/app/orders/selectOrdersList?isFixedStroke=1&page=' + this.page + '&limit=' + this
// 					.limit + '&shipCity=' + this.addlists.city + '&shipAddress=' + this.addlists.address +
// 					'&deliveryCity=' + this.addlist.city + '&deliveryAddress=' + this.addlist.address + '&driverUserId=' + userId + '&status=2').then(res => {
// 					if (res.code == 0 && res.data) {
// 						if (this.page == 1) {
// 							this.orderList = res.data.list
// 						} else {
// 							this.orderList = [...this.orderList, ...res.data.list]
// 						}
// 						uni.hideLoading();
// 						uni.stopPullDownRefresh();
// 					}
// 				});
// 			}
// 		},
// 		// 上拉加载
// 		onReachBottom: function() {
// 			this.page = this.page + 1;
// 			this.getMyOrderList();
// 		},
// 		onPullDownRefresh: function() {
// 			this.page = 1;
// 			this.getMyOrderList();
// 		}
// 	}
// </script>

// <style lang="scss">
// 	page {
// 		background: #F5F5F5;
// 	}

// 	.qc_btn {
// 		margin: 0 10rpx 10rpx;
// 		width: 320rpx;
// 		padding: 0 30rpx;
// 		height: 90rpx;
// 		border-radius: 50rpx;
// 		text-align: center;
// 		line-height: 90rpx;
// 		background: #346EF6;
// 		font-family: PingFang SC;
// 		font-weight: 500;
// 		font-size: 30rpx;
// 		color: #FFFFFF;
// 	}

// 	.sx_btn {
// 		margin: 0 10rpx 10rpx;
// 		width: 320rpx;
// 		padding: 0 30rpx;
// 		height: 90rpx;
// 		border-radius: 50rpx;
// 		text-align: center;
// 		line-height: 90rpx;
// 		background: #346EF6;
// 		font-family: PingFang SC;
// 		font-weight: 500;
// 		font-size: 30rpx;
// 		color: #FFFFFF;
// 	}

// 	.addbox {
// 		display: flex;
// 		align-items: center;
// 		justify-content: space-between;
// 		margin: 0 10rpx 30rpx;
// 		padding: 0 30rpx;
// 		height: 110rpx;
// 		border-radius: 16rpx;
// 	}

// 	.add_cont {
// 		display: flex;
// 		align-items: center;
// 	}

// 	.add_tit {
// 		font-size: 30rpx;
// 		font-family: PingFang SC;
// 		font-weight: bold;
// 		color: #333333;
// 		margin-left: 10rpx;

// 	}

// 	.bg {
// 		background: #F5F5F5;
// 	}

// 	.box_money {
// 		font-family: PingFang SC;
// 		font-weight: 500;
// 		font-size: 28rpx;
// 		color: #030303;
// 		margin-bottom: 30rpx;
// 		margin-top: 10rpx;

// 		text {
// 			font-size: 40rpx;
// 			color: #FF2020;
// 			font-weight: bold;
// 		}
// 	}

// 	.box_item {
// 		padding: 0 20rpx;
// 		display: flex;
// 		align-items: center;
// 		width: 520rpx;
// 		height: 100rpx;
// 		background: #F7F7F7;
// 		border-radius: 16rpx;
// 		justify-content: space-between;
// 	}

// 	.add_tit {
// 		font-size: 30rpx;
// 		font-family: PingFang SC;
// 		font-weight: bold;
// 		color: #333333;
// 		margin-left: 10rpx;
// 	}

// 	.myOrder_itemView {
// 		width: 686rpx;
// 		// height: 549rpx;
// 		background: #FFFFFF;
// 		border-radius: 32rpx;
// 		margin: 0 auto;
// 		margin-top: 20rpx;
// 		padding-bottom: 40rpx;
// 	}

// 	.item_title {
// 		font-family: Source Han Sans CN;
// 		font-weight: 600;
// 		font-size: 32rpx;
// 		color: #242424;
// 	}

// 	.order_up {
// 		width: 6rpx;
// 		height: 24rpx;
// 		margin-left: 12rpx;
// 	}

// 	.add_name {
// 		font-family: PingFang SC;
// 		font-weight: 500;
// 		font-size: 28rpx;
// 		color: #101010;
// 	}


// 	.green {
// 		width: 16rpx;
// 		height: 16rpx;
// 		background: #1FC657;
// 		border-radius: 50%;
// 		margin-right: 20rpx;
// 	}

// 	.item_money {
// 		font-family: PingFang SC;
// 		font-weight: 500;
// 		font-size: 28rpx;
// 		color: #101010;

// 		text {
// 			font-size: 42rpx;
// 			color: #FF2020;
// 			font-weight: bold;
// 		}
// 	}

// 	.item_btn {
// 		width: 150rpx;
// 		height: 58rpx;
// 		background: #346EF6;
// 		border-radius: 30rpx;
// 		text-align: center;
// 		line-height: 58rpx;
// 		font-family: PingFang SC;
// 		font-weight: 500;
// 		font-size: 24rpx;
// 		color: #FFFFFF;
// 	}

// 	.orgin {
// 		width: 16rpx;
// 		height: 16rpx;
// 		background: #FBAC04;
// 		border-radius: 50%;
// 		margin-right: 20rpx;
// 	}
// </style>