recyc/recycapp
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

'gengxin'

Browse Source
This commit is contained in:
unknown 2025-10-25 19:46:23 +08:00
parent 32311dd201
commit 920839469a
2 changed files with 254 additions and 224 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

198
pages/index/index.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<view class="content"> <view class="content">
<view class="topStatus"></view>
<view class="topBox"> <view class="topBox">
<view class="topStatus"></view>
<view class="flex-between headBox" style="height: 117rpx;padding-right: 35rpx;"> <view class="flex-between headBox" style="height: 117rpx;padding-right: 35rpx;">
<view class="menuBox"> <view class="menuBox">
<view class="menuView flex-center" :class="{checkMenu: menuNum == 1}" @click="menuClick(1)"> <view class="menuView flex-center" :class="{checkMenu: menuNum == 1}" @click="menuClick(1)">
@ -19,71 +19,75 @@
</view> </view>
</view> </view>
<view class="contentBox"> <view class="contentBox">
<view class="menuBox1" style="display: none;"> <view class="menuBox1" v-show="menuNum == 1">
<view class="notice " > <view class="twoMenuBox">
<view class="notice-icon"> <view class="notice flex-center" >
<image class="icon " src="/static/img/news.png" mode=""></image> <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>
<view class="notice-row" > <view class="flex-between" style="margin-top: 30rpx;">
<text class=" ">{{notice}}</text> <view>
</view> <view class="orderLabel flex-center">
</view> <view class="leftLine"></view>
<view class="flex-between" style="margin-top: 31rpx;"> 订单列表
<view> </view>
<view class="orderLabel flex-center"> </view>
<view class="leftLine"></view> <view class="flex-center">
订单列表 <view class="flex-center selectBox">
</view> <view>全部需求</view>
</view> <u-icon name="arrow-down" color="#333333" size="12" style="margin-left: 13rpx;"></u-icon>
<view class="flex-center"> </view>
<view class="flex-center selectBox"> <view class="flex-center selectBox">
<view>全部需求</view> <view>距离最近</view>
<u-icon name="arrow-down" color="#333333" size="12" style="margin-left: 13rpx;"></u-icon> <u-icon name="arrow-down" color="#333333" size="12" style="margin-left: 13rpx;"></u-icon>
</view> </view>
<view class="flex-center selectBox"> </view>
<view>距离最近</view> </view>
<u-icon name="arrow-down" color="#333333" size="12" style="margin-left: 13rpx;"></u-icon> </view>
</view> <view class="blockBox1"></view>
</view>
</view> <view class="orderBox" v-for="item in qiangdanArr">
<view class="orderBox"> <view class="flex-between">
<view class="flex-between"> <view class="flex-center">
<view></view> <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="flex-center"> <view class="timeLabel">{{countTime(item.order_time)}}分钟内</view>
<view class="timeLabel">36分钟内</view>
<view class="timeLabel2">(10:17前)上门</view> <view class="timeLabel2">(10:17前)上门</view>
</view> </view>
<view class="distant">1.5公里</view> <view class="distant">{{item.distance}}公里</view>
</view> </view>
<view class="flex-between addressBox"> <view class="flex-between addressBox">
<view class="addressText">‌江苏省南京市玄武区珠江路88号金鹰...</view> <view class="addressText">‌{{item.full_address}}</view>
<view class="addressBtn">导航</view> <view class="addressBtn">导航</view>
</view> </view>
<view class="flex-between goodsWrap"> <view class="flex-between goodsWrap">
<view class="goodsBox1 flex-center" style="width: 40%;"> <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>
<view class="goodsText1">回收品类</view> <view class="goodsText1">回收品类</view>
<view class="goodsText2">冰箱</view> <view class="goodsText2">{{item.type_name}}</view>
</view> </view>
</view> </view>
<view class="goodsBox2 flex-column-center" style="width: 20%;"> <view class="goodsBox2 flex-column-center" style="width: 20%;">
<view class="goodsText1">数量</view> <view class="goodsText1">数量</view>
<view class="goodsText2">X1</view> <view class="goodsText2">X{{item.quantity}}</view>
</view> </view>
<view class="goodsBox3 flex-column-center" style="width: 40%;"> <view class="goodsBox3 flex-column-center" style="width: 40%;">
<view class="goodsText1">预估价</view> <view class="goodsText1">预估价</view>
<view class="flex-center"> <view class="flex-center">
<view class="priceIcon">￥</view> <view class="priceIcon">￥</view>
<view class="priceNum">333</view> <view class="priceNum">{{item.price}}</view>
</view> </view>
</view> </view>
</view> </view>
<view class="remarkBox">备注：需要不要打电话，请按门铃</view> <view class="remarkBox">备注：{{item.remark}}</view>
<view class="flex-between userBox"> <view class="flex-between userBox">
<view class="flex-center"> <view class="flex-center">
<image src="/static/img/39.png" class="userImg"></image> <image src="/static/img/39.png" class="userImg"></image>
<view>糯米小团子</view> <view>{{item.accept_name}}</view>
</view> </view>
<view class="userBtn flex-center"> <view class="userBtn flex-center">
抢单 抢单
@ -91,7 +95,7 @@
</view> </view>
</view> </view>
</view> </view>
<view class="menuBox2"> <view class="menuBox2" v-show="menuNum == 2">
<view class="navbar"> <view class="navbar">
<view v-for="item in tabAll" class="item" :class="[tabCur==item.id?'on':'']" @click="selectTab(item.id)"> <view v-for="item in tabAll" class="item" :class="[tabCur==item.id?'on':'']" @click="selectTab(item.id)">
{{item.name}} {{item.name}}
@ -104,7 +108,8 @@
</view> </view>
</view> </view>
<view style="height: 195rpx;"></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-between">
<view class="flex-center"> <view class="flex-center">
<view class="timeLabel">36分钟内</view> <view class="timeLabel">36分钟内</view>
@ -113,7 +118,7 @@
<view class="distant">1.5公里</view> <view class="distant">1.5公里</view>
</view> </view>
<view class="flex-between addressBox"> <view class="flex-between addressBox">
<view class="addressText">‌江苏省南京市玄武区珠江路88号金鹰...</view> <view class="addressText">‌{{item.accept_address}}</view>
<view class="addressBtn">导航</view> <view class="addressBtn">导航</view>
</view> </view>
<view class="flex-between goodsWrap"> <view class="flex-between goodsWrap">
@ -121,28 +126,28 @@
<image src="/static/img/41.png" class="goodsImg"></image> <image src="/static/img/41.png" class="goodsImg"></image>
<view> <view>
<view class="goodsText1">回收品类</view> <view class="goodsText1">回收品类</view>
<view class="goodsText2">冰箱</view> <view class="goodsText2">{{item.type_name}}</view>
</view> </view>
</view> </view>
<view class="goodsBox2 flex-column-center" style="width: 20%;"> <view class="goodsBox2 flex-column-center" style="width: 20%;">
<view class="goodsText1">数量</view> <view class="goodsText1">数量</view>
<view class="goodsText2">X1</view> <view class="goodsText2">X{{item.quantity}}</view>
</view> </view>
<view class="goodsBox3 flex-column-center" style="width: 40%;"> <view class="goodsBox3 flex-column-center" style="width: 40%;">
<view class="goodsText1">预估价</view> <view class="goodsText1">预估价</view>
<view class="flex-center"> <view class="flex-center">
<view class="priceIcon">￥</view> <view class="priceIcon">￥</view>
<view class="priceNum">333</view> <view class="priceNum">{{item.price}}</view>
</view> </view>
</view> </view>
</view> </view>
<view class="remarkBox">备注：需要不要打电话，请按门铃</view> <view class="remarkBox">备注：{{item.remark}}</view>
<view class="flex-between userBox"> <view class="flex-between userBox">
<view class="flex-center"> <view class="flex-center">
<image src="/static/img/39.png" class="userImg"></image> <image src="/static/img/39.png" class="userImg"></image>
<view>糯米小团子</view> <view>{{item.accept_name}}</view>
</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> <u-icon name="phone" color="#333333" size="16" style="margin-right: 7rpx;"></u-icon>
联系TA 联系TA
</view> </view>
@ -153,11 +158,11 @@
期望时间：(10:17前) 期望时间：(10:17前)
</view> --> </view> -->
<view class="flex-center statusText1"> <view class="flex-center statusText1">
更多操作 <view @click="moreShow=!moreShow">更多操作</view>
<view class="floatBtnBox"> <view class="floatBtnBox" v-show="moreShow">
<view class="floatBtnEle" @click="cancleShow= true">取消订单</view> <view class="floatBtnEle" @click="cancleClickOrder">取消订单</view>
<view class="btnLine"></view> <view class="btnLine"></view>
<view class="floatBtnEle">改派订单</view> <view class="floatBtnEle" @click="changeClickOrder">改派订单</view>
</view> </view>
</view> </view>
<view class="flex-center"> <view class="flex-center">
@ -305,15 +310,15 @@
</view> </view>
</view> </view>
</u-popup> </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="pop4Box">
<view class="flex-between" style="padding: 51rpx 55rpx 0;"> <view class="flex-between" style="padding: 51rpx 55rpx 0;">
<text class="pop4Title">改派原因</text> <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> </view>
<u--textarea v-model="notesText" placeholder="请填写改派原因" class="pop4Input" style="background: #EFEFEF;border: none"></u--textarea> <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="flex-center" style="margin-top: 55rpx;">
<view class="pop4Btn1">取消改派</view> <view class="pop4Btn1" @click="pop4Show = false">取消改派</view>
<view class="pop4Btn2">确认改派</view> <view class="pop4Btn2">确认改派</view>
</view> </view>
</view> </view>
@ -380,19 +385,43 @@
], ],
tabCur: 0, tabCur: 0,
recycleList: [], recycleList: [],
qiangdanArr: [],
page: 1, page: 1,
orderList: [], orderList: [],
cancleShow:false, cancleShow:false,
signInShow: false, signInShow: false,
pop2Show: false, pop2Show: false,
pop3Show: false, pop3Show: false,
pop4Show: false pop4Show: false,
notesText: '',
moreShow: false
} }
}, },
components: { components: {
CustomTabBar, CustomTabBar,
cancleOrder 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() { onShow() {
uni.hideTabBar({ uni.hideTabBar({
fail: () => {}, fail: () => {},
@ -419,6 +448,14 @@
onReachBottom (){ onReachBottom (){
}, },
methods: { methods: {
cancleClickOrder(){
this.cancleShow = true
this.moreShow = false
},
changeClickOrder(){
this.pop4Show = true
this.moreShow = false
},
selectTab(id){ selectTab(id){
this.page=1 this.page=1
this.tabCur = id this.tabCur = id
@ -432,7 +469,8 @@
} }
this.$api.recycleOrderList(data,res=>{ this.$api.recycleOrderList(data,res=>{
if(res.code == '1'){ 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=>{ this.$api.qiangdanlist(data,res=>{
if(res.code == '1'){ 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{ .topBox{
background: linear-gradient(0deg, #FFF8F2 0%, #FFFBED 100%); background: linear-gradient(0deg, #FFF8F2 0%, #FFFBED 100%);
overflow: hidden; 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{ .topStatus{
height: var(--status-bar-height); //这里是状态栏css变量 // height: var(--status-bar-height); //这里是状态栏css变量
height: calc(118rpx + var(--status-bar-height));
} }
.menuBox{ .menuBox{
display: flex; display: flex;
@ -565,7 +612,9 @@
font-weight: 500; font-weight: 500;
font-size: 24rpx; font-size: 24rpx;
color: #333333; color: #333333;
padding: 12rpx 22rpx; padding: 0rpx 22rpx;
height: 50rpx;
line-height: 50rpx;
} }
.selectBox:first-child{ .selectBox:first-child{
margin-right: 14rpx; margin-right: 14rpx;
@ -723,15 +772,17 @@
} }
.notice { .notice {
padding: 15rpx 26rpx 15rpx 60rpx; // padding: 15rpx 26rpx 15rpx 60rpx;
height: 70rpx;
margin-top: 10rpx; margin-top: 10rpx;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
background-color: #fff; background-color: #fff;
color: #333; color: #333;
margin-bottom: 16rpx; // margin-bottom: 16rpx;
background: #FFECEB; background: #FFECEB;
border-radius: 16rpx; border-radius: 16rpx;
width: 100%;
// border: 1px solid #FFFFFF; // border: 1px solid #FFFFFF;
} }
.notice-icon { .notice-icon {
@ -889,7 +940,8 @@
align-items: flex-end; align-items: flex-end;
padding-left: 66rpx; padding-left: 66rpx;
height: 90rpx!important; height: 90rpx!important;
top: calc(117rpx + var(--status-bar-height)); top: calc(118rpx + var(--status-bar-height));
z-index: 99;
// height: 55rpx; // height: 55rpx;
} }
.navbar .item { .navbar .item {
@ -1214,5 +1266,19 @@
margin-left: 20rpx; 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> </style>

280
pages/mine/apply.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<view class="content"> <view class="content">
<view class="moduleWrap"> <view class="moduleWrap">
<view class="moduleBox"> <view class="moduleBox" style="padding-bottom: 40rpx;">
<view class="monthBox"> <view class="monthBox">
<view class="text1">身份证信息</view> <view class="text1">身份证信息</view>
<text class="text2">上传本人身份证照片，保持图片清晰完整</text> <text class="text2">上传本人身份证照片，保持图片清晰完整</text>
@ -42,19 +42,56 @@
</view> </view>
</view> </view>
</view> </view>
<view class="moduleWrap">
<view class="moduleBox"> <view class="moduleBox">
<view class="text4">订单号：202504121349001</view> <view class="text4">真实姓名</view>
<view class="flex-between"> <view class="inputBox">
<view class="centerBox"> <input class="input1" type="text" placeholder="输入和身份证姓名一致" />
<view class="text5">余额充值</view>
<view class="text6">2025年04月12日 13:49</view>
</view> </view>
<view class="bottomBox"> </view>
<view class="text7">+60.00</view> <view class="moduleBox">
<view class="text8">完成订单</view> <view class="text4">身份证号</view>
<view class="inputBox">
<input class="input1" type="text" placeholder="输入18位身份证号" />
</view> </view>
</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>
</view> </view>
</template> </template>
@ -88,12 +125,11 @@
padding: 20rpx 35rpx; padding: 20rpx 35rpx;
background: #F5F5FA; background: #F5F5FA;
height: 100%; height: 100%;
overflow: auto;
} }
.monthBox{ .monthBox{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
// justify-content: flex-start;
// align-items: center;
.text1{ .text1{
font-weight: bold; font-weight: bold;
font-size: 32rpx; font-size: 32rpx;
@ -108,43 +144,30 @@
} }
.moduleBox{ .moduleBox{
background: #fff; background: #fff;
padding: 32rpx 30rpx 40rpx; padding: 34rpx 30rpx 28rpx;
border-bottom: 1rpx solid #DEDEDE; // border-bottom: 1rpx solid #DEDEDE;
.text4{ .text4{
font-weight: 500; font-weight: bold;
font-size: 22rpx; font-size: 28rpx;
color: #999999; color: #333333;
} }
.centerBox{ .input1{
margin-top: 25rpx; margin-top: 40rpx;
.text5{ font-size: 28rpx;
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.text6{
font-weight: 500;
font-size: 22rpx;
color: #999999;
margin-top: 8rpx;
}
} }
.bottomBox{ .input2{
margin-top: 10rpx; margin-top: 40rpx;
text-align: center; font-size: 28rpx;
.text7{ text-align: right;
font-weight: bold; }
font-size: 36rpx; .centerIcon{
color: #333333; font-weight: 400;
text-align: center; font-size: 28rpx;
} color: #333333;
.text8{ }
font-weight: bold; .inputBox{
font-size: 22rpx; border-bottom: 1rpx solid #DEDEDE;
color: #333333; padding-bottom: 22rpx;
margin-top: 8rpx;
text-align: center;
}
} }
} }
.moduleBox:last-child{ .moduleBox:last-child{
@ -156,119 +179,60 @@
border-radius: 30rpx; border-radius: 30rpx;
overflow: hidden; 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;
}
.btnBox{
padding: 10rpx 35rpx;
position: fixed;
left: 0;
bottom: 0;
.hs-row{
width: 100%; 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; background: #fff;
text-align: center; .btnEle{
font-weight: 500; width: 100%;
font-size: 30rpx; height: 90rpx;
color: #282F38; background: linear-gradient(90deg, #FFAD38 0%, #FF884E 100%);
margin-top: 20rpx; border-radius: 10rpx;
} font-weight: 500;
.rightText{ font-size: 30rpx;
font-weight: 400; color: #FFFFFF;
font-size: 30rpx; line-height: 36rpx;
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;
} }
</style> </style>