diff --git a/.gitignore b/.gitignore
index 62d68fe..6828190 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,4 +2,5 @@
 /dist
 package-lock.json
 /unpackage
-/unpackage/dist
\ No newline at end of file
+/unpackage/dist
+/doc
\ No newline at end of file
diff --git a/components/LocationListSheet.vue b/components/LocationListSheet.vue
new file mode 100644
index 0000000..8160253
--- /dev/null
+++ b/components/LocationListSheet.vue
@@ -0,0 +1,234 @@
+<template>
+	<view class="location-popup" v-if="show">
+		<view class="popup-mask" @click="$emit('close')"></view>
+		<view class="location-sheet" :class="{ 'expanded': expanded }">
+			<view class="sheet-header">
+				<text class="sheet-title">{{ title }} ({{ positions.length }})</text>
+				<view class="close-btn" @click="$emit('close')">
+					<uv-icon name="close"></uv-icon>
+				</view>
+			</view>
+
+			<view class="sheet-content">
+				<view class="position-item" v-for="(item, index) in positions" :key="item.positionId || index"
+					@click="$emit('select', item)">
+					<view class="position-info">
+						<view class="position-name">{{ item.name }}</view>
+						<view class="tag-row">
+							<view class="status-tag rent" v-if="isRentable(item)"><text>可租借</text></view>
+							<view class="status-tag return" v-if="isReturnable(item)"><text>可归还</text></view>
+						</view>
+						<view class="position-time" v-if="item.workTime && item.workTime !== '0'"><text>营业时间：{{ item.workTime }}</text>
+						</view>
+					</view>
+					<view class="position-actions">
+						<view class="distance-info" v-if="item.distance"><text>{{ item.distance }}</text></view>
+						<view class="nav-btn" @click.stop="$emit('navigate', item)"><text>导航</text></view>
+					</view>
+				</view>
+
+				<view class="empty-state" v-if="!isLoading && (!positions || positions.length === 0)">
+					<image class="empty-icon" src="/static/scan-icon.png" mode="aspectFit" />
+					<text class="empty-text">附近暂无设备</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { computed } from 'vue'
+
+	const props = defineProps({
+		show: { type: Boolean, default: false },
+		expanded: { type: Boolean, default: false },
+		positions: { type: Array, default: () => [] },
+		isLoading: { type: Boolean, default: false },
+		title: { type: String, default: '附近设备场地' }
+	})
+
+	const isRentable = (item) => {
+		// 兼容多种标识字段
+		if (typeof item?.canRent !== 'undefined') return !!item.canRent
+		return String(item?.status || '').toLowerCase() === 'online'
+	}
+
+	const isReturnable = (item) => {
+		if (typeof item?.canReturn !== 'undefined') return !!item.canReturn
+		return String(item?.status || '').toLowerCase() === 'online'
+	}
+</script>
+
+<style lang="scss" scoped>
+	.location-popup {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		z-index: 2000;
+		display: flex;
+		align-items: flex-end;
+		justify-content: center;
+
+		.popup-mask {
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			background: rgba(0, 0, 0, 0.5);
+		}
+
+		.location-sheet {
+			background: #ffffff;
+			border-radius: 32rpx 32rpx 0 0;
+			box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.1);
+			max-height: 78vh;
+			transition: all 0.3s ease;
+			z-index: 1;
+			position: relative;
+			width: 100%;
+			display: flex;
+			flex-direction: column;
+			animation: slideUp 0.3s ease-out;
+
+			&.expanded {
+				max-height: 88vh;
+			}
+
+			.sheet-header {
+				padding: 20rpx 30rpx;
+				border-bottom: 1px solid #f0f0f0;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				.sheet-title {
+					font-size: 32rpx;
+					font-weight: 600;
+					color: #333;
+				}
+
+				.close-btn {
+					width: 60rpx;
+					height: 60rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					background: #f0f0f0;
+					border-radius: 50%;
+					transition: all 0.2s ease;
+
+					&:active {
+						background: #e0e0e0;
+						transform: scale(0.95);
+					}
+				}
+			}
+
+			.sheet-content {
+				padding: 12rpx 0;
+				height: 64vh;
+				overflow: auto;
+			}
+		}
+	}
+
+	@keyframes slideUp {
+		from {
+			transform: translateY(100%);
+		}
+
+		to {
+			transform: translateY(0);
+		}
+	}
+
+	.position-item {
+		display: flex;
+		align-items: center;
+		padding: 24rpx 30rpx;
+		border-bottom: 1px solid #f8f9fa;
+
+		.position-info {
+			flex: 1;
+
+			.position-name {
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #333;
+				margin-bottom: 8rpx;
+			}
+
+			.tag-row {
+				display: flex;
+				gap: 12rpx;
+				margin-bottom: 8rpx;
+
+				.status-tag {
+					padding: 8rpx 16rpx;
+					border-radius: 20rpx;
+					font-size: 22rpx;
+
+					&.rent {
+						background: #e8f5e8;
+						color: #4caf50;
+					}
+
+					&.return {
+						background: #e8f2ff;
+						color: #3578e5;
+					}
+				}
+			}
+
+			.position-time {
+				font-size: 24rpx;
+				color: #999;
+			}
+		}
+
+		.position-actions {
+			display: flex;
+			flex-direction: column;
+			align-items: flex-end;
+			gap: 8rpx;
+
+			.distance-info {
+				font-size: 24rpx;
+				color: #2196F3;
+				font-weight: 500;
+			}
+
+			.nav-btn {
+				padding: 12rpx 20rpx;
+				background: #2196F3;
+				border-radius: 20rpx;
+				font-size: 24rpx;
+				color: #ffffff;
+			}
+		}
+	}
+
+	.empty-state {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		padding: 60rpx 0;
+
+		.empty-icon {
+			width: 120rpx;
+			height: 120rpx;
+			margin-bottom: 24rpx;
+			opacity: 0.5;
+		}
+
+		.empty-text {
+			font-size: 28rpx;
+			color: #999;
+		}
+	}
+</style>
+
diff --git a/components/MapComponent.vue b/components/MapComponent.vue
index 063a973..f588f3b 100644
--- a/components/MapComponent.vue
+++ b/components/MapComponent.vue
@@ -3,11 +3,13 @@
 		<!-- 地图容器 -->
 		<view class="map-wrapper">
 			<!-- 使用小程序原生地图组件 -->
-            <map id="map" class="native-map" :longitude="mapCenter.longitude" :latitude="mapCenter.latitude"
+			<map id="map" class="native-map" :longitude="mapCenter.longitude" :latitude="mapCenter.latitude"
 				:markers="mapMarkers" :scale="mapZoom" :show-location="true" @regionchange="onMapRegionChange"
-				@markertap="onMapMarkerTap" @callouttap="onCalloutTap" @updated="onMapUpdated"
-				@error="onMapError">
+				@markertap="onMapMarkerTap" @callouttap="onCalloutTap" @updated="onMapUpdated" @error="onMapError">
 				<!-- 覆盖在地图上的可点击控件（使用 cover-view 以兼容小程序原生组件层级） -->
+				<cover-view class="index-swiper">
+					<image src="/static/index_swiper.png" class="index-swiper" mode="aspectFit"></image>
+				</cover-view>
 				<cover-view class="map-side-controls">
 					<cover-view class="side-btn service" @tap="handleService">
 						<cover-image class="side-icon" src="/static/customer-service.png"></cover-image>
@@ -22,11 +24,9 @@
 						<!-- <cover-view class="side-text">定位</cover-view> -->
 					</cover-view>
 				</cover-view>
-                <!-- 使用原生 marker 方案渲染中心指示，随 regionchange 同步到地图中心 -->
+				<!-- 使用原生 marker 方案渲染中心指示，随 regionchange 同步到地图中心 -->
 			</map>
 
-
-
 			<!-- 地图加载状态 -->
 			<view class="map-loading" v-if="isLoading">
 				<view class="loading-content">
@@ -39,15 +39,15 @@
 </template>
 
 <script setup>
-import {
-    ref,
-    computed,
-    watch,
-    onMounted,
-    onUnmounted,
-    nextTick,
-    getCurrentInstance
-} from 'vue'
+	import {
+		ref,
+		computed,
+		watch,
+		onMounted,
+		onUnmounted,
+		nextTick,
+		getCurrentInstance
+	} from 'vue'
 	// 导入地图工具函数
 	import {
 		calculateDistanceSync
@@ -76,7 +76,7 @@ import {
 	])
 
 	// Props
-    const props = defineProps({
+	const props = defineProps({
 		userLocation: {
 			type: Object,
 			default: null
@@ -92,15 +92,15 @@ import {
 		searchKeyword: {
 			type: String,
 			default: ''
-        },
-        noticeText: {
-            type: String,
-            default: ''
-        },
-        enableMarkers: {
-            type: Boolean,
-            default: false
-        }
+		},
+		noticeText: {
+			type: String,
+			default: ''
+		},
+		enableMarkers: {
+			type: Boolean,
+			default: false
+		}
 	})
 
 	// Emits
@@ -123,73 +123,79 @@ import {
 	const mapContext = ref(null) // 地图上下文
 
 	// 方法
-    const updateMapMarkers = () => {
-        const markers = []
-        // 中心 marker（始终存在，使用传入中心坐标或 userLocation）
-        const centerLng = Number(mapCenter.value.longitude || (props.userLocation && props.userLocation.longitude))
-        const centerLat = Number(mapCenter.value.latitude || (props.userLocation && props.userLocation.latitude))
-        if (!isNaN(centerLng) && !isNaN(centerLat)) {
-            markers.push({
-                id: 999999, // 固定 id 作为中心点
-                latitude: centerLat,
-                longitude: centerLng,
-                iconPath: '/static/location-icon.png',
-                width: 30,
-                height: 40,
-                anchor: { x: 0.5, y: 1 } // 图钉尖端对准坐标
-            })
-        }
+	const updateMapMarkers = () => {
+		const markers = []
+		// 中心 marker（始终存在，使用传入中心坐标或 userLocation）
+		const centerLng = Number(mapCenter.value.longitude || (props.userLocation && props.userLocation.longitude))
+		const centerLat = Number(mapCenter.value.latitude || (props.userLocation && props.userLocation.latitude))
+		if (!isNaN(centerLng) && !isNaN(centerLat)) {
+			markers.push({
+				id: 999999, // 固定 id 作为中心点
+				latitude: centerLat,
+				longitude: centerLng,
+				iconPath: '/static/location-icon.png',
+				width: 30,
+				height: 40,
+				anchor: {
+					x: 0.5,
+					y: 1
+				} // 图钉尖端对准坐标
+			})
+		}
 
-        // 可选：周边位置点
-        if (props.enableMarkers && props.filteredPositions && props.filteredPositions.length > 0) {
-            props.filteredPositions.forEach((pos, index) => {
-                if (pos.longitude && pos.latitude) {
-                    const lat = parseFloat(pos.latitude)
-                    const lng = parseFloat(pos.longitude)
-                    if (lat >= -90 && lat <= 90 && lng >= -180 && lng <= 180) {
-                        markers.push({
-                            id: index + 1,
-                            latitude: lat,
-                            longitude: lng,
-                            width: 24,
-                            height: 24,
-                            title: pos.name
-                        })
-                    }
-                }
-            })
-        }
+		// 可选：周边位置点
+		if (props.enableMarkers && props.filteredPositions && props.filteredPositions.length > 0) {
+			props.filteredPositions.forEach((pos, index) => {
+				if (pos.longitude && pos.latitude) {
+					const lat = parseFloat(pos.latitude)
+					const lng = parseFloat(pos.longitude)
+					if (lat >= -90 && lat <= 90 && lng >= -180 && lng <= 180) {
+						markers.push({
+							id: index + 1,
+							latitude: lat,
+							longitude: lng,
+							width: 24,
+							height: 24,
+							title: pos.name
+						})
+					}
+				}
+			})
+		}
 
-        mapMarkers.value = markers
-        isLoading.value = false
-    }
+		mapMarkers.value = markers
+		isLoading.value = false
+	}
 
-// 移动地图到指定位置（使用 includePoints 以避免 mapid 错误，并兼容不同基础库）
-const moveToLocation = (location) => {
-    if (!location || !location.longitude || !location.latitude) return
-    if (!mapContext.value) return
+	// 移动地图到指定位置（使用 includePoints 以避免 mapid 错误，并兼容不同基础库）
+	const moveToLocation = (location) => {
+		if (!location || !location.longitude || !location.latitude) return
+		if (!mapContext.value) return
 
-    try {
-        mapContext.value.includePoints({
-            points: [{ longitude: Number(location.longitude), latitude: Number(location.latitude) }],
-            padding: [60, 60, 60, 60],
-            success: () => {
-                console.log('地图已移动到指定位置(includePoints)')
-            },
-            fail: (err) => {
-                console.warn('includePoints 失败，尝试 moveToLocation():', err)
-                // 回退尝试（不传参，部分基础库仅支持移动到用户当前位置）
-                try {
-                    mapContext.value.moveToLocation()
-                } catch (e) {
-                    console.error('moveToLocation 回退失败:', e)
-                }
-            }
-        })
-    } catch (e) {
-        console.error('移动地图异常:', e)
-    }
-}
+		try {
+			mapContext.value.includePoints({
+				points: [{
+					longitude: Number(location.longitude),
+					latitude: Number(location.latitude)
+				}],
+				padding: [60, 60, 60, 60],
+				success: () => {
+					console.log('地图已移动到指定位置(includePoints)')
+				},
+				fail: (err) => {
+					console.warn('includePoints 失败，尝试 moveToLocation():', err)
+					// 回退尝试（不传参，部分基础库仅支持移动到用户当前位置）
+					try {
+						mapContext.value.moveToLocation()
+					} catch (e) {
+						console.error('moveToLocation 回退失败:', e)
+					}
+				}
+			})
+		} catch (e) {
+			console.error('移动地图异常:', e)
+		}
+	}
 
 	// 监听用户位置变化
 	watch(() => props.userLocation, (newLocation) => {
@@ -219,26 +225,26 @@ const moveToLocation = (location) => {
 	}
 
 	// 地图区域变化事件
-    const onMapRegionChange = (e) => {
-        // 在手势或缩放结束时更新中心坐标
-        if (e && e.type === 'end') {
-            if (mapContext.value) {
-                mapContext.value.getCenterLocation({
-                    success: (res) => {
-                        if (res && res.longitude && res.latitude) {
-                            mapCenter.value = {
-                                longitude: res.longitude,
-                                latitude: res.latitude
-                            }
-                            // 更新中心 marker 位置
-                            updateMapMarkers()
-                            emit('mapCenterChange', mapCenter.value)
-                        }
-                    }
-                })
-            }
-        }
-    }
+	const onMapRegionChange = (e) => {
+		// 在手势或缩放结束时更新中心坐标
+		if (e && e.type === 'end') {
+			if (mapContext.value) {
+				mapContext.value.getCenterLocation({
+					success: (res) => {
+						if (res && res.longitude && res.latitude) {
+							mapCenter.value = {
+								longitude: res.longitude,
+								latitude: res.latitude
+							}
+							// 更新中心 marker 位置
+							updateMapMarkers()
+							emit('mapCenterChange', mapCenter.value)
+						}
+					}
+				})
+			}
+		}
+	}
 
 	// 标记点点击事件
 	const onMapMarkerTap = (e) => {
@@ -276,55 +282,23 @@ const moveToLocation = (location) => {
 		isLoading.value = false
 	}
 
-const handleRelocate = () => {
-    // 直接委托父级处理定位并移动地图，避免内部重复弹 loading
-    try {
-        emit('relocate')
-    } catch (e) {}
-}
-
-	const handleSearch = () => {
-		// 选择位置后移动地图并通知父组件刷新附近列表（增强容错与平台兼容）
-		const onSuccess = (res) => {
-			try {
-				const lng = Number(res.longitude)
-				const lat = Number(res.latitude)
-				if (!isNaN(lng) && !isNaN(lat)) {
-					const center = { longitude: lng, latitude: lat }
-					moveToLocation(center)
-					emit('mapCenterChange', center)
-				} else {
-					uni.showToast({ title: '无效的坐标', icon: 'none' })
-				}
-			} catch (e) {
-				console.error('处理选择位置结果异常:', e)
-			}
-		}
-		const onFail = (err) => {
-			console.error('chooseLocation 失败:', err)
-			// 授权被拒时引导开启
-			if (err && (String(err.errMsg || '').includes('auth') || String(err.errMsg || '').includes('deny'))) {
-				// #ifdef MP-WEIXIN
-				wx.openSetting && wx.openSetting({})
-				// #endif
-			}
-			// uni.showToast({ title: '无法打开选择位置', icon: 'none' })
-		}
-		// #ifdef MP-WEIXIN
-		if (typeof wx !== 'undefined' && wx.chooseLocation) {
-			wx.chooseLocation({ success: onSuccess, fail: onFail })
-			return
-		}
-		// #endif
-		if (uni && typeof uni.chooseLocation === 'function') {
-			uni.chooseLocation({ success: onSuccess, fail: onFail })
-		} else {
-			uni.showToast({ title: '当前环境不支持选择位置', icon: 'none' })
-		}
+	const handleRelocate = () => {
+		// 直接委托父级处理定位并移动地图，避免内部重复弹 loading
+		try {
+			emit('relocate')
+		} catch (e) {}
 	}
 
+const handleSearch = () => {
+	try {
+		uni.navigateTo({ url: '/pages/search/index' })
+	} catch (e) {}
+}
+
 	const handleService = () => {
-		uni.navigateTo({ url: '/pages/help/index' })
+		uni.navigateTo({
+			url: '/pages/help/index'
+		})
 	}
 
 	const handleScan = () => {
@@ -336,26 +310,26 @@ const handleRelocate = () => {
 	}
 
 	// 生命周期钩子
-onMounted(() => {
-    // 初始化地图上下文
-    nextTick(() => {
-        // 需要使用nextTick确保地图组件已经渲染
-        const inst = getCurrentInstance()
-        const vm = (inst && (inst.proxy || inst)) || undefined
-        try {
-            mapContext.value = uni.createMapContext('map', vm)
-        } catch (e) {
-            // 兼容：如果第二参不被支持，退回单参
-            mapContext.value = uni.createMapContext('map')
-        }
-        updateMapMarkers()
+	onMounted(() => {
+		// 初始化地图上下文
+		nextTick(() => {
+			// 需要使用nextTick确保地图组件已经渲染
+			const inst = getCurrentInstance()
+			const vm = (inst && (inst.proxy || inst)) || undefined
+			try {
+				mapContext.value = uni.createMapContext('map', vm)
+			} catch (e) {
+				// 兼容：如果第二参不被支持，退回单参
+				mapContext.value = uni.createMapContext('map')
+			}
+			updateMapMarkers()
 
-        // 初始化折叠面板
-        if (collapseRef.value) {
-            collapseRef.value.init()
-        }
-    })
-})
+			// 初始化折叠面板
+			if (collapseRef.value) {
+				collapseRef.value.init()
+			}
+		})
+	})
 
 	onUnmounted(() => {
 		// 清理工作
@@ -447,7 +421,7 @@ onMounted(() => {
 				}
 			}
 		}
-		
+
 		/* 地图中心图钉（cover-view，避免使用 transform 以兼容小程序） */
 		.center-pin {
 			position: absolute;
@@ -479,7 +453,7 @@ onMounted(() => {
 
 		.map-side-controls {
 			position: absolute;
-			left: 20rpx;
+			right: 20rpx;
 			bottom: 20rpx;
 			display: flex;
 			flex-direction: column;
@@ -492,7 +466,7 @@ onMounted(() => {
 			.side-btn {
 				// min-width: 160rpx;
 				margin: auto;
-				height: 72rpx;
+				// height: 72rpx;
 				background: rgba(255, 255, 255, 0.96);
 				border-radius: 36rpx;
 				display: inline-flex;
@@ -500,7 +474,7 @@ onMounted(() => {
 				align-items: center;
 				justify-content: center;
 				box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.12);
-				padding: 0 18rpx;
+				padding: 20rpx;
 				border: 2rpx solid #e0e0e0;
 
 				&:active {
@@ -514,40 +488,9 @@ onMounted(() => {
 					font-weight: 500;
 				}
 
-				&.search {
-					border-color: #07c160;
-				}
-			}
-		}
-
-		/* 展示用图标列（与 cover-view 对齐） */
-		.map-side-icons {
-			position: absolute;
-			left: 20rpx;
-			bottom: 20rpx;
-			display: flex;
-			flex-direction: column;
-			gap: 12rpx;
-
-			.side-btn {
-				min-width: 160rpx;
-				height: 72rpx;
-				background: rgba(255, 255, 255, 0.96);
-				border-radius: 36rpx;
-				display: inline-flex;
-				flex-direction: row;
-				align-items: center;
-				justify-content: center;
-				box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.12);
-				padding: 0 18rpx;
-				border: 2rpx solid #e0e0e0;
-
-				.label {
-					margin-left: 8rpx;
-					font-size: 26rpx;
-					color: #333;
-					font-weight: 500;
-				}
+				// &.search {
+				// 	border-color: #07c160;
+				// }
 			}
 		}
 	}
@@ -562,9 +505,20 @@ onMounted(() => {
 		}
 	}
 
-	.side-icon{
-		width: 32rpx;
-		height: 32rpx;
+	.side-icon {
+		width: 44rpx;
+		height: 44rpx;
+	}
+
+	.index-swiper {
+		width: 92vw;
+		height: 180rpx;
+		border-radius: 20rpx;
+		z-index: 1000;
+		position: absolute;
+		top: 0;
+		left: 50%;
+		transform: translateX(-50%);
+		right: 0;
 	}
-	
 </style>
\ No newline at end of file
diff --git a/components/OrderItemCard.vue b/components/OrderItemCard.vue
new file mode 100644
index 0000000..ff79657
--- /dev/null
+++ b/components/OrderItemCard.vue
@@ -0,0 +1,364 @@
+<template>
+	<view class="order-item" >
+		<!-- 订单头部信息 -->
+		<view class="order-header">
+			<view class="header-left">
+				<view class="status-chip" :class="statusChipClass"><text class="chip-text">{{ statusText }}</text></view>
+				<view class="title">{{ titleText }}</view>
+			</view>
+			<view class="header-right">
+				<!-- 支付方式标识（移到头部右侧） -->
+				<view class="payment-badge wx-score" v-if="order.payWay == 'wx_score_pay'">
+					<image src="/static/images/wxpayflag.png" mode="aspectFit" class="badge-icon"></image>
+					<view class="badge-text">
+						<text>微信支付分</text>
+						<text class="divider">|</text>
+						<text class="highlight">免押租借</text>
+					</view>
+				</view>
+				<view class="payment-badge member" v-else-if="order.payWay == 'wx_member_pay'">
+					<text class="badge-text">会员订单</text>
+				</view>
+				<view class="payment-badge deposit" v-else>
+					<text class="badge-text">微信支付</text>
+					<text class="divider">|</text>
+					<text class="badge-text">押金租借</text>
+				</view>
+			</view>
+		</view>
+
+		<!-- 订单内容 -->
+		<view class="order-body" @click="onDetails">
+			<!-- <view class="device-info">
+				<view class="device-left">
+					<view class="device-name">{{ titleText }}</view>
+					<view class="device-id">设备号：{{ order.deviceId }}</view>
+				</view>
+			</view> -->
+
+			<!-- 订单时间信息 -->
+			<view class="order-times">
+				<view class="time-row">
+					<text class="time-label">租借地点：</text>
+					<text class="time-value">{{ order.deviceName || order.positionName }}</text>
+				</view>
+				<view class="time-row">
+					<text class="time-label">租借时间：</text>
+					<text class="time-value">{{ order.startTime }}</text>
+				</view>
+				<view class="arrow" @click="onDetails">
+					<uv-icon name="arrow-right" size="24rpx" color="#999"></uv-icon>
+				</view>
+				<!-- <view class="time-row">
+					<text class="time-label">结束时间：</text>
+					<text class="time-value">{{ order.endTime || '-' }}</text>
+				</view> -->
+			</view>
+		</view>
+
+		<!-- 订单底部 -->
+		<view class="order-footer">
+			<view class="footer-left">
+				<view v-if="isInUse" class="renting"><text class="dot"></text>租借中</view>
+				<view v-else-if="isFinished" class="meta">
+					<view class="meta-item"><text class="dot"></text>{{ usedDurationText }}</view>
+					<view class="meta-item"><text class="currency">￥</text>{{ displayAmount }}</view>
+				</view>
+			</view>
+
+			<view class="actions">
+				<!-- 待支付状态显示支付和取消按钮 -->
+				<view v-if="isWaitingForPayment" class="action-item primary" @click="onPay">立即支付</view>
+				<view v-if="isWaitingForPayment" class="action-item secondary" @click="onCancel">取消订单</view>
+				<!-- 使用中状态显示归还设备按钮 -->
+				<view v-if="isInUse" class="action-item primary" @click="onReturn">快速归还</view>
+				<!-- 查看详情按钮对所有订单都显示 -->
+				<!-- <view class="action-item secondary" >查看详情</view> -->
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { computed } from 'vue';
+
+	const props = defineProps({
+		order: { type: Object, required: true },
+		orderStatusMap: { type: Object, required: true }
+	});
+
+	const emit = defineEmits(['pay', 'cancel', 'return-device', 'details']);
+
+	const rawStatus = computed(() => props.order.orderStatus ?? props.order.status);
+	const normalizedStatus = computed(() => {
+		const s = rawStatus.value;
+		switch (s) {
+			case 0:
+			case '0':
+				return 'waiting_for_payment';
+			case 1:
+			case '1':
+				return 'in_used';
+			case 2:
+			case '2':
+				return 'used_done';
+			case 3:
+			case '3':
+				return 'order_cancelled';
+			default:
+				return s || '';
+		}
+	});
+
+	const statusDef = computed(() => props.orderStatusMap?.[rawStatus.value] || props.orderStatusMap?.[normalizedStatus.value] || {});
+	const statusText = computed(() => statusDef.value.text || '');
+	const statusChipClass = computed(() => {
+		const cls = statusDef.value.class || '';
+		if (cls.includes('status-using')) return 'chip-using';
+		if (cls.includes('status-waiting')) return 'chip-waiting';
+		if (cls.includes('status-finished')) return 'chip-finished';
+		if (cls.includes('status-cancelled')) return 'chip-cancelled';
+		return 'chip-default';
+	});
+
+	const isWaitingForPayment = computed(() => normalizedStatus.value === 'waiting_for_payment');
+	const isInUse = computed(() => normalizedStatus.value === 'in_used');
+	const isFinished = computed(() => normalizedStatus.value === 'used_done');
+
+	const titleText = computed(() => props.order.deviceName ? '租借风扇' : '租借风扇');
+
+	// 显示金额（优先后端给定字段）
+	const displayAmount = computed(() => props.order.amount || props.order.payAmount || props.order.actualDeviceAmount || props.order.currentFee || '0.00');
+
+	// 使用时长
+	const usedDurationText = computed(() => {
+		const start = parseDate(props.order.startTime);
+		const end = parseDate(props.order.endTime) || new Date();
+		if (!start) return '';
+		const diffMs = Math.max(0, end.getTime() - start.getTime());
+		const minutes = Math.floor(diffMs / 60000);
+		const hours = Math.floor(minutes / 60);
+		const mins = minutes % 60;
+		if (hours > 0) return `${hours}小时${mins}分钟`;
+		return `${mins}分钟`;
+	});
+
+	function parseDate(str) {
+		if (!str) return null;
+		try {
+			return new Date(String(str).replace(/-/g, '/'));
+		} catch (e) {
+			return null;
+		}
+	}
+
+	const onPay = () => emit('pay', props.order);
+	const onCancel = () => emit('cancel', props.order);
+	const onReturn = () => emit('return-device', props.order);
+	const onDetails = () => emit('details', props.order);
+</script>
+
+<style lang="scss" scoped>
+	.order-item {
+		background: #fff;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		overflow: hidden;
+		box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
+
+		// 订单头部
+		.order-header {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 24rpx;
+			// border-bottom: 1rpx solid #f0f0f0;
+
+			.header-left { display: flex; align-items: center; }
+			.title { font-size: 30rpx; color: #222; margin-left: 16rpx; font-weight: 600; }
+			.status-chip {
+				padding: 8rpx 20rpx;
+				border-radius: 8rpx;
+				font-size: 24rpx;
+				background: #f5f5f5;
+				transform: skewX(-15deg);
+				overflow: hidden;
+				.chip-text { display: inline-block; transform: skewX(15deg); }
+				&.chip-using { background: rgba(7,193,96,0.12); color: #07c160; }
+				&.chip-waiting { background: rgba(255,152,0,0.12); color: #FF9800; }
+				&.chip-finished { background: rgba(76,175,80,0.12); color: #4CAF50; }
+				&.chip-cancelled { background: rgba(158,158,158,0.12); color: #9E9E9E; }
+			}
+
+			.header-right { display: flex; align-items: center; }
+			// 支付标识：仅文字与图标，无底色
+			.payment-badge {
+				display: inline-flex;
+				align-items: center;
+				padding: 0;
+				border-radius: 0;
+				white-space: nowrap;
+
+				&.wx-score { }
+				&.member { }
+				&.deposit { }
+
+				.badge-icon { width: 32rpx; height: 26rpx; margin-right: 8rpx; }
+				.badge-text { font-size: 22rpx; color: #07c160; font-weight: 500; background: transparent; }
+				.divider { margin: 0 6rpx; color: #07c160; }
+			}
+
+			// 不同支付方式的文字颜色
+			.payment-badge.member {
+				.badge-text, .divider { color: #1976D2; }
+			}
+			.payment-badge.deposit {
+				.badge-text, .divider { color: #666; }
+			}
+		}
+
+		// 订单内容
+		.order-body {
+			padding: 24rpx;
+
+			.device-info {
+				margin-bottom: 20rpx;
+				display: flex;
+				justify-content: space-between;
+				align-items: flex-start;
+
+				.device-left {
+					flex: 1;
+					margin-right: 20rpx;
+
+					.device-name {
+						font-size: 32rpx;
+						font-weight: 500;
+						color: #333;
+						margin-bottom: 6rpx;
+					}
+
+					.device-id {
+						font-size: 26rpx;
+						color: #999;
+						margin-bottom: 0;
+					}
+				}
+
+				.device-right {
+					// 支付分标识
+					.payment-badge {
+						display: inline-flex;
+						align-items: center;
+						padding: 6rpx 12rpx;
+						border-radius: 8rpx;
+						white-space: nowrap;
+
+						&.wx-score {
+							background: rgba(7, 193, 96, 0.08);
+
+							.badge-icon {
+								width: 32rpx;
+								height: 26rpx;
+								margin-right: 8rpx;
+							}
+
+							.badge-text {
+								font-size: 22rpx;
+								color: #07c160;
+								display: flex;
+								align-items: center;
+
+								.divider { margin: 0 6rpx; }
+								.highlight { font-weight: 500; }
+							}
+						}
+
+						&.member {
+							background: rgba(25, 118, 210, 0.08);
+
+							.badge-text {
+								font-size: 22rpx;
+								color: #1976D2;
+								font-weight: 500;
+							}
+						}
+
+						&.deposit {
+							background: #f5f5f5;
+
+							.badge-text {
+								font-size: 22rpx;
+								color: #666;
+								font-weight: 500;
+							}
+						}
+					}
+				}
+			}
+
+			.order-times {
+				position: relative;
+				.time-row {
+					display: flex;
+					font-size: 26rpx;
+					margin-bottom: 8rpx;
+
+					.time-label { color: #999; width: 140rpx; }
+					.time-value { color: #333; flex: 1; }
+				}
+				.arrow {
+					position: absolute;
+					right: 0;
+					top: 0;
+					bottom: 0;
+					width: 40rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					color: #999;
+				}
+			}
+		}
+
+		// 订单底部
+		.order-footer {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 20rpx 24rpx;
+			background: #fafafa;
+			border-top: 1rpx solid #f0f0f0;
+
+			.footer-left { display: flex; align-items: center; }
+			.renting { font-size: 26rpx; color: #333; display: flex; align-items: center; }
+			.meta { display: flex; align-items: center; }
+			.meta-item { font-size: 26rpx; color: #333; display: flex; align-items: center; margin-right: 28rpx; }
+			.dot { width: 16rpx; height: 16rpx; background: #000; border-radius: 50%; margin-right: 12rpx; display: inline-block; }
+			.currency { margin-right: 4rpx; color: #333; }
+
+			.actions {
+				display: flex;
+				flex-wrap: wrap;
+				justify-content: flex-end;
+
+				.action-item {
+					font-size: 26rpx;
+					padding: 10rpx 30rpx;
+					border-radius: 30rpx;
+					margin-left: 20rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					margin-bottom: 10rpx;
+
+					&.primary { background: #07c160; color: #fff; }
+					&.secondary { background: #f5f5f5; color: #666; border: 1rpx solid #e0e0e0; }
+					&:active { opacity: 0.8; }
+				}
+			}
+		}
+	}
+</style>
+
+
diff --git a/config/user.js b/config/user.js
index 10ff5e3..ff513ff 100644
--- a/config/user.js
+++ b/config/user.js
@@ -249,6 +249,33 @@ export const uploadOssResource = (filePath) => {
 	})
 }
 
+// 上传并更新用户头像（后端接口）
+export const uploadUserAvatar = (filePath) => {
+	return new Promise((resolve, reject) => {
+		uni.uploadFile({
+			url: URL + '/app/user/uploadAvatar',
+			filePath,
+			name: 'file',
+			header: {
+				'appid': appid,
+				'Authorization': 'Bearer ' + uni.getStorageSync('token'),
+				'Clientid': uni.getStorageSync('client_id')
+			},
+			success: (res) => {
+				try {
+					const parsed = typeof res.data === 'string' ? JSON.parse(res.data) : res.data
+					resolve(parsed)
+				} catch (e) {
+					reject(e)
+				}
+			},
+			fail: (err) => {
+				reject(err)
+			}
+		})
+	})
+}
+
 // 获取系统配置（预留接口）
 // 期望后端返回形如：{ code: 200, data: { expressReturnCountdownSeconds: number } }
 export const getSystemConfig = () => {
diff --git a/pages.json b/pages.json
index a8291fa..306a6d0 100644
--- a/pages.json
+++ b/pages.json
@@ -43,9 +43,19 @@
 		{
 			"path": "pages/my/index",
 			"style": {
-				"navigationBarTitleText": "个人中心"
+				"navigationBarTitleText": "个人中心",
+				"navigationBarBackgroundColor": "#D1FFE1",
+				"navigationBarTextStyle": "black"
 			}
 		},
+        {
+            "path": "pages/setting/index",
+            "style": {
+                "navigationBarTitleText": "设置",
+                "navigationBarBackgroundColor": "#ffffff",
+                "navigationBarTextStyle": "black"
+            }
+        },
 		{
 			"path": "pages/deposit/index",
 			"style": {
@@ -125,6 +135,14 @@
 				"navigationBarTextStyle": "black"
 			}
 		},
+		{
+			"path": "pages/order/detail",
+			"style": {
+				"navigationBarTitleText": "订单详情",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black"
+			}
+		},
 		{
 			"path": "pages/expressReturn/index",
 			"style": {
@@ -140,6 +158,14 @@
 				"navigationBarTextStyle": "black"
 			}
 		},
+		{
+			"path": "pages/search/index",
+			"style": {
+				"navigationBarTitleText": "查找设备",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black"
+			}
+		},
 		{
 			"path": "pages/waiting/index",
 			"style": {
diff --git a/pages/device/detail.vue b/pages/device/detail.vue
index 5070336..e67e2a5 100644
--- a/pages/device/detail.vue
+++ b/pages/device/detail.vue
@@ -1,44 +1,19 @@
 <template>
 	<view class="container">
-		<!-- 顶部设备信息 -->
-		<view class="device-header">
-			<view class="device-status-card" :class="deviceStatus.class">
-				<view class="status-indicator"></view>
-				<text class="status-text">{{ deviceStatus.text }}</text>
-			</view>
-			<view class="device-title">
-				<text class="name">共享风扇</text>
-				<view class="device-meta">
-					<text class="id-label">设备号：</text>
-					<text class="id-value">{{ deviceId }}</text>
-				</view>
-			</view>
-		</view>
-
 		<!-- 设备信息卡片 -->
 		<view class="card device-info-card">
-			<view class="card-row">
-				<view class="card-item">
-					<view class="item-icon location-icon">
-						<!-- <uni-icons type="location" size="24" color="#fff"></uni-icons> -->
-						<image src="/static/images/location-map.svg" mode="aspectFill"
-							style="width: 45rpx;height: 45rpx;"></image>
-					</view>
-					<view class="item-content">
-						<text class="item-label">当前位置</text>
-						<text class="item-value">{{ deviceLocation }}</text>
-					</view>
+			<view class="device-location">
+				<view class="location-left">
+					<image src="/static/images/location-map.svg" mode="aspectFit" class="location-icon"></image>
+					<text class="location-name">{{ deviceLocation }}</text>
 				</view>
-				<!-- <view class="card-item">
-					<view class="item-icon battery-icon" :class="{ 'battery-low': batteryLevel < 20 }">
-						<image src="/static/images/Electricity.svg" mode="aspectFill"
-							style="width: 45rpx;height: 45rpx;"></image>
-					</view>
-					<view class="item-content">
-						<text class="item-label">电池电量</text>
-						<text class="item-value">{{ batteryLevel }}%</text>
-					</view>
-				</view> -->
+				<view class="device-status" :class="deviceStatus.class">
+					<text class="status-text">{{ deviceStatus.text }}</text>
+				</view>
+			</view>
+			<view class="device-id">
+				<text class="id-label">设备号：</text>
+				<text class="id-value">{{ deviceId }}</text>
 			</view>
 		</view>
 
@@ -50,46 +25,33 @@
 
 			<view class="pricing-banner">
 				<view class="pricing-main">
-					<text class="price">¥{{deviceFeeConfig.maxHourPrice}}</text>
+					<text class="price-symbol">¥</text>
+					<text class="price">{{ deviceFeeConfig.maxHourPrice || '5.00' }}</text>
 					<text class="unit">/小时</text>
 				</view>
-				<text class="cap-price">封顶 ¥{{deviceInfo.depositAmount}}</text>
+				<view class="cap-badge">
+					<text class="cap-text">{{ deviceInfo.depositAmount || '99' }}元封顶</text>
+				</view>
 			</view>
 
-			<view class="pricing-rules">
-				<!-- <view class="rule-item">
-					<view class="rule-dot"></view>
-					<text class="rule-text">前15分钟内归还<text class="highlight">免费</text></text>
-				</view> -->
-				<view class="rule-item">
-					<view class="rule-dot"></view>
-					<text class="rule-text">不足60分钟按60分钟计费</text>
+			<view class="pricing-info">
+				<view class="info-icon">
+					<text class="icon-text">ⓘ</text>
 				</view>
-				<view class="rule-item">
-					<view class="rule-dot"></view>
-					<text class="rule-text">持续计费至99元视为买断</text>
+				<text class="info-text">5元/小时，45元/24小时</text>
+			</view>
+			<view class="pricing-info">
+				<view class="info-icon">
+					<text class="icon-text">ⓘ</text>
 				</view>
+				<text class="info-text">前15分钟内归还免费，不足60分钟按60分钟计费点总封顶99元，持续计费至99元视为买断</text>
 			</view>
 		</view>
 
-		<!-- 手机号输入 -->
-		<!-- 		<view class="card phone-card" v-if="!hasActiveOrder">
-			<view class="card-header">
-				<text class="card-title">联系方式</text>
-			</view>
-			<view class="phone-input-container">
-				<view class="input-wrapper">
-					<text class="prefix">+86</text>
-					<input type="number" class="phone-input" maxlength="11" placeholder="请输入手机号码"
-						v-model="phoneNumber" />
-				</view>
-			</view>
-		</view> -->
-
-		<!-- 使用须知 -->
+		<!-- 使用说明 -->
 		<view class="card notice-card">
 			<view class="card-header">
-				<text class="card-title">使用须知</text>
+				<text class="card-title">使用说明</text>
 			</view>
 			<view class="notice-items">
 				<view class="notice-item">
@@ -98,34 +60,25 @@
 				</view>
 				<view class="notice-item">
 					<view class="notice-dot"></view>
-					<text class="notice-text">请在指定区域内使用设备</text>
+					<text class="notice-text">超出使用时间将自动按小时计费</text>
 				</view>
 				<view class="notice-item">
 					<view class="notice-dot"></view>
-					<text class="notice-text">归还时请确保设备完好，避免损坏</text>
+					<text class="notice-text">请在指定区域内使用设备</text>
 				</view>
 			</view>
 		</view>
 
 		<!-- 底部操作区 -->
 		<view class="footer">
-
-
 			<button class="rent-button" :class="{ 'return-button': hasActiveOrder }"
 				@click="handleRent('wx-score-pay')">
-				<text>{{ hasActiveOrder ? '归还设备' : '免押租借' }}</text>
+				<text>{{ hasActiveOrder ? '归还设备' : '免押金租借' }}</text>
 			</button>
 			<view class="wechat-credit">
 				<image src="/static/images/wxpayflag.png" mode="aspectFit" class="wx-icon"></image>
-				<view class="credit-text">
-					<text>微信支付分</text>
-					<text class="credit-divider">|</text>
-					<text class="credit-score">550分及以上优享</text>
-				</view>
+				<text class="credit-text">微信支付分 <text class="divider">|</text> 550分以上优享</text>
 			</view>
-			<!-- <view class="" style="align-items: center;align-content: center;text-align: center;line-height: 50rpx;"
-				@click="handleRent('wx-pay')">
-				无法免押点这里</view> -->
 		</view>
 
 		<!-- 手机号授权弹窗 -->
@@ -539,81 +492,11 @@
 		box-sizing: border-box;
 	}
 
-	// 顶部设备信息
-	.device-header {
-		display: flex;
-		flex-direction: column;
-		margin-bottom: 30rpx;
-
-		.device-status-card {
-			display: flex;
-			align-items: center;
-			margin-bottom: 20rpx;
-
-			.status-indicator {
-				width: 20rpx;
-				height: 20rpx;
-				border-radius: 50%;
-				margin-right: 10rpx;
-			}
-
-			&.available {
-				.status-indicator {
-					background-color: #10c469;
-					box-shadow: 0 0 10rpx rgba(16, 196, 105, 0.5);
-				}
-
-				.status-text {
-					color: #10c469;
-				}
-			}
-
-			&.offline {
-				.status-indicator {
-					background-color: #9a9a9a;
-				}
-
-				.status-text {
-					color: #9a9a9a;
-				}
-			}
-
-			.status-text {
-				font-size: 28rpx;
-				font-weight: 500;
-			}
-		}
-
-		.device-title {
-			.name {
-				font-size: 48rpx;
-				font-weight: bold;
-				color: #333;
-			}
-
-			.device-meta {
-				margin-top: 10rpx;
-				display: flex;
-				align-items: center;
-
-				.id-label {
-					font-size: 26rpx;
-					color: #999;
-				}
-
-				.id-value {
-					font-size: 26rpx;
-					color: #666;
-				}
-			}
-		}
-	}
-
 	// 卡片通用样式
 	.card {
 		background-color: #fff;
 		border-radius: 24rpx;
-		box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.03);
+		box-shadow: 0 2rpx 16rpx rgba(0, 0, 0, 0.04);
 		padding: 30rpx;
 		margin-bottom: 30rpx;
 
@@ -631,177 +514,161 @@
 		}
 	}
 
-	// 设备信息卡
+	// 设备信息卡片
 	.device-info-card {
-		.card-row {
-			display: flex;
-			justify-content: space-between;
-		}
 
-		.card-item {
+		.device-location {
 			display: flex;
 			align-items: center;
-			flex: 1;
+			justify-content: space-between;
+			margin-bottom: 20rpx;
 
-			.item-icon {
-				width: 60rpx;
-				height: 60rpx;
-				border-radius: 12rpx;
-				margin-right: 20rpx;
+			.location-left {
 				display: flex;
 				align-items: center;
-				justify-content: center;
-				font-size: 30rpx;
-				color: #fff;
 
-				&.location-icon {
-					background: linear-gradient(135deg, #40c9ff, #32a5ff);
-
-					// &::before {
-					// 	content: "\e900"; // 使用字体图标，需要自行替换
-					// }
+				.location-icon {
+					width: 40rpx;
+					height: 40rpx;
+					margin-right: 12rpx;
+					background-color: #10d673;
+					border-radius: 50%;
 				}
 
-				&.battery-icon {
-					background: linear-gradient(135deg, #33db92, #10c469);
-
-					// &::before {
-					// 	content: "\e901"; // 使用字体图标，需要自行替换
-					// }
-
-					&.battery-low {
-						background: linear-gradient(135deg, #ff7676, #f54f4f);
-					}
-				}
-			}
-
-			.item-content {
-				display: flex;
-				flex-direction: column;
-
-				.item-label {
-					font-size: 26rpx;
-					color: #999;
-					margin-bottom: 4rpx;
-				}
-
-				.item-value {
-					font-size: 30rpx;
+				.location-name {
+					font-size: 32rpx;
 					color: #333;
 					font-weight: 500;
 				}
 			}
+
+			.device-status {
+				padding: 8rpx 24rpx;
+				border-radius: 30rpx;
+				font-size: 24rpx;
+
+				&.available {
+					background-color: #d4f4dd;
+
+					.status-text {
+						color: #07c160;
+					}
+				}
+
+				&.offline {
+					background-color: #f0f0f0;
+
+					.status-text {
+						color: #999;
+					}
+				}
+
+				.status-text {
+					font-size: 24rpx;
+				}
+			}
+		}
+
+		.device-id {
+			display: flex;
+			align-items: center;
+
+			.id-label {
+				font-size: 28rpx;
+				color: #999;
+			}
+
+			.id-value {
+				font-size: 28rpx;
+				color: #666;
+			}
 		}
 	}
 
-	// 计费规则
+	// 计费规则卡片
 	.pricing-card {
 		.pricing-banner {
-			background: linear-gradient(to right, #f8f9ff, #e8f0ff);
-			border-radius: 16rpx;
-			padding: 30rpx;
-			margin-bottom: 30rpx;
+			background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
+			border-radius: 20rpx;
+			padding: 40rpx 30rpx;
+			margin-bottom: 24rpx;
 			display: flex;
 			flex-direction: column;
 			align-items: center;
 
 			.pricing-main {
 				display: flex;
-				align-items: flex-end;
+				align-items: baseline;
+				margin-bottom: 16rpx;
+
+				.price-symbol {
+					font-size: 48rpx;
+					font-weight: bold;
+					color: #07c160;
+					margin-right: 4rpx;
+				}
 
 				.price {
-					font-size: 60rpx;
+					font-size: 80rpx;
 					font-weight: bold;
-					color: #ff6b6b;
+					color: #07c160;
+					line-height: 1;
 				}
 
 				.unit {
+					font-size: 32rpx;
+					color: #07c160;
+					margin-left: 8rpx;
+				}
+			}
+
+			.cap-badge {
+				background-color: #07c160;
+				padding: 10rpx 32rpx;
+				border-radius: 30rpx;
+
+				.cap-text {
+					font-size: 26rpx;
+					color: #fff;
+					font-weight: 500;
+				}
+			}
+		}
+
+		.pricing-info {
+			display: flex;
+			align-items: flex-start;
+			margin-bottom: 16rpx;
+
+			&:last-child {
+				margin-bottom: 0;
+			}
+
+			.info-icon {
+				width: 32rpx;
+				height: 32rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin-right: 12rpx;
+				margin-top: 2rpx;
+
+				.icon-text {
 					font-size: 28rpx;
 					color: #999;
-					margin-left: 4rpx;
-					margin-bottom: 10rpx;
 				}
 			}
 
-			.cap-price {
-				margin-top: 10rpx;
+			.info-text {
+				flex: 1;
 				font-size: 26rpx;
 				color: #666;
-				background-color: rgba(255, 107, 107, 0.1);
-				padding: 6rpx 20rpx;
-				border-radius: 20rpx;
-			}
-		}
-
-		.pricing-rules {
-			.rule-item {
-				display: flex;
-				align-items: center;
-				margin-bottom: 16rpx;
-
-				&:last-child {
-					margin-bottom: 0;
-				}
-
-				.rule-dot {
-					width: 10rpx;
-					height: 10rpx;
-					border-radius: 50%;
-					background-color: #ff6b6b;
-					margin-right: 16rpx;
-				}
-
-				.rule-text {
-					font-size: 28rpx;
-					color: #666;
-
-					.highlight {
-						color: #ff6b6b;
-						font-weight: bold;
-					}
-				}
+				line-height: 1.6;
 			}
 		}
 	}
 
-	// 手机号输入
-	.phone-card {
-		.phone-input-container {
-			.input-wrapper {
-				display: flex;
-				align-items: center;
-				height: 88rpx;
-				background-color: #f5f7fa;
-				border-radius: 16rpx;
-				padding: 0 24rpx;
-
-				.prefix {
-					font-size: 28rpx;
-					color: #666;
-					margin-right: 16rpx;
-					padding-right: 16rpx;
-					border-right: 1px solid #e0e0e0;
-				}
-
-				.phone-input {
-					flex: 1;
-					height: 88rpx;
-					font-size: 28rpx;
-					color: #333;
-					padding-left: 10rpx;
-				}
-			}
-
-			.phone-tip {
-				font-size: 24rpx;
-				color: #999;
-				margin-top: 16rpx;
-				display: block;
-			}
-		}
-	}
-
-	// 使用须知
+	// 使用说明卡片
 	.notice-card {
 		.notice-items {
 			.notice-item {
@@ -814,15 +681,17 @@
 				}
 
 				.notice-dot {
-					width: 10rpx;
-					height: 10rpx;
+					width: 12rpx;
+					height: 12rpx;
 					border-radius: 50%;
-					background-color: #32a5ff;
+					background-color: #07c160;
 					margin-right: 16rpx;
-					margin-top: 12rpx;
+					margin-top: 10rpx;
+					flex-shrink: 0;
 				}
 
 				.notice-text {
+					flex: 1;
 					font-size: 28rpx;
 					color: #666;
 					line-height: 1.6;
@@ -838,58 +707,31 @@
 		left: 0;
 		right: 0;
 		background-color: #fff;
-		padding: 20rpx 30rpx;
-		padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
-		box-shadow: 0 -2rpx 20rpx rgba(0, 0, 0, 0.05);
+		padding: 24rpx 30rpx;
+		padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
+		box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.06);
 		z-index: 100;
 		display: flex;
 		flex-direction: column;
-		// 添加一个变量来保存footer高度，方便管理和确保一致性
-		--footer-height: 180rpx;
-
-		.wechat-credit {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			margin-top: 10rpx;
-
-			.wx-icon {
-				width: 50rpx;
-				height: 40rpx;
-				margin-right: 10rpx;
-			}
-
-			.credit-text {
-				font-size: 24rpx;
-				color: #07c160;
-				display: flex;
-				align-items: center;
-
-				.credit-divider {
-					margin: 0 10rpx;
-				}
-
-				.credit-score {
-					font-weight: 500;
-				}
-			}
-		}
+		align-items: center;
 
 		.rent-button {
-			height: 92rpx;
-			border-radius: 46rpx;
+			width: 100%;
+			height: 96rpx;
+			border-radius: 48rpx;
 			background: linear-gradient(135deg, #07c160, #10d673);
 			color: #fff;
-			font-size: 32rpx;
+			font-size: 34rpx;
 			font-weight: 600;
 			display: flex;
 			align-items: center;
 			justify-content: center;
 			border: none;
-			width: 90%;
+			box-shadow: 0 8rpx 20rpx rgba(7, 193, 96, 0.3);
 
 			&.return-button {
 				background: linear-gradient(135deg, #FF9800, #FFB74D);
+				box-shadow: 0 8rpx 20rpx rgba(255, 152, 0, 0.3);
 			}
 
 			&:active {
@@ -897,6 +739,29 @@
 				opacity: 0.9;
 			}
 		}
+
+		.wechat-credit {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			margin-top: 16rpx;
+
+			.wx-icon {
+				width: 48rpx;
+				height: 38rpx;
+				margin-right: 8rpx;
+			}
+
+			.credit-text {
+				font-size: 24rpx;
+				color: #999;
+
+				.divider {
+					margin: 0 8rpx;
+					color: #ddd;
+				}
+			}
+		}
 	}
 
 	/* 手机号授权弹窗样式 */
diff --git a/pages/expressReturn/addExpressReturn.vue b/pages/expressReturn/addExpressReturn.vue
index 6a1ff62..b76a713 100644
--- a/pages/expressReturn/addExpressReturn.vue
+++ b/pages/expressReturn/addExpressReturn.vue
@@ -1,7 +1,7 @@
 <template>
 	<view class="express-form-container">
-		<!-- 页头：订单摘要（商务风卡片） -->
-		<view class="card order-summary" v-if="orderInfo.orderNo">
+		<!-- 订单摘要卡片 -->
+		<view class="order-summary-card" v-if="orderInfo.orderNo">
 			<view class="summary-row">
 				<view class="label">订单号</view>
 				<view class="value">{{ orderInfo.orderNo }}</view>
@@ -11,32 +11,32 @@
 				<view class="value">{{ orderInfo.deviceNo }}</view>
 			</view>
 			<view class="summary-row" v-if="orderInfo.startTime">
-				<view class="label">开始时间</view>
+				<view class="label">开放时间</view>
 				<view class="value">{{ orderInfo.startTime }}</view>
 			</view>
 		</view>
 
-		<!-- 表单卡片 -->
-		<view class="card form-card">
+		<!-- 表单区域 -->
+		<view class="form-section">
 			<view class="form-title">填写快递归还信息</view>
-			<view class="form-item">
-				<view class="item-label">联系电话</view>
-				<input class="item-input" type="number" v-model="phone" placeholder="请输入联系电话" maxlength="20"
-					:focus-class="'item-input-focus'" />
+			
+			<view class="input-wrapper">
+				<view class="input-label">联系电话</view>
+				<input class="input-field" type="number" v-model="phone" maxlength="20" />
 			</view>
-			<view class="form-item">
-				<view class="item-label">快递单号</view>
-				<input class="item-input" type="text" v-model="trackingNumber"
-					:placeholder="isFillMode ? '请输入需要补填的快递单号' : '请输入快递单号（可先留空）'" maxlength="40"
-					:focus-class="'item-input-focus'" />
+			
+			<view class="input-wrapper">
+				<view class="input-label">快递单号</view>
+				<input class="input-field" type="text" v-model="trackingNumber"
+					:placeholder="isFillMode ? '请输入需要补填的快递单号' : '请输入快递单号（可先留空）'" maxlength="40" />
 			</view>
+			
 			<view class="tips" v-if="tipsText">{{ tipsText }}</view>
 		</view>
 
-		<!-- 提交操作条 -->
-		<view class="bottom-bar">
-			<view class="action-item primary" :class="{ disabled: submitting }" hover-class="primary-hover"
-				@click="!submitting && handleSubmit()">{{ isFillMode ? '确认补填' : '提交信息' }}</view>
+		<!-- 提交按钮 -->
+		<view class="submit-btn" :class="{ disabled: submitting }" @click="!submitting && handleSubmit()">
+			{{ isFillMode ? '确认补填' : '提交信息' }}
 		</view>
 	</view>
 </template>
@@ -249,130 +249,117 @@
 <style lang="scss" scoped>
 	.express-form-container {
 		min-height: 100vh;
-		background: #f7f8fa;
-		padding: 30rpx 30rpx 200rpx;
+		background: #f5f5f5;
+		padding: 40rpx 32rpx 180rpx;
 	}
 
-	.card {
-		background: #ffffff;
-		border-radius: 20rpx;
-		padding: 30rpx;
-		margin-bottom: 24rpx;
-		box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
-	}
+	/* 订单摘要卡片 - 淡绿色背景 */
+	.order-summary-card {
+		background: linear-gradient(135deg, #d4f4dd 0%, #e8f8ed 100%);
+		border-radius: 24rpx;
+		padding: 40rpx 32rpx;
+		margin-bottom: 40rpx;
 
-	.order-summary {
 		.summary-row {
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
-			padding: 14rpx 0;
-			border-bottom: 1rpx solid #f0f2f5;
-
-			&:last-child {
-				border-bottom: 0;
-			}
+			padding: 20rpx 0;
 
 			.label {
-				font-size: 26rpx;
-				color: #6b7280;
+				font-size: 28rpx;
+				color: #333333;
+				font-weight: 400;
 			}
 
 			.value {
 				font-size: 28rpx;
-				color: #111827;
+				color: #333333;
+				font-weight: 500;
 			}
 		}
 	}
 
-	.form-card {
+	/* 表单区域 */
+	.form-section {
+		background: transparent;
+		margin-bottom: 40rpx;
+
 		.form-title {
-			font-size: 30rpx;
+			font-size: 32rpx;
 			font-weight: 600;
-			color: #111827;
-			margin-bottom: 16rpx;
+			color: #333333;
+			margin-bottom: 32rpx;
 		}
 
-		.form-item {
-			padding: 22rpx 0;
-			border-bottom: 1rpx solid #f0f2f5;
+		.input-wrapper {
+			position: relative;
+			margin-bottom: 32rpx;
 
-			&:last-child {
-				border-bottom: 0;
-			}
-
-			.item-label {
-				font-size: 28rpx;
-				color: #374151;
-				margin-bottom: 10rpx;
-			}
-
-			.item-input {
-				display: block;
-				width: 100%;
-				height: 50rpx;
-				box-sizing: border-box;
+			.input-label {
+				position: absolute;
+				top: -14rpx;
+				left: 32rpx;
+				font-size: 24rpx;
+				color: #666666;
 				background: #ffffff;
-				border: 1rpx solid #e5e7eb;
-				border-radius: 12rpx;
-				padding: 0rpx 14rpx;
+				padding: 0 12rpx;
+				z-index: 1;
+			}
+
+			.input-field {
+				width: 100%;
+				height: 100rpx;
+				background: #ffffff;
+				border: 2rpx solid #333333;
+				border-radius: 48rpx;
+				padding: 0 32rpx;
 				font-size: 28rpx;
-				color: #111827;
-				line-height: 1.2;
-				transition: border-color 0.2s ease, box-shadow 0.2s ease;
+				color: #333333;
+				line-height: 100rpx;
+				box-sizing: border-box;
 			}
 
-			.item-input::placeholder {
-				color: #9ca3af;
-			}
-
-			.item-input-focus {
-				border-color: #2563eb;
-				box-shadow: 0 0 0 4rpx rgba(37, 99, 235, 0.15);
+			.input-field::placeholder {
+				color: #cccccc;
 			}
 		}
 
 		.tips {
-			margin-top: 12rpx;
+			margin-top: 16rpx;
+			padding: 0 16rpx;
 			font-size: 24rpx;
-			color: #6b7280;
+			color: #999999;
 		}
 	}
 
-	.bottom-bar {
+	/* 提交按钮 */
+	.submit-btn {
 		position: fixed;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		padding: 24rpx 30rpx;
-		padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
-		background: #ffffff;
-		box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.06);
-		display: block;
+		left: 32rpx;
+		right: 32rpx;
+		bottom: 60rpx;
+		bottom: calc(60rpx + env(safe-area-inset-bottom));
+		height: 96rpx;
+		background: linear-gradient(135deg, #7cd89f 0%, #6bc98c 100%);
+		border-radius: 48rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		font-size: 32rpx;
+		font-weight: 600;
+		color: #ffffff;
+		box-shadow: 0 8rpx 24rpx rgba(124, 216, 159, 0.3);
+		transition: all 0.3s ease;
 
-		.action-item {
-			width: 100%;
-			height: 92rpx;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			border-radius: 44rpx;
-			font-size: 30rpx;
-			font-weight: 600;
-
-			&.primary {
-				background: #1f2937;
-				color: #fff;
-			}
-
-			&.disabled {
-				opacity: 0.6;
-				pointer-events: none;
-			}
+		&:active {
+			transform: scale(0.98);
+			box-shadow: 0 4rpx 16rpx rgba(124, 216, 159, 0.2);
 		}
 
-		.primary-hover {
-			background: #111827;
+		&.disabled {
+			opacity: 0.5;
+			pointer-events: none;
 		}
 	}
 </style>
\ No newline at end of file
diff --git a/pages/expressReturn/index.vue b/pages/expressReturn/index.vue
index b121c89..61d2e57 100644
--- a/pages/expressReturn/index.vue
+++ b/pages/expressReturn/index.vue
@@ -1,42 +1,42 @@
 <template>
 	<view class="express-return-container">
-		<!-- 页面标题 -->
-		<!-- <view class="page-header">
-			<text class="page-title">快递归还</text>
-			<text class="page-subtitle">查看您的快递归还记录</text>
-		</view> -->
+		<!-- 收件信息卡片 -->
+		<view class="recipient-info-card">
+			<view class="info-header">收件信息</view>
+			<view class="info-content">
+				<text class="recipient-name">风电者 18163601305</text>
+				<text class="recipient-address">湖南省长沙市岳麓区麓谷街道新长海尖科技园A2栋623</text>
+			</view>
+			<view class="copy-all-btn" @click="copyAllInfo">
+				<text class="btn-text">一键复制全部信息</text>
+			</view>
+		</view>
 
 		<!-- 列表容器 -->
 		<view class="list-container">
 			<view class="return-item" v-for="(item, index) in returnList" :key="index" @click="handleItemClick(item)">
-				<!-- 左侧图标 -->
-				<view class="item-icon">
-					<view class="icon-wrapper" :class="getStatusClass(item.status)">
-						<text class="icon-text">{{ getStatusIcon(item.status) }}</text>
-					</view>
+				<!-- 左侧图标区域 -->
+				<view class="item-left">
+					<view class="avatar-placeholder"></view>
 				</view>
 
-				<!-- 中间内容 -->
+				<!-- 中间内容区域 -->
 				<view class="item-content">
-					<view class="item-header">
-						<text class="tracking-number">运单号：{{ item.logisticsTrackingNumber }}</text>
-						<!-- <text class="express-company">{{ item.expressCompany }}</text> -->
+					<view class="content-header">
+						<text class="status-label">{{ getStatusText(item.status) }}</text>
 					</view>
-					<view class="item-details">
-						<text class="return-address">归还地址：{{ item.returnAddress }}</text>
-						<text class="return-time">填写时间：{{ item.returnTime }}</text>
-					</view>
-					<view class="item-footer">
-						<text class="package-info">订单号：{{ item.orderId }}</text>
-						<text class="user-phone" v-if="item.userPhone">用户电话：{{ item.userPhone }}</text>
+					<view class="content-body">
+						<text class="info-text">订单号：{{ item.orderId || '' }}</text>
+						<text class="info-text">快递单号：{{ item.trackingNumber || '待填写' }}</text>
+						<text class="info-text">用户电话：{{ item.userPhone || '' }}</text>
 					</view>
 				</view>
 
-				<!-- 右侧状态 -->
-				<view class="item-status">
-					<text class="status-text" :class="getStatusClass(item.status)">
-						{{ getStatusText(item.status) }}
-					</text>
+				<!-- 右侧状态标签 -->
+				<view class="item-right">
+					<view class="status-badge" :class="getStatusClass(item.status)">
+						{{ getStatusBadge(item.status) }}
+					</view>
 				</view>
 			</view>
 		</view>
@@ -57,6 +57,10 @@ const returnList = ref([])
 const loading = ref(false)
 const query = ref({ pageNum: 1, pageSize: 20 })
 
+// 收件信息
+const recipientName = '风电者 18163601305'
+const recipientAddress = '湖南省长沙市岳麓区麓谷街道新长海尖科技园A2栋623'
+
 const loadList = async () => {
 	try {
 		loading.value = true
@@ -103,18 +107,32 @@ const getStatusClass = (status) => ({
 	'pending': 'status-pending'
 }[status] || 'status-pending')
 
-const getStatusIcon = (status) => ({
-	'completed': '✓',
-	'processing': '⏳',
-	'pending': '⏸'
-}[status] || '⏸')
-
 const getStatusText = (status) => ({
+	'completed': '暂停计费中',
+	'processing': '暂停计费中',
+	'pending': '暂停计费中'
+}[status] || '暂停计费中')
+
+const getStatusBadge = (status) => ({
 	'completed': '已完成',
 	'processing': '处理中',
 	'pending': '待处理'
 }[status] || '待处理')
 
+// 一键复制全部信息
+const copyAllInfo = () => {
+	const allInfo = `收件人：${recipientName}\n收件地址：${recipientAddress}`
+	uni.setClipboardData({
+		data: allInfo,
+		success: () => {
+			uni.showToast({ title: '全部信息已复制', icon: 'success' })
+		},
+		fail: () => {
+			uni.showToast({ title: '复制失败', icon: 'none' })
+		}
+	})
+}
+
 // 点击列表项
 const handleItemClick = (item) => {
 	console.log('点击了归还记录:', item)
@@ -132,145 +150,135 @@ onMounted(loadList)
 <style lang="scss">
 .express-return-container {
 	min-height: 100vh;
-	background-color: #f8f9fa;
+	background-color: #f5f5f5;
 	padding: 20rpx;
 }
 
-.page-header {
-	margin-bottom: 40rpx;
-	padding: 20rpx 0;
+// 收件信息卡片
+.recipient-info-card {
+	background: linear-gradient(135deg, #D1FFE1 0%, #B8F5D0 100%);
+	border-radius: 16rpx;
+	padding: 24rpx 28rpx;
+	margin-bottom: 20rpx;
 }
 
-.page-title {
-	display: block;
-	font-size: 36rpx;
+.info-header {
+	font-size: 28rpx;
 	font-weight: 600;
 	color: #2c3e50;
-	margin-bottom: 10rpx;
+	margin-bottom: 16rpx;
 }
 
-.page-subtitle {
-	display: block;
+.info-content {
+	display: flex;
+	flex-direction: column;
+	margin-bottom: 16rpx;
+}
+
+.recipient-name {
+	font-size: 30rpx;
+	font-weight: 600;
+	color: #1a1a1a;
+	margin-bottom: 8rpx;
+}
+
+.recipient-address {
+	font-size: 26rpx;
+	color: #333333;
+	line-height: 1.6;
+}
+
+.copy-all-btn {
+	padding: 16rpx;
+	background-color: #ffffff;
+	border-radius: 12rpx;
+	text-align: center;
+}
+
+.btn-text {
 	font-size: 28rpx;
-	color: #7f8c8d;
+	color: #27ae60;
+	font-weight: 500;
 }
 
+// 列表容器
 .list-container {
 	background-color: transparent;
 }
 
 .return-item {
 	display: flex;
-	align-items: center;
-	padding: 30rpx 24rpx;
+	align-items: flex-start;
+	padding: 28rpx 24rpx;
 	background-color: #ffffff;
 	border-radius: 16rpx;
 	margin-bottom: 20rpx;
-	box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
-	transition: background-color 0.2s ease;
+	box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
+	position: relative;
 
 	&:last-child {
 		margin-bottom: 0;
 	}
 
 	&:active {
-		background-color: #f8f9fa;
+		background-color: #fafafa;
 	}
 }
 
-.item-icon {
-	margin-right: 24rpx;
-}
-
-.icon-wrapper {
-	width: 80rpx;
-	height: 80rpx;
-	border-radius: 50%;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	font-size: 32rpx;
-	font-weight: bold;
-
-	&.status-completed {
-		background-color: #e8f5e8;
-		color: #27ae60;
-	}
-
-	&.status-processing {
-		background-color: #fff3cd;
-		color: #f39c12;
-	}
-
-	&.status-pending {
-		background-color: #f8f9fa;
-		color: #6c757d;
-	}
-}
-
-.item-content {
-	flex: 1;
+// 左侧头像区域
+.item-left {
 	margin-right: 20rpx;
 }
 
-.item-header {
-	margin-bottom: 12rpx;
+.avatar-placeholder {
+	width: 80rpx;
+	height: 80rpx;
+	border-radius: 50%;
+	background-color: #e0e0e0;
 }
 
-.express-company {
-	display: block;
-	font-size: 32rpx;
-	font-weight: 600;
-	color: #2c3e50;
-	margin-bottom: 8rpx;
-}
-
-.tracking-number {
-	display: block;
-	font-size: 26rpx;
-	color: #7f8c8d;
-}
-
-.item-details {
-	margin-bottom: 12rpx;
-}
-
-.return-address,
-.return-time {
-	display: block;
-	font-size: 26rpx;
-	color: #34495e;
-	line-height: 1.5;
-	margin-bottom: 6rpx;
-}
-
-.item-footer {
-	margin-top: 8rpx;
+// 中间内容区域
+.item-content {
+	flex: 1;
 	display: flex;
 	flex-direction: column;
-	align-items: flex-start;
 }
 
-.package-info {
-	font-size: 24rpx;
-	color: #95a5a6;
-	margin-bottom: 4rpx;
+.content-header {
+	margin-bottom: 12rpx;
 }
 
-.user-phone {
-	font-size: 24rpx;
-	color: #95a5a6;
+.status-label {
+	font-size: 32rpx;
+	font-weight: 600;
+	color: #1a1a1a;
 }
 
-.item-status {
-	text-align: right;
+.content-body {
+	display: flex;
+	flex-direction: column;
+	gap: 8rpx;
 }
 
-.status-text {
+.info-text {
 	font-size: 26rpx;
-	font-weight: 500;
-	padding: 8rpx 16rpx;
+	color: #666666;
+	line-height: 1.4;
+}
+
+// 右侧状态标签
+.item-right {
+	position: absolute;
+	top: 28rpx;
+	right: 24rpx;
+}
+
+.status-badge {
+	padding: 8rpx 20rpx;
 	border-radius: 20rpx;
+	font-size: 24rpx;
+	font-weight: 500;
+	white-space: nowrap;
 
 	&.status-completed {
 		background-color: #e8f5e8;
@@ -283,20 +291,18 @@ onMounted(loadList)
 	}
 
 	&.status-pending {
-		background-color: #f8f9fa;
-		color: #6c757d;
+		background-color: #f0f0f0;
+		color: #999999;
 	}
 }
 
+// 空状态
 .empty-state {
 	display: flex;
 	flex-direction: column;
 	align-items: center;
 	justify-content: center;
 	padding: 120rpx 40rpx;
-	// background-color: #ffffff;
-	// border-radius: 16rpx;
-	// box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
 }
 
 .empty-icon {
@@ -306,6 +312,6 @@ onMounted(loadList)
 
 .empty-text {
 	font-size: 28rpx;
-	color: #7f8c8d;
+	color: #999999;
 }
 </style>
\ No newline at end of file
diff --git a/pages/help/index.vue b/pages/help/index.vue
index a594a83..0f3257c 100644
--- a/pages/help/index.vue
+++ b/pages/help/index.vue
@@ -127,12 +127,28 @@ export default {
     box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.04);
 
     .contact-title {
+      position: relative;
+      z-index: 4;
+      display: inline-block;
       font-size: 32rpx;
       color: #333;
       font-weight: 500;
       margin-bottom: 20rpx;
-      border-left: 8rpx solid #1976D2;
-      padding-left: 20rpx;
+      padding-bottom: 8rpx;
+      width:fit-content;
+
+      &::after {
+        z-index: -1;
+        content: '';
+        position: absolute;
+        left: 0;
+        bottom: 8rpx;
+        width: 88%;
+        height: 16rpx;
+        border-radius: 20rpx;
+        // background: transparent;
+        background: #07C160; // 底部高亮（微信绿）
+      }
     }
 
     .contact-content {
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 956b076..407925c 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,1298 +1,1447 @@
-<template>
-	<view class="container fullscreen">
-		<view class="" style="font-size: 32rpx;font-weight: 600;margin: 15rpx 20rpx;">风电者共享风扇&充电宝</view>
-		<view class="map-notice" v-if="noticeText">
-			<uv-notice-bar :text="noticeText" :speed="50" :show-icon="true" color="#07c160" bg-color="#E8F8EF"
-				icon="volume"></uv-notice-bar>
-		</view>
-
-		<!-- 全屏地图组件 -->
-		<MapComponent v-if="!isLoading && userLocation" ref="mapRef" :userLocation="userLocation"
-			:positionList="positionList" :filteredPositions="filteredPositions" :searchKeyword="searchKeyword"
-			@relocate="handleRelocate" @scan="handleScan" @showList="showLocationList" @markerTap="selectPosition"
-			@mapCenterChange="onMapCenterChange" />
-
-		<!-- 底部操作栏：附近设备 / 扫码使用 / 我的 -->
-		<view class="bottom-actions">
-			<view class="action-btn secondary small btn-nearby" @click="showLocationList">
-				<view class="icon-wrap">
-					<image class="action-icon" src="/static/map.png" mode="aspectFit" />
-				</view>
-				<text class="action-label">附近设备</text>
-			</view>
-
-			<view class="action-btn primary btn-scan" @click="handleScan">
-				<view class="icon-wrap">
-					<image class="action-icon" src="/static/scan-icon.png" mode="aspectFit" />
-				</view>
-				<text class="action-label">扫码使用</text>
-			</view>
-
-			<view class="action-btn secondary small btn-my" @click="goMy">
-				<view class="icon-wrap">
-					<image class="action-icon" src="/static/user-active.png" mode="aspectFit" />
-				</view>
-				<text class="action-label">个人中心</text>
-			</view>
-		</view>
-
-		<!-- 地图加载状态 -->
-		<view v-if="isLoading || !userLocation" class="map-loading-placeholder">
-			<view class="loading-content">
-				<view class="loading-spinner"></view>
-				<text>正在获取位置信息...</text>
-			</view>
-		</view>
-
-
-
-		<!-- 场地列表弹窗 -->
-		<view class="location-popup" v-if="showLocationPopup">
-			<view class="popup-mask" @click="hideLocationList"></view>
-			<view class="location-sheet" :class="{ 'expanded': isExpanded }">
-				<!-- <view class="sheet-handle" @click="toggleSheet">
-					<view class="handle-bar"></view>
-				</view> -->
-
-				<view class="sheet-header">
-					<text class="sheet-title">附近设备场地 ({{ filteredPositions.length }})</text>
-					<view class="close-btn" @click="hideLocationList">
-						<!-- <image class="close-icon" src="/static/scan-icon.png" mode="aspectFit" /> -->
-						<uv-icon name='close'></uv-icon>
-					</view>
-				</view>
-
-				<scroll-view class="sheet-content" scroll-y="true">
-					<view class="position-item" v-for="(item, index) in filteredPositions" :key="item.positionId"
-						@click="selectPositionFromPopup(item)">
-						<view class="position-info">
-							<view class="position-name">{{ item.name }}</view>
-							<view class="status-tag" :class="item.status">
-								<text>{{ item.status === 'online' ? '可租借/归还' : '不可租借/归还' }}</text>
-							</view>
-							<view class="position-time" v-if="item.workTime && item.workTime !== '0'">
-								<text>营业时间：{{ item.workTime }}</text>
-							</view>
-						</view>
-						<view class="position-actions">
-							<view class="distance-info" v-if="item.distance">
-								<text>{{ item.distance }}</text>
-							</view>
-							<view class="status-tag" :class="item.status">
-								<text>{{ item.status === 'online' ? '营业中' : '暂停服务' }}</text>
-							</view>
-
-							<view class="nav-btn" @click.stop="navigateToPosition(item)">
-								<text>导航</text>
-							</view>
-						</view>
-					</view>
-
-					<view class="empty-state" v-if="filteredPositions.length === 0 && !isLoading">
-						<image class="empty-icon" src="/static/scan-icon.png" mode="aspectFit" />
-						<text class="empty-text">附近5公里内暂无设备</text>
-					</view>
-				</scroll-view>
-			</view>
-		</view>
-
-		<!-- 加载状态 -->
-		<view class="loading-overlay" v-if="isLoading">
-			<view class="loading-content">
-				<view class="loading-spinner"></view>
-				<text>正在获取场地信息...</text>
-			</view>
-		</view>
-
-		<!-- 手机号授权弹窗 -->
-		<view class="phone-auth-popup" v-if="showPhoneAuthPopup">
-			<view class="popup-mask" @click.stop="showPhoneAuthPopup = false"></view>
-			<view class="popup-content">
-				<view class="popup-header">
-					<text class="popup-title">授权获取手机号</text>
-				</view>
-				<view class="popup-body">
-					<view class="auth-desc">
-						<text>为了提供更好的服务和紧急联系，需要授权获取您的手机号</text>
-					</view>
-					<button class="auth-btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">
-						<text>一键获取手机号</text>
-					</button>
-					<view class="auth-cancel" @click="showPhoneAuthPopup = false">
-						<text>暂不授权</text>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script setup>
-	const redirectToLogin = () => {
-		try {
-			const pages = getCurrentPages()
-			const current = pages && pages.length ? pages[pages.length - 1] : null
-			const route = current && current.route ? ('/' + current.route) : '/pages/index/index'
-			const query = current && current.options ? Object.keys(current.options).map(k =>
-				`${k}=${encodeURIComponent(current.options[k])}`).join('&') : ''
-			const redirect = encodeURIComponent(query ? `${route}?${query}` : route)
-			uni.reLaunch({
-				url: `/pages/login/index?redirect=${redirect}`
-			})
-		} catch (e) {
-			uni.reLaunch({
-				url: '/pages/login/index'
-			})
-		}
-	}
-	import {
-		ref,
-		computed,
-		onMounted,
-		onUnmounted
-	} from 'vue'
-	import {
-		getQueryString,
-		wxLogin
-	} from '../../util/index.js'
-	import {
-		URL
-	} from "../../config/url.js"
-	import {
-		getDeviceInfo,
-		getPotionsDetail,
-		getNoticeTextData
-	} from '../../config/user.js'
-	// 导入地图工具函数
-	import {
-		getUserLocation,
-		getRegeo,
-		calculateDistanceSync,
-		testDistanceCalculation
-	} from '../../utils/mapUtils.js'
-	// 同样需要使用相对路径引入组件
-	// 注意：从 pages/index/ 目录访问 components/ 需要使用 ../../components/ 路径
-	import MapComponent from '../../components/MapComponent.vue'
-	// 开启右上角分享菜单（仅 mp-weixin 有效）
-	// #ifdef MP-WEIXIN
-	wx.showShareMenu({
-		withShareTicket: true,
-		menus: ['shareAppMessage', 'shareTimeline']
-	})
-	// #endif
-
-	// 响应式数据
-	const searchKeyword = ref('')
-	const userLocation = ref(null)
-	const positionList = ref([])
-	const filteredPositions = ref([])
-	const isExpanded = ref(false)
-	const isLoading = ref(false)
-	const showPhoneAuthPopup = ref(false)
-	const isLocationInitialized = ref(false)
-	const showLocationPopup = ref(false)
-
-	// 使用指南步骤
-	// 使用指南已取消
-
-	// 滚动通知内容
-	// const noticeText = ref('消费规则：每小时5元，不足1小时按1小时计费，最高24小时封顶，请爱护设备，使用后请及时归还')
-	
-	const noticeText = ref('')
-	const getNoticeText = async()=>{
-		const parasm = {
-			'title':'用户端公告'
-		}
-		const res = await getNoticeTextData(parasm);
-		noticeText.value = res.data.noticeContent;
-	}
-	
-	// 距离格式化函数
-	const formatDistance = (distanceInMeters) => {
-		if (distanceInMeters < 1000) {
-			return `${Math.round(distanceInMeters)}m`
-		} else {
-			return `${(distanceInMeters / 1000).toFixed(1)}km`
-		}
-	}
-
-
-	// 组件引用
-	const mapRef = ref(null)
-
-	// 计算属性
-	const searchPlaceholder = computed(() => {
-		if (userLocation.value && userLocation.value.address) {
-			return `${userLocation.value.district || '当前位置'} - 搜索附近场地`
-		}
-		return '搜索附近场地'
-	})
-
-	// 生命周期
-	onMounted(() => {
-		init()
-	})
-
-	onUnmounted(() => {
-		// 清理工作在子组件中处理
-	})
-
-	// 方法
-	const init = async () => {
-		isLoading.value = true
-		try {
-			// 开发环境测试距离计算
-			if (process.env.NODE_ENV === 'development') {
-				testDistanceCalculation()
-			}
-			await getNoticeText();
-			
-			// 1. 先获取用户位置
-			await getUserLocationAndAddress()
-
-			// 2. 加载场地列表
-			await loadPositions()
-
-			// 3. 检查是否需要显示使用指南（可以根据用户行为记录来决定）
-			// 这里暂时默认显示，后续可以根据用户使用情况优化
-
-		} catch (error) {
-			console.error('初始化失败:', error)
-			// 即使失败也要加载场地列表
-			await loadPositions()
-		} finally {
-			isLoading.value = false
-		}
-	}
-
-	const getUserLocationAndAddress = async () => {
-		try {
-			// 使用腾讯地图SDK获取位置
-			const location = await getUserLocation()
-
-			// 保存用户位置
-			userLocation.value = {
-				longitude: location.longitude,
-				latitude: location.latitude
-			}
-
-			console.log(userLocation.value);
-			// 将经纬度写入本地缓存（基础信息）
-			try {
-				uni.setStorageSync('userLocation', {
-					longitude: location.longitude,
-					latitude: location.latitude
-				})
-			} catch (e) {
-				console.warn('缓存基础定位信息失败:', e)
-			}
-
-			// 只在首次初始化时设置标记
-			if (!isLocationInitialized.value) {
-				isLocationInitialized.value = true
-			}
-
-			// 获取详细地址信息
-			try {
-				const addressResult = await getRegeo(location.longitude, location.latitude)
-				if (addressResult.success) {
-					const addressInfo = addressResult.data
-					userLocation.value.address = addressInfo.formatted_address
-					userLocation.value.city = addressInfo.addressComponent.city
-					userLocation.value.district = addressInfo.addressComponent.district
-
-					// 更新本地缓存，包含地址信息
-					try {
-						uni.setStorageSync('userLocation', {
-							longitude: userLocation.value.longitude,
-							latitude: userLocation.value.latitude,
-							address: userLocation.value.address,
-							city: userLocation.value.city,
-							district: userLocation.value.district
-						})
-					} catch (e) {
-						console.warn('缓存带地址的定位信息失败:', e)
-					}
-				}
-			} catch (error) {
-				// 忽略地址信息错误，使用基础定位信息
-			}
-
-			// 等待地图组件响应位置变化后，重新加载场地列表
-			setTimeout(async () => {
-				await loadPositions()
-
-				uni.hideLoading()
-			}, 800)
-
-		} catch (error) {
-			console.error('获取位置失败:', error)
-			uni.showToast({
-				title: '获取位置失败，显示默认地图',
-				icon: 'none'
-			})
-		}
-	}
-
-	const loadPositions = async () => {
-		try {
-			const res = await uni.request({
-				url: `${URL}/device/position/app/list`,
-				method: 'GET',
-				header: {
-					'Authorization': "Bearer " + uni.getStorageSync('token'),
-					'Clientid': uni.getStorageSync('client_id')
-				},
-				data: {
-					latitude: userLocation.value.latitude,
-					longitude: userLocation.value.longitude
-				}
-			})
-			console.log(res);
-
-			if (res.statusCode === 401 || res.data?.code === 401 || res.data?.code === 40101) {
-				redirectToLogin()
-				return
-			} else if (res.statusCode === 200 && res.data.code === 200) {
-				positionList.value = res.data.rows || []
-				calculateDistances()
-				filteredPositions.value = [...positionList.value]
-			} else {
-				console.error('获取场地列表失败:', res.data.msg)
-			}
-		} catch (error) {
-			console.error('获取场地列表异常:', error)
-		}
-	}
-
-	const calculateDistances = async (centerPoint = null) => {
-		// 如果没有指定中心点，优先使用用户位置，其次使用地图中心
-		const center = centerPoint || userLocation.value || (mapRef.value?.mapCenter)
-
-		// 严格检查center对象的有效性
-		if (!center || typeof center.longitude === 'undefined' || typeof center.latitude === 'undefined') {
-			return
-		}
-
-		positionList.value.forEach(item => {
-			if (item.longitude && item.latitude) {
-				try {
-					// 使用同步方法计算距离，避免await调用需要改动大量代码
-					const distanceInMeters = calculateDistanceSync(
-						center.latitude,
-						center.longitude,
-						parseFloat(item.latitude),
-						parseFloat(item.longitude)
-					)
-					// 使用智能距离格式化
-					item.distance = formatDistance(distanceInMeters)
-					// 同时保存原始米数用于排序和过滤
-					item.distanceInMeters = distanceInMeters
-				} catch (error) {
-					console.error('计算距离异常:', error, item)
-					item.distance = '999.0km' // 设置一个默认距离
-					item.distanceInMeters = 999000
-				}
-			}
-		})
-
-		// 按距离排序（使用米数进行排序）
-		positionList.value.sort((a, b) => {
-			return (a.distanceInMeters || 999000) - (b.distanceInMeters || 999000)
-		})
-	}
-
-	const loadPositionsByCenter = async (center) => {
-		try {
-			// 使用原有接口获取所有场地
-			const res = await uni.request({
-				url: `${URL}/device/position/app/list`,
-				method: 'GET',
-				header: {
-					'Authorization': "Bearer " + uni.getStorageSync('token'),
-					'Clientid': uni.getStorageSync('client_id')
-				}
-			})
-
-			if (res.statusCode === 401 || res.data?.code === 401 || res.data?.code === 40101) {
-				redirectToLogin()
-				return
-			} else if (res.statusCode === 200 && res.data.code === 200) {
-				positionList.value = res.data.rows || []
-				// 基于地图中心计算距离
-				calculateDistances(center)
-
-				// 可以选择性过滤距离过远的场地（比如超过10km的）
-				const maxDistanceInMeters = 10000 // 最大显示距离，单位米（10km）
-				filteredPositions.value = positionList.value.filter(item => {
-					return !item.distanceInMeters || item.distanceInMeters <= maxDistanceInMeters
-				})
-
-			} else {
-				console.error('根据地图中心加载场地失败:', res.data.msg)
-				positionList.value = []
-				filteredPositions.value = []
-			}
-		} catch (error) {
-			console.error('根据地图中心加载场地异常:', error)
-			// 如果请求失败，保持当前的场地列表不变
-		}
-	}
-
-	const handleRelocate = async () => {
-		try {
-			uni.showLoading({
-				title: '定位中...'
-			})
-			const loc = await getUserLocation()
-			const center = {
-				longitude: Number(loc.longitude),
-				latitude: Number(loc.latitude)
-			}
-			userLocation.value = center
-			try {
-				uni.setStorageSync('userLocation', center)
-			} catch (_) {}
-			if (mapRef.value && typeof mapRef.value.moveToLocation === 'function') {
-				mapRef.value.moveToLocation(center)
-			}
-			await loadPositionsByCenter(center)
-		} catch (e) {
-			uni.showToast({
-				title: '定位失败',
-				icon: 'none'
-			})
-		} finally {
-			uni.hideLoading()
-		}
-	}
-
-	const onMapCenterChange = (center) => {
-		if (center && typeof center.longitude !== 'undefined' && typeof center.latitude !== 'undefined') {
-			userLocation.value = {
-				longitude: Number(center.longitude),
-				latitude: Number(center.latitude)
-			}
-			try {
-				uni.setStorageSync('userLocation', userLocation.value)
-			} catch (_) {}
-		}
-		loadPositionsByCenter(center)
-	}
-
-	const selectPosition = (position) => {
-		uni.showActionSheet({
-			itemList: ['扫码使用', '导航前往'],
-			success: (res) => {
-				switch (res.tapIndex) {
-					case 0:
-						handleScan()
-						break
-					case 1:
-						navigateToPosition(position)
-						break
-				}
-			}
-		})
-	}
-
-	const goMy = () => {
-		uni.navigateTo({
-			url: '/pages/my/index'
-		})
-	}
-
-	const selectPositionFromPopup = (position) => {
-		// 先关闭弹窗
-		hideLocationList()
-
-		// 延迟一点时间再显示选择菜单，让弹窗关闭动画完成
-		setTimeout(() => {
-			selectPosition(position)
-		}, 200)
-	}
-
-	const navigateToPosition = (position) => {
-		const latitude = parseFloat(position.latitude)
-		const longitude = parseFloat(position.longitude)
-
-		uni.openLocation({
-			latitude,
-			longitude,
-			name: position.name,
-			address: position.location
-		})
-	}
-
-	const toggleSheet = () => {
-		isExpanded.value = !isExpanded.value
-	}
-
-	const onSearchInput = () => {
-		if (!searchKeyword.value.trim()) {
-			filteredPositions.value = [...positionList.value]
-		} else {
-			filteredPositions.value = positionList.value.filter(item => {
-				return item.name.includes(searchKeyword.value) ||
-					item.describe.includes(searchKeyword.value) ||
-					item.location.includes(searchKeyword.value)
-			})
-		}
-	}
-
-	const handleScan = async () => {
-		try {
-			const scanResult = await new Promise((resolve, reject) => {
-				uni.scanCode({
-					success: resolve,
-					fail: reject
-				})
-			})
-
-			let deviceNo = getQueryString(scanResult.path, 'deviceNo')
-
-			if (!deviceNo) {
-				uni.showToast({
-					title: '无效的设备二维码',
-					icon: 'none'
-				})
-				return
-			}
-
-			// 检查是否有使用中的订单
-			const inUseRes = await uni.request({
-				url: `${URL}/app/order/inUse`,
-				method: 'GET',
-				header: {
-					'Authorization': "Bearer " + uni.getStorageSync('token'),
-					'Clientid': uni.getStorageSync('client_id')
-				}
-			})
-
-			if (inUseRes.statusCode === 401 || inUseRes.data?.code === 401 || inUseRes.data?.code === 40101) {
-				redirectToLogin()
-				return
-			} else if (inUseRes.statusCode == 200 && inUseRes.data.code == 200 && inUseRes.data.data) {
-				const inUseOrder = inUseRes.data.data
-				uni.reLaunch({
-					url: `/pages/return/index?orderId=${inUseOrder.orderId}&deviceId=${deviceNo || inUseOrder.deviceNo}`
-				})
-				return
-			}
-
-			// 检查是否有待支付订单
-			const orderRes = await uni.request({
-				url: `${URL}/app/order/unpaid`,
-				method: 'GET',
-				header: {
-					'Authorization': "Bearer " + uni.getStorageSync('token'),
-					'Clientid': uni.getStorageSync('client_id')
-				}
-			})
-
-			if (orderRes.statusCode === 401 || orderRes.data?.code === 401 || orderRes.data?.code === 40101) {
-				redirectToLogin()
-				return
-			} else if (orderRes.statusCode == 200 && orderRes.data.code == 200 && orderRes.data.data) {
-				const unpaidOrder = orderRes.data.data
-				uni.navigateTo({
-					url: `/pages/order/payment?orderId=${unpaidOrder.orderId}`
-				})
-			} else {
-				try {
-					const deviceInfoRes = await getDeviceInfo(deviceNo)
-
-					if (deviceInfoRes.code == 200 && deviceInfoRes.data && deviceInfoRes.data.device) {
-						const deviceInfo = deviceInfoRes.data.device
-
-						if (deviceInfo.feeConfig) {
-							try {
-								const feeConfig = JSON.parse(deviceInfo.feeConfig)
-								uni.navigateTo({
-									url: `/pages/device/detail?deviceNo=${deviceNo}&feeConfig=${encodeURIComponent(deviceInfo.feeConfig)}`
-								})
-							} catch (e) {
-								uni.navigateTo({
-									url: `/pages/device/detail?deviceNo=${deviceNo}`
-								})
-							}
-						} else {
-							uni.navigateTo({
-								url: `/pages/device/detail?deviceNo=${deviceNo}`
-							})
-						}
-					} else {
-						uni.showToast({
-							title: '获取设备信息失败',
-							icon: 'none'
-						})
-						uni.navigateTo({
-							url: `/pages/device/detail?deviceNo=${deviceNo}`
-						})
-					}
-				} catch (error) {
-					console.error('获取设备信息异常:', error)
-					uni.navigateTo({
-						url: `/pages/device/detail?deviceNo=${deviceNo}`
-					})
-				}
-			}
-		} catch (error) {
-			console.error('扫码处理失败:', error)
-			// uni.showToast({
-			// 	title: '扫码失败',
-			// 	icon: 'none'
-			// })
-		}
-	}
-
-	const showLocationList = () => {
-		showLocationPopup.value = true
-	}
-
-	const hideLocationList = () => {
-		showLocationPopup.value = false
-	}
-
-	const onGetPhoneNumber = (e) => {
-		if (e.detail.errMsg === 'getPhoneNumber:ok') {
-			showPhoneAuthPopup.value = false
-		}
-	}
-</script>
-
-<script>
-	// 选用 Page 级分享钩子（uni-app 需普通 script 导出）
-	export default {
-		// 分享给朋友
-		onShareAppMessage() {
-			return {
-				title: '风电者 - 共享风扇暖手充电宝',
-				path: '/pages/index/index',
-				// imageUrl: '/static/logo.png'
-			}
-		},
-		// 朋友圈
-		onShareTimeline() {
-			return {
-				title: '风电者 - 共享风扇暖手充电宝',
-				query: '',
-				// imageUrl: '/static/logo.png'
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.container {
-		height: 100vh;
-		width: 100vw;
-		background-color: #fff;
-		display: flex;
-		flex-direction: column;
-	}
-
-	.fullscreen {
-		padding: 0;
-	}
-
-	/* 顶部Logo和通知栏 */
-	.header-section {
-		width: 92%;
-		margin: 0 auto 20rpx;
-	}
-
-	.logo-container {
-		display: flex;
-		align-items: center;
-		// margin-bottom: 16rpx;
-
-		.logo-image {
-			width: 80rpx;
-			height: 80rpx;
-			margin-right: 8rpx;
-		}
-
-		.app-name {
-			font-size: 36rpx;
-			font-weight: 600;
-			color: #333;
-		}
-	}
-
-
-	/* 地图标题 */
-	.map-title {
-		width: 92%;
-		margin: 0 auto 10rpx;
-		padding: 10rpx 0;
-
-		text {
-			font-size: 32rpx;
-			font-weight: 600;
-			color: #333;
-		}
-	}
-
-
-
-	/* 顶部搜索栏 */
-	.header-search {
-		padding: 20rpx 30rpx;
-		background: #ffffff;
-		border-bottom: 1px solid #f0f0f0;
-		z-index: 10;
-
-		.search-box {
-			display: flex;
-			align-items: center;
-			background: #f8f9fa;
-			border-radius: 50rpx;
-			padding: 0 20rpx;
-			height: 80rpx;
-
-			.search-icon {
-				width: 32rpx;
-				height: 32rpx;
-				margin-right: 16rpx;
-			}
-
-			.search-input {
-				flex: 1;
-				font-size: 28rpx;
-				color: #333;
-			}
-
-			.location-btn {
-				width: 60rpx;
-				height: 60rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				background: #2196F3;
-				border-radius: 50%;
-				margin-left: 16rpx;
-
-				.location-icon {
-					width: 24rpx;
-					height: 24rpx;
-				}
-			}
-		}
-	}
-
-	/* 场地列表弹窗 */
-	.location-popup {
-		position: fixed;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		z-index: 2000;
-		display: flex;
-		align-items: flex-end;
-		justify-content: center;
-
-		.popup-mask {
-			position: absolute;
-			top: 0;
-			left: 0;
-			right: 0;
-			bottom: 0;
-			background: rgba(0, 0, 0, 0.5);
-		}
-
-		.location-sheet {
-			background: #ffffff;
-			border-radius: 32rpx 32rpx 0 0;
-			box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.1);
-			max-height: 70vh;
-			transition: all 0.3s ease;
-			z-index: 1;
-			position: relative;
-			width: 100%;
-			display: flex;
-			flex-direction: column;
-			animation: slideUp 0.3s ease-out;
-
-			&.expanded {
-				max-height: 85vh;
-			}
-
-			.sheet-handle {
-				display: flex;
-				justify-content: center;
-				padding: 20rpx 0;
-				cursor: pointer;
-
-				.handle-bar {
-					width: 80rpx;
-					height: 8rpx;
-					background: #e0e0e0;
-					border-radius: 4rpx;
-				}
-			}
-
-			.sheet-header {
-				padding: 20rpx 30rpx;
-				border-bottom: 1px solid #f0f0f0;
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-
-				.sheet-title {
-					font-size: 32rpx;
-					font-weight: 600;
-					color: #333;
-				}
-
-				.close-btn {
-					width: 60rpx;
-					height: 60rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					background: #f0f0f0;
-					border-radius: 50%;
-					transition: all 0.2s ease;
-
-					&:active {
-						background: #e0e0e0;
-						transform: scale(0.95);
-					}
-
-					.close-icon {
-						width: 24rpx;
-						height: 24rpx;
-					}
-				}
-			}
-
-			.sheet-content {
-				padding: 20rpx 0;
-				height: 60vh;
-				/* 固定高度以保证小程序端 scroll-view 正常滚动 */
-			}
-		}
-	}
-
-	@keyframes slideUp {
-		from {
-			transform: translateY(100%);
-		}
-
-		to {
-			transform: translateY(0);
-		}
-	}
-
-	/* 场地列表项 */
-	.position-item {
-		display: flex;
-		align-items: center;
-		padding: 24rpx 30rpx;
-		border-bottom: 1px solid #f8f9fa;
-
-		.position-info {
-			flex: 1;
-
-			.position-name {
-				font-size: 32rpx;
-				font-weight: 500;
-				color: #333;
-				margin-bottom: 8rpx;
-			}
-
-			.position-desc {
-				font-size: 26rpx;
-				color: #666;
-				margin-bottom: 8rpx;
-			}
-
-			.position-location {
-				display: flex;
-				align-items: center;
-				margin-bottom: 8rpx;
-
-				.location-icon-small {
-					width: 24rpx;
-					height: 24rpx;
-					margin-right: 8rpx;
-				}
-
-				text {
-					font-size: 24rpx;
-					color: #999;
-				}
-			}
-
-			.position-time {
-				font-size: 24rpx;
-				color: #999;
-			}
-		}
-
-		.position-actions {
-			display: flex;
-			flex-direction: column;
-			align-items: flex-end;
-			gap: 8rpx;
-
-			.distance-info {
-				font-size: 24rpx;
-				color: #2196F3;
-				font-weight: 500;
-			}
-
-			.status-tag {
-				padding: 8rpx 16rpx;
-				border-radius: 20rpx;
-				font-size: 22rpx;
-
-				&.online {
-					background: #e8f5e8;
-					color: #4caf50;
-				}
-
-				&.offline {
-					background: #ffeaea;
-					color: #f44336;
-				}
-			}
-
-			.nav-btn {
-				padding: 12rpx 20rpx;
-				background: #2196F3;
-				border-radius: 20rpx;
-				font-size: 24rpx;
-				color: #ffffff;
-			}
-		}
-	}
-
-	/* 空状态 */
-	.empty-state {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		padding: 80rpx 0;
-
-		.empty-icon {
-			width: 120rpx;
-			height: 120rpx;
-			margin-bottom: 24rpx;
-			opacity: 0.5;
-		}
-
-		.empty-text {
-			font-size: 28rpx;
-			color: #999;
-		}
-	}
-
-	.status-tag {
-		padding: 8rpx 16rpx;
-		border-radius: 20rpx;
-		font-size: 22rpx;
-		width: fit-content;
-
-
-		&.online {
-			background: #e8f5e8;
-			color: #4caf50;
-		}
-
-		&.offline {
-			background: #ffeaea;
-			color: #f44336;
-		}
-
-		&.wait {
-			background: #ffeaea;
-			color: #f44336;
-		}
-	}
-
-	/* 底部操作栏 */
-	.bottom-actions {
-		position: fixed;
-		left: 20rpx;
-		right: 20rpx;
-		bottom: 40rpx;
-		z-index: 1200;
-		display: flex;
-		flex-direction: row;
-		align-items: center;
-		justify-content: space-between;
-		// gap: 16rpx;
-		padding: 0;
-
-		.action-btn {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			align-content: center;
-			justify-content: center;
-			font-size: 26rpx;
-			font-weight: 600;
-
-			&.primary {
-				background: #07c160;
-				color: #fff;
-				border-radius: 64rpx;
-				height: 100rpx;
-				min-width: 320rpx;
-				// box-shadow: 0 16rpx 40rpx rgba(7, 193, 96, 0.35);
-				padding: 12rpx 24rpx;
-
-				.icon-wrap {
-					width: 50rpx;
-					height: 50rpx;
-					border-radius: 50%;
-					// background: rgba(255, 255, 255, 0.25);
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					margin-bottom: 10rpx;
-				}
-			}
-
-			&.secondary {
-				// background: rgba(255, 255, 255, 0.95);
-				color: #333;
-				border-radius: 24rpx;
-				height: 100rpx;
-				min-width: 180rpx;
-				// box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
-				padding: 12rpx 16rpx;
-
-				.icon-wrap {
-					width: 40rpx;
-					height: 40rpx;
-					border-radius: 50%;
-					background: #f7f8fa;
-					border: 2rpx solid #eaeaea;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					margin-bottom: 10rpx;
-				}
-			}
-
-			&.small {
-				height: 120rpx;
-				min-width: 180rpx;
-				border-radius: 28rpx;
-			}
-		}
-
-		.btn-nearby,
-		.btn-my {
-			gap: 10rpx;
-		}
-
-		.btn-scan {
-			flex-direction: row;
-			gap: 14rpx;
-
-			.icon-wrap {
-				margin-bottom: 0;
-				margin-right: 12rpx;
-				// background: rgba(255, 255, 255, 0.25);
-				box-shadow: none;
-			}
-		}
-	}
-
-	/* 加载状态 */
-	.loading-overlay {
-		position: fixed;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		background: rgba(0, 0, 0, 0.5);
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		z-index: 1000;
-
-		.loading-content {
-			background: #ffffff;
-			border-radius: 16rpx;
-			padding: 40rpx;
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-
-			.loading-spinner {
-				width: 60rpx;
-				height: 60rpx;
-				border: 4rpx solid #f0f0f0;
-				border-top: 4rpx solid #2196F3;
-				border-radius: 50%;
-				animation: spin 1s linear infinite;
-				margin-bottom: 24rpx;
-			}
-
-			text {
-				font-size: 28rpx;
-				color: #666;
-			}
-		}
-	}
-
-	@keyframes spin {
-		0% {
-			transform: rotate(0deg);
-		}
-
-		100% {
-			transform: rotate(360deg);
-		}
-	}
-
-	/* 地图加载状态 */
-	.map-loading-placeholder {
-		position: absolute;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		background: #f6f7fb;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		z-index: 100;
-
-		.loading-content {
-			background: #ffffff;
-			border-radius: 16rpx;
-			padding: 40rpx;
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-
-			.loading-spinner {
-				width: 60rpx;
-				height: 60rpx;
-				border: 4rpx solid #f0f0f0;
-				border-top: 4rpx solid #2196F3;
-				border-radius: 50%;
-				animation: spin 1s linear infinite;
-				margin-bottom: 24rpx;
-			}
-
-			text {
-				font-size: 28rpx;
-				color: #666;
-			}
-		}
-	}
-
-	/* 手机号授权弹窗 */
-	.phone-auth-popup {
-		position: fixed;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		z-index: 2000;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-
-		.popup-mask {
-			position: absolute;
-			top: 0;
-			left: 0;
-			right: 0;
-			bottom: 0;
-			background: rgba(0, 0, 0, 0.5);
-		}
-
-		.popup-content {
-			background: #ffffff;
-			border-radius: 24rpx;
-			margin: 0 60rpx;
-			padding: 40rpx;
-			position: relative;
-			z-index: 1;
-
-			.popup-header {
-				text-align: center;
-				margin-bottom: 30rpx;
-
-				.popup-title {
-					font-size: 36rpx;
-					font-weight: 600;
-					color: #333;
-				}
-			}
-
-			.popup-body {
-				.auth-desc {
-					text-align: center;
-					margin-bottom: 40rpx;
-
-					text {
-						font-size: 28rpx;
-						color: #666;
-						line-height: 1.6;
-					}
-				}
-
-				.auth-btn {
-					width: 100%;
-					height: 88rpx;
-					background: #2196F3;
-					border-radius: 44rpx;
-					border: none;
-					color: #ffffff;
-					font-size: 32rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					margin-bottom: 20rpx;
-				}
-
-				.auth-cancel {
-					text-align: center;
-					padding: 20rpx;
-
-					text {
-						font-size: 28rpx;
-						color: #999;
-					}
-				}
-			}
-		}
-	}
-
-	.action-icon {
-		width: 42rpx;
-		height: 42rpx;
-		filter: none;
-		box-shadow: none;
-	}
-
-	.btn-scan .action-icon {
-		filter: brightness(0) invert(1);
-	}
-
-	.action-label {
-		line-height: 1;
-	}
-
-
-	.map-notice {
-		margin: 0 20rpx;
-		// position: absolute;
-		// left: 20rpx;
-		// right: 20rpx;
-		// top: 20rpx;
-		border-radius: 20rpx;
-		z-index: 15;
-	}
+<template>
+	<view class="container fullscreen">
+		<view class="" style="font-size: 32rpx;font-weight: 600;margin: 15rpx 20rpx;">风电者共享风扇&充电宝</view>
+		<view class="map-notice" v-if="noticeText">
+			<uv-notice-bar :text="noticeText" :speed="50" :show-icon="true" color="#07c160" bg-color="#E8F8EF"
+				icon="volume"></uv-notice-bar>
+		</view>
+
+		<!-- 全屏地图组件 -->
+		<MapComponent v-if="!isLoading && userLocation" ref="mapRef" :userLocation="userLocation"
+			:positionList="positionList" :filteredPositions="filteredPositions" :searchKeyword="searchKeyword"
+			@relocate="handleRelocate" @scan="handleScan" @showList="showLocationList" @markerTap="selectPosition"
+			@mapCenterChange="onMapCenterChange" />
+
+		<!-- 底部操作栏：附近设备 / 扫码使用 / 我的 -->
+		<view class="bottom-actions">
+			<!-- <view class="action-btn secondary small btn-nearby" @click="showLocationList">
+				<view class="icon-wrap">
+					<image class="action-icon" src="/static/map.png" mode="aspectFit" />
+				</view>
+				<text class="action-label">附近设备</text>
+			</view> -->
+
+			<view class="action-btn secondary small btn-nearby" @click="openPopup">
+				<view class="icon-wrap">
+					<image src="/static/use_help.png" class="action-icon" mode="aspectFit"></image>
+				</view>
+				<text class="action-label">使用指南</text>
+			</view>
+
+			<view class="action-btn primary btn-scan" @click="handleScan">
+				<view class="icon-wrap">
+					<image class="action-icon" src="/static/scan-icon.png" mode="aspectFill" />
+				</view>
+				<text class="primary-label">扫码使用</text>
+			</view>
+
+			<view class="action-btn secondary small btn-my" @click="goMy">
+				<view class="icon-wrap">
+					<image class="action-icon" src="/static/user.png" mode="aspectFit" />
+				</view>
+				<text class="action-label">个人中心</text>
+			</view>
+		</view>
+
+		<!-- 地图加载状态 -->
+		<view v-if="isLoading || !userLocation" class="map-loading-placeholder">
+			<view class="loading-content">
+				<view class="loading-spinner"></view>
+				<text>正在获取位置信息...</text>
+			</view>
+		</view>
+
+
+
+		<!-- 场地列表弹窗组件 -->
+		<LocationListSheet
+			:show="showLocationPopup"
+			:expanded="isExpanded"
+			:positions="filteredPositions"
+			:isLoading="isLoading"
+			title="附近设备场地"
+			@close="hideLocationList"
+			@select="selectPositionFromPopup"
+			@navigate="navigateToPosition"
+		/>
+
+		<!-- 加载状态 -->
+		<view class="loading-overlay" v-if="isLoading">
+			<view class="loading-content">
+				<view class="loading-spinner"></view>
+				<text>正在获取场地信息...</text>
+			</view>
+		</view>
+
+		<!-- 手机号授权弹窗 -->
+		<view class="phone-auth-popup" v-if="showPhoneAuthPopup">
+			<view class="popup-mask" @click.stop="showPhoneAuthPopup = false"></view>
+			<view class="popup-content">
+				<view class="popup-header">
+					<text class="popup-title">授权获取手机号</text>
+				</view>
+				<view class="popup-body">
+					<view class="auth-desc">
+						<text>为了提供更好的服务和紧急联系，需要授权获取您的手机号</text>
+					</view>
+					<button class="auth-btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">
+						<text>一键获取手机号</text>
+					</button>
+					<view class="auth-cancel" @click="showPhoneAuthPopup = false">
+						<text>暂不授权</text>
+					</view>
+				</view>
+			</view>
+		</view>
+
+		<!-- 使用指南：居中弹出（ref 控制 open/close） -->
+		<uv-popup ref="guidePopup" mode="center" round="24" :overlay="true" :closeOnClickOverlay="false" :safeAreaInsetBottom="false">
+			<view class="guide-popup">
+				<view class="guide-header">
+					<text class="guide-title">使用指南</text>
+					<!-- <view class="guide-close" @click="closeGuidePopup">
+						<uv-icon name="close" size="20"></uv-icon>
+					</view> -->
+				</view>
+				<view class="guide-content">
+					<view class="guide-step" v-for="(step, idx) in guideSteps" :key="idx">
+						<view class="step-index">{{ idx + 1 }}</view>
+						<view class="step-info">
+							<view class="step-title">{{ step.title }}</view>
+							<view class="step-desc">{{ step.desc }}</view>
+						</view>
+					</view>
+				</view>
+				<view class="guide-actions">
+					<!-- <view class="primary-btn" @click="closeGuidePopup"></view> -->
+						<view class="primary-btn" @click="closeGuidePopup">
+						<uv-icon name="close" size="20"></uv-icon>
+					</view>
+				</view>
+			</view>
+		</uv-popup>
+	</view>
+</template>
+
+<script setup>
+	import {
+		ref,
+		computed,
+		onMounted,
+		onUnmounted
+	} from 'vue'
+	import {
+		getQueryString,
+		wxLogin
+	} from '../../util/index.js'
+	import {
+		URL
+	} from "../../config/url.js"
+	import {
+		getDeviceInfo,
+		getPotionsDetail,
+		getNoticeTextData
+	} from '../../config/user.js'
+	// 导入地图工具函数
+	import {
+		getUserLocation,
+		getRegeo,
+		calculateDistanceSync,
+		testDistanceCalculation
+	} from '../../utils/mapUtils.js'
+	// 同样需要使用相对路径引入组件
+	// 注意：从 pages/index/ 目录访问 components/ 需要使用 ../../components/ 路径
+	import MapComponent from '../../components/MapComponent.vue'
+	import LocationListSheet from '../../components/LocationListSheet.vue'
+	// 开启右上角分享菜单（仅 mp-weixin 有效）
+	// #ifdef MP-WEIXIN
+	wx.showShareMenu({
+		withShareTicket: true,
+		menus: ['shareAppMessage', 'shareTimeline']
+	})
+	// #endif
+
+	// 响应式数据
+	const searchKeyword = ref('')
+	const userLocation = ref(null)
+	const positionList = ref([])
+	const filteredPositions = ref([])
+	const isExpanded = ref(false)
+	const isLoading = ref(false)
+	const showPhoneAuthPopup = ref(false)
+	const isLocationInitialized = ref(false)
+	const showLocationPopup = ref(false)
+
+	// 使用指南步骤
+	const guideSteps = ref([
+		{ title: '扫码使用', desc: '找到附近设备，扫描设备上的二维码' },
+		{ title: '免押金支付', desc: '无需支付押金，使用支付分免押即可完成租借' },
+		{ title: '开始使用', desc: '设备自动解锁，风扇弹出后取出即可开始使用' },
+		{ title: '归还设备', desc: '使用完毕后，按照设备规格要求将风扇还入即可结束订单' }
+	])
+
+	// 使用指南步骤
+	// 使用指南已取消
+
+	// 滚动通知内容
+	// const noticeText = ref('消费规则：每小时5元，不足1小时按1小时计费，最高24小时封顶，请爱护设备，使用后请及时归还')
+
+
+	const redirectToLogin = () => {
+		try {
+			const pages = getCurrentPages()
+			const current = pages && pages.length ? pages[pages.length - 1] : null
+			const route = current && current.route ? ('/' + current.route) : '/pages/index/index'
+			const query = current && current.options ? Object.keys(current.options).map(k =>
+				`${k}=${encodeURIComponent(current.options[k])}`).join('&') : ''
+			const redirect = encodeURIComponent(query ? `${route}?${query}` : route)
+			uni.reLaunch({
+				url: `/pages/login/index?redirect=${redirect}`
+			})
+		} catch (e) {
+			uni.reLaunch({
+				url: '/pages/login/index'
+			})
+		}
+	}
+
+	const noticeText = ref('')
+	const getNoticeText = async () => {
+		const parasm = {
+			'title': '用户端公告'
+		}
+		const res = await getNoticeTextData(parasm);
+		noticeText.value = res.data.noticeContent;
+	}
+
+	// 距离格式化函数
+	const formatDistance = (distanceInMeters) => {
+		if (distanceInMeters < 1000) {
+			return `${Math.round(distanceInMeters)}m`
+		} else {
+			return `${(distanceInMeters / 1000).toFixed(1)}km`
+		}
+	}
+
+
+	// 组件引用
+	const mapRef = ref(null)
+	const guidePopup = ref(null)
+
+	// 计算属性
+	const searchPlaceholder = computed(() => {
+		if (userLocation.value && userLocation.value.address) {
+			return `${userLocation.value.district || '当前位置'} - 搜索附近场地`
+		}
+		return '搜索附近场地'
+	})
+
+	// 生命周期
+	onMounted(() => {
+		init()
+	})
+
+	onUnmounted(() => {
+		// 清理工作在子组件中处理
+	})
+
+	// 方法
+	const init = async () => {
+		isLoading.value = true
+		try {
+			// 开发环境测试距离计算
+			if (process.env.NODE_ENV === 'development') {
+				testDistanceCalculation()
+			}
+			await getNoticeText();
+
+			// 1. 先获取用户位置
+			await getUserLocationAndAddress()
+
+			// 2. 加载场地列表
+			await loadPositions()
+
+			// 3. 检查是否需要显示使用指南（可以根据用户行为记录来决定）
+			// 这里暂时默认显示，后续可以根据用户使用情况优化
+
+		} catch (error) {
+			console.error('初始化失败:', error)
+			// 即使失败也要加载场地列表
+			await loadPositions()
+		} finally {
+			isLoading.value = false
+		}
+	}
+
+	const getUserLocationAndAddress = async () => {
+		try {
+			// 使用腾讯地图SDK获取位置
+			const location = await getUserLocation()
+
+			// 保存用户位置
+			userLocation.value = {
+				longitude: location.longitude,
+				latitude: location.latitude
+			}
+
+			console.log(userLocation.value);
+			// 将经纬度写入本地缓存（基础信息）
+			try {
+				uni.setStorageSync('userLocation', {
+					longitude: location.longitude,
+					latitude: location.latitude
+				})
+			} catch (e) {
+				console.warn('缓存基础定位信息失败:', e)
+			}
+
+			// 只在首次初始化时设置标记
+			if (!isLocationInitialized.value) {
+				isLocationInitialized.value = true
+			}
+
+			// 获取详细地址信息
+			try {
+				const addressResult = await getRegeo(location.longitude, location.latitude)
+				if (addressResult.success) {
+					const addressInfo = addressResult.data
+					userLocation.value.address = addressInfo.formatted_address
+					userLocation.value.city = addressInfo.addressComponent.city
+					userLocation.value.district = addressInfo.addressComponent.district
+
+					// 更新本地缓存，包含地址信息
+					try {
+						uni.setStorageSync('userLocation', {
+							longitude: userLocation.value.longitude,
+							latitude: userLocation.value.latitude,
+							address: userLocation.value.address,
+							city: userLocation.value.city,
+							district: userLocation.value.district
+						})
+					} catch (e) {
+						console.warn('缓存带地址的定位信息失败:', e)
+					}
+				}
+			} catch (error) {
+				// 忽略地址信息错误，使用基础定位信息
+			}
+
+			// 等待地图组件响应位置变化后，重新加载场地列表
+			setTimeout(async () => {
+				await loadPositions()
+
+				uni.hideLoading()
+			}, 800)
+
+		} catch (error) {
+			console.error('获取位置失败:', error)
+			uni.showToast({
+				title: '获取位置失败，显示默认地图',
+				icon: 'none'
+			})
+		}
+	}
+
+	const loadPositions = async () => {
+		try {
+			const res = await uni.request({
+				url: `${URL}/device/position/app/list`,
+				method: 'GET',
+				header: {
+					'Authorization': "Bearer " + uni.getStorageSync('token'),
+					'Clientid': uni.getStorageSync('client_id')
+				},
+				data: {
+					latitude: userLocation.value.latitude,
+					longitude: userLocation.value.longitude
+				}
+			})
+			console.log(res);
+
+			if (res.statusCode === 401 || res.data?.code === 401 || res.data?.code === 40101) {
+				redirectToLogin()
+				return
+			} else if (res.statusCode === 200 && res.data.code === 200) {
+				positionList.value = res.data.rows || []
+				calculateDistances()
+				filteredPositions.value = [...positionList.value]
+			} else {
+				console.error('获取场地列表失败:', res.data.msg)
+			}
+		} catch (error) {
+			console.error('获取场地列表异常:', error)
+		}
+	}
+
+	const calculateDistances = async (centerPoint = null) => {
+		// 如果没有指定中心点，优先使用用户位置，其次使用地图中心
+		const center = centerPoint || userLocation.value || (mapRef.value?.mapCenter)
+
+		// 严格检查center对象的有效性
+		if (!center || typeof center.longitude === 'undefined' || typeof center.latitude === 'undefined') {
+			return
+		}
+
+		positionList.value.forEach(item => {
+			if (item.longitude && item.latitude) {
+				try {
+					// 使用同步方法计算距离，避免await调用需要改动大量代码
+					const distanceInMeters = calculateDistanceSync(
+						center.latitude,
+						center.longitude,
+						parseFloat(item.latitude),
+						parseFloat(item.longitude)
+					)
+					// 使用智能距离格式化
+					item.distance = formatDistance(distanceInMeters)
+					// 同时保存原始米数用于排序和过滤
+					item.distanceInMeters = distanceInMeters
+				} catch (error) {
+					console.error('计算距离异常:', error, item)
+					item.distance = '999.0km' // 设置一个默认距离
+					item.distanceInMeters = 999000
+				}
+			}
+		})
+
+		// 按距离排序（使用米数进行排序）
+		positionList.value.sort((a, b) => {
+			return (a.distanceInMeters || 999000) - (b.distanceInMeters || 999000)
+		})
+	}
+
+	const loadPositionsByCenter = async (center) => {
+		try {
+			// 使用原有接口获取所有场地
+			const res = await uni.request({
+				url: `${URL}/device/position/app/list`,
+				method: 'GET',
+				header: {
+					'Authorization': "Bearer " + uni.getStorageSync('token'),
+					'Clientid': uni.getStorageSync('client_id')
+				}
+			})
+
+			if (res.statusCode === 401 || res.data?.code === 401 || res.data?.code === 40101) {
+				redirectToLogin()
+				return
+			} else if (res.statusCode === 200 && res.data.code === 200) {
+				positionList.value = res.data.rows || []
+				// 基于地图中心计算距离
+				calculateDistances(center)
+
+				// 可以选择性过滤距离过远的场地（比如超过10km的）
+				const maxDistanceInMeters = 10000 // 最大显示距离，单位米（10km）
+				filteredPositions.value = positionList.value.filter(item => {
+					return !item.distanceInMeters || item.distanceInMeters <= maxDistanceInMeters
+				})
+
+			} else {
+				console.error('根据地图中心加载场地失败:', res.data.msg)
+				positionList.value = []
+				filteredPositions.value = []
+			}
+		} catch (error) {
+			console.error('根据地图中心加载场地异常:', error)
+			// 如果请求失败，保持当前的场地列表不变
+		}
+	}
+
+	const handleRelocate = async () => {
+		try {
+			uni.showLoading({
+				title: '定位中...'
+			})
+			const loc = await getUserLocation()
+			const center = {
+				longitude: Number(loc.longitude),
+				latitude: Number(loc.latitude)
+			}
+			userLocation.value = center
+			try {
+				uni.setStorageSync('userLocation', center)
+			} catch (_) {}
+			if (mapRef.value && typeof mapRef.value.moveToLocation === 'function') {
+				mapRef.value.moveToLocation(center)
+			}
+			await loadPositionsByCenter(center)
+		} catch (e) {
+			uni.showToast({
+				title: '定位失败',
+				icon: 'none'
+			})
+		} finally {
+			uni.hideLoading()
+		}
+	}
+
+	const onMapCenterChange = (center) => {
+		if (center && typeof center.longitude !== 'undefined' && typeof center.latitude !== 'undefined') {
+			userLocation.value = {
+				longitude: Number(center.longitude),
+				latitude: Number(center.latitude)
+			}
+			try {
+				uni.setStorageSync('userLocation', userLocation.value)
+			} catch (_) {}
+		}
+		loadPositionsByCenter(center)
+	}
+
+	const selectPosition = (position) => {
+		uni.showActionSheet({
+			itemList: ['扫码使用', '导航前往'],
+			success: (res) => {
+				switch (res.tapIndex) {
+					case 0:
+						handleScan()
+						break
+					case 1:
+						navigateToPosition(position)
+						break
+				}
+			}
+		})
+	}
+
+	const goMy = () => {
+		uni.navigateTo({
+			url: '/pages/my/index'
+		})
+	}
+
+	const selectPositionFromPopup = (position) => {
+		// 先关闭弹窗
+		hideLocationList()
+
+		// 延迟一点时间再显示选择菜单，让弹窗关闭动画完成
+		setTimeout(() => {
+			selectPosition(position)
+		}, 200)
+	}
+
+	const navigateToPosition = (position) => {
+		const latitude = parseFloat(position.latitude)
+		const longitude = parseFloat(position.longitude)
+
+		uni.openLocation({
+			latitude,
+			longitude,
+			name: position.name,
+			address: position.location
+		})
+	}
+
+	const toggleSheet = () => {
+		isExpanded.value = !isExpanded.value
+	}
+
+	const onSearchInput = () => {
+		if (!searchKeyword.value.trim()) {
+			filteredPositions.value = [...positionList.value]
+		} else {
+			filteredPositions.value = positionList.value.filter(item => {
+				return item.name.includes(searchKeyword.value) ||
+					item.describe.includes(searchKeyword.value) ||
+					item.location.includes(searchKeyword.value)
+			})
+		}
+	}
+
+	const handleScan = async () => {
+		try {
+			const scanResult = await new Promise((resolve, reject) => {
+				uni.scanCode({
+					success: resolve,
+					fail: reject
+				})
+			})
+
+			let deviceNo = getQueryString(scanResult.path, 'deviceNo')
+
+			if (!deviceNo) {
+				uni.showToast({
+					title: '无效的设备二维码',
+					icon: 'none'
+				})
+				return
+			}
+
+			// 检查是否有使用中的订单
+			const inUseRes = await uni.request({
+				url: `${URL}/app/order/inUse`,
+				method: 'GET',
+				header: {
+					'Authorization': "Bearer " + uni.getStorageSync('token'),
+					'Clientid': uni.getStorageSync('client_id')
+				}
+			})
+
+		if (inUseRes.statusCode === 401 || inUseRes.data?.code === 401 || inUseRes.data?.code === 40101) {
+			redirectToLogin()
+			return
+		} else if (inUseRes.statusCode == 200 && inUseRes.data.code == 200 && inUseRes.data.data) {
+			const inUseOrder = inUseRes.data.data
+			uni.reLaunch({
+				url: `/pages/order/detail?orderId=${inUseOrder.orderId}&deviceId=${deviceNo || inUseOrder.deviceNo}`
+			})
+			return
+		}
+
+			// 检查是否有待支付订单
+			const orderRes = await uni.request({
+				url: `${URL}/app/order/unpaid`,
+				method: 'GET',
+				header: {
+					'Authorization': "Bearer " + uni.getStorageSync('token'),
+					'Clientid': uni.getStorageSync('client_id')
+				}
+			})
+
+			if (orderRes.statusCode === 401 || orderRes.data?.code === 401 || orderRes.data?.code === 40101) {
+				redirectToLogin()
+				return
+			} else if (orderRes.statusCode == 200 && orderRes.data.code == 200 && orderRes.data.data) {
+				const unpaidOrder = orderRes.data.data
+				uni.navigateTo({
+					url: `/pages/order/payment?orderId=${unpaidOrder.orderId}`
+				})
+			} else {
+				try {
+					const deviceInfoRes = await getDeviceInfo(deviceNo)
+
+					if (deviceInfoRes.code == 200 && deviceInfoRes.data && deviceInfoRes.data.device) {
+						const deviceInfo = deviceInfoRes.data.device
+
+						if (deviceInfo.feeConfig) {
+							try {
+								const feeConfig = JSON.parse(deviceInfo.feeConfig)
+								uni.navigateTo({
+									url: `/pages/device/detail?deviceNo=${deviceNo}&feeConfig=${encodeURIComponent(deviceInfo.feeConfig)}`
+								})
+							} catch (e) {
+								uni.navigateTo({
+									url: `/pages/device/detail?deviceNo=${deviceNo}`
+								})
+							}
+						} else {
+							uni.navigateTo({
+								url: `/pages/device/detail?deviceNo=${deviceNo}`
+							})
+						}
+					} else {
+						uni.showToast({
+							title: '获取设备信息失败',
+							icon: 'none'
+						})
+						uni.navigateTo({
+							url: `/pages/device/detail?deviceNo=${deviceNo}`
+						})
+					}
+				} catch (error) {
+					console.error('获取设备信息异常:', error)
+					uni.navigateTo({
+						url: `/pages/device/detail?deviceNo=${deviceNo}`
+					})
+				}
+			}
+		} catch (error) {
+			console.error('扫码处理失败:', error)
+			// uni.showToast({
+			// 	title: '扫码失败',
+			// 	icon: 'none'
+			// })
+		}
+	}
+
+	const showLocationList = () => {
+		showLocationPopup.value = true
+	}
+
+	const hideLocationList = () => {
+		showLocationPopup.value = false
+	}
+
+	const onGetPhoneNumber = (e) => {
+		if (e.detail.errMsg === 'getPhoneNumber:ok') {
+			showPhoneAuthPopup.value = false
+		}
+	}
+	
+	// 使用指南弹窗控制
+	const openPopup = () => {
+		try {
+			guidePopup.value && typeof guidePopup.value.open === 'function' && guidePopup.value.open()
+		} catch (e) {}
+	}
+
+	const closeGuidePopup = () => {
+		try {
+			guidePopup.value && typeof guidePopup.value.close === 'function' && guidePopup.value.close()
+		} catch (e) {}
+	}
+</script>
+
+<script>
+	// 选用 Page 级分享钩子（uni-app 需普通 script 导出）
+	export default {
+		// 分享给朋友
+		onShareAppMessage() {
+			return {
+				title: '风电者 - 共享风扇暖手充电宝',
+				path: '/pages/index/index',
+				// imageUrl: '/static/logo.png'
+			}
+		},
+		// 朋友圈
+		onShareTimeline() {
+			return {
+				title: '风电者 - 共享风扇暖手充电宝',
+				query: '',
+				// imageUrl: '/static/logo.png'
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.container {
+		height: 100vh;
+		width: 100vw;
+		background-color: #fff;
+		display: flex;
+		flex-direction: column;
+	}
+
+	.fullscreen {
+		padding: 0;
+	}
+
+	/* 顶部Logo和通知栏 */
+	.header-section {
+		width: 92%;
+		margin: 0 auto 20rpx;
+	}
+
+	.logo-container {
+		display: flex;
+		align-items: center;
+		// margin-bottom: 16rpx;
+
+		.logo-image {
+			width: 80rpx;
+			height: 80rpx;
+			margin-right: 8rpx;
+		}
+
+		.app-name {
+			font-size: 36rpx;
+			font-weight: 600;
+			color: #333;
+		}
+	}
+
+
+	/* 地图标题 */
+	.map-title {
+		width: 92%;
+		margin: 0 auto 10rpx;
+		padding: 10rpx 0;
+
+		text {
+			font-size: 32rpx;
+			font-weight: 600;
+			color: #333;
+		}
+	}
+
+
+
+	/* 顶部搜索栏 */
+	.header-search {
+		padding: 20rpx 30rpx;
+		background: #ffffff;
+		border-bottom: 1px solid #f0f0f0;
+		z-index: 10;
+
+		.search-box {
+			display: flex;
+			align-items: center;
+			background: #f8f9fa;
+			border-radius: 50rpx;
+			padding: 0 20rpx;
+			height: 80rpx;
+
+			.search-icon {
+				width: 32rpx;
+				height: 32rpx;
+				margin-right: 16rpx;
+			}
+
+			.search-input {
+				flex: 1;
+				font-size: 28rpx;
+				color: #333;
+			}
+
+			.location-btn {
+				width: 60rpx;
+				height: 60rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				background: #2196F3;
+				border-radius: 50%;
+				margin-left: 16rpx;
+
+				.location-icon {
+					width: 24rpx;
+					height: 24rpx;
+				}
+			}
+		}
+	}
+
+	/* 场地列表弹窗 */
+	.location-popup {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		z-index: 2000;
+		display: flex;
+		align-items: flex-end;
+		justify-content: center;
+
+		.popup-mask {
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			background: rgba(0, 0, 0, 0.5);
+		}
+
+		.location-sheet {
+			background: #ffffff;
+			border-radius: 32rpx 32rpx 0 0;
+			box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.1);
+			max-height: 70vh;
+			transition: all 0.3s ease;
+			z-index: 1;
+			position: relative;
+			width: 100%;
+			display: flex;
+			flex-direction: column;
+			animation: slideUp 0.3s ease-out;
+
+			&.expanded {
+				max-height: 85vh;
+			}
+
+			.sheet-handle {
+				display: flex;
+				justify-content: center;
+				padding: 20rpx 0;
+				cursor: pointer;
+
+				.handle-bar {
+					width: 80rpx;
+					height: 8rpx;
+					background: #e0e0e0;
+					border-radius: 4rpx;
+				}
+			}
+
+			.sheet-header {
+				padding: 20rpx 30rpx;
+				border-bottom: 1px solid #f0f0f0;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				.sheet-title {
+					font-size: 32rpx;
+					font-weight: 600;
+					color: #333;
+				}
+
+				.close-btn {
+					width: 60rpx;
+					height: 60rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					background: #f0f0f0;
+					border-radius: 50%;
+					transition: all 0.2s ease;
+
+					&:active {
+						background: #e0e0e0;
+						transform: scale(0.95);
+					}
+
+					.close-icon {
+						width: 24rpx;
+						height: 24rpx;
+					}
+				}
+			}
+
+			.sheet-content {
+				padding: 20rpx 0;
+				height: 60vh;
+				/* 固定高度以保证小程序端 scroll-view 正常滚动 */
+			}
+		}
+	}
+
+	@keyframes slideUp {
+		from {
+			transform: translateY(100%);
+		}
+
+		to {
+			transform: translateY(0);
+		}
+	}
+
+	/* 场地列表项 */
+	.position-item {
+		display: flex;
+		align-items: center;
+		padding: 24rpx 30rpx;
+		border-bottom: 1px solid #f8f9fa;
+
+		.position-info {
+			flex: 1;
+
+			.position-name {
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #333;
+				margin-bottom: 8rpx;
+			}
+
+			.position-desc {
+				font-size: 26rpx;
+				color: #666;
+				margin-bottom: 8rpx;
+			}
+
+			.position-location {
+				display: flex;
+				align-items: center;
+				margin-bottom: 8rpx;
+
+				.location-icon-small {
+					width: 24rpx;
+					height: 24rpx;
+					margin-right: 8rpx;
+				}
+
+				text {
+					font-size: 24rpx;
+					color: #999;
+				}
+			}
+
+			.position-time {
+				font-size: 24rpx;
+				color: #999;
+			}
+		}
+
+		.position-actions {
+			display: flex;
+			flex-direction: column;
+			align-items: flex-end;
+			gap: 8rpx;
+
+			.distance-info {
+				font-size: 24rpx;
+				color: #2196F3;
+				font-weight: 500;
+			}
+
+			.status-tag {
+				padding: 8rpx 16rpx;
+				border-radius: 20rpx;
+				font-size: 22rpx;
+
+				&.online {
+					background: #e8f5e8;
+					color: #4caf50;
+				}
+
+				&.offline {
+					background: #ffeaea;
+					color: #f44336;
+				}
+			}
+
+			.nav-btn {
+				padding: 12rpx 20rpx;
+				background: #2196F3;
+				border-radius: 20rpx;
+				font-size: 24rpx;
+				color: #ffffff;
+			}
+		}
+	}
+
+	/* 空状态 */
+	.empty-state {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		padding: 80rpx 0;
+
+		.empty-icon {
+			width: 120rpx;
+			height: 120rpx;
+			margin-bottom: 24rpx;
+			opacity: 0.5;
+		}
+
+		.empty-text {
+			font-size: 28rpx;
+			color: #999;
+		}
+	}
+
+	.status-tag {
+		padding: 8rpx 16rpx;
+		border-radius: 20rpx;
+		font-size: 22rpx;
+		width: fit-content;
+
+
+		&.online {
+			background: #e8f5e8;
+			color: #4caf50;
+		}
+
+		&.offline {
+			background: #ffeaea;
+			color: #f44336;
+		}
+
+		&.wait {
+			background: #ffeaea;
+			color: #f44336;
+		}
+	}
+
+	/* 底部操作栏 */
+	.bottom-actions {
+		position: fixed;
+		left: 20rpx;
+		right: 20rpx;
+		bottom: 40rpx;
+		z-index: 1200;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+		// gap: 16rpx;
+		padding: 0;
+
+		.action-btn {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			align-content: center;
+			justify-content: center;
+			font-size: 26rpx;
+			font-weight: 600;
+
+			&.primary {
+				background: #3EAB64;
+				color: #fff;
+				border-radius: 64rpx;
+				height: 100rpx;
+				min-width: 320rpx;
+				// box-shadow: 0 16rpx 40rpx rgba(7, 193, 96, 0.35);
+				padding: 12rpx 24rpx;
+
+				.icon-wrap {
+					width: 50rpx;
+					height: 50rpx;
+					border-radius: 50%;
+					// background: rgba(255, 255, 255, 0.25);
+					display: flex;
+					align-items: center;
+					align-content: center;
+					justify-content: center;
+					// margin-bottom: 10rpx;
+				}
+			}
+
+			&.secondary {
+				// background: rgba(255, 255, 255, 0.95);
+				color: #333;
+				border-radius: 24rpx;
+				height: 100rpx;
+				min-width: 180rpx;
+				// box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
+				padding: 12rpx 16rpx;
+
+				.icon-wrap {
+					width: 40rpx;
+					height: 40rpx;
+					border-radius: 50%;
+					// background: #f7f8fa;
+					// border: 2rpx solid #eaeaea;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					margin-bottom: 10rpx;
+				}
+			}
+
+			&.small {
+				height: 120rpx;
+				min-width: 180rpx;
+				border-radius: 28rpx;
+			}
+		}
+
+		.btn-nearby,
+		.btn-my {
+			gap: 10rpx;
+		}
+
+		.btn-scan {
+			/* 尺寸与布局（覆盖 primary 的默认尺寸） */
+			height: 112rpx;
+			min-width: 360rpx;
+			padding: 0 32rpx;
+			border-radius: 56rpx;
+			flex-direction: row;
+			// gap: 16rpx;
+			align-items: center;
+			justify-content: center;
+
+			/* 左侧图标容器 */
+			.icon-wrap {
+				width: 64rpx;
+				height: 64rpx;
+				border-radius: 50%;
+				margin: 0;
+				margin-right: 12rpx;
+				// background: rgba(255, 255, 255, 0.18);
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				box-shadow: none;
+			}
+
+			/* 图标大小与反色 */
+			.action-icon {
+				width: 40rpx;
+				height: 40rpx;
+				filter: brightness(0) invert(1);
+			}
+		}
+	}
+
+	/* 加载状态 */
+	.loading-overlay {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		background: rgba(0, 0, 0, 0.5);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		z-index: 1000;
+
+		.loading-content {
+			background: #ffffff;
+			border-radius: 16rpx;
+			padding: 40rpx;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+
+			.loading-spinner {
+				width: 60rpx;
+				height: 60rpx;
+				border: 4rpx solid #f0f0f0;
+				border-top: 4rpx solid #2196F3;
+				border-radius: 50%;
+				animation: spin 1s linear infinite;
+				margin-bottom: 24rpx;
+			}
+
+			text {
+				font-size: 28rpx;
+				color: #666;
+			}
+		}
+	}
+
+	@keyframes spin {
+		0% {
+			transform: rotate(0deg);
+		}
+
+		100% {
+			transform: rotate(360deg);
+		}
+	}
+
+	/* 地图加载状态 */
+	.map-loading-placeholder {
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		background: #f6f7fb;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		z-index: 100;
+
+		.loading-content {
+			background: #ffffff;
+			border-radius: 16rpx;
+			padding: 40rpx;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+
+			.loading-spinner {
+				width: 60rpx;
+				height: 60rpx;
+				border: 4rpx solid #f0f0f0;
+				border-top: 4rpx solid #2196F3;
+				border-radius: 50%;
+				animation: spin 1s linear infinite;
+				margin-bottom: 24rpx;
+			}
+
+			text {
+				font-size: 28rpx;
+				color: #666;
+			}
+		}
+	}
+
+	/* 手机号授权弹窗 */
+	.phone-auth-popup {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		z-index: 2000;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+
+		.popup-mask {
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			background: rgba(0, 0, 0, 0.5);
+		}
+
+		.popup-content {
+			background: #ffffff;
+			border-radius: 24rpx;
+			margin: 0 60rpx;
+			padding: 40rpx;
+			position: relative;
+			z-index: 1;
+
+			.popup-header {
+				text-align: center;
+				margin-bottom: 30rpx;
+
+				.popup-title {
+					font-size: 36rpx;
+					font-weight: 600;
+					color: #333;
+				}
+			}
+
+			.popup-body {
+				.auth-desc {
+					text-align: center;
+					margin-bottom: 40rpx;
+
+					text {
+						font-size: 28rpx;
+						color: #666;
+						line-height: 1.6;
+					}
+				}
+
+				.auth-btn {
+					width: 100%;
+					height: 88rpx;
+					background: #2196F3;
+					border-radius: 44rpx;
+					border: none;
+					color: #ffffff;
+					font-size: 32rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					margin-bottom: 20rpx;
+				}
+
+				.auth-cancel {
+					text-align: center;
+					padding: 20rpx;
+
+					text {
+						font-size: 28rpx;
+						color: #999;
+					}
+				}
+			}
+		}
+	}
+
+	.action-icon {
+		width: 42rpx;
+		height: 42rpx;
+		filter: none;
+		box-shadow: none;
+	}
+
+	.btn-scan .action-icon {
+		filter: brightness(0) invert(1);
+	}
+
+	.action-label {
+		line-height: 1;
+	}
+	
+	.map-notice {
+		margin: 0 20rpx;
+		// position: absolute;
+		// left: 20rpx;
+		// right: 20rpx;
+		// top: 20rpx;
+		border-radius: 20rpx;
+		z-index: 15;
+	}
+
+	/* 使用指南弹窗样式 */
+	.guide-popup {
+		width: 640rpx;
+		max-width: 86vw;
+		background: #ffffff;
+		border-radius: 24rpx;
+		padding: 24rpx 24rpx 16rpx;
+		box-sizing: border-box;
+	}
+
+	.guide-header {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		position: relative;
+		margin-bottom: 8rpx;
+	}
+
+	.guide-title {
+		font-size: 32rpx;
+		font-weight: 600;
+		color: #333;
+	}
+
+	.guide-close {
+		position: absolute;
+		right: 0;
+		top: 0;
+		width: 48rpx;
+		height: 48rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		background: #f5f5f5;
+		border-radius: 50%;
+	}
+
+	.guide-content {
+		max-height: 600rpx;
+		padding: 8rpx 4rpx 4rpx;
+		box-sizing: border-box;
+	}
+
+	.guide-step {
+		display: flex;
+		align-items: flex-start;
+		gap: 16rpx;
+		padding: 16rpx 0;
+		border-bottom: 1px solid #f5f5f5;
+	}
+
+	.step-index {
+		width: 40rpx;
+		height: 40rpx;
+		border-radius: 50%;
+		background: #07c160;
+		color: #ffffff;
+		font-weight: 600;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.step-info {
+		flex: 1;
+	}
+
+	.step-title {
+		font-size: 28rpx;
+		font-weight: 600;
+		color: #333;
+		margin-bottom: 6rpx;
+	}
+
+	.step-desc {
+		font-size: 24rpx;
+		color: #666;
+		line-height: 1.6;
+	}
+
+	.guide-actions {
+		margin-top:20rpx;
+	}
+
+	.primary-btn {
+		// width: 100%;
+		width: 80rpx;
+		height: 80rpx;
+		padding: 20rpx;
+		border-radius: 40rpx;
+		background: #DDEFE3;
+		color: #ffffff;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		margin: auto;
+		font-size: 28rpx;
+		font-weight: 600;
+	}
+
+
+	.primary-label{
+		color:#ffffff;
+		font-size: 32rpx;
+		font-weight: 600;
+	}
 </style>
\ No newline at end of file
diff --git a/pages/my/index.vue b/pages/my/index.vue
index 21ff32a..3ac3f2e 100644
--- a/pages/my/index.vue
+++ b/pages/my/index.vue
@@ -1,124 +1,109 @@
 <template>
-	<view class="profile-container">
-		<!-- 用户信息区域 -->
-		<view class="header-section">
-			<view class="user-profile" @click="handleUserProfileClick">
-				<view class="avatar-container">
-					<image class="avatar" v-if="userInfo.avatar" :src="userInfo.avatar" mode="aspectFill">
-					</image>
-					<image v-else class="avatar" src="@/static/user-active.png" mode="aspectFill"></image>
-					<view class="avatar-badge" v-if="userInfo.isAdmin"></view>
-				</view>
-
-				<view class="user-details" v-if="userInfo">
-					<view class="username">{{ userInfo.nickName }}</view>
-					<view class="user-id">{{ userInfo.phone ? maskPhone(userInfo.phone) : '未绑定手机号' }}</view>
-				</view>
-
-				<view class="user-details" v-else>
-					<view class="username">点击登录</view>
-					<view class="user-id">授权登录后享受更多服务</view>
-				</view>
-
-				<view class="edit-profile">
-					<uni-icons type="right" size="16" color="#999"></uni-icons>
-				</view>
+	<view class="my-page">
+		<view class="user-card">
+			<view class="avatar-box">
+				<image class="avatar" v-if="userInfo.avatar" :src="userInfo.avatar" mode="aspectFill"></image>
+				<image v-else class="avatar" src="@/static/head.png" mode="aspectFill"></image>
+				<!-- 覆盖在头像上的微信选择头像授权按钮，仅小程序生效 -->
+				<!-- #ifdef MP-WEIXIN -->
+				<button class="avatar-choose-btn" open-type="chooseAvatar" @chooseavatar="onChooseAvatar"></button>
+				<!-- #endif -->
 			</view>
+			<view class="user-text">
+				<view class="nickname">{{ userInfo.nickName || '点击登录' }}</view>
+				<view class="subtext">{{ userInfo.phone ? maskPhone(userInfo.phone) : '授权登录后可查看订单与资产' }}</view>
+			</view>
+			<uv-icon type="right" size="16" color="#999"></uv-icon>
 		</view>
 
-		<!-- 余额卡片 -->
-		<view class="balance-card">
-			<view class="balance-info">
-				<view class="balance-label">押金余额</view>
-				<view class="balance-amount">¥{{ deposit }}</view>
+	
+		<!-- <view class="assets-card">
+			<view class="assets-left">
+				<view class="label">押金余额</view>
+				<view class="amount">¥{{ deposit }}</view>
 			</view>
-			<view class="action-button" @click="handleWithdraw">
-				<text>提现</text>
-			</view>
-		</view>
-
-		<!-- 功能区域列表 -->
-		<view class="function-list">
-			<!-- 订单中心 -->
-			<view class="function-item" @click="navigateTo('/pages/order/index')">
-				<view class="item-left">
-					<view class="item-icon">
-						<image src="/static/jl.png" mode="aspectFit"></image>
-					</view>
-					<text class="item-title">订单中心</text>
-				</view>
-				<view class="item-right">
-					<uni-icons type="right" size="16" color="#999"></uni-icons>
-				</view>
-			</view>
-
-			<!-- 投诉建议 -->
-			<view class="function-item" @click="navigateTo('/pages/feedback/index')">
-				<view class="item-left">
-					<view class="item-icon">
-						<image src="/static/complaint.png" mode="aspectFit"></image>
-					</view>
-					<text class="item-title">投诉建议</text>
-				</view>
-				<view class="item-right">
-					<uni-icons type="right" size="16" color="#999"></uni-icons>
-				</view>
-			</view>
-
-			<!-- 帮助中心 -->
-			<view class="function-item" @click="navigateTo('/pages/help/index')">
-				<view class="item-left">
-					<view class="item-icon">
-						<image src="/static/hlep.png" mode="aspectFit"></image>
-					</view>
-					<text class="item-title">帮助中心</text>
-				</view>
-				<view class="item-right">
-					<uni-icons type="right" size="16" color="#999"></uni-icons>
-				</view>
-			</view>
-			<view class="function-item" @click="navigateTo('/pages/expressReturn/index')">
-				<view class="item-left">
-					<view class="item-icon">
-						<image src="/static/express.png" mode="aspectFit"></image>
-					</view>
-					<text class="item-title">快递归还</text>
-				</view>
-				<view class="item-right">
-					<uni-icons type="right" size="16" color="#999"></uni-icons>
-				</view>
-			</view>
-			<view class="function-item" @click="doLogout()">
-				<view class="item-left">
-					<view class="item-icon">
-						<image src="/static/logout.png" mode="aspectFit"></image>
-					</view>
-					<text class="item-title">退出登录</text>
-				</view>
-				<view class="item-right">
-					<uni-icons type="right" size="16" color="#999"></uni-icons>
-				</view>
-			</view>
-		</view>
-
-		<!-- 
-		<view class="section-title">设置</view>
-
-		<view class="settings-list">
-			<view 
-				v-for="(item, index) in settingItems" 
-				:key="index"
-				class="settings-item" 
-				@click="item.action">
-				<view class="settings-item-left">
-					<uni-icons :type="item.icon" size="20" color="#4facfe"></uni-icons>
-					<text>{{ item.name }}</text>
-				</view>
-				<uni-icons type="right" size="16" color="#999"></uni-icons>
+			<view class="assets-right" @click="handleWithdraw">
+				<text class="withdraw-btn">提现</text>
 			</view>
 		</view> -->
 
-		<!-- 		<u-popup ref="authPopup" mode="center" border-radius="15" width="600rpx" @open="onPopupOpen" @close="onPopupClose">
+		<view class="section">
+			<view class="banner-card">
+			<image class="banner-image" src="/static/userCenter_swiper.png" mode="aspectFill"></image>
+		</view>
+			<!-- <view class="section-title">常用服务</view> -->
+			<view class="list">
+				<view class="list-item" @click="handleQuickReturn">
+					<view class="left">
+						<image class="icon" src="/static/express_return.png" mode="aspectFit"></image>
+						<text class="title">快速归还</text>
+					</view>
+					<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+				</view>
+				<view class="list-item" @click="navigateTo('/pages/expressReturn/index')">
+					<view class="left">
+						<image class="icon" src="/static/express.png" mode="aspectFit"></image>
+						<text class="title">快递归还记录</text>
+					</view>
+					<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+				</view>
+				<view class="list-item" @click="navigateTo('/pages/order/index')">
+					<view class="left">
+						<image class="icon" src="/static/orderList.png" mode="aspectFit"></image>
+						<text class="title">我的订单</text>
+					</view>
+					<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+				</view>
+				<view class="list-item" @click="navigateTo('/pages/help/index')">
+					<view class="left">
+						<image class="icon" src="/static/customer-service.png" mode="aspectFit"></image>
+						<text class="title">客服中心</text>
+					</view>
+					<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+				</view>
+				<view class="list-item" @click="navigateTo('/pages/feedback/index')">
+					<view class="left">
+						<image class="icon" src="/static/complaint.png" mode="aspectFit"></image>
+						<text class="title">投诉与建议</text>
+					</view>
+					<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+				</view>
+				<view class="list-item" @click="navigateTo('/pages/legal/agreement')">
+					<view class="left">
+						<image class="icon" src="/static/peopleInWork.png" mode="aspectFit"></image>
+						<text class="title">营业资质</text>
+					</view>
+					<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+				</view>
+				<view class="list-item" @click="navigateTo('/pages/serve/bagCheck/index')">
+					<view class="left">
+						<image class="icon" src="/static/other_device.png" mode="aspectFit"></image>
+						<text class="title">合作加盟</text>
+					</view>
+					<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+				</view>
+				<view class="list-item" @click="navigateTo('/pages/setting/index')">
+					<view class="left">
+						<image class="icon" src="/static/setting.png" mode="aspectFit"></image>
+						<text class="title">设置</text>
+					</view>
+					<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+				</view>
+			</view>
+		</view>
+
+		<view class="footer-agreements">
+			<view class="link-box">
+			<text class="link" @click="navigateTo('/pages/legal/agreement')">《服务条款》</text>
+				<text class="sep">｜</text>
+				<text class="link" @click="navigateTo('/pages/legal/privacy')">《隐私政策》</text>
+			</view>
+			<view class="version">v{{ appVersion }}</view>
+		</view>
+
+		<!-- 保留授权弹窗，暂不启用 -->
+		<!--
+		<u-popup ref="authPopup" mode="center" border-radius="15" width="600rpx" @open="onPopupOpen" @close="onPopupClose">
 			<view class="auth-popup">
 				<view class="auth-title">授权登录</view>
 				<view class="auth-desc">获取您的微信头像、昵称等公开信息</view>
@@ -127,7 +112,8 @@
 					<button class="confirm-btn" @click="getUserProfile">确定</button>
 				</view>
 			</view>
-		</u-popup> -->
+		</u-popup>
+		-->
 	</view>
 </template>
 
@@ -142,9 +128,9 @@
 		wxLogin,
 		getUserInfo
 	} from '../../util/index.js';
-	import {
-		userLogout
-	} from '@/config/user.js'
+	import { uploadUserAvatar } from '../../config/user.js'
+	import { URL } from '../../config/url.js'
+// 设置页执行退出登录，此页不再直接调用
 
 	// 响应式状态
 	const userInfo = ref({});
@@ -152,10 +138,12 @@
 	const openId = ref('');
 	const authPopup = ref(null); // u-popup 的引用
 	const isPopupVisible = ref(false);
+	const appVersion = ref('1.0.0');
 
 	// 页面加载时初始化
 	onMounted(() => {
 		getInfo();
+		initVersion();
 	});
 
 	// 获取用户信息
@@ -194,6 +182,26 @@
 		}
 	};
 
+	// 初始化应用版本号（多端兼容，取可用信息）
+	const initVersion = () => {
+		// #ifdef MP-WEIXIN
+		try {
+			const info = wx.getAccountInfoSync && wx.getAccountInfoSync();
+			if (info && info.miniProgram && info.miniProgram.version) {
+				appVersion.value = info.miniProgram.version;
+			}
+		} catch (e) {}
+		// #endif
+
+		// #ifdef APP-PLUS
+		try {
+			if (typeof plus !== 'undefined' && plus.runtime && plus.runtime.version) {
+				appVersion.value = plus.runtime.version;
+			}
+		} catch (e) {}
+		// #endif
+	};
+
 	const redirectToLogin = () => {
 		try {
 			const pages = getCurrentPages()
@@ -219,6 +227,52 @@
 		});
 	};
 
+	// 处理快速归还
+	const handleQuickReturn = async () => {
+		try {
+			uni.showLoading({
+				title: '加载中'
+			});
+
+		// 获取使用中的订单
+		const res = await uni.request({
+			url: `${URL}/app/order/inUse`,
+			method: 'GET',
+			header: {
+				'Authorization': "Bearer " + uni.getStorageSync('token'),
+				'Clientid': uni.getStorageSync('client_id')
+			}
+		});
+
+			uni.hideLoading();
+
+			if (res.statusCode === 401 || res.data?.code === 401 || res.data?.code === 40101) {
+				redirectToLogin();
+				return;
+			}
+
+			if (res.statusCode === 200 && res.data.code === 200 && res.data.data) {
+				const inUseOrder = res.data.data;
+				// 跳转到统一订单详情页面
+				uni.navigateTo({
+					url: `/pages/order/detail?orderId=${inUseOrder.orderId}&deviceId=${inUseOrder.deviceNo}`
+				});
+			} else {
+				uni.showToast({
+					title: '暂无使用中的订单',
+					icon: 'none'
+				});
+			}
+		} catch (error) {
+			uni.hideLoading();
+			console.error('获取使用中订单失败:', error);
+			uni.showToast({
+				title: '获取订单失败',
+				icon: 'none'
+			});
+		}
+	};
+
 	// 处理提现按钮点击
 	const handleWithdraw = () => {
 		navigateTo('/pages/deposit/index');
@@ -226,15 +280,49 @@
 
 	// 处理用户资料点击
 	const handleUserProfileClick = () => {
-		if (!userInfo.value) {
-			// 打开授权弹窗
-			openAuthPopup();
-		} else {
-			// 已登录用户点击个人资料，可以导航到编辑页面
-			// navigateTo('/pages/profile/edit');
+		const token = uni.getStorageSync('token')
+		if (!token) {
+			redirectToLogin()
+			return
 		}
+		// #ifdef MP-WEIXIN
+		getUserProfile()
+		// #endif
+		// #ifndef MP-WEIXIN
+		uni.showToast({ title: '请在微信小程序中使用此功能', icon: 'none' })
+		// #endif
 	};
 
+	// 小程序原生选择头像回调（需基础库>=2.21.2）
+	const onChooseAvatar = async (e) => {
+		try {
+			const token = uni.getStorageSync('token')
+			if (!token) {
+				redirectToLogin()
+				return
+			}
+			const avatarLocalPath = e?.detail?.avatarUrl
+			if (!avatarLocalPath) {
+				uni.showToast({ title: '未选择头像', icon: 'none' })
+				return
+			}
+			uni.showLoading({ title: '上传中...', mask: true })
+			const uploadRes = await uploadUserAvatar(avatarLocalPath)
+			const serverAvatar = uploadRes?.data?.url || uploadRes?.url || uploadRes?.data || ''
+			if (serverAvatar) {
+				userInfo.value = { ...userInfo.value, avatar: serverAvatar }
+				uni.setStorageSync('userInfo', userInfo.value)
+			}
+			uni.showToast({ title: '头像已更新', icon: 'success' })
+			await getInfo()
+		} catch (err) {
+			console.error('选择/上传头像失败:', err)
+			uni.showToast({ title: '头像更新失败', icon: 'none' })
+		} finally {
+			uni.hideLoading()
+		}
+	}
+
 	// 打开授权弹窗
 	const openAuthPopup = () => {
 		if (authPopup.value) {
@@ -270,6 +358,7 @@
 			success: (res) => {
 				console.log('获取用户信息成功:', res);
 				updateUserInfo(res.userInfo);
+				uploadAvatarAndRefresh(res.userInfo);
 			},
 			fail: (err) => {
 				console.error('获取用户信息失败:', err);
@@ -331,6 +420,46 @@
 		}
 	};
 
+	// 下载并上传头像，更新用户信息
+	const uploadAvatarAndRefresh = async (wxUserInfo) => {
+		try {
+			const avatarUrl = wxUserInfo?.avatarUrl
+			if (!avatarUrl) {
+				uni.showToast({ title: '未获取到头像地址', icon: 'none' })
+				return
+			}
+			// 下载微信头像为本地临时文件
+			const tempFilePath = await new Promise((resolve, reject) => {
+				uni.downloadFile({
+					url: avatarUrl,
+					success: (res) => {
+						if (res.statusCode === 200 && res.tempFilePath) {
+							resolve(res.tempFilePath)
+							return
+						}
+						reject(new Error('头像下载失败'))
+					},
+					fail: reject
+				})
+			})
+			// 上传到后端
+			const uploadRes = await uploadUserAvatar(tempFilePath)
+			// 直接使用返回的头像地址（如果有），并刷新用户信息
+			const serverAvatar = uploadRes?.data?.url || uploadRes?.url || uploadRes?.data || ''
+			if (serverAvatar) {
+				userInfo.value = { ...userInfo.value, avatar: serverAvatar }
+				uni.setStorageSync('userInfo', userInfo.value)
+			}
+			uni.showToast({ title: '头像已更新', icon: 'success' })
+			await getInfo()
+		} catch (error) {
+			console.error('头像上传失败:', error)
+			uni.showToast({ title: '头像上传失败', icon: 'none' })
+		} finally {
+			uni.hideLoading()
+		}
+	}
+
 	// 关闭授权弹窗
 	const closeAuthPopup = () => {
 		if (authPopup.value) {
@@ -362,222 +491,221 @@
 		return phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
 	}
 
-	const doLogout = async () => {
-		uni.showModal({
-			title: '提示',
-			content: '确定要退出登录吗？',
-			success: async (res) => {
-				if (res.confirm) {
-					const response = await userLogout();
-					if (response.code == 200) {
-						uni.showToast({
-							title:'退出成功',
-							icon:'none'
-						})
-						setTimeout(() => {
-						uni.removeStorageSync('token');
-						uni.removeStorageSync('userInfo');
-							uni.redirectTo({
-								url: '/pages/login/index'
-							})
-						}, 1500)
-					}
-				}
-			}
-		})
-	}
+// 退出登录移动至设置页
 </script>
 
 <style lang="scss" scoped>
-	.profile-container {
+	.my-page {
 		min-height: 100vh;
-		background-color: #f5f7fa;
+		background-color: #ffffff;
+		position: -webkit-sticky;
+		position: sticky;
+		top: 0;
 		padding-bottom: env(safe-area-inset-bottom);
+		display: flex;
+		flex-direction: column;
 	}
 
-	/* Header Section */
-	.header-section {
-		padding: 40rpx;
-		background: linear-gradient(135deg, #07c160, #05a14e);
-		position: relative;
-		border-radius: 0 0 30rpx 30rpx;
-		margin-bottom: 20rpx;
-		box-shadow: 0 10rpx 30rpx rgba(7, 193, 96, 0.25);
-	}
-
-	.user-profile {
+	.user-card {
 		display: flex;
 		align-items: center;
-		padding: 20rpx 0;
+		padding: 24rpx 30rpx;
+		
+		// background-color: #D1FFE1;
+		background: linear-gradient(180deg, #D1FFE1 0%, #ffffff 100%);
+		// border-bottom: 1rpx solid #f0f0f0;
+		// margin: 0 20rpx;
 	}
 
-	.avatar-container {
+	.banner-card {
+		margin: 20rpx 30rpx 0 30rpx;
+		background-color: #ffffff;
+		border-radius: 50rpx;
+		overflow: hidden;
+		border: 1rpx solid #f0f0f0;
+	}
+
+	.banner-image {
+		width: 100%;
+		height: 260rpx;
+		border-radius: 50rpx;
+		display: block;
+	}
+
+	.avatar-box {
+		margin-right: 20rpx;
 		position: relative;
-		margin-right: 30rpx;
 	}
 
 	.avatar {
-		width: 120rpx;
-		height: 120rpx;
-		border-radius: 60rpx;
-		border: 4rpx solid rgba(255, 255, 255, 0.6);
-		box-shadow: 0 8rpx 20rpx rgba(0, 0, 0, 0.1);
+		width: 100rpx;
+		height: 100rpx;
+		border-radius: 50rpx;
+		background-color: #f0f0f0;
 	}
 
-	.avatar-badge {
+	/* 仅小程序端存在，此按钮覆盖在头像上捕获点击以触发选择头像 */
+	/* #ifdef MP-WEIXIN */
+	.avatar-choose-btn {
 		position: absolute;
-		bottom: 0;
-		right: 0;
-		width: 36rpx;
-		height: 36rpx;
-		border-radius: 18rpx;
-		background-color: #ff9500;
-		border: 4rpx solid white;
+		left: 0;
+		top: 0;
+		width: 100rpx;
+		height: 100rpx;
+		border: none;
+		background: transparent;
+		padding: 0;
+		margin: 0;
+		opacity: 0; /* 保持可点击但不可见 */
 	}
+	/* #endif */
 
-	.user-details {
+	.user-text {
 		flex: 1;
 	}
 
-	.username {
-		font-size: 36rpx;
+	.nickname {
+		font-size: 32rpx;
+		color: #222222;
 		font-weight: 600;
-		color: white;
-		margin-bottom: 8rpx;
 	}
 
-	.user-id {
-		font-size: 26rpx;
-		color: rgba(255, 255, 255, 0.8);
+	.subtext {
+		margin-top: 6rpx;
+		font-size: 24rpx;
+		color: #999999;
 	}
 
-	.edit-profile {
-		background-color: rgba(255, 255, 255, 0.2);
-		padding: 10rpx;
-		border-radius: 50%;
-	}
-
-	/* Balance Card */
-	.balance-card {
-		margin: 30rpx;
-		background: white;
-		border-radius: 20rpx;
-		padding: 30rpx;
+	.assets-card {
+		margin: 20rpx 0;
+		padding: 24rpx 30rpx;
+		background-color: #ffffff;
 		display: flex;
+		align-items: center;
 		justify-content: space-between;
-		align-items: center;
-		box-shadow: 0 10rpx 30rpx rgba(0, 0, 0, 0.05);
-	}
-
-	.balance-label {
-		font-size: 28rpx;
-		color: #666;
-		margin-bottom: 10rpx;
-	}
-
-	.balance-amount {
-		font-size: 48rpx;
-		font-weight: 600;
-		color: #07c160;
-	}
-
-	.action-button {
-		background: linear-gradient(135deg, #07c160, #05a14e);
-		border-radius: 40rpx;
-		height: 80rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		padding: 0 40rpx;
-		color: white;
-		font-weight: 500;
-		font-size: 30rpx;
-		box-shadow: 0 8rpx 16rpx rgba(7, 193, 96, 0.25);
-
-		&:active {
-			opacity: 0.9;
-			transform: scale(0.98);
-		}
-
-		text {
-			margin-right: 10rpx;
-		}
-	}
-
-	/* Function List */
-	.function-list {
-		margin: 30rpx;
-		background: white;
-		border-radius: 20rpx;
-		overflow: hidden;
-		box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.04);
-	}
-
-	.function-item {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 32rpx 30rpx;
+		border-top: 1rpx solid #f0f0f0;
 		border-bottom: 1rpx solid #f0f0f0;
-
-		&:last-child {
-			border-bottom: none;
-		}
-
-		&:active {
-			background-color: #f9f9f9;
-		}
 	}
 
-	.item-left {
+	.assets-left .label {
+		font-size: 26rpx;
+		color: #666666;
+	}
+
+	.assets-left .amount {
+		margin-top: 8rpx;
+		font-size: 40rpx;
+		color: #e2231a;
+		font-weight: 600;
+	}
+
+	.withdraw-btn {
+		display: inline-block;
+		padding: 14rpx 28rpx;
+		color: #e2231a;
+		border: 1rpx solid #e2231a;
+		border-radius: 6rpx;
+		font-size: 26rpx;
+	}
+
+	.section {
+		margin-top: 20rpx;
+		margin: 0 20rpx 20rpx 20rpx;
+		background-color: #ffffff;
+		flex:1;
+		// border-top: 1rpx solid #f0f0f0;
+		// border-bottom: 1rpx solid #f0f0f0;
+		border-radius: 20rpx;
+	}
+
+	.section-title {
+		padding: 20rpx 30rpx;
+		font-size: 26rpx;
+		color: #999999;
+	}
+
+	.list-item {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 28rpx 30rpx;
+		border-top: 1rpx solid #f5f5f5;
+	}
+
+	.list-item:first-child {
+		border-top: none;
+	}
+
+	.left {
 		display: flex;
 		align-items: center;
 	}
 
-	.item-icon {
-		width: 48rpx;
-		height: 48rpx;
-		margin-right: 24rpx;
+	.icon {
+		width: 40rpx;
+		height: 40rpx;
+		margin-right: 16rpx;
+	}
+
+	.title {
+		font-size: 30rpx;
+		color: #333333;
+	}
+
+	.footer-agreements {
+		margin: 40rpx 0 20rpx 0;
+		position: absolute;
+		bottom: 10rpx;
+		left: 0;
+		right: 0;
 		display: flex;
+		flex-direction: column;
 		align-items: center;
 		justify-content: center;
+		color: #999999;
+		font-size: 22rpx;
 
-		image {
-			width: 40rpx;
-			height: 40rpx;
+		.link-box{
+			display: flex;
+			align-items: center;
+			justify-content: center;
 		}
 	}
 
-	.item-title {
-		font-size: 30rpx;
-		color: #333;
-		font-weight: 500;
+	.footer-agreements .link {
+		color: #999999;
 	}
 
-	.item-right {
-		display: flex;
-		align-items: center;
+	.footer-agreements .sep {
+		margin: 0 10rpx;
+		color: #c0c0c0;
 	}
 
-	/* Auth Popup */
+	.footer-agreements .version {
+		margin-top: 10rpx;
+		color: #c0c0c0;
+		font-size: 20rpx;
+	}
+
+	/* 保留弹窗样式（未启用） */
 	.auth-popup {
-		background-color: white;
+		background-color: #ffffff;
 		width: 100%;
 		padding: 40rpx;
-		border-radius: 15rpx;
+		border-radius: 12rpx;
 	}
 
 	.auth-title {
 		font-size: 34rpx;
 		font-weight: 600;
-		color: #333;
+		color: #333333;
 		text-align: center;
 		margin-bottom: 20rpx;
 	}
 
 	.auth-desc {
 		font-size: 28rpx;
-		color: #666;
+		color: #666666;
 		text-align: center;
 		margin-bottom: 40rpx;
 	}
@@ -595,19 +723,5 @@
 		text-align: center;
 		border-radius: 40rpx;
 		font-size: 28rpx;
-
-		&::after {
-			border: none;
-		}
-	}
-
-	.cancel-btn {
-		background-color: #f0f0f0;
-		color: #666;
-	}
-
-	.confirm-btn {
-		background: linear-gradient(135deg, #07c160, #05a14e);
-		color: white;
 	}
 </style>
\ No newline at end of file
diff --git a/pages/order/detail.vue b/pages/order/detail.vue
new file mode 100644
index 0000000..241a21a
--- /dev/null
+++ b/pages/order/detail.vue
@@ -0,0 +1,1026 @@
+<template>
+	<view class="order-detail-container">
+		<!-- 顶部标题 -->
+		<view class="page-header">
+			<view class="header-title">{{ getOrderStatusText() }}</view>
+			<view class="header-desc">{{ getStatusDesc() }}</view>
+		</view>
+
+		<!-- 订单信息卡片 -->
+		<view class="info-card">
+			<view class="info-row">
+				<view class="info-col">
+					<view class="info-value">{{ getUsedTimeNumber() }}</view>
+					<view class="info-label">{{ getUsedTimeUnit() }}</view>
+				</view>
+				<view class="info-col">
+					<view class="info-value">{{ getOrderFee() }}</view>
+					<view class="info-label">{{ isOrderCompleted() ? '订单金额' : '订单金额' }}</view>
+				</view>
+				<view class="info-col">
+					<view class="info-value">{{ orderInfo.packagePrice || '10' }}</view>
+					<view class="info-label">元</view>
+				</view>
+			</view>
+			<view class="fee-rule">
+				计费规则：5.0元/60分钟 前15分钟内归还免费 不足60分钟按60分钟计费 封顶99元 持续计费至99元视为买断
+			</view>
+		</view>
+
+		<!-- 租借信息卡片 -->
+		<view class="rent-card">
+			<view class="rent-title">租借信息</view>
+			<view class="rent-item">
+				<view class="rent-label">订单编号</view>
+				<view class="rent-value">{{ orderInfo.orderNo || '-' }}</view>
+			</view>
+			<view class="rent-item">
+				<view class="rent-label">风扇编号</view>
+				<view class="rent-value">{{ deviceId || '-' }}</view>
+			</view>
+			<view class="rent-item">
+				<view class="rent-label">租借时间</view>
+				<view class="rent-value">{{ orderInfo.startTime || '-' }}</view>
+			</view>
+			<view class="rent-item">
+				<view class="rent-label">租借地点</view>
+				<view class="rent-value">{{ orderInfo.positionName || '新佳宜（九天银河店）' }}</view>
+			</view>
+			<view class="rent-item">
+				<view class="rent-label">租借方式</view>
+				<view class="rent-value">{{ getPayWayText() }}</view>
+			</view>
+			<view class="rent-item" v-if="isOrderCompleted() && orderInfo.endTime">
+				<view class="rent-label">归还时间</view>
+				<view class="rent-value">{{ orderInfo.endTime }}</view>
+			</view>
+			<view class="rent-item" v-if="isOrderCompleted() && orderInfo.returnPosition">
+				<view class="rent-label">归还地点</view>
+				<view class="rent-value">{{ orderInfo.returnPosition || '新佳宜（九天银河店）' }}</view>
+			</view>
+			<view class="rent-paid" v-if="isOrderCompleted()">
+				<text class="paid-label">已支付</text>
+				<text class="paid-value">{{ orderInfo.currentFee || orderInfo.payAmount || '10' }}</text>
+				<text class="paid-unit">元</text>
+			</view>
+		</view>
+
+		<!-- 底部操作栏 -->
+		<view class="bottom-bar">
+			<!-- 使用中状态 -->
+			<template v-if="orderInfo.orderStatus === 'in_used'">
+				<view class="bottom-icon-btn" @click="contactService">
+					<image src="/static/customer-service.png" class="icon" mode="aspectFit"></image>
+					<text>客服中心</text>
+				</view>
+				<view v-if="!showExpressAction" class="countdown-btn">
+					{{ formatCountdown(countdownRemaining) }}后可快递归还
+				</view>
+				<view v-if="showExpressAction" class="action-btn secondary" @click="expressRetrunOrder">
+					暂停计费
+				</view>
+				<view v-if="showExpressAction" class="action-btn primary" @click="quickReturn">
+					快速归还
+				</view>
+			</template>
+
+			<!-- 已完成状态 -->
+			<template v-if="isOrderCompleted()">
+				<view class="bottom-icon-btn" @click="handleWithdraw" v-if="!orderInfo.isWithdrawn && orderInfo.refundAmount > 0">
+					<image src="/static/suggess.png" class="icon" mode="aspectFit"></image>
+					<text>费用申请</text>
+				</view>
+				<view class="bottom-icon-btn" @click="contactService">
+					<image src="/static/customer-service.png" class="icon" mode="aspectFit"></image>
+					<text>客服中心</text>
+				</view>
+				<view class="action-btn primary" @click="rentAgain">
+					再次租借
+				</view>
+			</template>
+
+			<!-- 待支付状态 -->
+			<template v-if="orderInfo.orderStatus === 'waiting_for_payment'">
+				<view class="action-btn secondary" @click="handleCancelOrder">取消订单</view>
+				<view class="action-btn primary" @click="handlePayment">立即支付</view>
+			</template>
+
+			<!-- 已取消状态 -->
+			<template v-if="orderInfo.orderStatus === 'order_cancelled'">
+				<view class="action-btn primary full-width" @click="goToHome">返回首页</view>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		queryById,
+		cancelOrder,
+		getSystemConfig
+	} from '@/config/user.js'
+	import {
+		URL
+	} from "@/config/url.js"
+
+	export default {
+		data() {
+			return {
+				deviceId: '',
+				orderInfo: {
+					orderId: '',
+					orderNo: '',
+					startTime: '',
+					endTime: '',
+					usedTime: '0分钟',
+					currentFee: '0.00',
+					orderStatus: '',
+					payWay: '',
+					depositAmount: '',
+					packageTime: '',
+					packagePrice: '',
+					payAmount: '0.00',
+					phone: '',
+					refundAmount: '0.00',
+					withdrawStatus: 'waiting',
+					isWithdrawn: false,
+					positionName: '',
+					returnPosition: ''
+				},
+				timer: null,
+				statusCheckTimer: null,
+				maxStatusChecks: 30,
+				currentStatusChecks: 0,
+				statusCheckInterval: 5000,
+				isPageActive: false,
+				expressThresholdSeconds: 180,
+				countdownRemaining: 0,
+				showExpressAction: false,
+				countdownTimer: null
+			}
+		},
+		onLoad(options) {
+			console.log('订单详情页加载，参数:', JSON.stringify(options))
+
+			this.isPageActive = true
+
+			this.orderInfo.orderId = options.orderId || ''
+			this.deviceId = options.deviceNo || options.deviceId || ''
+
+			if (!this.orderInfo.orderId && this.deviceId) {
+				this.getOrderByDevice()
+			} else if (this.orderInfo.orderId) {
+				this.getOrderDetails()
+			} else {
+				uni.showToast({
+					title: '缺少订单信息',
+					icon: 'none'
+				})
+				setTimeout(() => {
+					this.goToHome()
+				}, 1500)
+			}
+
+			// 注册全局订单完成事件监听器
+			uni.$on('orderCompleted', this.handleOrderCompleted)
+
+			// 获取系统配置
+			this.loadSystemConfig().then(() => {
+				if (this.orderInfo.orderStatus === 'in_used') {
+					this.startExpressCountdown()
+				}
+			})
+		},
+		onShow() {
+			this.isPageActive = true
+			if (this.orderInfo.orderStatus === 'in_used') {
+				this.startExpressCountdown()
+			}
+		},
+		onHide() {
+			console.log('订单详情页隐藏，清理资源')
+			this.isPageActive = false
+			this.clearTimer()
+			this.clearStatusCheckTimer()
+			this.clearExpressCountdown()
+			this.removeFromOrderMonitor()
+		},
+		onUnload() {
+			console.log('订单详情页卸载，清理所有资源')
+			this.isPageActive = false
+			this.clearTimer()
+			this.clearStatusCheckTimer()
+			this.clearExpressCountdown()
+			this.removeFromOrderMonitor()
+			uni.$off('orderCompleted', this.handleOrderCompleted)
+		},
+		methods: {
+			// 判断订单是否已完成
+			isOrderCompleted() {
+				return this.orderInfo.orderStatus === 'used_done' || 
+					   this.orderInfo.orderStatus === 'used_down'
+			},
+
+			// 获取订单状态文字
+			getOrderStatusText() {
+				const statusMap = {
+					'waiting_for_payment': '待支付',
+					'payment_in_progress': '支付中',
+					'payment_successful': '支付成功',
+					'in_used': '使用中',
+					'payment_failed': '支付失败',
+					'order_cancelled': '已取消',
+					'used_done': '已完成',
+					'used_down': '已完成'
+				}
+				return statusMap[this.orderInfo.orderStatus] || '订单详情'
+			},
+
+			// 获取状态描述
+			getStatusDesc() {
+				const descMap = {
+					'waiting_for_payment': '请尽快完成支付',
+					'in_used': '请妥善保管设备，使用完毕后及时归还',
+					'used_done': '您的风扇已归还，感谢使用',
+					'used_down': '您的风扇已归还，感谢使用',
+					'order_cancelled': '订单已取消',
+					'payment_failed': '支付失败，请重新支付'
+				}
+				return descMap[this.orderInfo.orderStatus] || ''
+			},
+
+			// 获取状态图标样式
+			getStatusIconClass() {
+				const classMap = {
+					'waiting_for_payment': 'waiting',
+					'in_used': 'using',
+					'used_done': 'success',
+					'used_down': 'success',
+					'order_cancelled': 'cancelled',
+					'payment_failed': 'failed'
+				}
+				return classMap[this.orderInfo.orderStatus] || 'default'
+			},
+
+			// 获取退款状态文本
+			getWithdrawStatusText() {
+				const statusMap = {
+					'waiting': '待申请',
+					'processing': '处理中',
+					'success': '已退款',
+					'failed': '退款失败'
+				}
+				return statusMap[this.orderInfo.withdrawStatus] || '待申请'
+			},
+
+			// 获取支付方式文本
+			getPayWayText() {
+				const payWayMap = {
+					'wx_score_pay': '免押租借',
+					'wx_member_pay': '会员订单',
+					'wx_pay': '押金租借'
+				}
+				return payWayMap[this.orderInfo.payWay] || '免押租借'
+			},
+
+			// 格式化倒计时（显示为 HH:MM:SS 格式）
+			formatCountdown(totalSeconds) {
+				if (typeof totalSeconds !== 'number' || totalSeconds < 0) return '00:00:00'
+				const hours = Math.floor(totalSeconds / 3600)
+				const minutes = Math.floor((totalSeconds % 3600) / 60)
+				const seconds = totalSeconds % 60
+				const pad = (n) => n.toString().padStart(2, '0')
+				return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`
+			},
+
+			// 联系客服
+			contactService() {
+				uni.navigateTo({
+					url: '/pages/help/index'
+				})
+			},
+
+			// 快速归还
+			quickReturn() {
+				// 刷新订单状态，检查是否已归还
+				this.checkReturnStatus()
+			},
+
+			// 再次租借
+			rentAgain() {
+				uni.reLaunch({
+					url: '/pages/index/index'
+				})
+			},
+
+			// 获取使用时长的数字部分（用于显示）
+			getUsedTimeNumber() {
+				const usedTime = this.orderInfo.usedTime || '0分钟'
+				// 提取第一个数字（如 "1小时5分钟" -> "1"）
+				const match = usedTime.match(/(\d+)/)
+				return match ? match[1] : '0'
+			},
+
+			// 获取使用时长的单位部分
+			getUsedTimeUnit() {
+				if (this.isOrderCompleted()) {
+					return '使用时长'
+				}
+				const usedTime = this.orderInfo.usedTime || '0分钟'
+				// 如果是完整的时长字符串，返回"已使用"
+				// 否则提取单位
+				if (usedTime.includes('小时')) {
+					return '小时'
+				} else if (usedTime.includes('分钟')) {
+					return '分钟'
+				}
+				return '已使用'
+			},
+
+			// 获取订单费用（不含单位）
+			getOrderFee() {
+				const fee = this.orderInfo.currentFee || this.orderInfo.payAmount || '0'
+				// 移除可能的"元"字符
+				return String(fee).replace(/[元¥]/g, '')
+			},
+
+			// 加载系统配置
+			async loadSystemConfig() {
+				try {
+					const res = await getSystemConfig()
+					if (res && res.code === 200 && res.data && typeof res.data.expressReturnCountdownSeconds === 'number') {
+						const seconds = res.data.expressReturnCountdownSeconds
+						if (seconds > 0) {
+							this.expressThresholdSeconds = seconds
+						}
+					}
+					if (this.orderInfo.orderStatus === 'in_used' && this.orderInfo.startTime) {
+						this.recomputeExpressCountdownFromStartTime()
+					}
+				} catch (e) {
+					console.log('加载系统配置失败:', e)
+				}
+			},
+
+			// 启动快递归还倒计时
+			startExpressCountdown() {
+				this.clearExpressCountdown()
+				this.recomputeExpressCountdownFromStartTime()
+				if (this.showExpressAction) return
+				this.countdownTimer = setInterval(() => {
+					if (!this.isPageActive) {
+						this.clearExpressCountdown()
+						return
+					}
+					if (this.orderInfo.orderStatus !== 'in_used') {
+						this.clearExpressCountdown()
+						return
+					}
+					this.recomputeExpressCountdownFromStartTime()
+					if (this.showExpressAction) {
+						this.clearExpressCountdown()
+					}
+				}, 1000)
+			},
+
+			// 清除倒计时
+			clearExpressCountdown() {
+				if (this.countdownTimer) {
+					clearInterval(this.countdownTimer)
+					this.countdownTimer = null
+				}
+			},
+
+			// 解析开始时间
+			parseStartTimeToMs(timeStr) {
+				if (!timeStr) return NaN
+				if (typeof timeStr === 'number') {
+					return timeStr < 1e12 ? timeStr * 1000 : timeStr
+				}
+				let normalized = String(timeStr).trim()
+				normalized = normalized.replace('T', ' ').replace(/\.\d+Z?$/, '')
+				const candidates = [
+					normalized,
+					normalized.replace(/-/g, '/')
+				]
+				for (let i = 0; i < candidates.length; i++) {
+					const ts = Date.parse(candidates[i])
+					if (!isNaN(ts)) return ts
+				}
+				const m = normalized.match(/(\d{4})[\/-](\d{1,2})[\/-](\d{1,2})\s+(\d{1,2}):(\d{1,2})(?::(\d{1,2}))?/)
+				if (m) {
+					const y = parseInt(m[1])
+					const mon = parseInt(m[2]) - 1
+					const d = parseInt(m[3])
+					const h = parseInt(m[4])
+					const min = parseInt(m[5])
+					const s = m[6] ? parseInt(m[6]) : 0
+					return new Date(y, mon, d, h, min, s).getTime()
+				}
+				const num = Number(normalized)
+				if (!isNaN(num)) {
+					return num < 1e12 ? num * 1000 : num
+				}
+				return NaN
+			},
+
+			// 重新计算倒计时
+			recomputeExpressCountdownFromStartTime() {
+				if (this.orderInfo.orderStatus !== 'in_used') {
+					this.showExpressAction = false
+					this.countdownRemaining = 0
+					return
+				}
+				const startMs = this.parseStartTimeToMs(this.orderInfo.startTime)
+				if (isNaN(startMs)) {
+					this.showExpressAction = false
+					this.countdownRemaining = 0
+					return
+				}
+				const nowMs = Date.now()
+				const elapsedSeconds = Math.max(0, Math.floor((nowMs - startMs) / 1000))
+				const remaining = this.expressThresholdSeconds - elapsedSeconds
+				if (remaining <= 0) {
+					this.countdownRemaining = 0
+					this.showExpressAction = true
+				} else {
+					this.countdownRemaining = remaining
+					this.showExpressAction = false
+				}
+			},
+
+			// 从订单监控服务中移除当前订单
+			removeFromOrderMonitor() {
+				if (this.orderInfo.orderId && this.$orderMonitor) {
+					try {
+						this.$orderMonitor.removeOrder({
+							orderId: this.orderInfo.orderId
+						})
+						console.log('订单已从监控队列移除:', this.orderInfo.orderId)
+					} catch (error) {
+						console.error('从监控队列移除订单失败:', error)
+					}
+				}
+			},
+
+			// 处理订单完成事件
+			handleOrderCompleted(orderData) {
+				console.log('收到订单完成事件:', orderData)
+				if (orderData.orderId === this.orderInfo.orderId || orderData.orderNo === this.orderInfo.orderNo) {
+					// 刷新订单详情
+					this.getOrderDetails()
+				}
+			},
+
+			// 获取订单详情
+			async getOrderDetails() {
+				if (!this.isPageActive) {
+					console.log('页面已不活跃，跳过订单详情请求')
+					return
+				}
+
+				try {
+					if (!this.orderInfo.orderId) {
+						throw new Error('订单ID不能为空')
+					}
+
+					const result = await queryById(this.orderInfo.orderId)
+
+					if (result.code === 200 && result.data) {
+						const orderData = result.data
+						console.log('订单数据:', orderData)
+
+						// 更新订单信息
+						this.updateOrderInfo(orderData)
+
+						// 只有使用中的订单才启动定时器和监控
+						if (this.orderInfo.orderStatus === 'in_used') {
+							this.startTimer()
+							this.startStatusCheckTimer()
+							this.startExpressCountdown()
+
+							uni.setStorageSync('activeOrderId', this.orderInfo.orderId)
+
+							// 添加到监控队列
+							try {
+								if (this.$orderMonitor) {
+									this.$orderMonitor.removeOrder({
+										orderId: this.orderInfo.orderId
+									})
+									this.$orderMonitor.addOrder({
+										orderId: this.orderInfo.orderId
+									}, 'detail')
+									console.log('订单已添加到监控队列:', this.orderInfo.orderId)
+								}
+							} catch (error) {
+								console.error('添加订单到监控队列失败:', error)
+							}
+						}
+					} else {
+						throw new Error(result.msg || '获取订单详情失败')
+					}
+				} catch (error) {
+					console.error('获取订单详情错误:', error)
+					uni.showToast({
+						title: error.message || '获取订单信息失败',
+						icon: 'none'
+					})
+					setTimeout(() => {
+						this.goToHome()
+					}, 1500)
+				} finally {
+					uni.hideLoading()
+				}
+			},
+
+			// 更新订单信息
+			updateOrderInfo(orderData) {
+				this.orderInfo.usedTime = orderData.usedTime || '0分钟'
+				this.orderInfo.currentFee = orderData.currentFee || orderData.actualDeviceAmount || orderData.payAmount || '0.00'
+				this.orderInfo.orderStatus = orderData.orderStatus || ''
+				this.orderInfo.payWay = orderData.payWay || ''
+				this.orderInfo.startTime = orderData.startTime || orderData.createTime || ''
+				this.orderInfo.endTime = orderData.endTime || ''
+				this.orderInfo.depositAmount = orderData.depositAmount || ''
+				this.orderInfo.packageTime = orderData.packageTime || ''
+				this.orderInfo.packagePrice = orderData.packagePrice || ''
+				this.orderInfo.payAmount = orderData.payAmount || '0.00'
+				this.orderInfo.phone = orderData.phone || ''
+				this.orderInfo.orderNo = orderData.orderNo || ''
+				this.orderInfo.refundAmount = orderData.residueAmount || '0.00'
+				this.orderInfo.withdrawStatus = orderData.withdrawStatus || 'waiting'
+				this.orderInfo.isWithdrawn = orderData.withdrawStatus === 'success'
+				this.orderInfo.positionName = orderData.positionName || orderData.positionLocation || ''
+				this.orderInfo.returnPosition = orderData.returnPosition || orderData.positionName || orderData.positionLocation || ''
+
+				if (orderData.deviceNo && !this.deviceId) {
+					this.deviceId = orderData.deviceNo
+				}
+			},
+
+			// 更新使用时长的定时器
+			startTimer() {
+				this.clearTimer()
+				this.timer = setInterval(() => {
+					if (this.isPageActive) {
+						console.log('执行定时更新订单信息')
+						this.getOrderDetails()
+					} else {
+						console.log('页面已不活跃，停止计时器')
+						this.clearTimer()
+					}
+				}, 60000)
+				console.log('已启动使用时长更新计时器')
+			},
+
+			// 清除定时器
+			clearTimer() {
+				if (this.timer) {
+					clearInterval(this.timer)
+					this.timer = null
+					console.log('已清除使用时长更新计时器')
+				}
+			},
+
+			// 清除状态检查定时器
+			clearStatusCheckTimer() {
+				if (this.statusCheckTimer) {
+					clearInterval(this.statusCheckTimer)
+					this.statusCheckTimer = null
+					console.log('已清除归还状态检查计时器')
+				}
+			},
+
+			// 开始状态检查定时器
+			startStatusCheckTimer() {
+				this.currentStatusChecks = 0
+				this.clearStatusCheckTimer()
+
+				this.statusCheckTimer = setInterval(() => {
+					if (this.isPageActive) {
+						this.currentStatusChecks++
+						console.log(`执行归还状态检查 (${this.currentStatusChecks}/${this.maxStatusChecks})`)
+						this.checkReturnStatus()
+
+						if (this.currentStatusChecks >= this.maxStatusChecks) {
+							this.clearStatusCheckTimer()
+							uni.showToast({
+								title: '请手动刷新查看归还状态',
+								icon: 'none',
+								duration: 3000
+							})
+						}
+					} else {
+						console.log('页面已不活跃，停止状态检查计时器')
+						this.clearStatusCheckTimer()
+					}
+				}, this.statusCheckInterval)
+
+				console.log('已启动归还状态检查计时器')
+			},
+
+			// 通过设备号查询使用中的订单
+			async getOrderByDevice() {
+				try {
+					if (!this.deviceId) {
+						throw new Error('设备号不能为空')
+					}
+
+					const inUseRes = await uni.request({
+						url: `${URL || 'http://127.0.0.1:8080'}/app/order/inUse`,
+						method: 'GET',
+						header: {
+							'Authorization': "Bearer " + uni.getStorageSync('token'),
+							'Clientid': uni.getStorageSync('client_id')
+						}
+					})
+
+					console.log('通过设备号查询订单结果:', JSON.stringify(inUseRes))
+
+					if (inUseRes.statusCode === 200 && inUseRes.data.code === 200 && inUseRes.data.data) {
+						const inUseOrder = inUseRes.data.data
+						console.log('使用中的订单:', inUseOrder)
+
+						this.orderInfo.orderId = inUseOrder.orderId
+						this.orderInfo.orderStatus = inUseOrder.orderStatus || ''
+						this.orderInfo.payWay = inUseOrder.payWay || ''
+						this.orderInfo.startTime = inUseOrder.startTime || ''
+
+						this.getOrderDetails()
+					} else {
+						throw new Error('未找到使用中的订单')
+					}
+				} catch (error) {
+					console.error('通过设备号查询订单失败:', error)
+					uni.showToast({
+						title: error.message || '获取订单信息失败',
+						icon: 'none'
+					})
+					setTimeout(() => {
+						this.goToHome()
+					}, 1500)
+				} finally {
+					uni.hideLoading()
+				}
+			},
+
+			// 检查归还状态
+			async checkReturnStatus() {
+				try {
+					if (this.isPageActive) {
+						await this.getOrderDetails()
+					}
+				} catch (error) {
+					console.error('检查归还状态失败:', error)
+				}
+			},
+
+			// 快递归还
+			expressRetrunOrder() {
+				uni.navigateTo({
+					url: `/pages/expressReturn/addExpressReturn?orderId=${this.orderInfo.orderId}`
+				})
+			},
+
+			// 取消订单
+			handleCancelOrder() {
+				uni.showModal({
+					title: '确认取消',
+					content: '确定要取消此订单吗？',
+					success: async (res) => {
+						if (res.confirm) {
+							try {
+								uni.showLoading({
+									title: '处理中'
+								})
+								const result = await cancelOrder({
+									orderId: this.orderInfo.orderId
+								})
+								if (result.code === 200) {
+									uni.hideLoading()
+									uni.showToast({
+										title: '订单已取消',
+										icon: 'success'
+									})
+									await this.getOrderDetails()
+								} else {
+									throw new Error(result.msg || '取消订单失败')
+								}
+							} catch (error) {
+								uni.hideLoading()
+								uni.showToast({
+									title: error.message || '取消订单失败',
+									icon: 'none'
+								})
+							}
+						}
+					}
+				})
+			},
+
+			// 立即支付
+			handlePayment() {
+				uni.navigateTo({
+					url: `/pages/order/payment?orderId=${this.orderInfo.orderId}`
+				})
+			},
+
+			// 申请退款
+			async handleWithdraw() {
+				try {
+					uni.showLoading({
+						title: '处理中'
+					})
+
+					const res = await uni.request({
+						url: `${URL || 'http://127.0.0.1:8080'}/app/withdraw/add/${this.orderInfo.orderNo}`,
+						method: 'GET',
+						header: {
+							'Content-Type': 'application/json',
+							'Authorization': 'Bearer ' + uni.getStorageSync('token'),
+							'Clientid': uni.getStorageSync('client_id')
+						}
+					})
+
+					if (res.statusCode === 200 && res.data.code === 200) {
+						uni.showToast({
+							title: '退款申请成功',
+							icon: 'success'
+						})
+
+						this.orderInfo.withdrawStatus = 'processing'
+						this.orderInfo.isWithdrawn = true
+
+						setTimeout(() => {
+							this.getOrderDetails()
+						}, 1500)
+					} else {
+						throw new Error(res.data.msg || '退款申请失败')
+					}
+				} catch (error) {
+					console.error('退款申请错误:', error)
+					uni.showToast({
+						title: error.message || '退款申请失败',
+						icon: 'none'
+					})
+				} finally {
+					uni.hideLoading()
+				}
+			},
+
+			// 返回首页
+			goToHome() {
+				uni.reLaunch({
+					url: '/pages/index/index'
+				})
+			},
+
+			// 格式化时间
+			formatTime(minutes) {
+				if (!minutes) return ''
+				const mins = parseInt(minutes)
+				if (mins < 60) {
+					return `${mins}分钟`
+				} else {
+					const hours = Math.floor(mins / 60)
+					const remainingMins = mins % 60
+					return remainingMins > 0 ? `${hours}小时${remainingMins}分钟` : `${hours}小时`
+				}
+			},
+
+			// 格式化倒计时
+			formatHms(totalSeconds) {
+				if (typeof totalSeconds !== 'number' || totalSeconds < 0) return '00:00:00'
+				const hours = Math.floor(totalSeconds / 3600)
+				const minutes = Math.floor((totalSeconds % 3600) / 60)
+				const seconds = totalSeconds % 60
+				const pad = (n) => n.toString().padStart(2, '0')
+				return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.order-detail-container {
+		min-height: 100vh;
+		background: #f7f8fa;
+		padding: 30rpx;
+		padding-bottom: 180rpx;
+		box-sizing: border-box;
+
+		// 顶部标题
+		.page-header {
+			margin-bottom: 30rpx;
+
+			.header-title {
+				font-size: 48rpx;
+				font-weight: bold;
+				color: #333;
+				margin-bottom: 12rpx;
+			}
+
+			.header-desc {
+				font-size: 28rpx;
+				color: #999;
+			}
+		}
+
+		// 订单信息卡片
+		.info-card {
+			background: #fff;
+			border-radius: 20rpx;
+			padding: 30rpx;
+			margin-bottom: 20rpx;
+			box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
+
+			.info-row {
+				display: flex;
+				justify-content: space-between;
+				margin-bottom: 20rpx;
+
+				.info-col {
+					flex: 1;
+					text-align: center;
+
+					.info-value {
+						font-size: 40rpx;
+						font-weight: bold;
+						color: #333;
+						margin-bottom: 8rpx;
+					}
+
+					.info-label {
+						font-size: 24rpx;
+						color: #999;
+					}
+				}
+			}
+
+			.fee-rule {
+				background: #E8F5E9;
+				border-radius: 8rpx;
+				padding: 16rpx;
+				font-size: 24rpx;
+				color: #4CAF50;
+				line-height: 1.6;
+			}
+		}
+
+		// 租借信息卡片
+		.rent-card {
+			background: #fff;
+			border-radius: 20rpx;
+			padding: 30rpx;
+			margin-bottom: 20rpx;
+			box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
+
+			.rent-title {
+				font-size: 32rpx;
+				font-weight: bold;
+				color: #333;
+				margin-bottom: 24rpx;
+			}
+
+			.rent-item {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 16rpx 0;
+				border-bottom: 1rpx solid #f0f0f0;
+
+				&:last-of-type {
+					border-bottom: none;
+				}
+
+				.rent-label {
+					font-size: 28rpx;
+					color: #999;
+				}
+
+				.rent-value {
+					font-size: 28rpx;
+					color: #333;
+					text-align: right;
+					max-width: 400rpx;
+				}
+			}
+
+			.rent-paid {
+				display: flex;
+				justify-content: flex-end;
+				align-items: baseline;
+				padding-top: 20rpx;
+				margin-top: 10rpx;
+				border-top: 1rpx solid #f0f0f0;
+
+				.paid-label {
+					font-size: 28rpx;
+					color: #999;
+					margin-right: 8rpx;
+				}
+
+				.paid-value {
+					font-size: 48rpx;
+					font-weight: bold;
+					color: #ff6b6b;
+				}
+
+				.paid-unit {
+					font-size: 28rpx;
+					color: #ff6b6b;
+					margin-left: 4rpx;
+				}
+			}
+		}
+
+		// 底部操作栏
+		.bottom-bar {
+			position: fixed;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			padding: 20rpx 30rpx;
+			padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
+			background: #fff;
+			box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.04);
+			z-index: 10;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			gap: 20rpx;
+
+			.bottom-icon-btn {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				justify-content: center;
+				min-width: 100rpx;
+
+				.icon {
+					width: 48rpx;
+					height: 48rpx;
+					margin-bottom: 8rpx;
+				}
+
+				text {
+					font-size: 24rpx;
+					color: #666;
+				}
+
+				&:active {
+					opacity: 0.7;
+				}
+			}
+
+			.countdown-btn {
+				flex: 1;
+				height: 88rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 28rpx;
+				color: #07c160;
+				background: #E8F5E9;
+				border-radius: 44rpx;
+				border: 2rpx solid #07c160;
+			}
+
+			.action-btn {
+				height: 88rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 30rpx;
+				border-radius: 44rpx;
+				padding: 0 40rpx;
+				white-space: nowrap;
+
+				&.full-width {
+					flex: 1;
+				}
+
+				&.primary {
+					background: #07c160;
+					color: #fff;
+					flex: 1;
+
+					&:active {
+						opacity: 0.8;
+					}
+				}
+
+				&.secondary {
+					background: #f5f5f5;
+					color: #333;
+					border: 1rpx solid #e0e0e0;
+
+					&:active {
+						opacity: 0.8;
+					}
+				}
+			}
+		}
+	}
+</style>
+
diff --git a/pages/order/index.vue b/pages/order/index.vue
index b89ec2a..774b4ef 100644
--- a/pages/order/index.vue
+++ b/pages/order/index.vue
@@ -11,96 +11,22 @@
 		<!-- 订单列表 -->
 		<view class="order-list">
 			<view class="empty-state" v-if="orderList.length === 0">
-				<view class="empty-icon"></view>
+				<view class="empty-icon">
+					<image src="/static/orderList.png" mode="aspectFill" class="empty-icon"></image>
+				</view>
 				<text class="empty-text">暂无订单记录</text>
 			</view>
 
-			<view class="order-item" v-for="(order, index) in orderList" :key="index">
-				<!-- 订单头部信息 -->
-				<view class="order-header">
-					<view class="order-id">
-						<text>订单号：{{ order.orderNo }}</text>
-					</view>
-					<view class="order-status" :class="orderStatusMap[order.orderStatus]?.class">
-						{{ orderStatusMap[order.orderStatus]?.text }}
-					</view>
-				</view>
-
-				<!-- 订单内容 -->
-				<view class="order-body">
-					<view class="device-info">
-						<view class="device-left">
-							<view class="device-name">共享风扇</view>
-							<view class="device-id">设备号：{{ order.deviceId }}</view>
-						</view>
-
-						<!-- 支付方式标识 -->
-						<view class="device-right">
-							<!-- 微信支付分标识 -->
-							<view class="payment-badge wx-score" v-if="order.payWay == 'wx_score_pay'">
-								<image src="/static/images/wxpayflag.png" mode="aspectFit" class="badge-icon"></image>
-								<view class="badge-text">
-									<text>微信支付分</text>
-									<text class="divider">|</text>
-									<text class="highlight">免押租借</text>
-								</view>
-							</view>
-							<!-- 会员订单标识 -->
-							<view class="payment-badge member" v-else-if="order.payWay == 'wx_member_pay'">
-								<text class="badge-text">会员订单</text>
-							</view>
-							<!-- 押金租借标识（微信支付订单） -->
-							<view class="payment-badge deposit" v-else-if="order.payWay == 'wx_pay'">
-								<text class="badge-text">押金租借</text>
-							</view>
-						</view>
-					</view>
-
-					<!-- 订单时间信息 -->
-					<view class="order-times">
-						<view class="time-row">
-							<text class="time-label">开始时间：</text>
-							<text class="time-value">{{ order.startTime }}</text>
-						</view>
-						<view class="time-row">
-							<text class="time-label">结束时间：</text>
-							<text class="time-value">{{ order.endTime || '-' }}</text>
-						</view>
-					</view>
-				</view>
-
-				<!-- 订单底部 -->
-				<view class="order-footer">
-					<view class="price">￥{{ order.amount }}</view>
-
-					<view class="actions">
-						<!-- 待支付状态显示支付和取消按钮 -->
-						<view v-if="order.status === 'waiting_for_payment' || order.orderStatus === 'waiting_for_payment'" class="action-item primary" @click="handlePayment(order)">
-							立即支付
-						</view>
-						<view v-if="order.status === 'waiting_for_payment' || order.orderStatus === 'waiting_for_payment'" class="action-item secondary" @click="handleCancelOrder(order)">
-							取消订单
-						</view>
-
-						<!-- 使用中状态显示归还设备按钮 -->
-						<view v-if="order.status=='in_used' || order.orderStatus=='in_used'" class="action-item primary"
-							@click="navigateToReturn(order.deviceId, order.orderId)">
-							归还设备
-						</view>
-						
-						<!-- 查看详情按钮对所有订单都显示 -->
-						<view class="action-item secondary" @click="navigateToDetails(order)">
-							查看详情
-						</view>
-						
-						<!-- 同步订单状态按钮 -->
-						<!-- <view v-if="order.status === 'waiting_for_payment' || order.orderStatus === 'waiting_for_payment'" class="action-item secondary"
-							@click="getOrderStatus(order)">
-							同步状态
-						</view> -->
-					</view>
-				</view>
-			</view>
+			<OrderItemCard
+				v-for="(order, index) in orderList"
+				:key="index"
+				:order="order"
+				:orderStatusMap="orderStatusMap"
+				@pay="handlePayment"
+				@cancel="handleCancelOrder"
+				@return-device="onReturnDevice"
+				@details="navigateToDetails"
+			/>
 		</view>
 	</view>
 </template>
@@ -111,6 +37,7 @@
 		reactive,
 		onMounted
 	} from 'vue';
+    import OrderItemCard from '../../components/OrderItemCard.vue';
 	import {
 		onLoad
 	} from '@dcloudio/uni-app';
@@ -215,7 +142,9 @@
 						payWay: orderData.payWay,
 						startTime: orderStartTime,
 						endTime: orderData.endTime || '',
-						amount: orderData.payAmount || orderData.actualDeviceAmount || '0.00'
+						positionName: orderData.positionName || orderData.positionLocation || '',
+						deviceName: orderData.deviceName || '',
+						amount: orderData.payAmount || orderData.actualDeviceAmount || orderData.currentFee || orderData.residueAmount || '0.00'
 					};
 
 					// 将订单添加到列表开头
@@ -270,7 +199,9 @@
 						payWay: item.payWay,
 						startTime: orderStartTime,
 						endTime: item.endTime || '',
-						amount: item.payAmount || item.actualDeviceAmount || '0.00'
+						positionName: item.positionName || item.positionLocation || '',
+						deviceName: item.deviceName || '',
+						amount: item.payAmount || item.actualDeviceAmount || item.currentFee || item.residueAmount || '0.00'
 					};
 				});
 			}
@@ -302,19 +233,21 @@
 		}
 	};
 
-	// 跳转到归还设备页面
-	const navigateToReturn = (deviceId, orderId) => {
-		console.log(orderId);
+	// 跳转到订单详情页面（统一入口）
+	const navigateToOrderDetail = (order) => {
 		uni.navigateTo({
-			url: `/pages/return/index?deviceId=${deviceId}&orderId=${orderId}`
+			url: `/pages/order/detail?orderId=${order.orderId || order.orderNo}&deviceId=${order.deviceId}`
 		});
 	};
+
+	// 组件事件：归还设备（实际跳转到订单详情页）
+	const onReturnDevice = (order) => {
+		navigateToOrderDetail(order);
+	};
 	
 	// 跳转到订单详情页
 	const navigateToDetails = (order) => {
-		uni.navigateTo({
-			url: `/pages/return/index?orderId=${order.orderId || order.orderNo}&deviceId=${order.deviceId}`
-		});
+		navigateToOrderDetail(order);
 	};
 	
 	// 立即支付
@@ -676,7 +609,7 @@
 					height: 180rpx;
 					margin: 0 auto 30rpx;
 					background: #f5f5f5;
-					border-radius: 50%;
+					// border-radius: 50%;
 				}
 
 				.empty-text {
diff --git a/pages/search/index.vue b/pages/search/index.vue
new file mode 100644
index 0000000..7ba0b1d
--- /dev/null
+++ b/pages/search/index.vue
@@ -0,0 +1,391 @@
+<template>
+	<view class="search-page">
+		<!-- <view class="map-wrap">
+			<MapComponent :userLocation="userLocation" :filteredPositions="filteredPositions"
+				@mapCenterChange="onMapCenterChange" />
+		</view> -->
+		<view class="list-wrap">
+			<view class="panel">
+				<view class="filter-tabs">
+					<view class="tab" :class="{ active: activeTab === 'rent' }" @click="setTab('rent')">可租借</view>
+					<view class="tab" :class="{ active: activeTab === 'return' }" @click="setTab('return')">可归还</view>
+				</view>
+				<scroll-view class="list-scroll" scroll-y="true">
+					<view class="card" :class="{ available: isRentable(item) }"
+						v-for="(item, index) in filteredPositions" :key="item.positionId || index">
+						<view class="thumb"></view>
+						<view class="info">
+							<view class="row top">
+								<view class="name">{{ item.name }}</view>
+
+							</view>
+							<view class="row sub" v-if="item.location">
+								<text class="addr">{{ item.location }}</text>
+							</view>
+							<view class="row meta" v-if="item.workTime && item.workTime !== '0'">
+								<text class="time">营业时间：{{ item.workTime }}</text>
+							</view>
+							<view class="tags">
+								<view class="tag rent" v-if="isRentable(item)">可租借</view>
+								<view class="tag return" v-if="isReturnable(item)">可归还</view>
+							</view>
+						</view>
+						<view class="actions">
+
+							<view class="nav" @click.stop="navigateToPosition(item)">
+								<image src="/static/location.png" class="action-icon" mode="aspectFit"></image>
+							</view>
+							<view class="distance" v-if="item.distance">{{ item.distance }}</view>
+						</view>
+					</view>
+
+					<view class="empty-state" v-if="!isLoading && (!positionList || positionList.length === 0)">
+						<image class="empty-icon" src="/static/scan-icon.png" mode="aspectFit" />
+						<text class="empty-text">附近暂无设备</text>
+					</view>
+				</scroll-view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		ref,
+		computed,
+		onMounted
+	} from 'vue'
+	import MapComponent from '../../components/MapComponent.vue'
+	import {
+		URL
+	} from '../../config/url.js'
+	import {
+		getUserLocation,
+		getRegeo,
+		calculateDistanceSync
+	} from '../../utils/mapUtils.js'
+
+	const userLocation = ref(null)
+	const positionList = ref([])
+	const filteredPositions = ref([])
+	const isLoading = ref(false)
+	const activeTab = ref('rent')
+
+	const isRentable = (item) => {
+		if (typeof item?.canRent !== 'undefined') return !!item.canRent
+		return String(item?.status || '').toLowerCase() === 'online'
+	}
+
+	const isReturnable = (item) => {
+		if (typeof item?.canReturn !== 'undefined') return !!item.canReturn
+		return String(item?.status || '').toLowerCase() === 'online'
+	}
+
+	const formatDistance = (meters) => {
+		if (meters < 1000) return `${Math.round(meters)}m`
+		return `${(meters / 1000).toFixed(1)}km`
+	}
+
+	const setTab = (name) => {
+		activeTab.value = name
+		applyFilter()
+	}
+
+	const applyFilter = () => {
+		if (activeTab.value === 'rent') {
+			filteredPositions.value = positionList.value.filter(isRentable)
+		} else if (activeTab.value === 'return') {
+			filteredPositions.value = positionList.value.filter(isReturnable)
+		} else {
+			filteredPositions.value = [...positionList.value]
+		}
+	}
+
+	const calculateDistances = (center) => {
+		positionList.value.forEach(item => {
+			if (item.longitude && item.latitude) {
+				try {
+					const distanceInMeters = calculateDistanceSync(
+						center.latitude,
+						center.longitude,
+						parseFloat(item.latitude),
+						parseFloat(item.longitude)
+					)
+					item.distance = formatDistance(distanceInMeters)
+					item.distanceInMeters = distanceInMeters
+				} catch (_) {}
+			}
+		})
+		positionList.value.sort((a, b) => (a.distanceInMeters || 999000) - (b.distanceInMeters || 999000))
+		applyFilter()
+	}
+
+	const loadPositions = async (center) => {
+		try {
+			isLoading.value = true
+			const res = await uni.request({
+				url: `${URL}/device/position/app/list`,
+				method: 'GET',
+				header: {
+					'Authorization': 'Bearer ' + uni.getStorageSync('token'),
+					'Clientid': uni.getStorageSync('client_id')
+				}
+			})
+			if (res.statusCode === 200 && res.data?.code === 200) {
+				positionList.value = res.data.rows || []
+				calculateDistances(center)
+			} else if (res.statusCode === 401 || res.data?.code === 401 || res.data?.code === 40101) {
+				uni.reLaunch({
+					url: '/pages/login/index'
+				})
+			} else {
+				positionList.value = []
+				filteredPositions.value = []
+			}
+		} catch (e) {
+			positionList.value = []
+			filteredPositions.value = []
+		} finally {
+			isLoading.value = false
+		}
+	}
+
+	const init = async () => {
+		isLoading.value = true
+		try {
+			const loc = await getUserLocation()
+			userLocation.value = {
+				longitude: loc.longitude,
+				latitude: loc.latitude
+			}
+			await loadPositions(userLocation.value)
+		} catch (e) {
+			await loadPositions(userLocation.value || {
+				longitude: 0,
+				latitude: 0
+			})
+		} finally {
+			isLoading.value = false
+		}
+	}
+
+	const onMapCenterChange = (center) => {
+		if (center && typeof center.longitude !== 'undefined' && typeof center.latitude !== 'undefined') {
+			userLocation.value = {
+				longitude: Number(center.longitude),
+				latitude: Number(center.latitude)
+			}
+			loadPositions(userLocation.value)
+		}
+	}
+
+	const navigateToPosition = (position) => {
+		const latitude = parseFloat(position.latitude)
+		const longitude = parseFloat(position.longitude)
+		uni.openLocation({
+			latitude,
+			longitude,
+			name: position.name,
+			address: position.location
+		})
+	}
+
+	onMounted(() => {
+		init()
+	})
+</script>
+
+<style lang="scss" scoped>
+	.search-page {
+		display: flex;
+		flex-direction: column;
+		height: 100vh;
+	}
+
+	.map-wrap {
+		flex: 0 0 48vh;
+		padding: 20rpx 20rpx 0 20rpx;
+	}
+
+	.list-wrap {
+		flex: 1;
+		background: transparent;
+		margin-top: -20rpx;
+		padding: 0 20rpx 20rpx;
+
+		.panel {
+			background: #ffffff;
+			border-radius: 24rpx;
+			box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
+			padding: 16rpx 16rpx 8rpx;
+		}
+
+		.filter-tabs {
+			display: flex;
+			background: #E8F8EF;
+			padding: 8rpx;
+			border-radius: 28rpx;
+			gap: 8rpx;
+			margin: 6rpx 6rpx 12rpx 6rpx;
+
+			.tab {
+				flex: 1;
+				height: 64rpx;
+				border-radius: 24rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 28rpx;
+				color: #3EAB64;
+				font-weight: 600;
+
+				&.active {
+					background: #3EAB64;
+					color: #ffffff;
+				}
+			}
+		}
+
+		.list-scroll {
+			height: calc(52vh - 88rpx);
+			padding: 6rpx 4rpx 12rpx 4rpx;
+			box-sizing: border-box;
+		}
+	}
+
+	.card {
+		display: grid;
+		grid-template-columns: 120rpx 1fr 72rpx;
+		align-items: center;
+		gap: 16rpx;
+		padding: 20rpx;
+		border-radius: 20rpx;
+		border: 2rpx solid #E3EDE7;
+		background: #ffffff;
+		margin: 12rpx 8rpx;
+
+		&.available {
+			border-color: #BFE2CF;
+			background: #F6FBF8;
+		}
+
+		.thumb {
+			width: 120rpx;
+			height: 120rpx;
+			border-radius: 16rpx;
+			background: #F0F2F5;
+		}
+
+		.info {
+			display: flex;
+			flex-direction: column;
+			gap: 8rpx;
+
+			.row.top {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+			}
+
+			.name {
+				font-size: 30rpx;
+				font-weight: 700;
+				color: #2A2A2A;
+				max-width: 70%;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				white-space: nowrap;
+			}
+
+			.row.sub {
+				color: #888;
+				font-size: 24rpx;
+			}
+
+			.addr {
+				display: -webkit-box;
+				-webkit-line-clamp: 1;
+				-webkit-box-orient: vertical;
+				overflow: hidden;
+			}
+
+			.row.meta {
+				color: #999;
+				font-size: 22rpx;
+			}
+
+			.tags {
+				display: flex;
+				gap: 10rpx;
+			}
+
+			.tag {
+				padding: 6rpx 14rpx;
+				border-radius: 16rpx;
+				font-size: 22rpx;
+				font-weight: 600;
+			}
+
+			.tag.rent {
+				background: #E8F5E8;
+				color: #3EAB64;
+			}
+
+			.tag.return {
+				background: #E8F2FF;
+				color: #3578e5;
+			}
+		}
+
+		.actions {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			flex-direction: column;
+		}
+
+		.nav {
+			width: 56rpx;
+			height: 56rpx;
+			border-radius: 25%;
+			background: #E8F5EE;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #3EAB64;
+		}
+	}
+
+	.empty-state {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		padding: 60rpx 0;
+	}
+
+	.empty-icon {
+		width: 120rpx;
+		height: 120rpx;
+		margin-bottom: 24rpx;
+		opacity: 0.5;
+	}
+
+	.empty-text {
+		font-size: 28rpx;
+		color: #999;
+	}
+
+	.action-icon {
+		width: 40rpx;
+		height: 40rpx;
+		filter: none;
+		box-shadow: none;
+	}
+
+	.distance {
+		font-size: 24rpx;
+		color: #2A8E5A;
+		font-weight: 700;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/setting/index.vue b/pages/setting/index.vue
new file mode 100644
index 0000000..c7be6fb
--- /dev/null
+++ b/pages/setting/index.vue
@@ -0,0 +1,80 @@
+<template>
+	<view class="setting-page">
+		<view class="group">
+			<view class="item" @click="navigateTo('/pages/legal/agreement')">
+				<text class="label">用户协议</text>
+				<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+			</view>
+			<view class="item" @click="navigateTo('/pages/legal/privacy')">
+				<text class="label">隐私政策</text>
+				<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+			</view>
+		</view>
+		<view class="group">
+			<view class="item" @click="handleLogout">
+				<text class="label">退出登录</text>
+				<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+import { userLogout } from '@/config/user.js'
+
+const navigateTo = (url) => {
+	uni.navigateTo({ url })
+}
+
+const handleLogout = async () => {
+	uni.showModal({
+		title: '提示',
+		content: '确定要退出登录吗？',
+		success: async (res) => {
+			if (res.confirm) {
+				const response = await userLogout();
+				if (response.code == 200) {
+					uni.showToast({ title: '退出成功', icon: 'none' })
+					setTimeout(() => {
+						uni.removeStorageSync('token')
+						uni.removeStorageSync('userInfo')
+						uni.reLaunch({ url: '/pages/login/index' })
+					}, 1200)
+				}
+			}
+		}
+	})
+}
+</script>
+
+<style lang="scss" scoped>
+	.setting-page {
+		min-height: 100vh;
+		background-color: #f6f6f6;
+		padding-bottom: env(safe-area-inset-bottom);
+	}
+
+	.group {
+		margin-top: 20rpx;
+		background-color: #ffffff;
+		border-top: 1rpx solid #f0f0f0;
+		border-bottom: 1rpx solid #f0f0f0;
+	}
+
+	.item {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 28rpx 30rpx;
+		border-top: 1rpx solid #f5f5f5;
+	}
+
+	.item:first-child {
+		border-top: none;
+	}
+
+	.label {
+		font-size: 30rpx;
+		color: #333333;
+	}
+</style>
\ No newline at end of file
diff --git a/static/customer-service.png b/static/customer-service.png
index e43f982..95275a6 100644
Binary files a/static/customer-service.png and b/static/customer-service.png differ
diff --git a/static/express_return.png b/static/express_return.png
new file mode 100644
index 0000000..fc0deff
Binary files /dev/null and b/static/express_return.png differ
diff --git a/static/index_swiper.png b/static/index_swiper.png
new file mode 100644
index 0000000..9ed81c1
Binary files /dev/null and b/static/index_swiper.png differ
diff --git a/static/location.png b/static/location.png
index 5a4517d..8472a57 100644
Binary files a/static/location.png and b/static/location.png differ
diff --git a/static/orderList.png b/static/orderList.png
new file mode 100644
index 0000000..e046e0c
Binary files /dev/null and b/static/orderList.png differ
diff --git a/static/other_device.png b/static/other_device.png
new file mode 100644
index 0000000..b00c153
Binary files /dev/null and b/static/other_device.png differ
diff --git a/static/peopleInWork.png b/static/peopleInWork.png
new file mode 100644
index 0000000..11f2b71
Binary files /dev/null and b/static/peopleInWork.png differ
diff --git a/static/setting.png b/static/setting.png
new file mode 100644
index 0000000..139862a
Binary files /dev/null and b/static/setting.png differ
diff --git a/static/suggess.png b/static/suggess.png
new file mode 100644
index 0000000..b3aff88
Binary files /dev/null and b/static/suggess.png differ
diff --git a/static/use_help.png b/static/use_help.png
new file mode 100644
index 0000000..a97d372
Binary files /dev/null and b/static/use_help.png differ
diff --git a/static/user-active.png b/static/user-active.png
deleted file mode 100644
index 892cea3..0000000
Binary files a/static/user-active.png and /dev/null differ
diff --git a/static/user.png b/static/user.png
index 1054ecf..03789be 100644
Binary files a/static/user.png and b/static/user.png differ
diff --git a/static/userCenter_swiper.png b/static/userCenter_swiper.png
new file mode 100644
index 0000000..5e4d076
Binary files /dev/null and b/static/userCenter_swiper.png differ
diff --git a/utils/orderMonitor.js b/utils/orderMonitor.js
index b6841d7..b1bfb9e 100644
--- a/utils/orderMonitor.js
+++ b/utils/orderMonitor.js
@@ -191,9 +191,9 @@ class OrderMonitor {
                 confirmText: '查看详情',
                 success: (res) => {
                   if (res.confirm) {
-                    // 跳转到归还成功页面查看详情
+                    // 跳转到统一订单详情页面查看详情
                     uni.redirectTo({
-                      url: `/pages/order/return-success?orderId=${orderId}`
+                      url: `/pages/order/detail?orderId=${orderId}`
                     })
                   }
                 }