emis-app/pages/user/bunsStatic.vue
2025-01-16 10:50:01 +08:00

154 lines
4.7 KiB
Vue

<template>
<tpx-page>
<view class="">
<view class="sta-item">
<u-row justify="between">
<text class="font-30 font-weight">业务统计</text>
<view style="width: 460rpx;;">
<tpx-date-input v-model:value="searchParam._date" @change="handleReloadData" placeholder="请选择时间"
:toolsRangesList="dateRangeList"
></tpx-date-input>
</view>
</u-row>
<u-row custom-style="margin: 20rpx 0 0 0;">
<u-col span="3" :custom-style="`border-right: 2rpx solid #E8E8E8;`">
<u-text :text="staticInfo.totalNum" bold="true" size="32" align="center" color="#B12D29"></u-text>
<u-text margin="10rpx 0 0 0" text="总票数" size="28" color="#999" align="center"></u-text>
</u-col>
<u-col span="3" :custom-style="`border-right: 2rpx solid #E8E8E8;`">
<u-text :text="staticInfo.totalParcelQty" bold="true" size="32" align="center" color="#B12D29"></u-text>
<u-text margin="10rpx 0 0 0" text="总件数" size="28" color="#999" align="center"></u-text>
</u-col>
<u-col span="3" :custom-style="`border-right: 2rpx solid #E8E8E8;`">
<u-text :text="staticInfo.totalBillWeight" bold="true" size="32" align="center" color="#B12D29"></u-text>
<u-text margin="10rpx 0 0 0" text="总重量" size="28" color="#999" align="center"></u-text>
</u-col>
<u-col span="3">
<u-text :text="staticInfo.totalVolume" bold="true" size="32" align="center" color="#B12D29"></u-text>
<u-text margin="10rpx 0 0 0" text="总体积" size="28" color="#999" align="center"></u-text>
</u-col>
</u-row>
</view>
<view class="pl-30 pr-30 pt-10 pb-10">
<view v-for="(item) in statList" class="sta-item radius-20">
<text class="font-30 font-weight">{{item.countryName}}</text>
<u-row custom-style="margin: 20rpx 0 0 0;">
<u-col span="4" :custom-style="`border-right: 2rpx solid #E8E8E8;`">
<view class="text-center">
<span class="clr-prm font-weight font-28">{{item.kdTotalNum}}</span>
<span class="clr-sub pl-10">票</span>
</view>
<view class="mt-10 text-center">
<span class="clr-prm font-weight font-28">{{item.kdTotalBillWeight}}</span>
<span class="clr-sub pl-10">KG</span>
</view>
<view class="mt-10 text-center">快递</view>
</u-col>
<u-col span="4" :custom-style="`border-right: 2rpx solid #E8E8E8;`">
<view class="text-center">
<span class="clr-prm font-weight font-28">{{item.kyTotalNum}}</span>
<span class="clr-sub pl-10">票</span>
</view>
<view class="mt-10 text-center">
<span class="clr-prm font-weight font-28">{{item.kyTotalBillWeight}}</span>
<span class="clr-sub pl-10">KG</span>
</view>
<view class="mt-10 text-center">空运</view>
</u-col>
<u-col span="4">
<view class="text-center">
<span class="clr-prm font-weight font-28">{{item.wlTotalNum}}</span>
<span class="clr-sub pl-10">票</span>
</view>
<view class="mt-10 text-center">
<span class="clr-prm font-weight font-28">{{item.wlTotalBillWeight}}</span>
<span class="clr-sub pl-10">KG</span>
</view>
<view class="mt-10 text-center">物流</view>
</u-col>
</u-row>
</view>
<tpx-empty v-if="statList.length == 0"></tpx-empty>
</view>
</view>
</tpx-page>
</template>
<script>
import { dateRangeList } from "@/common/enum"
import * as apiService from "@/common/api"
import dayjs from "dayjs"
export default {
props: {
},
data() {
return {
dateRangeList,
searchParam: {
_date: dateRangeList[0].range,
},
queryOption: {
},
staticInfo: {},
statList: [],
}
},
onShareAppMessage() {
return {
}
},
onLoad(queryOption) {
this.queryOption = queryOption
this.initData();
},
methods: {
transSearchPm(param) {
let cpParam = JSON.parse(JSON.stringify(param))
cpParam.beginDate = cpParam?._date?.[0]
cpParam.endDate = cpParam?._date?.[1]
return cpParam
},
async initData(opt = {}){
const cpParam = this.transSearchPm(this.searchParam)
let params = {
params:{
...cpParam,
...opt,
},
_loading: true,
}
const statRes = await apiService.getMyBizStatInfo(params)
this.staticInfo = statRes.data || {}
const statListRes = await apiService.getMyBizStatList(params)
this.statList = statListRes.data || []
},
handleReloadData(){
setTimeout(()=> {
this.initData()
}, 400)
},
}
}
</script>
<style lang="scss">
@import '@/common/uni-nvue.scss';
page{
height: 100% !important;
}
</style>
<style scoped lang="scss">
.sta-item{
margin-bottom: 20rpx;
padding: 30rpx;
background-color: #fff;
}
</style>