更改需求

components/search.vue

@@ -1,96 +1,84 @@
 <template>
 	<view class="search">
-		<picker style="width: 50%;" @change="bindPickerChange($event,1)" :value="typeIndex" :range="typeList">
+		<uni-data-picker v-slot:default v-model="typeValue" :localdata="typeList" popup-title="请选择预约状态" @nodeclick="onnodeclick">
 			<view class="search-type">
-				{{typeList[typeIndex]}}
-				<div class="search-type-img">
-					<img src="../static/bottom.png">
-				</div>
+				{{ typeList[typeValue].text }}
+				<view class="search-type-img"><img src="../static/bottom.png" /></view>
 			</view>
-		</picker>
+		</uni-data-picker>
 
-		<picker style="width: 50%;" @change="bindPickerChange($event,2)" :value="timeIndex" :range="timeList">
+		<uni-data-picker v-slot:default v-model="timeValue" :localdata="timeList" popup-title="请选择预约时间" @nodeclick="onnodeclick">
 			<view class="search-time">
-				{{timeList[timeIndex]}}
-				<div class="search-time-img">
-					<img src="../static/bottom.png">
-				</div>
+				{{ timeList[timeValue].text }}
+				<view class="search-time-img"><img src="../static/bottom.png" /></view>
 			</view>
-		</picker>
+		</uni-data-picker>
 	</view>
 </template>
 
 <script setup>
-	import {
-		ref
-	} from "vue"
+import { ref } from 'vue'
 
-	defineProps({
-		typeList: Array,
-		timeList: Array
-	})
-
-	const typeIndex = ref(0)
-	const timeIndex = ref(0)
+const props = defineProps({
+	typeList: Array,
+	timeList: Array
+})
 
-	const conveyData = defineEmits(["handLeConveyData"])
+const typeValue = ref(0)
+const timeValue = ref(0)
 
-	const bindPickerChange = (e, type) => {
-		if (type === 1) {
-			typeIndex.value = e.detail.value
-		} else {
-			timeIndex.value = e.detail.value
-		}
+const conveyData = defineEmits(['handLeConveyData'])
 
-		conveyData("handLeConveyData", {
-			typeIndex: typeIndex.value,
-			timeIndex: timeIndex.value,
-		})
-	}
+const onnodeclick = () => {
+	conveyData('handLeConveyData', {
+		typeIndex: typeValue.value,
+		timeIndex: timeValue.value
+	})
+}
 </script>
 
 <style lang="scss" scoped>
-	.search {
-		display: flex;
-		justify-content: space-around;
-		align-items: center;
-		margin-bottom: 20rpx;
-		height: 100rpx;
-		font-size: 28rpx;
-		background-color: #fff;
+.search {
+	display: flex;
+	justify-content: space-around;
+	align-items: center;
+	margin-bottom: 20rpx;
+	height: 100rpx;
+	font-size: 28rpx;
+	background-color: #fff;
 
-		.search-type {
-			flex: 1;
-			display: flex;
-			justify-content: space-evenly;
+	.search-type {
+		flex: 1;
+		display: flex;
+		justify-content: space-evenly;
 
-			.search-type-img {
-				margin-top: -5rpx;
-				width: 17rpx;
-				height: 12rpx;
+		.search-type-img {
+			margin-top: -5rpx;
+			width: 17rpx;
+			height: 12rpx;
 
-				img {
-					width: 100%;
-					height: 100%;
-				}
+			img {
+				width: 100%;
+				height: 100%;
 			}
 		}
+	}
 
-		.search-time {
-			flex: 1;
-			display: flex;
-			justify-content: space-evenly;
+	.search-time {
+		flex: 1;
+		display: flex;
+		justify-content: space-evenly;
 
-			.search-time-img {
-				margin-top: -5rpx;
-				width: 17rpx;
-				height: 12rpx;
+		.search-time-img {
+			margin-top: -5rpx;
+			width: 17rpx;
+			height: 12rpx;
 
-				img {
-					width: 100%;
-					height: 100%;
-				}
+			img {
+				width: 100%;
+				height: 100%;
 			}
 		}
 	}
-</style>
+}
+</style>

components/test.vue

@@ -0,0 +1,96 @@
+<template>
+	<view class="search">
+		<picker style="width: 50%;" @change="bindPickerChange($event,1)" :value="typeIndex" :range="typeList">
+			<view class="search-type">
+				{{typeList[typeIndex]}}
+				<div class="search-type-img">
+					<img src="../static/bottom.png">
+				</div>
+			</view>
+		</picker>
+
+		<picker style="width: 50%;" @change="bindPickerChange($event,2)" :value="timeIndex" :range="timeList">
+			<view class="search-time">
+				{{timeList[timeIndex]}}
+				<div class="search-time-img">
+					<img src="../static/bottom.png">
+				</div>
+			</view>
+		</picker>
+	</view>
+</template>
+
+<script setup>
+	import {
+		ref
+	} from "vue"
+
+	defineProps({
+		typeList: Array,
+		timeList: Array
+	})
+
+	const typeIndex = ref(0)
+	const timeIndex = ref(0)
+
+	const conveyData = defineEmits(["handLeConveyData"])
+
+	const bindPickerChange = (e, type) => {
+		if (type === 1) {
+			typeIndex.value = e.detail.value
+		} else {
+			timeIndex.value = e.detail.value
+		}
+
+		conveyData("handLeConveyData", {
+			typeIndex: typeIndex.value,
+			timeIndex: timeIndex.value,
+		})
+	}
+</script>
+
+<style lang="scss" scoped>
+	.search {
+		display: flex;
+		justify-content: space-around;
+		align-items: center;
+		margin-bottom: 20rpx;
+		height: 100rpx;
+		font-size: 28rpx;
+		background-color: #fff;
+
+		.search-type {
+			flex: 1;
+			display: flex;
+			justify-content: space-evenly;
+
+			.search-type-img {
+				margin-top: -5rpx;
+				width: 17rpx;
+				height: 12rpx;
+
+				img {
+					width: 100%;
+					height: 100%;
+				}
+			}
+		}
+
+		.search-time {
+			flex: 1;
+			display: flex;
+			justify-content: space-evenly;
+
+			.search-time-img {
+				margin-top: -5rpx;
+				width: 17rpx;
+				height: 12rpx;
+
+				img {
+					width: 100%;
+					height: 100%;
+				}
+			}
+		}
+	}
+</style>

manifest.json

@@ -1,80 +1,80 @@
 {
-    "name" : "校车预约",
-    "appid" : "__UNI__43F49FA",
-    "description" : "",
-    "versionName" : "1.0.0",
-    "versionCode" : "100",
-    "transformPx" : false,
-    "app-plus" : {
-        /* 5+App特有相关 */
-        "usingComponents" : true,
-        "nvueCompiler" : "uni-app",
-        "nvueStyleCompiler" : "uni-app",
-        "splashscreen" : {
-            "alwaysShowBeforeRender" : true,
-            "waiting" : true,
-            "autoclose" : true,
-            "delay" : 0
-        },
-        "modules" : {},
-        /* 模块配置 */
-        "distribute" : {
-            /* 应用发布信息 */
-            "android" : {
-                /* android打包配置 */
-                "permissions" : [
-                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
-                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
-                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
-                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
-                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
-                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
-                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
-                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
-                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
-                    "<uses-feature android:name=\"android.hardware.camera\"/>",
-                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
-                ]
-            },
-            "ios" : {},
-            /* ios打包配置 */
-            "sdkConfigs" : {}
-        }
-    },
-    /* SDK配置 */
-    "quickapp" : {},
-    /* 快应用特有相关 */
-    "mp-weixin" : {
-        /* 小程序特有相关 */
-        "appid" : "",
-        "setting" : {
-            "urlCheck" : false
-        },
-        "usingComponents" : true
-    },
-    "vueVersion" : "3",
-    "h5" : {
-        "title" : "校车预约",
-        "devServer" : {
-            "disableHostCheck" : true,
-            "proxy" : {
-                "/carstop/carbook" : {
-                    //目标接口域名
-                    "target" : "https://chtech.ncjti.edu.cn/carstop/carbook",
-                    // "target": "http://192.168.161.170:8088/carBook",
-                    //是否跨域
-                    "changeOrigin" : true,
-                    // 设置支持https协议的代理
-                    "secure" : false
-                }
-            }
-        },
-        "router" : {
-            "base" : "/carstop/dist5/"
-        }
-    }
-}
+	"name": "校车预约",
+	"appid": "__UNI__43F49FA",
+	"description": "",
+	"versionName": "1.0.0",
+	"versionCode": "100",
+	"transformPx": false,
+	"app-plus": {
+		/* 5+App特有相关 */
+		"usingComponents": true,
+		"nvueCompiler": "uni-app",
+		"nvueStyleCompiler": "uni-app",
+		"splashscreen": {
+			"alwaysShowBeforeRender": true,
+			"waiting": true,
+			"autoclose": true,
+			"delay": 0
+		},
+		"modules": {},
+		/* 模块配置 */
+		"distribute": {
+			/* 应用发布信息 */
+			"android": {
+				/* android打包配置 */
+				"permissions": [
+					"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+					"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+					"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+					"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+					"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+					"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+					"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+					"<uses-permission android:name=\"android.permission.CAMERA\"/>",
+					"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+					"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+					"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+					"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+					"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+					"<uses-feature android:name=\"android.hardware.camera\"/>",
+					"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+				]
+			},
+			"ios": {},
+			/* ios打包配置 */
+			"sdkConfigs": {}
+		}
+	},
+	/* SDK配置 */
+	"quickapp": {},
+	/* 快应用特有相关 */
+	"mp-weixin": {
+		/* 小程序特有相关 */
+		"appid": "",
+		"setting": {
+			"urlCheck": false
+		},
+		"usingComponents": true
+	},
+	"vueVersion": "3",
+	"h5": {
+		"title": "校车预约",
+		"devServer": {
+			"disableHostCheck": true,
+			"proxy": {
+				"/carstop/carbook": {
+					//目标接口域名
+					"target": "https://chtech.ncjti.edu.cn/carstop/carbook",
+					// "target": "http://192.168.161.170:8088/carBook",
+					//是否跨域
+					"changeOrigin": true,
+					// 设置支持https协议的代理
+					"secure": false
+				}
+			}
+		},
+		"router": {
+			"base": "/carstop/dist5/"
+		}
+	}
+}

pages/index/index.vue

@@ -1,53 +1,45 @@
 <template>
-	<view>
-		<!-- 授权页面 -->
-	</view>
+	<view><!-- 授权页面 --></view>
 </template>
 
 <script setup>
-	import {
-		onLoad
-	} from "@dcloudio/uni-app"
+import { onLoad } from '@dcloudio/uni-app'
 
-	import {
-		getQueryString
-	} from "../../util/getParams.js"
+import { getQueryString } from '../../util/getParams.js'
 
-	const APPKEY = '4AA7B3944BDF3739'
-	const ocode = '1015730314'
-	// 线上地址
-	const URL = 'https://chtech.ncjti.edu.cn/carstop/carbook/appopenid.action'
-	// 本地地址
-	// const URL = 'http://192.168.161.170:8088/carBook/appopenid.action'
+const APPKEY = '4AA7B3944BDF3739'
+const ocode = '1015730314'
+// 线上地址
+// const URL = 'https://chtech.ncjti.edu.cn/carstop/carbook/appopenid.action'
+// 本地地址
+const URL = 'http://192.168.161.170:8088/carBook/appopenid.action'
 
-	onLoad(() => {
-		loginFilter()
-	})
+onLoad(() => {
+	loginFilter()
+})
 
-	// 获取用户card_number
-	const loginFilter = () => {
-		const card_number = uni.getStorageSync('bus_card_number')
+// 获取用户card_number
+const loginFilter = () => {
+	const card_number = uni.getStorageSync('bus_card_number')
+	if (!card_number) {
+		const card_number = getQueryString('card_number')
 		if (!card_number) {
-			const card_number = getQueryString('card_number')
-			if (!card_number) {
-				getCardnumberURL()
-			} else {
-				uni.setStorageSync('bus_card_number', card_number)
-				uni.switchTab({
-					url: "/pages/home/home"
-				})
-			}
+			getCardnumberURL()
 		} else {
+			uni.setStorageSync('bus_card_number', card_number)
 			uni.switchTab({
-				url: "/pages/home/home"
+				url: '/pages/home/home'
 			})
 		}
+	} else {
+		uni.switchTab({
+			url: '/pages/home/home'
+		})
 	}
+}
 
-	// 跳转授权页面
-	const getCardnumberURL = () => {
-		window.
-		location.href =
-			`https://open.wecard.qq.com/connect/oauth/authorize?app_key=${APPKEY}&response_type=code&scope=snsapi_base&ocode=${ocode}&redirect_uri=${URL}&state=${URL}`
-	}
-</script>
+// 跳转授权页面
+const getCardnumberURL = () => {
+	window.location.href = `https://open.wecard.qq.com/connect/oauth/authorize?app_key=${APPKEY}&response_type=code&scope=snsapi_base&ocode=${ocode}&redirect_uri=${URL}&state=${URL}`
+}
+</script>

pages/my/my.vue

@@ -4,322 +4,353 @@
 		<Search :typeList="typeList" :timeList="timeList" @handLeConveyData="getConveyData" />
 
 		<!-- 列表区域 -->
-		<view class="list" v-for="(item,index) in listData" :key="index">
+		<view class="list" v-for="(item, index) in listData" :key="index">
 			<view class="list-title">
-				<view>
-					{{item.route }}
-				</view>
-				<view class="list-img" :class="item.state ===1 ? 'mr-30':''">
-					<img v-if="item.state===1" src="../../static/success.png">
-					<img v-if="item.state===2" src="../../static/pass.png">
-					<img v-if="item.state===3" src="../../static/waiting.png">
-					<img v-if="item.state===4" src="../../static/cancel.png">
+				<view>{{ item.route }}</view>
+				<view class="list-img" :class="item.state === 1 ? 'mr-30' : ''">
+					<img v-if="item.state === 1" src="../../static/success.png" />
+					<img v-if="item.state === 2" src="../../static/pass.png" />
+					<img v-if="item.state === 3" src="../../static/waiting.png" />
+					<img v-if="item.state === 4" src="../../static/cancel.png" />
 				</view>
 			</view>
 			<view class="list-info">
 				<view class="list-info-item">
-					<span>预约号：</span>{{item.row_num}}
+					<span>预约号：</span>
+					{{ item.row_num }}
 				</view>
 				<view class="list-info-item">
-					<span>下单时间：</span>{{item.yy_time}}
+					<span>下单时间：</span>
+					{{ item.yy_time }}
 				</view>
-				<view class="list-info-item" v-if="item.state===1">
-					<span>发车时间：</span>{{item.yy_date}}
+				<view class="list-info-item" v-if="item.state === 1">
+					<span>发车时间：</span>
+					{{ item.yy_date }}
 				</view>
-				<view class="list-info-item" v-if="item.state===1||item.state===2">
-					<span>车牌号：</span>{{item.car_number}}
+				<view class="list-info-item" v-if="item.state === 1 || item.state === 2">
+					<span>车牌号：</span>
+					{{ item.car_number }}
 				</view>
 				<view class="list-info-item">
-					<span>终点站：</span>{{item.route_end}}
+					<span>终点站：</span>
+					{{ item.route_end }}
 				</view>
-				<view class="list-info-item" v-if="item.state===1||item.state===2">
-					<span>容 量：</span>{{item.contain}}人
+				<view class="list-info-item" v-if="item.state === 1 || item.state === 2">
+					<span>容 量：</span>
+					{{ item.contain }}人
 				</view>
-				<view class="list-info-item2" v-if="item.state===1||item.state===2">
-					<span>变更信息：</span>{{item.remark!=''?item.remark:'无'}}
+				<view class="list-info-item2" v-if="item.state === 1 || item.state === 2">
+					<span>变更信息：</span>
+					{{ item.remark != '' ? item.remark : '无' }}
 				</view>
 			</view>
 			<view class="list-button">
 				<!-- <view class="list-button-change" v-if="item.state ===1" @click="handleChange">
 					更换车次
 				</view> -->
-				<view class="list-button-change" v-if="item.state ===1&&item.contain==6" @click="handleOnCar(item.id)">
-					我已上车
-				</view>
-				<view class="list-button-cancel" v-if="item.state ===1||item.state ===3" @click="handleCancel(item.id)">
-					取消预约
-				</view>
+				<view class="list-button-change" v-if="item.state === 1 && item.contain == 6" @click="handleOnCar(item.id)">我已上车</view>
+				<view class="list-button-cancel" v-if="item.state === 1 || item.state === 3" @click="handleCancel(item.id)">取消预约</view>
 			</view>
 		</view>
 
 		<!-- 无数据时展示的区域 -->
-		<view class="list-nodata" v-if="listData.length ==0">
-			<img src="../../static/no-bus.png">
-			<view>
-				暂无数据
-			</view>
+		<view class="list-nodata" v-if="listData.length == 0">
+			<img src="../../static/no-bus.png" />
+			<view>暂无数据</view>
 		</view>
-
 	</view>
 </template>
 
 <script setup>
-	import {
-		ref
-	} from "vue"
-
-	import {
-		onLoad,
-		onShow,
-		onPullDownRefresh
-	} from "@dcloudio/uni-app"
-
-	import {
-		myRequest
-	} from "../../util/api.js"
-
-	import {
-		isWeixin
-	} from "../../util/isWeixin.js"
-
-	import Search from '../../components/search'
-
-	onLoad(() => {
-		if (isWeixin()) {
-			card_number.value = uni.getStorageSync('bus_card_number')
-		} else {
-			uni.redirectTo({
-				url: "/pages/404/404?message=请在微信客户端打开链接"
-			})
-		}
-	})
-	onShow(() => {
-		getMyData()
-	})
+import { ref } from 'vue'
 
-	onPullDownRefresh(() => {
-		getMyData()
-		setTimeout(function() {
-			uni.stopPullDownRefresh();
-		}, 500);
-	})
+import { onLoad, onShow, onPullDownRefresh } from '@dcloudio/uni-app'
 
-	// 用户card_number
-	const card_number = ref('')
-	// 筛选条件状态列表
-	const typeList = ref(['全部', '预约成功', '已乘车', '候补中', '已取消'])
-	// 筛选条件时间列表
-	const timeList = ref(['全部', '当天', '本周', '本月'])
-	// 预约状态 0:全部 1:预约成功 2:已乘车 3:候补中 4:已取消
-	const result_state = ref(0)
-	// 时间状态 1:全部 2:当天 3:本周 4:本月
-	const date_state = ref(1)
-
-	// 预约记录数据
-	// 1代表成功,2代表已乘车,3代表已分配,4代表候补中,5代表已取消
-	const listData = ref([])
-
-	// 获取用户预约数据
-	const getMyData = async () => {
-		listData.value = []
-		const res = await myRequest({
-			url: '/appqueryUserOrders.action',
-			data: {
-				result_state: result_state.value,
-				date_state: date_state.value,
-				card_number: card_number.value,
-			}
-		})
-		// console.log(res);
-		listData.value = res.data
-	}
+import { myRequest } from '../../util/api.js'
 
-	// 更换车次按钮回调
-	const handleChange = () => {
-		uni.switchTab({
-			url: "/pages/home/home"
-		})
-	}
+import { isWeixin } from '../../util/isWeixin.js'
 
-	// 我已上车按钮回调
-	const handleOnCar = (id) => {
-		uni.showModal({
-			title: '提示',
-			content: '确定已经上车吗？',
-			success: (res) => {
-				if (res.confirm) {
-					handleOnCarRequest(id)
-				} else if (res.cancel) {}
-			}
-		});
-	}
+import Search from '../../components/search'
 
-	// 已上车请求
-	const handleOnCarRequest = async (id) => {
-		const res = await myRequest({
-			url: '/appBoarding.action',
-			data: {
-				card_number: card_number.value,
-				record_id: id
-			}
+onLoad(() => {
+	if (isWeixin()) {
+		card_number.value = uni.getStorageSync('bus_card_number')
+	} else {
+		uni.redirectTo({
+			url: '/pages/404/404?message=请在微信客户端打开链接'
 		})
-		// console.log(res);
-		if (res) {
-			uni.showToast({
-				title: res.message
-			})
-			setTimeout(() => {
-				getMyData()
-			}, 1500)
-		}
 	}
-
-	// 取消预约按钮回调
-	const handleCancel = (id) => {
-		uni.showModal({
-			title: '提示',
-			content: '确定取消预约吗？',
-			success: (res) => {
-				if (res.confirm) {
-					handleCancelRequest(id)
-				} else if (res.cancel) {}
-			}
-		});
+})
+onShow(() => {
+	result_state.value = 0
+	date_state.value = 1
+	getMyData()
+})
+
+onPullDownRefresh(() => {
+	getMyData()
+	setTimeout(function() {
+		uni.stopPullDownRefresh()
+	}, 500)
+})
+
+// 用户card_number
+const card_number = ref('')
+// 筛选条件状态列表
+const typeList = ref([
+	{
+		text: '全部',
+		value: 0
+	},
+	{
+		text: '预约成功',
+		value: 1
+	},
+	{
+		text: '已乘车',
+		value: 2
+	},
+	{
+		text: '候补中',
+		value: 3
+	},
+	{
+		text: '已取消',
+		value: 4
 	}
-	// 取消预约请求
-	const handleCancelRequest = async (id) => {
-		const res = await myRequest({
-			url: '/appcancelOrder.action',
-			data: {
-				card_number: card_number.value,
-				record_id: id
+])
+// 筛选条件时间列表
+const timeList = ref([
+	{
+		text: '全部',
+		value: 0
+	},
+	{
+		text: '当天',
+		value: 1
+	},
+	{
+		text: '本周',
+		value: 2
+	},
+	{
+		text: '本月',
+		value: 3
+	}
+])
+
+// 预约状态 0:全部 1:预约成功 2:已乘车 3:候补中 4:已取消
+const result_state = ref(0)
+// 时间状态 1:全部 2:当天 3:本周 4:本月
+const date_state = ref(1)
+
+// 预约记录数据
+// 1代表成功,2代表已乘车,3代表已分配,4代表候补中,5代表已取消
+const listData = ref([])
+
+// 获取用户预约数据
+const getMyData = async () => {
+	listData.value = []
+	const res = await myRequest({
+		url: '/appqueryUserOrders.action',
+		data: {
+			result_state: result_state.value,
+			date_state: date_state.value,
+			card_number: card_number.value
+		}
+	})
+	// console.log(res);
+	listData.value = res.data
+}
+
+// 更换车次按钮回调
+const handleChange = () => {
+	uni.switchTab({
+		url: '/pages/home/home'
+	})
+}
+
+// 我已上车按钮回调
+const handleOnCar = id => {
+	uni.showModal({
+		title: '提示',
+		content: '确定已经上车吗？',
+		success: res => {
+			if (res.confirm) {
+				handleOnCarRequest(id)
+			} else if (res.cancel) {
 			}
-		})
-		// console.log(res);
-		if (res) {
-			uni.showToast({
-				title: res.message
-			})
-			setTimeout(() => {
-				getMyData()
-			}, 1500)
 		}
+	})
+}
+
+// 已上车请求
+const handleOnCarRequest = async id => {
+	const res = await myRequest({
+		url: '/appBoarding.action',
+		data: {
+			card_number: card_number.value,
+			record_id: id
+		}
+	})
+	// console.log(res);
+	if (res) {
+		uni.showToast({
+			title: res.message
+		})
+		setTimeout(() => {
+			getMyData()
+		}, 1500)
 	}
-
-	// 筛选下拉框确定选择回调
-	const getConveyData = (Obj) => {
-		// console.log(Obj);
-		result_state.value = Obj.typeIndex
-		date_state.value = Obj.timeIndex - 0 + 1
-		getMyData()
+}
+
+// 取消预约按钮回调
+const handleCancel = id => {
+	uni.showModal({
+		title: '提示',
+		content: '确定取消预约吗？',
+		success: res => {
+			if (res.confirm) {
+				handleCancelRequest(id)
+			} else if (res.cancel) {
+			}
+		}
+	})
+}
+// 取消预约请求
+const handleCancelRequest = async id => {
+	const res = await myRequest({
+		url: '/appcancelOrder.action',
+		data: {
+			card_number: card_number.value,
+			record_id: id
+		}
+	})
+	// console.log(res);
+	if (res) {
+		uni.showToast({
+			title: res.message
+		})
+		setTimeout(() => {
+			getMyData()
+		}, 1500)
 	}
+}
+
+// 筛选下拉框确定选择回调
+const getConveyData = Obj => {
+	// console.log(Obj)
+	result_state.value = Obj.typeIndex
+	date_state.value = Obj.timeIndex - 0 + 1
+	getMyData()
+}
 </script>
 
 <style lang="scss" scoped>
-	.container {
-		display: flex;
-		flex-direction: column;
-		background-color: #F2F2F2;
-
-		.list {
-			margin-bottom: 20rpx;
+.container {
+	display: flex;
+	flex-direction: column;
+	background-color: #f2f2f2;
+
+	.list {
+		margin-bottom: 20rpx;
+		font-size: 32rpx;
+		background-color: #fff;
+
+		.list-title {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 0 30rpx;
+			height: 94rpx;
+			font-weight: bold;
 			font-size: 32rpx;
-			background-color: #fff;
+			border-bottom: 1rpx solid #e6e6e6;
 
-			.list-title {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				padding: 0 30rpx;
-				height: 94rpx;
-				font-weight: bold;
-				font-size: 32rpx;
-				border-bottom: 1rpx solid #E6E6E6;
-
-				.list-img {
-					width: 121rpx;
-					height: 34rpx;
-
-					img {
-						// width: 100%;
-						height: 100%;
-					}
-				}
+			.list-img {
+				width: 121rpx;
+				height: 34rpx;
 
-				.mr-30 {
-					margin-right: 30rpx;
+				img {
+					// width: 100%;
+					height: 100%;
 				}
 			}
 
-			.list-info {
-				display: flex;
-				flex-direction: column;
-				justify-content: space-evenly;
-				padding: 0 30rpx;
-				margin-top: 15rpx;
-
-				.list-info-item,
-				.list-info-item2 {
-					line-height: 60rpx;
-					font-size: 28rpx;
-					color: #333333;
-
-					span {
-						display: inline-block;
-						width: 160rpx;
-						text-align-last: justify;
-						color: #999999;
-					}
-				}
-
-				.list-info-item {
-					height: 60rpx;
-				}
+			.mr-30 {
+				margin-right: 30rpx;
 			}
+		}
 
-			.list-button {
-				display: flex;
-				justify-content: flex-end;
-				align-items: center;
+		.list-info {
+			display: flex;
+			flex-direction: column;
+			justify-content: space-evenly;
+			padding: 0 30rpx;
+			margin-top: 15rpx;
+
+			.list-info-item,
+			.list-info-item2 {
+				line-height: 60rpx;
 				font-size: 28rpx;
-				text-align: center;
-
-				.list-button-change {
-					display: flex;
-					justify-content: center;
-					align-items: center;
-					margin: 17rpx 0 40rpx 0;
-					width: 170rpx;
-					height: 70rpx;
-					color: #fff;
-					border-radius: 15rpx;
-					background: linear-gradient(#8684FF, #3C50E8);
-				}
+				color: #333333;
 
-				.list-button-cancel {
-					display: flex;
-					justify-content: center;
-					align-items: center;
-					margin: 17rpx 30rpx 40rpx;
-					width: 170rpx;
-					height: 70rpx;
+				span {
+					display: inline-block;
+					width: 160rpx;
+					text-align-last: justify;
 					color: #999999;
-					border-radius: 15rpx;
-					background-color: #E6E6E6;
 				}
 			}
+
+			.list-info-item {
+				height: 60rpx;
+			}
 		}
 
-		.list-nodata {
-			margin-top: -20rpx;
-			padding-top: 100rpx;
-			background-color: #fff;
+		.list-button {
+			display: flex;
+			justify-content: flex-end;
+			align-items: center;
+			font-size: 28rpx;
 			text-align: center;
-			color: #999999;
 
-			img {
-				width: 600rpx;
+			.list-button-change {
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				margin: 17rpx 0 40rpx 0;
+				width: 170rpx;
+				height: 70rpx;
+				color: #fff;
+				border-radius: 15rpx;
+				background: linear-gradient(#8684ff, #3c50e8);
 			}
+
+			.list-button-cancel {
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				margin: 17rpx 30rpx 40rpx;
+				width: 170rpx;
+				height: 70rpx;
+				color: #999999;
+				border-radius: 15rpx;
+				background-color: #e6e6e6;
+			}
+		}
+	}
+
+	.list-nodata {
+		margin-top: -20rpx;
+		padding-top: 100rpx;
+		background-color: #fff;
+		text-align: center;
+		color: #999999;
+
+		img {
+			width: 600rpx;
 		}
 	}
-</style>
+}
+</style>

pages/record/record.vue

@@ -4,206 +4,234 @@
 		<Search :typeList="typeList" :timeList="timeList" @handLeConveyData="getConveyData" />
 
 		<!-- 列表区域 -->
-		<view class="list" v-for="(item,index) in listData" :key="index" @click="handleLookDetail(item)">
+		<view class="list" v-for="(item, index) in listData" :key="index" @click="handleLookDetail(item)">
 			<view class="list-title">
-				<view class="title-number">
-					车牌：{{item.car_number!=0?item.car_number:'无'}}
-				</view>
-				<view class="title-icon">
-					<img src="../../static/right.png">
-				</view>
+				<view class="title-number">车牌：{{ item.car_number != 0 ? item.car_number : '无' }}</view>
+				<view class="title-icon"><img src="../../static/right.png" /></view>
 			</view>
 			<view class="list-item">
 				状态：
-				<span :class="item.state_str=='预约进行中'||item.state_str=='候补中'?'list-item-type':''">{{item.state_str}}
-				</span>
+				<span :class="item.state_str == '预约进行中' || item.state_str == '候补中' ? 'list-item-type' : ''">{{ item.state_str }}</span>
 			</view>
 			<view class="list-item">
-				发车日期：<span>{{item.yy_date}}</span>
+				发车日期：
+				<span>{{ item.yy_date }}</span>
 			</view>
-			<view class="list-item" v-if="item.state_str=='预约进行中'||item.state_str=='已截止'">
-				发车时间：<span>{{item.ci_time}}</span>
+			<view class="list-item" v-if="item.state_str == '预约进行中' || item.state_str == '已截止'">
+				发车时间：
+				<span>{{ item.ci_time != 0 ? item.ci_time : '' }}</span>
 			</view>
 			<view class="list-item">
-				线路：<span>{{item.route}}</span>
+				扫码时间：
+				<span>{{ item.sm_start + '-' + item.sm_end }}</span>
 			</view>
 			<view class="list-item">
-				终点：<span>{{item.route_end}}</span>
+				线路：
+				<span>{{ item.route }}</span>
+			</view>
+			<view class="list-item">
+				终点：
+				<span>{{ item.route_end }}</span>
 			</view>
 			<view class="list-item">
 				人数：
-				<view class="list-item-progress" v-if="item.state_str=='预约进行中'||item.state_str=='已截止'">
-					<progress activeColor="#3C50E8" stroke-width="9" :percent="item.percent?item.percent:0" />
+				<view class="list-item-progress" v-if="item.state_str == '预约进行中' || item.state_str == '已截止'">
+					<progress activeColor="#3C50E8" stroke-width="9" :percent="item.percent ? item.percent : 0" />
 				</view>
-				<span v-if="item.state_str=='预约进行中'||item.state_str=='已截止'">{{item.user_num+'/'+item.contain}}</span>
-				<span v-else>{{item.contain}}</span>
+				<span v-if="item.state_str == '预约进行中' || item.state_str == '已截止'">{{ item.user_num + '/' + item.contain }}</span>
+				<span v-else>{{ item.contain }}</span>
 			</view>
 		</view>
 
 		<!-- 无数据时展示的区域 -->
-		<view class="list-nodata" v-if="listData.length ==0">
-			<img src="../../static/no-bus.png">
-			<view>
-				暂无数据
-			</view>
+		<view class="list-nodata" v-if="listData.length == 0">
+			<img src="../../static/no-bus.png" />
+			<view>暂无数据</view>
 		</view>
-
 	</view>
 </template>
 
 <script setup>
-	import {
-		ref
-	} from "vue"
-
-	import {
-		onLoad,
-		onPullDownRefresh
-	} from "@dcloudio/uni-app"
-
-	import {
-		myRequest
-	} from "../../util/api.js"
-
-	import {
-		isWeixin
-	} from "../../util/isWeixin.js"
-
-	import Search from '../../components/search'
-
-	onLoad(() => {
-		if (isWeixin()) {
-			getData()
-		} else {
-			uni.redirectTo({
-				url: "/pages/404/404?message=请在微信客户端打开链接"
-			})
-		}
-	})
+import { ref } from 'vue'
+
+import { onLoad, onPullDownRefresh } from '@dcloudio/uni-app'
 
-	onPullDownRefresh(() => {
+import { myRequest } from '../../util/api.js'
+
+import { isWeixin } from '../../util/isWeixin.js'
+
+import Search from '../../components/search'
+
+onLoad(() => {
+	if (isWeixin()) {
 		getData()
-		setTimeout(function() {
-			uni.stopPullDownRefresh()
-		}, 500)
-	})
-	// 预约状态数组
-	const typeList = ref(['全部', '预约进行中', '已截止', '已分配', '候补中'])
-	// 时间状态数组
-	const timeList = ref(['全部', '今天', '明天'])
-	// 时间状态  全部：1  今天：2  明天：3
-	const date_state = ref(1)
-	// 预约状态  全部：0  预约进行中：1  已截止：2  已分配：3   候补中：4
-	const result_state = ref(0)
-
-	// 预约记录数据
-	const listData = ref([])
-
-	// 获取预约记录数据
-	const getData = async () => {
-		const res = await myRequest({
-			url: '/appcarCaptainManage.action',
-			data: {
-				date_state: date_state.value,
-				result_state: result_state.value,
-			}
+	} else {
+		uni.redirectTo({
+			url: '/pages/404/404?message=请在微信客户端打开链接'
 		})
-		// console.log(res.data);
-		if (res.data.length) {
-			res.data.forEach((item) => {
-				item.percent = Math.ceil(parseInt(item.user_num) / parseInt(item.contain))
-			})
-		}
-		listData.value = res.data
 	}
-
-	// 点击每一条记录回调
-	const handleLookDetail = (item) => {
-		const info = JSON.stringify(item)
-		uni.navigateTo({
-			url: `/pages/detail/detail?info=${info}`
-		})
+})
+
+onPullDownRefresh(() => {
+	getData()
+	setTimeout(function() {
+		uni.stopPullDownRefresh()
+	}, 500)
+})
+
+// 预约状态数组
+const typeList = ref([
+	{
+		text: '全部',
+		value: 0
+	},
+	{
+		text: '预约进行中',
+		value: 1
+	},
+	{
+		text: '已截止',
+		value: 2
+	},
+	{
+		text: '已分配',
+		value: 3
+	},
+	{
+		text: '候补中',
+		value: 4
 	}
-	// 条件筛选框选择回调
-	const getConveyData = (Obj) => {
-		date_state.value = Obj.timeIndex - 0 + 1
-		result_state.value = Obj.typeIndex
-		getData()
+])
+// 时间状态数组
+const timeList = ref([
+	{
+		text: '全部',
+		value: 0
+	},
+	{
+		text: '今天',
+		value: 1
+	},
+	{
+		text: '明天',
+		value: 2
+	}
+])
+
+// 时间状态  全部：1  今天：2  明天：3
+const date_state = ref(1)
+// 预约状态  全部：0  预约进行中：1  已截止：2  已分配：3   候补中：4
+const result_state = ref(0)
+
+// 预约记录数据
+const listData = ref([])
+
+// 获取预约记录数据
+const getData = async () => {
+	const res = await myRequest({
+		url: '/appcarCaptainManage.action',
+		data: {
+			date_state: date_state.value,
+			result_state: result_state.value
+		}
+	})
+	// console.log(res.data);
+	if (res.data.length) {
+		res.data.forEach(item => {
+			item.percent = Math.ceil((parseInt(item.user_num) / parseInt(item.contain)) * 100)
+		})
 	}
+	listData.value = res.data
+}
+
+// 点击每一条记录回调
+const handleLookDetail = item => {
+	const info = JSON.stringify(item)
+	uni.navigateTo({
+		url: `/pages/detail/detail?info=${info}`
+	})
+}
+
+// 条件筛选框选择回调
+const getConveyData = Obj => {
+	date_state.value = Obj.timeIndex - 0 + 1
+	result_state.value = Obj.typeIndex
+	getData()
+}
 </script>
 
 <style lang="scss" scoped>
-	.container {
-		background-color: #F2F2F2;
-
-		.list {
+.container {
+	background-color: #f2f2f2;
+
+	.list {
+		margin-bottom: 20rpx;
+		padding-bottom: 24rpx;
+		background-color: #fff;
+
+		.list-title {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 0 30rpx;
 			margin-bottom: 20rpx;
-			padding-bottom: 24rpx;
-			background-color: #fff;
-
-			.list-title {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				padding: 0 30rpx;
-				margin-bottom: 20rpx;
-				height: 94rpx;
-				font-size: 32rpx;
-				font-weight: bold;
-				border-bottom: 1rpx solid #E6E6E6;
-
-				.title-icon {
-					margin-top: -20rpx;
-					width: 15rpx;
-					height: 25rpx;
-
-					img {
-						width: 100%;
-						height: 100%;
-					}
+			height: 94rpx;
+			font-size: 32rpx;
+			font-weight: bold;
+			border-bottom: 1rpx solid #e6e6e6;
+
+			.title-icon {
+				margin-top: -20rpx;
+				width: 15rpx;
+				height: 25rpx;
+
+				img {
+					width: 100%;
+					height: 100%;
 				}
 			}
+		}
 
-			.list-item {
-				display: flex;
-				align-items: center;
-				padding: 0 30rpx;
-				margin-bottom: 14rpx;
+		.list-item {
+			display: flex;
+			align-items: center;
+			padding: 0 30rpx;
+			margin-bottom: 14rpx;
 
-				color: #999999;
-				font-size: 28rpx;
+			color: #999999;
+			font-size: 28rpx;
 
-				span {
-					color: #333333;
-				}
+			span {
+				color: #333333;
+			}
 
-				.list-item-type {
-					color: #00BAAD;
-				}
+			.list-item-type {
+				color: #00baad;
+			}
 
-				.list-item-progress {
-					margin-right: 36rpx;
-					width: 437rpx;
-					height: 22rpx;
+			.list-item-progress {
+				margin-right: 36rpx;
+				width: 437rpx;
+				height: 22rpx;
 
-					:deep(.uni-progress-bar),
-					:deep(.uni-progress-inner-bar) {
-						border-radius: 85rpx;
-					}
+				:deep(.uni-progress-bar),
+				:deep(.uni-progress-inner-bar) {
+					border-radius: 85rpx;
 				}
 			}
 		}
+	}
 
-		.list-nodata {
-			margin-top: -20rpx;
-			padding-top: 100rpx;
-			background-color: #fff;
-			text-align: center;
-			color: #999999;
+	.list-nodata {
+		margin-top: -20rpx;
+		padding-top: 100rpx;
+		background-color: #fff;
+		text-align: center;
+		color: #999999;
 
-			img {
-				width: 600rpx;
-			}
+		img {
+			width: 600rpx;
 		}
 	}
-</style>
+}
+</style>

unpackage/dist/build/h5/assets/uni-app.es.18e68793.js

@@ -1 +0,0 @@
-import{L as s,M as a,O as o,N as r,P as n,Q as t,R as e}from"./index-220b8b44.js";function i(s,a){return t(s)?a:s}const c=o=>(r,n=a())=>{!e&&s(o,r,n)},f=c(o),m=c(r),p=c(n);export{f as a,p as b,m as o,i as r};

unpackage/dist/build/h5/assets/uni-app.es.fb9b0d80.js

@@ -0,0 +1 @@
+import{a5 as a,a6 as s,a7 as o,a8 as r,a9 as n,aa as t,ab as e}from"./index-c03fdd25.js";function i(a,s){return t(a)?s:a}const b=o=>(r,n=s())=>{!e&&a(o,r,n)},c=b(o),f=b(r),m=b(n);export{c as a,m as b,f as o,i as r};

unpackage/dist/build/h5/index.html

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <link rel="stylesheet" href="/carstop/dist5/assets/uni.545a1a57.css">
+    <link rel="stylesheet" href="/carstop/dist5/assets/uni.956a6ead.css">
 
     <meta charset="UTF-8" />
     <script>
@@ -14,7 +14,7 @@
     <title>校车预约</title>
     <!--preload-links-->
     <!--app-context-->
-    <script type="module" crossorigin src="/carstop/dist5/assets/index-220b8b44.js"></script>
+    <script type="module" crossorigin src="/carstop/dist5/assets/index-c03fdd25.js"></script>
     <link rel="stylesheet" href="/carstop/dist5/assets/index-88c6c4d6.css">
   </head>
   <body>

util/formatTime.js

@@ -0,0 +1,9 @@
+export const time_to_sec = (time) => {
+	if (time) {
+		let s = ''
+		let hour = time.split(':')[0]
+		let min = time.split(':')[1]
+		s = Number(hour * 3600) + Number(min * 60)
+		return s
+	}
+}