lanan-app/pages/my/StatisticsInfo.vue
2024-08-20 20:02:05 +08:00

163 lines
2.8 KiB
Vue

<template>
<view class="centenr">
<view class="c-top">
<view class="top-icon" @click="getback()">
<uni-icons type="left" size="18"></uni-icons>
<view class="">返回</view>
</view>
<view class="">数据统计</view>
<view style="width: 10%; height: 100%; "></view>
</view>
<view class="distap">
<view class="tapbox" :class="{'act' : tapindex == index }" v-for="(item,index) in typeList" :key="index"
@click="gettapindex(index,item.type)">
{{item.name}}
</view>
</view>
<view class="ail">
<view class="san_" v-for="(item,index) in dataList " :key="index">
<view class="s_box">
<view class="title_">姓名</view>
<view class="nums">{{item.driverName}}</view>
</view>
<view class="s_box">
<view class="title_">金额</view>
<view class="nums">{{item.money}}</view>
</view>
<view class="s_box">
<view class="title_">数量</view>
<view class="nums">{{item.rescueNum}}</view>
</view>
</view>
</view>
</view>
</template>
<script>
import request from '../../utils/request';
export default {
data() {
return {
dataList: [],
tapindex: 0,
typeList: [{
name: '日',
type: 'day'
},
{
name: '周',
type: 'week'
},
{
name: '月',
type: 'month'
},
],
type: 'day'
}
},
onShow() {
this.getDataList()
},
methods: {
getback() {
uni.navigateBack()
},
gettapindex(index, type) {
this.tapindex = index
this.type = type
this.getDataList()
},
async getDataList() {
request({
url: "/app/rescueInfo/statisticsInfo",
method: 'get',
params: {
type: this.type
}
}).then(res => {
this.dataList = res.data
})
}
},
}
</script>
<style scoped lang="scss">
.centenr {
background-color: #f7f7f7;
height: 100vh;
}
.c-top {
width: 100%;
height: 88px;
display: flex;
align-items: center;
justify-content: space-between;
background-color: white;
}
.top-icon {
display: flex;
align-items: center;
}
.ail {
width: 100%;
box-sizing: border-box;
padding: 10px;
background-color: #f7f7f7;
}
.san_ {
width: 100%;
box-sizing: border-box;
padding: 10px;
display: flex;
align-items: center;
justify-content: space-around;
background-color: white;
border-radius: 8px;
margin: 10px 0px;
}
.s_box {
width: 33%;
}
.title_ {
font-size: 16px;
text-align: center;
}
.nums {
font-size: 16px;
text-align: center;
font-weight: bold;
color: #003bbc;
}
.distap {
display: flex;
align-items: center;
margin: 10px;
}
.tapbox {
width: 38px;
height: 38px;
background: #fff;
display: flex;
align-items: center;
justify-content: center;
}
.act {
background: #003bbc !important;
color: #fff !important;
}
</style>