You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
386 lines
10 KiB
386 lines
10 KiB
<template>
|
|
<view class="pd-main font16">
|
|
<view class="headsearch paddtop10 paddbotm10 fotct">
|
|
<view class=" fcorfff paddtop10 paddbotm10 ">总加油金额</view>
|
|
<view class="font28 fcorfff ">¥<text class="margle font40">{{GasOrder.refuelPrice || 0}}</text></view>
|
|
<view class="alijus marb20 mart10">
|
|
<view class="width50 fcorfff ">
|
|
<view class="width100">总笔数</view>
|
|
<view class="width100 mart10 font22">{{GasOrder.refuelNum || 0}} 笔</view>
|
|
</view>
|
|
<view class="width50 fcorfff ">
|
|
<view class="width100">总升数</view>
|
|
<view class="width100 mart10 font22">{{GasOrder.refuelLiters || 0}} 升</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="headsearch mart15 paddtop10 paddbotm10 fotct">
|
|
|
|
<view class="mart10 width90 dis-flex flex-sp">
|
|
<view class="fcorfff font14 margleri10 width60 fotlt">开始时间 :</view>
|
|
<picker mode="date" :value="startdate" :start="startDate" :end="endDate" @change="bindDateChange">
|
|
<view class="uni-input datetim fcorfff">{{startdate}}<i class="down"></i></view>
|
|
</picker>
|
|
</view>
|
|
<view class="mart10 width90 dis-flex flex-sp">
|
|
<view class="fcorfff font14 margleri10 width60 fotlt">结束时间 :</view>
|
|
<picker mode="date" :value="enddate" :start="startDate" :end="endDate" @change="bindDateChange1">
|
|
<view class="uni-input datetim fcorfff">{{enddate}}<i class="down"></i></view>
|
|
</picker>
|
|
</view>
|
|
<view class="mart10 width90 dis-flex flex-sp">
|
|
<view class="fcorfff font14 margleri10 width60 fotlt">油品 :</view>
|
|
<picker mode="selector" :range="oilList" range-key="codeName" @change="changeUserCard">
|
|
<view class="uni-input datetim fcorfff font14">{{typeName}}<i class="down"></i></view>
|
|
</picker>
|
|
</view>
|
|
<view class="mart10 width90 dis-flex flex-sp">
|
|
<view class="fcorfff font14 margleri10 width60 fotlt">状态 :</view>
|
|
<picker mode="selector" :range="statulist" range-key="codeName" @change="changeUserstu">
|
|
<view class="uni-input datetim fcorfff font14">{{statusname}}<i class="down"></i></view>
|
|
</picker>
|
|
</view>
|
|
<view class="input-box fotlt dis-flex flex-center mart15 marb10">
|
|
<input placeholder="订单号搜索" v-model="orderNo" placeholder-style="color:#c0c0c0;"
|
|
@input="searchOrder()" />
|
|
<view class="icon search"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<view v-if="orderDetailsList == ''" class="mart40 fotct font14 fcor666">
|
|
<image mode="widthFix" style="width: 70vw;" src="../../../static/img/noorder.png"></image>
|
|
</view>
|
|
|
|
<view class=" backcorfff headcont mart10 pd-main font14" v-for="(item,index) in orderDetailsList" :key="index"
|
|
@click="jumpDetails(item.orderNo)">
|
|
<view class="alijusstart fcor333 paddtop10 paddbotm10 bor-botm1">
|
|
<text :user-select="true" class=" text1">{{item.orderNo}}</text>
|
|
<image class="iconw margle " style="height: 15px;" mode="widthFix" src="/static/img/jtg.png"></image>
|
|
<text class="flex-1 fotrt" >{{item.status | filterStatus }}</text>
|
|
</view>
|
|
<view class="paddtop10 paddbotm10 bor-botm1">
|
|
<view class=" dis-flex fcor666">
|
|
油号/枪号: <text class="margle marglerig">{{item.gasOilNo}}#/{{item.gasGunNo}}号枪</text>
|
|
</view>
|
|
<view class=" dis-flex fcor666 mart5">
|
|
升数:<text class="margle">{{item.gasOilLiters}}L</text>
|
|
</view>
|
|
<view class="dis-flex flex-sp mart5">
|
|
<view class=" fcor666">加油金额: ¥{{item.gasRefuelPrice}}</view>
|
|
<view class=" fcor333 fotrt dis-flex font18">实付:
|
|
<text class="margle" >¥{{item.payPrice || 0}}</text>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="paddtop10 mart5 fcor666">下单时间:
|
|
{{item.createTime | timeFormat('yyyy-mm-dd hh:mm:ss')}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
getDictionaryByCodeType,
|
|
getGasOrderList,
|
|
countGasOrder
|
|
} from '../../../Utils/Api.js';
|
|
export default {
|
|
data() {
|
|
const currentDate = this.getDate({
|
|
format: true
|
|
})
|
|
return {
|
|
startdate: currentDate,
|
|
enddate: currentDate,
|
|
pageNum: 1,
|
|
pagesize: 10,
|
|
isLoadMore: false, //是否加载中
|
|
orderNo: '', //搜索内容
|
|
oilList: [{
|
|
codeValue: '',
|
|
codeName: '全部'
|
|
}], //数据字典
|
|
typeName: '全部', // 名称
|
|
typeId: '', //区分类型
|
|
statulist: [{
|
|
codeValue: '',
|
|
codeName: '全部'
|
|
}, {
|
|
codeValue: 1,
|
|
codeName: '待支付'
|
|
}, {
|
|
codeValue: 2,
|
|
codeName: '已支付'
|
|
}, {
|
|
codeValue: 3,
|
|
codeName: '已取消'
|
|
},{
|
|
codeValue: 4,
|
|
codeName: '已退款'
|
|
}, {
|
|
codeValue: 5,
|
|
codeName: '退款中'
|
|
}, {
|
|
codeValue: 6,
|
|
codeName: '退款失败'
|
|
},
|
|
], //状态
|
|
statuid: '',
|
|
statusname: '全部',
|
|
orderDetailsList: [], //列表数据
|
|
GasOrder: '' //统计
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.getDictionaryByCodeType();
|
|
this.getGasOrderList();
|
|
this.countGasOrder();
|
|
},
|
|
computed: {
|
|
startDate() {
|
|
return this.getDate('start');
|
|
},
|
|
endDate() {
|
|
return this.getDate('end');
|
|
}
|
|
},
|
|
filters:{
|
|
filterStatus(value){
|
|
switch (value) {
|
|
case 1:
|
|
return "待支付";
|
|
case 2:
|
|
return "已支付";
|
|
case 3:
|
|
return "已取消";
|
|
case 4:
|
|
return "已退款";
|
|
case 5:
|
|
return "退款中";
|
|
case 6:
|
|
return "退款失败";
|
|
default:
|
|
return "未知";
|
|
}
|
|
}
|
|
},
|
|
onReachBottom() { //上拉触底函数
|
|
if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
|
|
this.isLoadMore = true
|
|
this.pageNum += 1
|
|
this.getGasOrderList()
|
|
}
|
|
},
|
|
methods: {
|
|
bindDateChange: function(e) {
|
|
this.startdate = e.target.value;
|
|
this.pageNum = 1;
|
|
this.orderDetailsList = [];
|
|
this.GasOrder = '';
|
|
this.isLoadMore = true;
|
|
this.countGasOrder();
|
|
this.getGasOrderList();
|
|
},
|
|
bindDateChange1: function(e) {
|
|
this.enddate = e.target.value;
|
|
this.pageNum = 1;
|
|
this.orderDetailsList = [];
|
|
this.GasOrder = '';
|
|
this.isLoadMore = true;
|
|
this.countGasOrder();
|
|
this.getGasOrderList();
|
|
},
|
|
getDate(type) {
|
|
const date = new Date();
|
|
let year = date.getFullYear();
|
|
let month = date.getMonth() + 1;
|
|
let day = date.getDate();
|
|
|
|
if (type === 'start') {
|
|
year = year - 60;
|
|
} else if (type === 'end') {
|
|
year = year + 2;
|
|
}
|
|
month = month > 9 ? month : '0' + month;;
|
|
day = day > 9 ? day : '0' + day;
|
|
return `${year}-${month}-${day}`;
|
|
},
|
|
//查询数据字典油品
|
|
getDictionaryByCodeType() {
|
|
let datas = {
|
|
codeType: 'GAS_OIL_TYPE'
|
|
}
|
|
getDictionaryByCodeType(datas).then(res => {
|
|
if (res.return_code == '000000') {
|
|
let List = res.return_data;
|
|
for (var i = 0; i < List.length; i++) {
|
|
this.oilList.push(List[i]);
|
|
}
|
|
}
|
|
})
|
|
},
|
|
//选择油品
|
|
changeUserCard(e) {
|
|
this.typeId = this.oilList[e.target.value].codeValue;
|
|
this.typeName = this.oilList[e.target.value].codeName;
|
|
this.pageNum = 1;
|
|
this.orderDetailsList = [];
|
|
this.GasOrder = '';
|
|
this.isLoadMore = true;
|
|
this.countGasOrder();
|
|
this.getGasOrderList();
|
|
},
|
|
//选择状态
|
|
changeUserstu(e) {
|
|
this.statuid = this.statulist[e.target.value].codeValue;
|
|
this.statusname = this.statulist[e.target.value].codeName;
|
|
this.pageNum = 1;
|
|
this.orderDetailsList = [];
|
|
this.GasOrder = '';
|
|
this.isLoadMore = true;
|
|
this.countGasOrder();
|
|
this.getGasOrderList();
|
|
},
|
|
//订单统计
|
|
countGasOrder() {
|
|
uni.showLoading({
|
|
title: '加载中'
|
|
})
|
|
let a = new Date(this.startdate).getTime();
|
|
let b = new Date(this.enddate).getTime();
|
|
let startTime = a - 28800000;
|
|
let endTime = b + 57599000;
|
|
let datas = {
|
|
orderNo: this.orderNo,
|
|
oilNo: this.typeId,
|
|
status: this.statuid,
|
|
pageNum: this.pageNum,
|
|
pageSize: this.pagesize,
|
|
payTimeS: startTime,
|
|
payTimeE: endTime
|
|
}
|
|
countGasOrder(datas).then(res => {
|
|
uni.hideLoading();
|
|
if (res.return_code == '000000') {
|
|
this.GasOrder = res.return_data;
|
|
}
|
|
})
|
|
},
|
|
//查询列表
|
|
getGasOrderList() {
|
|
uni.showLoading({
|
|
title: '加载中'
|
|
})
|
|
let a = new Date(this.startdate).getTime();
|
|
let b = new Date(this.enddate).getTime();
|
|
let startTime = a - 28800000;
|
|
let endTime = b + 57599000;
|
|
let datas = {
|
|
orderNo: this.orderNo,
|
|
oilNo: this.typeId,
|
|
status: this.statuid,
|
|
pageNum: this.pageNum,
|
|
pageSize: this.pagesize,
|
|
payTimeS: startTime,
|
|
payTimeE: endTime
|
|
}
|
|
getGasOrderList(datas).then(res => {
|
|
uni.hideLoading();
|
|
if (res.return_code == '000000' && res.return_data.list !='') {
|
|
this.orderDetailsList = this.orderDetailsList.concat(res.return_data.list);
|
|
if (res.return_data.pages == this.pageNum) {
|
|
this.isLoadMore = true;
|
|
} else {
|
|
this.isLoadMore = false
|
|
}
|
|
} else {
|
|
this.orderDetailsList = [];
|
|
this.isLoadMore = true
|
|
}
|
|
});
|
|
},
|
|
//搜索条件
|
|
searchOrder() {
|
|
this.orderDetailsList = [];
|
|
this.pageNum = 1;
|
|
this.getGasOrderList();
|
|
},
|
|
//跳转详情
|
|
jumpDetails(item) {
|
|
uni.navigateTo({
|
|
url: '../../home/oderDetails/oderDetails?ordesid=' + item
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #f3f4f8;
|
|
}
|
|
|
|
.datetim {
|
|
width: 130px;
|
|
height: 30px;
|
|
line-height: 30px;
|
|
text-align: right;
|
|
border-radius: 15px;
|
|
}
|
|
|
|
i {
|
|
border: solid #ffffff;
|
|
border-width: 0 2px 2px 0;
|
|
display: inline-block;
|
|
padding: 4px;
|
|
margin-left: 10px;
|
|
vertical-align: 3px;
|
|
}
|
|
|
|
.down {
|
|
-webkit-transform: rotate(45deg);
|
|
}
|
|
|
|
.headsearch {
|
|
border-radius: 8px;
|
|
background-color: #4c7fe6;
|
|
}
|
|
|
|
.input-box {
|
|
width: 90%;
|
|
margin-left: 5%;
|
|
background-color: #f5f5f5;
|
|
border-radius: 10rpx;
|
|
height: 35px;
|
|
|
|
.icon {
|
|
align-items: center;
|
|
width: 60upx;
|
|
font-size: 40upx;
|
|
color: #c0c0c0;
|
|
}
|
|
|
|
input {
|
|
padding-left: 28upx;
|
|
height: 28upx;
|
|
font-size: 28upx;
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.headcont {
|
|
// height: 150px;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.counimgs {
|
|
width: 60px;
|
|
max-height: 60px;
|
|
}
|
|
|
|
.counscou {
|
|
margin-left: 70px;
|
|
}
|
|
</style>
|
|
|