211 lines
3.9 KiB
Vue
211 lines
3.9 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="head-top">
|
|
<view class="" @click="banckf()">
|
|
<uni-icons type="left" size="22"></uni-icons>
|
|
</view>
|
|
<view class="">加油记录</view>
|
|
<view class=""></view>
|
|
|
|
</view>
|
|
<view class="mubu">
|
|
<view class="jsy" v-if="listArr.length == 0">
|
|
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
|
|
</view>
|
|
<!-- <view class="" @click="dianyidain()">测试方法</view> -->
|
|
<view class="bao-box" v-for="(item,index) in listArr" :key="index">
|
|
|
|
<view class="you">
|
|
<view class="box-top">
|
|
<text class="numone">一共加油{{item.refuelNum || ''}}升</text>
|
|
<text class="numthree">{{item.recordTime|| '0'}}</text>
|
|
</view>
|
|
<view class="numtwo">消费{{item.refuelMoney || '0'}}元</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="box-pupop" @click="gonews">
|
|
<view class="">
|
|
<uni-icons type="plusempty" color="#ffffff" size="26"></uni-icons>
|
|
<view class="">新增</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import request from '../../utils/request';
|
|
|
|
|
|
export default{
|
|
|
|
data(){
|
|
return{
|
|
msg:'2',
|
|
value2:1,
|
|
pageNum: 1,//第几页
|
|
pageSize: 10,//一页多少张
|
|
totalPages: 0,//总数
|
|
listArr:[]
|
|
}
|
|
},
|
|
onShow() {
|
|
this.driverRescuePage()
|
|
},
|
|
onReachBottom() {
|
|
if (this.pageNum >= this.totalPages) {
|
|
uni.showToast({
|
|
title: '没有下一页数据',
|
|
icon: 'none'
|
|
})
|
|
|
|
} else {
|
|
this.pageNum++
|
|
this.driverRescuePage()
|
|
}
|
|
},
|
|
|
|
methods:{
|
|
|
|
driverRescuePage(){
|
|
let data = {
|
|
driverId : uni.getStorageSync('driverInfo'),
|
|
pageSize:this.pageSize,
|
|
pageNum:this.pageNum
|
|
}
|
|
request({
|
|
url: '/app/driver/listRefuelRecord',
|
|
method: 'get',
|
|
params:data
|
|
}).then((res)=>{
|
|
if(res.code == 200){
|
|
if (this.pageNum != 1) {
|
|
this.listArr = this.listArr.concat(res.rows)
|
|
}else{
|
|
this.listArr = res.rows
|
|
}
|
|
|
|
let total = res.total
|
|
this.totalPages = Math.ceil(total / this.pageSize);
|
|
}
|
|
})
|
|
},
|
|
banckf(){
|
|
uni.navigateBack()
|
|
},
|
|
gonews(){
|
|
uni.navigateTo({
|
|
url:'/pages/my/newrefuel'
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.content{
|
|
width: 100%;
|
|
height: calc(100vh);
|
|
background-color: #F6F6F6;
|
|
box-sizing: border-box;
|
|
padding-top: 40px;
|
|
}
|
|
.head-top{
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
box-sizing: border-box;
|
|
padding: 0px 10px;
|
|
}
|
|
.mubu{
|
|
width: 100%;
|
|
background-color: #F6F6F6;
|
|
box-sizing: border-box;
|
|
padding: 10px;
|
|
}
|
|
.jsy{
|
|
width: 90%;
|
|
margin: 40px auto;
|
|
}
|
|
.bao-box{
|
|
width: 100%;
|
|
background: white;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 10px;
|
|
}
|
|
.icon-lv{
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 50%;
|
|
background: #CBF0D0;
|
|
box-sizing: border-box;
|
|
padding: 10px;
|
|
position: relative;
|
|
image{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
.hongdi{
|
|
position: absolute;
|
|
right: 2px;
|
|
top: 2px;
|
|
width: 6px;
|
|
height: 6px;
|
|
background: #FF3829;
|
|
border-radius: 50%;
|
|
}
|
|
.ddx{
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.you{
|
|
width: 100%;
|
|
}
|
|
.box-top{
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
.numone{
|
|
font-size: 14px;
|
|
font-family: Microsoft YaHei;
|
|
font-weight: 400;
|
|
}
|
|
.numtwo{
|
|
font-size: 16px;
|
|
color: #666666;
|
|
margin-top: 10px;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
|
|
}
|
|
.numthree{
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
color: #999999;
|
|
}
|
|
.box-pupop{
|
|
width: 60px;
|
|
height: 60px;
|
|
border-radius: 50%;
|
|
position: fixed;
|
|
bottom: 45px;
|
|
right: 15px;
|
|
background-color: #0D2E8D;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: white;
|
|
font-size: 14px;
|
|
}
|
|
</style> |