From 920839469a24742890b580ba73a7591e10c4b7b7 Mon Sep 17 00:00:00 2001
From: unknown <573515615@qq.com>
Date: Sat, 25 Oct 2025 19:46:23 +0800
Subject: [PATCH] 'gengxin'

---
 pages/index/index.vue | 198 +++++++++++++++++++----------
 pages/mine/apply.vue  | 280 ++++++++++++++++++------------------------
 2 files changed, 254 insertions(+), 224 deletions(-)

diff --git a/pages/index/index.vue b/pages/index/index.vue
index 574da8d..c1bf3b2 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,7 +1,7 @@
 <template>
 	<view class="content">
+		<view class="topStatus"></view>
 		<view class="topBox">
-			<view class="topStatus"></view>
 			<view class="flex-between headBox" style="height: 117rpx;padding-right: 35rpx;">
 				<view class="menuBox">
 					<view class="menuView flex-center" :class="{checkMenu: menuNum == 1}" @click="menuClick(1)">
@@ -19,71 +19,75 @@
 			</view>
 		</view>
 		<view class="contentBox">
-			<view class="menuBox1" style="display: none;">
-				<view class="notice "  >
-					<view class="notice-icon">
-						<image class="icon  " src="/static/img/news.png" mode=""></image>
+			<view class="menuBox1" v-show="menuNum == 1">
+				<view class="twoMenuBox">
+					<view class="notice flex-center"  >
+						<view class="notice-icon">
+							<image class="icon  " src="/static/img/news.png" mode=""></image>
+						</view> 
+						<view class="notice-row flex1"  > 
+							<text class=" ">{{notice}}</text>  
+						</view> 
 					</view> 
-					<view class="notice-row"  > 
-						<text class=" ">{{notice}}</text>  
-					</view> 
-				</view> 
-				<view class="flex-between" style="margin-top: 31rpx;">
-					<view>
-						<view class="orderLabel flex-center">
-							<view class="leftLine"></view>
-							订单列表
-						</view>
-					</view>
-					<view class="flex-center">
-						<view class="flex-center selectBox">
-							<view>全部需求</view>
-							<u-icon name="arrow-down" color="#333333" size="12" style="margin-left: 13rpx;"></u-icon>
-						</view>
-						<view class="flex-center selectBox">
-							<view>距离最近</view>
-							<u-icon name="arrow-down" color="#333333" size="12" style="margin-left: 13rpx;"></u-icon>
-						</view>
-					</view>
-				</view>
-				<view class="orderBox">
-					<view class="flex-between">
-						<view></view>
-						<view class="flex-center">
-							<view class="timeLabel">36分钟内</view>
+					<view class="flex-between" style="margin-top: 30rpx;">
+						<view>
+							<view class="orderLabel flex-center">
+								<view class="leftLine"></view>
+								订单列表
+							</view>
+						</view>
+						<view class="flex-center">
+							<view class="flex-center selectBox">
+								<view>全部需求</view>
+								<u-icon name="arrow-down" color="#333333" size="12" style="margin-left: 13rpx;"></u-icon>
+							</view>
+							<view class="flex-center selectBox">
+								<view>距离最近</view>
+								<u-icon name="arrow-down" color="#333333" size="12" style="margin-left: 13rpx;"></u-icon>
+							</view>
+						</view>
+					</view>
+				</view>
+				<view class="blockBox1"></view>
+				
+				<view class="orderBox" v-for="item in qiangdanArr">
+					<view class="flex-between">
+						<view class="flex-center">
+						<image :src="path+'/assets/img/icon/yu.png'" style="width: 79rpx;height: 71rpx;margin-top: -25rpx;margin-left: -33rpx;margin-right: 21rpx;"></image>
+							<view class="timeLabel">{{countTime(item.order_time)}}分钟内</view>
 							<view class="timeLabel2">(10:17前)上门</view>
 						</view>
-						<view class="distant">1.5公里</view>
+						<view class="distant">{{item.distance}}公里</view>
 					</view>
 					<view class="flex-between addressBox">
-						<view class="addressText">‌江苏省南京市玄武区珠江路88号金鹰...</view>
+						<view class="addressText">‌{{item.full_address}}</view>
 						<view class="addressBtn">导航</view>
 					</view>
 					<view class="flex-between goodsWrap">
 						<view class="goodsBox1 flex-center" style="width: 40%;">
-							<image src="/static/img/41.png" class="goodsImg"></image>
+							<image :src="item.type_image" class="goodsImg"></image>
 							<view>
 								<view class="goodsText1">回收品类</view>
-								<view class="goodsText2">冰箱</view>
+								<view class="goodsText2">{{item.type_name}}</view>
 							</view>
 						</view>
 						<view class="goodsBox2 flex-column-center" style="width: 20%;">
 							<view class="goodsText1">数量</view>
-							<view class="goodsText2">X1</view>
+							<view class="goodsText2">X{{item.quantity}}</view>
 						</view>
 						<view class="goodsBox3 flex-column-center" style="width: 40%;">
 							<view class="goodsText1">预估价</view>
 							<view class="flex-center">
 								<view class="priceIcon">￥</view>
-								<view class="priceNum">333</view>
+								<view class="priceNum">{{item.price}}</view>
 							</view>
 						</view>
 					</view>
-					<view class="remarkBox">备注：需要不要打电话，请按门铃</view>
+					<view class="remarkBox">备注：{{item.remark}}</view>
 					<view class="flex-between userBox">
 						<view class="flex-center">
 							<image src="/static/img/39.png" class="userImg"></image>
-							<view>糯米小团子</view>
+							<view>{{item.accept_name}}</view>
 						</view>
 						<view class="userBtn flex-center">
 							抢单
@@ -91,7 +95,7 @@
 					</view>
 				</view>
 			</view>
-			<view class="menuBox2">
+			<view class="menuBox2" v-show="menuNum == 2">
 				<view class="navbar">
 					<view v-for="item in tabAll"  class="item"  :class="[tabCur==item.id?'on':'']" @click="selectTab(item.id)">
 						{{item.name}}
@@ -104,7 +108,8 @@
 					</view>  
 				</view>
 				<view style="height: 195rpx;"></view>
-				<view class="orderBox">
+				<!-- {{recycleList}} -->
+				<view class="orderBox" v-for="item in recycleList">
 					<view class="flex-between">
 						<view class="flex-center">
 							<view class="timeLabel">36分钟内</view>
@@ -113,7 +118,7 @@
 						<view class="distant">1.5公里</view>
 					</view>
 					<view class="flex-between addressBox">
-						<view class="addressText">‌江苏省南京市玄武区珠江路88号金鹰...</view>
+						<view class="addressText">‌{{item.accept_address}}</view>
 						<view class="addressBtn">导航</view>
 					</view>
 					<view class="flex-between goodsWrap">
@@ -121,28 +126,28 @@
 							<image src="/static/img/41.png" class="goodsImg"></image>
 							<view>
 								<view class="goodsText1">回收品类</view>
-								<view class="goodsText2">冰箱</view>
+								<view class="goodsText2">{{item.type_name}}</view>
 							</view>
 						</view>
 						<view class="goodsBox2 flex-column-center" style="width: 20%;">
 							<view class="goodsText1">数量</view>
-							<view class="goodsText2">X1</view>
+							<view class="goodsText2">X{{item.quantity}}</view>
 						</view>
 						<view class="goodsBox3 flex-column-center" style="width: 40%;">
 							<view class="goodsText1">预估价</view>
 							<view class="flex-center">
 								<view class="priceIcon">￥</view>
-								<view class="priceNum">333</view>
+								<view class="priceNum">{{item.price}}</view>
 							</view>
 						</view>
 					</view>
-					<view class="remarkBox">备注：需要不要打电话，请按门铃</view>
+					<view class="remarkBox">备注：{{item.remark}}</view>
 					<view class="flex-between userBox">
 						<view class="flex-center">
 							<image src="/static/img/39.png" class="userImg"></image>
-							<view>糯米小团子</view>
+							<view>{{item.accept_name}}</view>
 						</view>
-						<view class="flex-center contactText">
+						<view class="flex-center contactText" @click="tellPhone(item.accept_mobile)">
 							<u-icon name="phone" color="#333333" size="16" style="margin-right: 7rpx;"></u-icon>
 							联系TA
 						</view>
@@ -153,11 +158,11 @@
 							期望时间：(10:17前)
 						</view> -->
 						<view class="flex-center statusText1">
-							更多操作
-							<view class="floatBtnBox">
-								<view class="floatBtnEle" @click="cancleShow= true">取消订单</view>
+							<view @click="moreShow=!moreShow">更多操作</view>
+							<view class="floatBtnBox" v-show="moreShow">
+								<view class="floatBtnEle" @click="cancleClickOrder">取消订单</view>
 								<view class="btnLine"></view>
-								<view class="floatBtnEle">改派订单</view>
+								<view class="floatBtnEle" @click="changeClickOrder">改派订单</view>
 							</view>
 						</view>
 						<view class="flex-center">
@@ -305,15 +310,15 @@
 				</view>
 			</view>
 		</u-popup>
-		<u-popup :show="pop4Show" @close="close" @open="open" mode="center" :round="30">
+		<u-popup :show="pop4Show" @close="pop4Show = false" @open="open" mode="center" :round="30">
 			  <view class="pop4Box">
 				  <view class="flex-between" style="padding: 51rpx 55rpx 0;">
 					  <text class="pop4Title">改派原因</text>
-					  <u-icon name="close" color="#333333" size="16" bold></u-icon>
+					  <u-icon @click="pop4Show = false" name="close" color="#333333" size="16" bold></u-icon>
 				  </view>
 				  <u--textarea v-model="notesText" placeholder="请填写改派原因" class="pop4Input" style="background: #EFEFEF;border: none"></u--textarea>
 				  <view class="flex-center" style="margin-top: 55rpx;">
-				  	<view class="pop4Btn1">取消改派</view>
+				  	<view class="pop4Btn1" @click="pop4Show = false">取消改派</view>
 				  	<view class="pop4Btn2">确认改派</view>
 				  </view>
 			  </view>
@@ -380,19 +385,43 @@
 				],
 				tabCur: 0,
 				recycleList: [],
+				qiangdanArr: [],
 				page: 1,
 				orderList: [],
 				cancleShow:false,
 				signInShow: false,
 				pop2Show: false,
 				pop3Show: false,
-				pop4Show: false
+				pop4Show: false,
+				notesText: '',
+				moreShow: false
 			}
 		},
 		components: {
 			CustomTabBar,
 			cancleOrder
 		},
+		computed: {
+			countTime: function(){
+				return function(val){
+					console.log(val,'ddd')
+					// let nowTime = new Date().getTime()
+					// let valTime = new Date(val).getTime()
+					// console.log(valTime - nowTime)
+					// if(valTime>nowTime){
+					// 	return (valTime - nowTime)/1000/60
+					// }else{
+						
+					// }
+					// return (nowTime - valTime)/1000
+					const date1 = new Date();
+					const date2 = new Date(val);
+					const diffInMs = Math.abs(date2 - date1); // 计算两个日期之间的差异（毫秒）
+					const diffInMinutes = Math.round(diffInMs / (1000 * 60)); // 将毫秒转换为分钟
+					return diffInMinutes;
+				}
+			}
+		},
 		onShow() { 
 			uni.hideTabBar({
 			  fail: () => {},
@@ -419,6 +448,14 @@
 		onReachBottom (){ 
 		},
 		methods: {
+			cancleClickOrder(){
+				this.cancleShow = true
+				this.moreShow = false
+			},
+			changeClickOrder(){
+				this.pop4Show = true
+				this.moreShow = false
+			},
 			selectTab(id){
 				this.page=1
 				this.tabCur = id
@@ -432,7 +469,8 @@
 				}
 				this.$api.recycleOrderList(data,res=>{
 					if(res.code == '1'){
-						this.recycleList = res.data.type
+						console.log(res.data.list,res.data.list.data,'dddd')
+						this.recycleList = res.data.list.data
 					}
 				})
 			},
@@ -445,7 +483,8 @@
 				}
 				this.$api.qiangdanlist(data,res=>{
 					if(res.code == '1'){
-						this.recycleList = res.data.type
+						this.qiangdanArr = res.data.list.data
+						// this.recycleList = res.data.type
 					}
 				})
 			},
@@ -515,10 +554,18 @@
 	.topBox{
 		background: linear-gradient(0deg, #FFF8F2 0%, #FFFBED 100%);
 		overflow: hidden;
-		// padding-bottom: 6rpx;
+		// padding-bottom: 6rpx;
+		
+		height: calc(118rpx + var(--status-bar-height));
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		z-index: 99;
 	}
 	.topStatus{
-		height: var(--status-bar-height);	//这里是状态栏css变量
+		// height: var(--status-bar-height);	//这里是状态栏css变量
+		height: calc(118rpx + var(--status-bar-height));
 	}
 	.menuBox{
 		display: flex;
@@ -565,7 +612,9 @@
 		font-weight: 500;
 		font-size: 24rpx;
 		color: #333333;
-		padding: 12rpx 22rpx;
+		padding: 0rpx 22rpx;
+		height: 50rpx;
+		line-height: 50rpx;
 	}
 	.selectBox:first-child{
 		margin-right: 14rpx;
@@ -723,15 +772,17 @@
 	}
 	
 	.notice {
-		padding: 15rpx 26rpx 15rpx 60rpx;
+		// padding: 15rpx 26rpx 15rpx 60rpx;
+		height: 70rpx;
 		margin-top: 10rpx;
 		position: relative;
 		overflow: hidden;
 		background-color: #fff;
 		color: #333;
-		margin-bottom: 16rpx;
+		// margin-bottom: 16rpx;
 		background: #FFECEB;
-		border-radius: 16rpx;
+		border-radius: 16rpx;
+		width: 100%;
 		// border: 1px solid #FFFFFF;
 	}
 	.notice-icon {
@@ -889,7 +940,8 @@
 			align-items: flex-end;
 			padding-left: 66rpx;
 			height: 90rpx!important;
-			top: calc(117rpx + var(--status-bar-height));
+			top: calc(118rpx + var(--status-bar-height));
+			z-index: 99;
 			// height: 55rpx;
 	}
 	.navbar .item {
@@ -1214,5 +1266,19 @@
 			margin-left: 20rpx;
 		}
 	}
+	
+	.twoMenuBox{
+		position: fixed;
+		top: calc(118rpx + var(--status-bar-height));
+		left: 0;
+		padding: 0 35rpx 16rpx;
+		box-sizing: border-box;
+		width: 100%;
+		background: #FBF9F7;
+		z-index: 99;
+	}
+	.blockBox1{
+		height: 165rpx;
+	}
 </style>
 
diff --git a/pages/mine/apply.vue b/pages/mine/apply.vue
index be3ab63..8818348 100644
--- a/pages/mine/apply.vue
+++ b/pages/mine/apply.vue
@@ -1,7 +1,7 @@
 <template>
 	<view class="content">
 		<view class="moduleWrap">
-			<view class="moduleBox">
+			<view class="moduleBox" style="padding-bottom: 40rpx;">
 				<view class="monthBox">
 					<view class="text1">身份证信息</view>
 					<text class="text2">上传本人身份证照片，保持图片清晰完整</text>
@@ -42,19 +42,56 @@
 				</view>
 			</view>
 		</view>
-		
-		<view class="moduleBox">
-			<view class="text4">订单号：202504121349001</view>
-			<view class="flex-between">
-				<view class="centerBox">
-					<view class="text5">余额充值</view>
-					<view class="text6">2025年04月12日  13:49</view>
+		<view class="moduleWrap">
+			<view class="moduleBox">
+				<view class="text4">真实姓名</view>
+				<view class="inputBox">
+					<input class="input1" type="text" placeholder="输入和身份证姓名一致" />
 				</view>
-				<view class="bottomBox">
-					<view class="text7">+60.00</view>
-					<view class="text8">完成订单</view>
+			</view>
+			<view class="moduleBox">
+				<view class="text4">身份证号</view>
+				<view class="inputBox">
+					<input class="input1" type="text" placeholder="输入18位身份证号" />
 				</view>
 			</view>
+			<view class="moduleBox">
+				<view class="text4">有效日期</view>
+				<view class="inputBox inputTwoBox">
+					<input class="input1" type="text" placeholder="开始日期" />
+					<text class="centerIcon">至</text>
+					<input class="input2" type="text" placeholder="开始日期" />
+				</view>
+			</view>
+			<view class="moduleBox">
+				<view class="text4">证件地址</view>
+				<view class="inputBox">
+					<input class="input1" type="text" placeholder="与身份证住址保持一致" />
+				</view>
+			</view>
+			<view class="moduleBox">
+				<view class="text4">联系电话</view>
+				<view class="inputBox">
+					<input class="input1" type="text" placeholder="输入您的联系方式" />
+				</view>
+			</view>
+			<view class="moduleBox"  style="padding-bottom: 60rpx;">
+				<view class="text4">代理区域</view>
+				<view class="inputBox inputTwoBox2">
+					<input class="input1" type="text" placeholder="请选择省份" />
+					<text class="centerIcon">-</text>
+					<input class="input2" type="text" placeholder="请选择城市" />
+				</view>
+			</view>
+		</view>
+		<view class="tipBox">
+			Tips：我们会在3个工作日内审核并与您联系，请注意接听电话。
+		</view>
+		<view style="height: 130rpx;"></view>
+		<view class="btnBox">
+			<view class="btnEle flex-center">
+				提交申请
+			</view>
 		</view>
 	</view>
 </template>
@@ -88,12 +125,11 @@
 		padding: 20rpx 35rpx;
 		background: #F5F5FA;
 		height: 100%;
+		overflow: auto;
 	}
 	.monthBox{
 		display: flex;
 		flex-direction: column;
-		// justify-content: flex-start;
-		// align-items: center;
 		.text1{
 			font-weight: bold;
 			font-size: 32rpx;
@@ -108,43 +144,30 @@
 	}
 	.moduleBox{
 		background: #fff;
-		padding: 32rpx 30rpx 40rpx;
-		border-bottom: 1rpx solid #DEDEDE;
+		padding: 34rpx 30rpx 28rpx;
+		// border-bottom: 1rpx solid #DEDEDE;
 		.text4{
-			font-weight: 500;
-			font-size: 22rpx;
-			color: #999999;
+			font-weight: bold;
+			font-size: 28rpx;
+			color: #333333;
 		}
-		.centerBox{
-			margin-top: 25rpx;
-			.text5{
-				font-weight: bold;
-				font-size: 32rpx;
-				color: #333333;
-			}
-			.text6{
-				font-weight: 500;
-				font-size: 22rpx;
-				color: #999999;
-				margin-top: 8rpx;
-			}
+		.input1{
+			margin-top: 40rpx;
+			font-size: 28rpx;
 		}
-		.bottomBox{
-			margin-top: 10rpx;
-			text-align: center;
-			.text7{
-				font-weight: bold;
-				font-size: 36rpx;
-				color: #333333;
-				text-align: center;
-			}
-			.text8{
-				font-weight: bold;
-				font-size: 22rpx;
-				color: #333333;
-				margin-top: 8rpx;
-				text-align: center;
-			}
+		.input2{
+			margin-top: 40rpx;
+			font-size: 28rpx;
+			text-align: right;
+		}
+		.centerIcon{
+			font-weight: 400;
+			font-size: 28rpx;
+			color: #333333;
+		}
+		.inputBox{
+			border-bottom: 1rpx solid #DEDEDE;
+			padding-bottom: 22rpx;
 		}
 	}
 	.moduleBox:last-child{
@@ -156,119 +179,60 @@
 		border-radius: 30rpx;
 		overflow: hidden;
 	}
+	.inputTwoBox{
+		display: flex;
+		flex-direction: row;
+		justify-content: space-between;
+		align-items: flex-end;
+	}
+	.inputTwoBox2{
+		display: flex;
+		flex-direction: row;
+		justify-content: flex-start;
+		align-items: flex-end;
+		.input1{
+			margin-top: 40rpx;
+			font-size: 28rpx;
+			width: 200rpx;
+		}
+		.input2{
+			margin-top: 40rpx;
+			font-size: 28rpx;
+			width: 200rpx;
+		}
+	}
+	.tipBox{
+		width: 680rpx;
+		height: 110rpx;
+		background: #FFF4ED;
+		border-radius: 20rpx;
+		font-weight: 400;
+		font-size: 28rpx;
+		color: #FF9348;
+		line-height: 36rpx;
+		padding: 0 30rpx;
+		display: flex;
+		flex-direction: row;
+		justify-content: flex-start;
+		align-items: center;
+	}
 	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	
-	.hs-row{
+	.btnBox{
+		padding: 10rpx 35rpx;
+		position: fixed;
+		left: 0;
+		bottom: 0;
 		width: 100%;
-		margin-left: 0;
-		padding: 40rpx 45rpx 40rpx 69rpx;
-		border-radius: 30rpx;
-	}
-.hs-row-ft	button{
-		height: 144rpx;
-		width: 144rpx;
-		padding: 0;
-		border-radius: 50%;background-color: #fff;line-height: 108px;
-		 
-	}
-.hs-row-ft	button::after{
-		border: none;
-	}
-	
-		.user-head {
-			height: 140rpx;
-		}
-	
-		.user-head-img {
-			height: 90upx;
-			width: 90upx;
-			border-radius: 50%;
-		}
-	 
-	
-		.hs-row-na {
-			color: #666;
-			font-size: 26upx;    text-align: right;    padding-right: 15px;
-    width: 100%;
-		}
-	
-		.hs-hd {
-			width: 160rpx;
-		}
-	
-		.down {
-			top: 50%;
-			transform: translateY(-50%);
-		}
-		.infoBox{
-			background: #fff;
-			border-radius: 30rpx;
-			overflow: hidden;
-			padding: 10rpx 0 10rpx;
-		}
-		.hs-list{
-			// padding: 33rpx 45rpx;
-			margin: 33rpx 45rpx 0;
-			padding-bottom: 33rpx;
-			border-bottom: 1px solid #DEDEDE;
-			overflow: hidden;
-		}
-		.hs-list:last-child{
-			border-bottom: none;
-		}
-	.escLogin{
-		padding: 40rpx 0;
-		border-radius: 30rpx;
 		background: #fff;
-		text-align: center;
-		font-weight: 500;
-		font-size: 30rpx;
-		color: #282F38;
-		margin-top: 20rpx;
-	}
-	.rightText{
-		font-weight: 400;
-		font-size: 30rpx;
-		color: #282F38;
-	}
-	.colorText{
-		color:#FB8F0C;
-	}
-	.modelLabel{
-		font-weight: bold;
-		font-size: 32rpx;
-		color: #282F38;
-		padding: 42rpx 42rpx 20rpx;
-	}
-	.rightText2{
-		width: 115rpx;
-		height: 48rpx;
-		line-height: 48rpx;
-		text-align: center;
-		background: rgba(251,143,12,0.1);
-		border-radius: 10rpx;
-		font-weight: 400;
-		font-size: 30rpx;
-		color: #FB8F0C;
+		.btnEle{
+			width: 100%;
+			height: 90rpx;
+			background: linear-gradient(90deg, #FFAD38 0%, #FF884E 100%);
+			border-radius: 10rpx;
+			font-weight: 500;
+			font-size: 30rpx;
+			color: #FFFFFF;
+			line-height: 36rpx;
+		}
 	}
 </style>
\ No newline at end of file