parent
9f75592592
commit
3b63bc9a97
@ -0,0 +1,236 @@ |
||||
<template> |
||||
<view class="wallet"> |
||||
<u-sticky offset-top="0"> |
||||
<view class="timecontainer" style="padding: 0 20rpx;"> |
||||
<view class="timetext"> |
||||
月份: |
||||
</view> |
||||
<view class="timecontainer"> |
||||
<view class="selectTime" @click="onchangeTime(1)"> |
||||
{{start_at?start_at:'开始月份'}} |
||||
</view> |
||||
<text>-</text> |
||||
<view class="selectTime" @click="onchangeTime(2)"> |
||||
{{end_at?end_at:'结束月份'}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</u-sticky> |
||||
<u-picker v-model="timeShow" mode="time" :params="timeParams" @confirm="timeChage"></u-picker> |
||||
<view class="dataList" style="margin: 26rpx;" v-if="list.length>0"> |
||||
<view class="item" v-for="item in list" :key="i"> |
||||
<view class="l"> |
||||
<view class="b">{{item.month}}</view> |
||||
</view> |
||||
<view class="r"> |
||||
<view class="a">{{item.total_money?Number(item.total_money):item.total_money}}</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<u-empty text="暂无数据显示哦~" v-else mode="list"></u-empty> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import * as wallet from '@/api/wallet' |
||||
export default { |
||||
data() { |
||||
return { |
||||
timeShow: false, |
||||
timeType: '', |
||||
list: [], |
||||
start_at: '', |
||||
end_at: '', |
||||
timeParams: { |
||||
year: true, |
||||
month: true, |
||||
}, |
||||
y1: '', |
||||
m1: '', |
||||
y2: '', |
||||
m2: '', |
||||
|
||||
} |
||||
}, |
||||
onLoad(options) { |
||||
this.getBalance() |
||||
}, |
||||
onShow() {}, |
||||
methods: { |
||||
getBalance() { |
||||
let that = this; |
||||
let obj = { |
||||
userId: uni.getStorageSync('userId'), |
||||
startTime: that.start_at, |
||||
endTime: that.end_at, |
||||
} |
||||
wallet.getMonhlySalesList(obj) |
||||
.then(res => { |
||||
that.list = [] |
||||
that.list = res.data.list.data |
||||
}) |
||||
.finally() |
||||
}, |
||||
onchangeTime(type) { |
||||
this.timeType = type |
||||
this.timeShow = true |
||||
}, |
||||
timeChage(e) { |
||||
if (this.timeType == 1) { |
||||
this.start_at = e.year + '-' + e.month |
||||
this.y1 = e.year |
||||
this.m1 = e.month |
||||
} |
||||
if (this.timeType == 2) { |
||||
this.end_at = e.year + '-' + e.month |
||||
this.y2 = e.year |
||||
this.m2 = e.month |
||||
} |
||||
if (this.start_at && this.end_at) { |
||||
console.log(this.y1, this.y2) |
||||
console.log(this.m1, this.m2) |
||||
if (this.y1 > this.y2) { |
||||
uni.showToast({ |
||||
icon: "none", |
||||
title: '结束月份比必须大于开始月份' |
||||
}) |
||||
this.end_at = '' |
||||
} |
||||
if (this.y1 == this.y2 && this.m1 > this.m2) { |
||||
uni.showToast({ |
||||
icon: "none", |
||||
title: '结束月份比必须大于开始月份' |
||||
}) |
||||
this.end_at = '' |
||||
} |
||||
} |
||||
this.getBalance() |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.wallet { |
||||
height: 100%; |
||||
} |
||||
|
||||
.timecontainer { |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
background-color: #fff; |
||||
height: 120rpx; |
||||
|
||||
.timetext { |
||||
color: #000; |
||||
font-size: 30rpx; |
||||
} |
||||
} |
||||
|
||||
.selectTime { |
||||
width: 255rpx; |
||||
height: 70rpx; |
||||
background: #F3F3F3; |
||||
border-radius: 44rpx; |
||||
text-align: center; |
||||
line-height: 70rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
font-size: 28rpx; |
||||
color: #A1A1A1; |
||||
font-style: normal; |
||||
text-transform: none; |
||||
margin: 0 15rpx; |
||||
} |
||||
|
||||
.dataList { |
||||
overflow: hidden; |
||||
background-color: #fff; |
||||
padding: 0 20rpx; |
||||
border-radius: 20rpx; |
||||
|
||||
.empty { |
||||
// margin:0 auto; |
||||
// text-align: center; |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
justify-content: center; |
||||
width: 100%; |
||||
|
||||
image { |
||||
width: 114rpx; |
||||
height: auto; |
||||
margin-top: 200rpx; |
||||
} |
||||
|
||||
text { |
||||
font-size: 28rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #464646; |
||||
margin-top: 44rpx; |
||||
} |
||||
} |
||||
|
||||
.item { |
||||
padding: 26rpx 0; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
border-top: 1px solid #F3F3F3; |
||||
|
||||
&:first-child { |
||||
border-top-color: #fff; |
||||
} |
||||
|
||||
.l { |
||||
|
||||
.a { |
||||
padding: 20rpx 0; |
||||
font-size: 28rpx; |
||||
font-weight: 400; |
||||
color: #595959; |
||||
margin: 0 6rpx; |
||||
} |
||||
|
||||
.b { |
||||
font-size: 26rpx; |
||||
font-weight: 400; |
||||
color: #A3A3A3; |
||||
margin: 0 6rpx; |
||||
} |
||||
} |
||||
|
||||
.r { |
||||
flex: 1; |
||||
text-align: right; |
||||
|
||||
.a { |
||||
font-size: 40rpx; |
||||
font-weight: 500; |
||||
color: #414141; |
||||
margin: 0 6rpx; |
||||
} |
||||
|
||||
.b { |
||||
font-size: 28rpx; |
||||
font-weight: 400; |
||||
color: #A3A3A3; |
||||
margin: 0 6rpx; |
||||
} |
||||
} |
||||
} |
||||
|
||||
} |
||||
|
||||
::v-deep .u-empty { |
||||
padding: 100rpx 0; |
||||
} |
||||
|
||||
::v-deep .u-btn--primary { |
||||
background-color: #FF6257 !important; |
||||
border-color: #FF6257; |
||||
} |
||||
</style> |
Loading…
Reference in new issue