sunliwei/lanan-repair
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

订单列表加分页，操作指南对接扣

Browse Source
This commit is contained in:
Vinjor 2024-10-15 15:24:01 +08:00
parent 52cc6cd3c3
commit a7f4597468
5 changed files with 271 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pages-home/home/active.vue
View File

@ -18,7 +18,9 @@
</view> </view>
</view> </view>
</uni-card> </uni-card>
<view style="text-align: center" v-if="activeList.length==0">
<image class="" src="@/static/images/nothing.png" ></image>
</view>
</view> </view>
<view> <view>
<!-- 输入框示例 --> <!-- 输入框示例 -->

136
pages-order/orderList/orderList.vue
View File

@ -11,40 +11,43 @@
</view> </view>
</view> </view>
<view class="orderList"> <view class="orderList">
<view v-for="(item, index) in orderList" :key="index" class="orderItem"> <scroll-view style="height: 100%;" scroll-y="true" class="itemContent" bindscrolltolower="onReachBottom"
<view class="line1"> refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
<view class="orderNo"> <view v-for="(item, index) in orderList" :key="index" class="orderItem">
订单编号：{{ item.orderNo }} <view class="line1">
<view class="orderNo">
订单编号：{{ item.orderNo }}
</view>
<text class="orderStatus" :class="['status_' + item.status]">
{{ getStatus(item.orderStatus) }}
</text>
</view> </view>
<text class="orderStatus" :class="['status_' + item.status]"> <view class="orderInfo">
{{ getStatus(item.orderStatus) }} <image class="orderInfoIcon" src="@/static/icons/Frame28.png" mode="aspectFit"></image>
</text> <text class="orderInfoText">{{ item.goodsTitle }}</text>
</view> </view>
<view class="orderInfo"> <view class="orderInfo">
<image class="orderInfoIcon" src="@/static/icons/Frame28.png" mode="aspectFit"></image> <image class="orderInfoIcon" src="@/static/icons/Frame27.png" mode="aspectFit"></image>
<text class="orderInfoText">{{ item.goodsTitle }}</text> <text class="orderInfoText">{{ item.tenantName || "蓝安-中鑫之宝" }}</text>
</view> </view>
<view class="orderInfo"> <view class="line2">
<image class="orderInfoIcon" src="@/static/icons/Frame27.png" mode="aspectFit"></image> <view>
<text class="orderInfoText">{{ item.tenantName || "蓝安-中鑫之宝" }}</text> 共计
</view> <text class="orderAmountUnit">￥</text>
<view class="line2"> <text class="orderAmount">{{ item.payMoney }}</text>
<view> </view>
共计 <text>{{ formatTimestamp(item.createTime) }}</text>
<text class="orderAmountUnit">￥</text> </view>
<text class="orderAmount">{{ item.payMoney }}</text> <view class="line3">
<view v-if="item.orderStatus == '0'" @click="goPay(item)" class="showOrder">支付</view>
<view v-if="item.goodsType == '2'" @click="gotoDetail(item)" class="showOrder">查看订单</view>
<view @click="gotoEvaluate(item)" class="evaluate" v-if="item.orderStatus === '1' && !item.commentDesc">评价订单</view>
</view> </view>
<text>{{ formatTimestamp(item.createTime) }}</text>
</view> </view>
<view class="line3"> <view class="no-data" v-if="orderList.length==0">
<view v-if="item.orderStatus == '0'" @click="goPay(item)" class="showOrder">支付</view> <image class="" src="@/static/images/nothing.png" ></image>
<view v-if="item.goodsType == '2'" @click="gotoDetail(item)" class="showOrder">查看订单</view>
<view @click="gotoEvaluate(item)" class="evaluate" v-if="item.orderStatus === '1' && !item.commentDesc">评价订单</view>
</view> </view>
</view> </scroll-view>
<view class="no-data" v-if="orderList.length==0">
<image class="" src="@/static/images/nothing.png" ></image>
</view>
</view> </view>
<uni-popup ref="popup" type="center" border-radius="10px 10px 0 0" @change="popupChange"> <uni-popup ref="popup" type="center" border-radius="10px 10px 0 0" @change="popupChange">
@ -78,8 +81,6 @@ export default {
return { return {
payShow: false, payShow: false,
activeKey: 0, activeKey: 0,
pageNum: 1,
totalPages: 0,
imageUrl: '', imageUrl: '',
tabList: [{ tabList: [{
id: 0, id: 0,
@ -95,24 +96,18 @@ export default {
}, },
], ],
orderList: [], orderList: [],
pageNo: 1,
pageSize: 10,
total: 0,
//下来刷新状态
isTriggered:false,
changeActive: false changeActive: false
} }
}, },
onShow() { onLoad() {
this.orderList = [] this.orderList = []
this.getList() this.getList()
}, },
onReachBottom() {
if (this.pageNum >= this.totalPages) {
uni.showToast({
title: '没有下一页数据',
icon: 'none'
})
} else {
this.pageNum++
this.getList()
}
},
methods: { methods: {
formatTimestamp(timestamp) { formatTimestamp(timestamp) {
// 将时间戳转换为Date对象 // 将时间戳转换为Date对象
@ -127,10 +122,34 @@ export default {
// 组合成日期时间字符串 // 组合成日期时间字符串
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}, },
/**
* 上滑加载数据
*/
onReachBottom() {
//判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
if (this.pageNo * this.pageSize >= this.total) {
uni.$u.toast('没有更多数据了')
return
}
//页码+1,调用获取数据的方法获取第二页数据
this.pageNo++
//此处调用自己获取数据列表的方法
this.getList()
},
/**
* 下拉刷新数据
*/
onRefresherrefresh(){
this.isTriggered = true
this.pageNo = 1
this.total = 0
this.messageList = []
this.getList()
},
async getList() { async getList() {
let data = { let data = {
pageSize: 20, pageSize: this.pageSize,
pageNo: this.pageNum pageNo: this.pageNo
} }
switch (this.activeKey) { switch (this.activeKey) {
case 0: case 0:
@ -149,20 +168,29 @@ export default {
} }
this.changeActive = false this.changeActive = false
await request({ await request({
url: '/userClient/order/page', url: '/app-api/repair/order-info/page',
method: 'get', method: 'get',
params: data params: data,
tenantIdFlag:false
}).then((res) => { }).then((res) => {
if (res.code === 200) { if (res.code === 200) {
this.orderList = this.orderList.concat(res.rows) //判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
let total = res.total if (this.pageNo != 1) {
this.totalPages = Math.ceil(total / this.pageSize); this.orderList = this.orderList.concat(res.data.records)
} else {
this.orderList = res.data.records
}
//将获取的总条数赋值
this.total = res.data.total
this.isTriggered = false
} }
}) })
}, },
changeTabFun(id) { changeTabFun(id) {
this.activeKey = id this.activeKey = id
this.changeActive = true this.changeActive = true
this.pageNo = 1
this.total = 0
this.getList() this.getList()
}, },
getStatus(status) { getStatus(status) {
@ -253,8 +281,8 @@ export default {
.body { .body {
flex: 1; flex: 1;
height: 0; height: 100%;
padding: 24rpx 32rpx; padding: 0 32rpx;
overflow: auto; overflow: auto;
} }
@ -294,8 +322,10 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
row-gap: 20rpx; row-gap: 20rpx;
height: calc(100% - 65px);
.orderItem { .orderItem {
margin-bottom:10rpx;
padding: 30rpx; padding: 30rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 12rpx 12rpx 12rpx 12rpx; border-radius: 12rpx 12rpx 12rpx 12rpx;

23
pages/guideList/guideDetail.vue
View File

@ -1,24 +1,32 @@
<template> <template>
<view class="container"> <view class="container">
<VNavigationBar background-color="rgba(0,0,0,0)" title-color="rgba(0,0,0,0)"></VNavigationBar> <VNavigationBar title="操作指南" background-color="#fff" title-color="#333"></VNavigationBar>
<view class="body"> <view class="body">
<view class="title">如何在小程序上下单车辆维修</view> <view class="title">{{guideObj.title}}</view>
<view class="content"></view> <rich-text style="width: 100%" :nodes="guideObj.content" />
<!-- <view class="content">{{guideObj.content}}</view>-->
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import VNavigationBar from '@/components/VNavigationBar.vue' import VNavigationBar from '@/components/VNavigationBar.vue'
import {getJSONData} from '@/utils/auth'
export default { export default {
components: { components: {
VNavigationBar VNavigationBar
}, },
data() { data() {
return { return {
guideObj:{
title:"",
content:"",
},
}; };
} },
onLoad(){
this.guideObj = getJSONData("guideObj")
}
} }
</script> </script>
@ -34,13 +42,14 @@
height: 0; height: 0;
margin: 32rpx; margin: 32rpx;
padding: 30rpx; padding: 30rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
row-gap: 20rpx; row-gap: 20rpx;
.title { .title {
text-align: center; text-align: center;
font-size: 20px;
} }
} }
} }

99
pages/guideList/guideList.vue
View File

@ -2,27 +2,98 @@
<view class="container"> <view class="container">
<v-navigation-bar title="操作指南" background-color="#fff" title-color="#333"></v-navigation-bar> <v-navigation-bar title="操作指南" background-color="#fff" title-color="#333"></v-navigation-bar>
<view class="body"> <view class="body">
<view @click="gotoDetail(item)" v-for="(item,index) in data" :key="index" class="guideItem"> <scroll-view style="height: 100%;" scroll-y="true" class="itemContent" bindscrolltolower="onReachBottom"
<text class="guide_content">如何在小程序上下单车辆维修</text> refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
<image class="guideIcon" src="../../static/icons/homeInfoMore.png" mode="aspectFit"></image> <view @click="gotoDetail(item)" v-for="(item,index) in dataList" :key="index" class="guideItem">
</view> <text class="guide_content">{{ item.title }}</text>
<image class="guideIcon" src="../../static/icons/homeInfoMore.png" mode="aspectFit"></image>
</view>
<view style="text-align: center" v-if="dataList.length==0">
<image class="" src="@/static/images/nothing.png" ></image>
</view>
</scroll-view>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import VNavigationBar from '@/components/VNavigationBar.vue' import VNavigationBar from '@/components/VNavigationBar.vue'
import request from "@/utils/request";
import {setJSONData} from '@/utils/auth'
export default { export default {
components: { components: {
VNavigationBar VNavigationBar
}, },
data() { data() {
return { return {
data: [{}, {}] dataList: [],
pageNo: 1,
pageSize: 10,
total: 0,
//下来刷新状态
isTriggered:false,
}; };
}, },
onLoad(){
this.getList()
},
methods: { methods: {
gotoDetail() { /**
* 上滑加载数据
*/
onReachBottom() {
//判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
if (this.pageNo * this.pageSize >= this.total) {
uni.$u.toast('没有更多数据了')
return
}
//页码+1,调用获取数据的方法获取第二页数据
this.pageNo++
//此处调用自己获取数据列表的方法
this.getList()
},
/**
* 下拉刷新数据
*/
onRefresherrefresh(){
this.isTriggered = true
this.pageNo = 1
this.total = 0
this.dataList = []
this.getList()
},
/**
* 分页查询
*/
async getList(){
await request({
url: "/app-api/base/notice/pageList",
method: "GET",
params:{
pageNo:this.pageNo,
pageSize:this.pageSize,
type:3,
parentServer:"weixiu",
server:"wx"
},
tenantIdFlag:false
}).then((res) => {
//判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
if (this.pageNo != 1) {
this.dataList = this.dataList.concat(res.data.records)
} else {
this.dataList = res.data.records
}
//将获取的总条数赋值
this.total = res.data.total
this.isTriggered = false
})
},
/**
* 查看详情页
*/
gotoDetail(item) {
setJSONData("guideObj",item)
uni.navigateTo({ uni.navigateTo({
url: '/pages/guideList/guideDetail' url: '/pages/guideList/guideDetail'
}) })
@ -35,36 +106,36 @@
.container { .container {
background-color: #F3F5F7; background-color: #F3F5F7;
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.body { .body {
flex: 1; flex: 1;
height: 0; height: 0;
padding: 0 0 20rpx; padding: 0 0 20rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.guideItem { .guideItem {
margin: 20rpx 32rpx 0; margin: 20rpx 32rpx 0;
background: #FFFFFF; background: #FFFFFF;
border-radius: 12rpx 12rpx 12rpx 12rpx; border-radius: 12rpx 12rpx 12rpx 12rpx;
padding: 40rpx 30rpx; padding: 40rpx 30rpx;
display: flex; display: flex;
align-items: center; align-items: center;
column-gap: 10rpx; column-gap: 10rpx;
font-size: 32rpx; font-size: 32rpx;
color: #333333; color: #333333;
.guide_content { .guide_content {
flex: 1; flex: 1;
width: 0; width: 0;
} }
.guideIcon { .guideIcon {
width: 24rpx; width: 24rpx;
height: 24rpx; height: 24rpx;

103
pages/my/message.vue
View File

@ -1,18 +1,24 @@
<template> <template>
<view class="container"> <view class="container">
<VNavigationBar background-color="#fff" title-color="#333" title="消息中心"></VNavigationBar> <VNavigationBar background-color="#fff" title-color="#333" title="消息中心"></VNavigationBar>
<view class="body"> <view class="body">
<view class="messageList"> <view class="messageList">
<view v-for="(item, index) in messageList" :key="index" class="messageItem"> <scroll-view style="height: 100%;" scroll-y="true" class="itemContent" bindscrolltolower="onReachBottom"
<image class="messageIcon" src="../../static/icons/message-icon1.png" mode="aspectFit"></image> refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
<view class="messageContent"> <view v-for="(item, index) in messageList" :key="index" class="messageItem">
<view class="messageTitle">系统通知</view> <image class="messageIcon" src="../../static/icons/message-icon1.png" mode="aspectFit"></image>
<view class="messageContent_content">节日快乐！在这美好的时刻，送上我最真挚的祝福：愿你的每一天都充满阳光和欢笑，每一步都走向成功和辉煌。</view> <view class="messageContent">
</view> <view class="messageTitle">系统通知</view>
</view> <view class="messageContent_content">节日快乐！在这美好的时刻，送上我最真挚的祝福：愿你的每一天都充满阳光和欢笑，每一步都走向成功和辉煌。</view>
</view> </view>
</view> </view>
</view> <view style="text-align: center" v-if="messageList.length==0">
<image class="" src="@/static/images/nothing.png"></image>
</view>
</scroll-view>
</view>
</view>
</view>
</template> </template>
<script> <script>
@ -24,9 +30,68 @@
}, },
data() { data() {
return { return {
messageList: [{}, {}] messageList: [{}, {}],
pageNo: 1,
pageSize: 10,
total: 0,
//下来刷新状态
isTriggered:false,
}; };
} },
onLoad(){
this.getList()
},
/**
* 上滑加载数据
*/
onReachBottom() {
//判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
if (this.pageNo * this.pageSize >= this.total) {
uni.$u.toast('没有更多数据了')
return
}
//页码+1,调用获取数据的方法获取第二页数据
this.pageNo++
//此处调用自己获取数据列表的方法
this.getList()
},
/**
* 下拉刷新数据
*/
onRefresherrefresh(){
this.isTriggered = true
this.pageNo = 1
this.total = 0
this.messageList = []
this.getList()
},
/**
* 分页查询
*/
async getList(){
// await request({
// url: "/app-api/base/notice/pageList",
// method: "GET",
// params:{
// pageNo:this.pageNo,
// pageSize:this.pageSize,
// type:3,
// parentServer:"weixiu",
// server:"wx"
// },
// tenantIdFlag:false
// }).then((res) => {
// //判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
// if (this.pageNo != 1) {
// this.messageList = this.messageList.concat(res.data.records)
// } else {
// this.messageList = res.data.records
// }
// //将获取的总条数赋值
// this.total = res.data.total
// this.isTriggered = false
// })
},
} }
</script> </script>
@ -49,12 +114,12 @@
align-items: center; align-items: center;
column-gap: 20rpx; column-gap: 20rpx;
border-bottom: 1rpx solid #EEEEEE; border-bottom: 1rpx solid #EEEEEE;
.messageIcon { .messageIcon {
width: 80rpx; width: 80rpx;
height: 80rpx; height: 80rpx;
} }
.messageContent { .messageContent {
flex: 1; flex: 1;
width: 0; width: 0;
@ -68,7 +133,7 @@
font-weight: 500; font-weight: 500;
font-size: 28rpx; font-size: 28rpx;
color: #858BA0; color: #858BA0;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;