订单报表
This commit is contained in:
parent
07db11caa6
commit
3e9e46ddde
|
@ -46,7 +46,7 @@
|
|||
default: () => ({
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
bottom: '8%',
|
||||
containLabel: true
|
||||
}),
|
||||
},
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh" :option="{ title: { text: '小区新增会员统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'新增会员'"></Bar>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '小区新增会员统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'新增会员'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="xzrsColumns">
|
||||
<template #bodyCell="{ column, record }">
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh" :option="{ title: { text: '小区投递次数排行榜', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'投递次数'"></Bar>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '小区投递次数排行榜', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'投递次数'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="tdcsColumns" >
|
||||
<template #bodyCell="{ column, record }">
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh" :option="{ title: { text: '小区投递重量排行榜', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'投递重量'"></Bar>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '小区投递重量排行榜', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'投递重量'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="tdzlColumns" >
|
||||
<template #bodyCell="{ column, record }">
|
||||
|
|
|
@ -1,11 +1,5 @@
|
|||
import {BasicColumn} from '/@/components/Table';
|
||||
import {FormSchema} from '/@/components/Table';
|
||||
import { rules} from '/@/utils/helper/validator';
|
||||
import { render } from '/@/utils/common/renderUtils';
|
||||
import { getWeekMonthQuarterYear } from '/@/utils';
|
||||
import {ref} from "vue";
|
||||
//列表数据
|
||||
|
||||
export const xzrsColumns : BasicColumn[] =[
|
||||
{
|
||||
title: '序号',
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh"
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh"
|
||||
:option="{ title: { text: '会员投递次数排行榜', left: 'center' } }"
|
||||
:itemStyle="{ normal: { label: { show: true, position: 'top' } } }" :seriesName="'投递次数'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh" :option="{ title: { text: '会员投递重量排行榜', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'投递重量'"></Bar>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '会员投递重量排行榜', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'投递重量'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="tdzlColumns">
|
||||
<template #bodyCell="{ column, record }">
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh"
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh"
|
||||
:option="{ title: { text: '会员违规信息统计', left: 'center' } }"
|
||||
:itemStyle="{ normal: { label: { show: true, position: 'top' } } }" :seriesName="'违规会员数'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
|
|
|
@ -20,7 +20,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<BaseAreaLine v-show="!izList" :chartData="dataSource" height="80vh" :option="{ title: { text: '新增会员统计', left: 'center' }}" :seriesLabel="{show: true, position: 'top'}" :seriesName="'新增会员'"></BaseAreaLine>
|
||||
<BaseAreaLine v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '新增会员统计', left: 'center' }}" :seriesLabel="{show: true, position: 'top'}" :seriesName="'新增会员'"></BaseAreaLine>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="xzrsColumns">
|
||||
<template #bodyCell="{ column, record }">
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
</a-select>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar :chartData="dataSource" height="80vh" :option="{ title: { text: '会员注册时间段统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'个数'"></Bar>
|
||||
<Bar :chartData="dataSource" height="75vh" :option="{ title: { text: '会员注册时间段统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'个数'"></Bar>
|
||||
</a-card>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -0,0 +1,41 @@
|
|||
import { defHttp } from '/@/utils/http/axios';
|
||||
|
||||
enum Api {
|
||||
housingestateList = '/zh/hy/queryHousingestateList',
|
||||
queryOrderList = '/zh/order/queryOrderList',
|
||||
queryWgOrderList = '/zh/order/queryWgOrderList',
|
||||
querySjdtdcsList = '/zh/order/querySjdtdcsList',
|
||||
querySjdtdjeList = '/zh/order/querySjdtdjeList',
|
||||
queryWgddjetjList = '/zh/order/queryWgddjetjList',
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取小区
|
||||
* @param params
|
||||
*/
|
||||
export const housingestateList = (params) => defHttp.get({ url: Api.housingestateList, params });
|
||||
/**
|
||||
* 订单列表
|
||||
* @param params
|
||||
*/
|
||||
export const orderList = (params) => defHttp.get({ url: Api.queryOrderList, params });
|
||||
/**
|
||||
* 违规订单列表
|
||||
* @param params
|
||||
*/
|
||||
export const wgOrderList = (params) => defHttp.get({ url: Api.queryWgOrderList, params });
|
||||
/**
|
||||
* 时间段投递次数
|
||||
* @param params
|
||||
*/
|
||||
export const sjdtdcsList = (params) => defHttp.get({ url: Api.querySjdtdcsList, params });
|
||||
/**
|
||||
* 时间段投递金额
|
||||
* @param params
|
||||
*/
|
||||
export const sjdtdjeList = (params) => defHttp.get({ url: Api.querySjdtdjeList, params });
|
||||
/**
|
||||
* 违规订单金额统计
|
||||
* @param params
|
||||
*/
|
||||
export const wgddjetjList = (params) => defHttp.get({ url: Api.queryWgddjetjList, params });
|
|
@ -0,0 +1,132 @@
|
|||
import {BasicColumn} from '/@/components/Table';
|
||||
|
||||
export const detailColumns : BasicColumn[] =[
|
||||
{
|
||||
title: '序号',
|
||||
dataIndex: 'rowNumber',
|
||||
key: 'rowNumber',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '小区名称',
|
||||
dataIndex: 'housingestateName',
|
||||
key: 'housingestateName',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '设备地点',
|
||||
dataIndex: 'content',
|
||||
key: 'content',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '会员手机号',
|
||||
dataIndex: 'phone',
|
||||
key: 'phone',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '投递时间',
|
||||
dataIndex: 'addTime',
|
||||
key: 'addTime',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '重量',
|
||||
dataIndex: 'weight',
|
||||
key: 'weight',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '实际金额',
|
||||
dataIndex: 'money',
|
||||
key: 'money',
|
||||
align: 'center',
|
||||
customRender: function ({ text, record, index}) {
|
||||
return (record.money - record.deductMoney).toFixed(2)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '订单金额',
|
||||
dataIndex: 'money',
|
||||
key: 'money',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '扣除金额',
|
||||
dataIndex: 'deductMoney',
|
||||
key: 'deductMoney',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '订单状态',
|
||||
dataIndex: 'invalid',
|
||||
key: 'invalid',
|
||||
align: 'center',
|
||||
customRender: function ({ text }) {
|
||||
if (text == '0') {
|
||||
return '正常';
|
||||
} else if (text == '1') {
|
||||
return '违规';
|
||||
} else if (text == '2') {
|
||||
return '部分违规';
|
||||
} else if (text == '3') {
|
||||
return '待审核';
|
||||
} else if (text == '4') {
|
||||
return '异常';
|
||||
} else if (text == '5') {
|
||||
return '忽略';
|
||||
}else{
|
||||
return '';
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '原因',
|
||||
dataIndex: 'cause',
|
||||
key: 'cause',
|
||||
align: 'center'
|
||||
},
|
||||
]
|
||||
|
||||
export const sjdtdcsColumns : BasicColumn[] =[
|
||||
{
|
||||
title: '时间',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '投递次数',
|
||||
dataIndex: 'value',
|
||||
key: 'value',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
align: 'center',
|
||||
width: '150px',
|
||||
}
|
||||
]
|
||||
|
||||
export const sjdtdjeColumns : BasicColumn[] =[
|
||||
{
|
||||
title: '时间',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '金额',
|
||||
dataIndex: 'value',
|
||||
key: 'value',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
align: 'center',
|
||||
width: '150px',
|
||||
}
|
||||
]
|
|
@ -0,0 +1,182 @@
|
|||
<template>
|
||||
<div class="p-4">
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
<a-row>
|
||||
<a-col :span="21">
|
||||
<a-radio-group v-model:value="parmas.type" @change="changeType">
|
||||
<a-radio-button value="1">当天</a-radio-button>
|
||||
<a-radio-button value="2">近3天</a-radio-button>
|
||||
<a-radio-button value="3">近7天</a-radio-button>
|
||||
<a-radio-button value="4">近30天</a-radio-button>
|
||||
<a-radio-button value="5">自定义</a-radio-button>
|
||||
</a-radio-group>
|
||||
<span v-show="parmas.type == '5'" style="margin-left: 5px;">
|
||||
<a-range-picker :value-format="valueFormat" @change="changeDate" />
|
||||
</span>
|
||||
<a-select ref="select" placeholder="请选区域" v-model:value="parmas.housingestateId"
|
||||
style="width: 200px;margin-left: 5px;" @change="handleHousinges">
|
||||
<a-select-option value="">全部</a-select-option>
|
||||
<a-select-option :value="item.housingestateId" v-for="item in housingestates" :key="item.housingestateId">{{item.housingestateName }}</a-select-option>
|
||||
</a-select>
|
||||
</a-col>
|
||||
<a-col :span="3">
|
||||
<a-radio-group v-model:value="izList" button-style="solid" @change="loadDate">
|
||||
<a-radio-button :value="false">统计图</a-radio-button>
|
||||
<a-radio-button :value="true">列表页</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '时间段投递订单次数统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'投递次数'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="sjdtdcsColumns" :pagination="false">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'action'">
|
||||
<a-button type="link" @click="handleView(record)">查看</a-button>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-modal v-model:visible="detailVisible" title="订单详情" width="80%" :footer="null">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-row>
|
||||
<a-col :span="20">
|
||||
<div style="margin: 5px 0px 5px 20px">订单状态
|
||||
<a-select ref="select"
|
||||
placeholder="请选订单状态"
|
||||
v-model:value="detailParmas.invalid"
|
||||
style="width: 200px;margin-left: 5px;"
|
||||
@change="loadDetailDate">
|
||||
<a-select-option value="" >全部</a-select-option>
|
||||
<a-select-option value="0">正常</a-select-option>
|
||||
<a-select-option value="1">违规</a-select-option>
|
||||
<a-select-option value="2">部分违规</a-select-option>
|
||||
<a-select-option value="3">待审核</a-select-option>
|
||||
<a-select-option value="4">异常</a-select-option>
|
||||
<a-select-option value="5">忽略</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-table :dataSource="detailData" :columns="detailColumns" rowKey="rowNumber">
|
||||
</a-table>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, unref, reactive, onMounted } from 'vue';
|
||||
import Bar from '/@/components/chart/Bar.vue';
|
||||
import { housingestateList,sjdtdcsList,orderList } from '../order.api';
|
||||
import { sjdtdcsColumns,detailColumns } from '../order.data';
|
||||
|
||||
const valueFormat = 'YYYY-MM-DD';
|
||||
const dataSource = ref([]);
|
||||
const dateValue = ref();
|
||||
const housingestates = ref();
|
||||
const izList = ref(false)
|
||||
const detailVisible = ref(false);
|
||||
const confirmLoading = ref(false);
|
||||
const detailData = ref([]);
|
||||
|
||||
async function getHousingestates(){
|
||||
housingestates.value = await housingestateList();
|
||||
}
|
||||
|
||||
const parmas = reactive<any>({
|
||||
beginTime: '',
|
||||
endTime: '',
|
||||
type: '1',
|
||||
housingestateId: '',
|
||||
})
|
||||
|
||||
function handleHousinges(){
|
||||
loadDate();
|
||||
};
|
||||
|
||||
|
||||
const detailParmas = reactive<any>({
|
||||
housingestateId: '',
|
||||
invalid: '',
|
||||
shortHour: '',
|
||||
})
|
||||
|
||||
function changeType() {
|
||||
parmas.endTime = getPreviousDate(0) + ' 23:59:59';
|
||||
if (parmas.type === '1') {
|
||||
parmas.beginTime = getPreviousDate(0) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
if (parmas.type === '2') {
|
||||
parmas.beginTime = getPreviousDate(2) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
if (parmas.type === '3') {
|
||||
parmas.beginTime = getPreviousDate(6) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
if (parmas.type === '4') {
|
||||
parmas.beginTime = getPreviousDate(29) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
}
|
||||
|
||||
const changeDate = (date, dateString) => {
|
||||
parmas.beginTime = dateString[0] + ' 00:00:00';
|
||||
parmas.endTime = dateString[1] + ' 23:59:59';
|
||||
loadDate();
|
||||
};
|
||||
|
||||
async function loadDate() {
|
||||
const res = await sjdtdcsList(parmas);
|
||||
dataSource.value = [];
|
||||
for (let i = 0; i < res.length; i++) {
|
||||
dataSource.value.push({
|
||||
shortHour: `${res[i].shortHour}`,
|
||||
name: `${res[i].shortHour}时`,
|
||||
value: res[i].cn,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 查看详情
|
||||
const handleView = async (record) => {
|
||||
detailParmas.shortHour = record.shortHour;
|
||||
loadDetailDate();
|
||||
}
|
||||
|
||||
// 查看详情
|
||||
async function loadDetailDate(){
|
||||
detailVisible.value = true;
|
||||
try {
|
||||
confirmLoading.value = true;
|
||||
detailData.value = [];
|
||||
const res = await orderList({ beginTime:parmas.beginTime,endTime:parmas.endTime,housingestateId:parmas.housingestateId,invalid:detailParmas.invalid,shortHour:detailParmas.shortHour });
|
||||
detailData.value = res;
|
||||
confirmLoading.value = false;
|
||||
} catch (error) {
|
||||
console.error('获取详情失败:', error);
|
||||
}
|
||||
}
|
||||
|
||||
function getPreviousDate(days) {
|
||||
const date = new Date();
|
||||
date.setDate(date.getDate() - days);
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份+1(0-indexed)并补零
|
||||
const day = String(date.getDate()).padStart(2, '0'); // 日期补零
|
||||
const formattedDate = `${year}-${month}-${day}`;
|
||||
return formattedDate;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (parmas.type == '1') {
|
||||
parmas.beginTime = getPreviousDate(0) + ' 00:00:00';
|
||||
parmas.endTime = getPreviousDate(0) + ' 23:59:59';
|
||||
}
|
||||
loadDate();
|
||||
getHousingestates();
|
||||
})
|
||||
|
||||
</script>
|
|
@ -0,0 +1,182 @@
|
|||
<template>
|
||||
<div class="p-4">
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
<a-row>
|
||||
<a-col :span="21">
|
||||
<a-radio-group v-model:value="parmas.type" @change="changeType">
|
||||
<a-radio-button value="1">当天</a-radio-button>
|
||||
<a-radio-button value="2">近3天</a-radio-button>
|
||||
<a-radio-button value="3">近7天</a-radio-button>
|
||||
<a-radio-button value="4">近30天</a-radio-button>
|
||||
<a-radio-button value="5">自定义</a-radio-button>
|
||||
</a-radio-group>
|
||||
<span v-show="parmas.type == '5'" style="margin-left: 5px;">
|
||||
<a-range-picker :value-format="valueFormat" @change="changeDate" />
|
||||
</span>
|
||||
<a-select ref="select" placeholder="请选区域" v-model:value="parmas.housingestateId"
|
||||
style="width: 200px;margin-left: 5px;" @change="handleHousinges">
|
||||
<a-select-option value="">全部</a-select-option>
|
||||
<a-select-option :value="item.housingestateId" v-for="item in housingestates" :key="item.housingestateId">{{item.housingestateName }}</a-select-option>
|
||||
</a-select>
|
||||
</a-col>
|
||||
<a-col :span="3">
|
||||
<a-radio-group v-model:value="izList" button-style="solid" @change="loadDate">
|
||||
<a-radio-button :value="false">统计图</a-radio-button>
|
||||
<a-radio-button :value="true">列表页</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '时间段投递订单金额统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'投递金额'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="sjdtdjeColumns" :pagination="false">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'action'">
|
||||
<a-button type="link" @click="handleView(record)">查看</a-button>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-modal v-model:visible="detailVisible" title="订单详情" width="80%" :footer="null">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-row>
|
||||
<a-col :span="20">
|
||||
<div style="margin: 5px 0px 5px 20px">订单状态
|
||||
<a-select ref="select"
|
||||
placeholder="请选订单状态"
|
||||
v-model:value="detailParmas.invalid"
|
||||
style="width: 200px;margin-left: 5px;"
|
||||
@change="loadDetailDate">
|
||||
<a-select-option value="" >全部</a-select-option>
|
||||
<a-select-option value="0">正常</a-select-option>
|
||||
<a-select-option value="1">违规</a-select-option>
|
||||
<a-select-option value="2">部分违规</a-select-option>
|
||||
<a-select-option value="3">待审核</a-select-option>
|
||||
<a-select-option value="4">异常</a-select-option>
|
||||
<a-select-option value="5">忽略</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-table :dataSource="detailData" :columns="detailColumns" rowKey="rowNumber">
|
||||
</a-table>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, unref, reactive, onMounted } from 'vue';
|
||||
import Bar from '/@/components/chart/Bar.vue';
|
||||
import { housingestateList,sjdtdjeList,orderList } from '../order.api';
|
||||
import { sjdtdjeColumns,detailColumns } from '../order.data';
|
||||
|
||||
const valueFormat = 'YYYY-MM-DD';
|
||||
const dataSource = ref([]);
|
||||
const dateValue = ref();
|
||||
const housingestates = ref();
|
||||
const izList = ref(false)
|
||||
const detailVisible = ref(false);
|
||||
const confirmLoading = ref(false);
|
||||
const detailData = ref([]);
|
||||
|
||||
async function getHousingestates(){
|
||||
housingestates.value = await housingestateList();
|
||||
}
|
||||
|
||||
const parmas = reactive<any>({
|
||||
beginTime: '',
|
||||
endTime: '',
|
||||
type: '1',
|
||||
housingestateId: '',
|
||||
})
|
||||
|
||||
function handleHousinges(){
|
||||
loadDate();
|
||||
};
|
||||
|
||||
|
||||
const detailParmas = reactive<any>({
|
||||
housingestateId: '',
|
||||
invalid: '',
|
||||
shortHour: '',
|
||||
})
|
||||
|
||||
function changeType() {
|
||||
parmas.endTime = getPreviousDate(0) + ' 23:59:59';
|
||||
if (parmas.type === '1') {
|
||||
parmas.beginTime = getPreviousDate(0) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
if (parmas.type === '2') {
|
||||
parmas.beginTime = getPreviousDate(2) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
if (parmas.type === '3') {
|
||||
parmas.beginTime = getPreviousDate(6) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
if (parmas.type === '4') {
|
||||
parmas.beginTime = getPreviousDate(29) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
}
|
||||
|
||||
const changeDate = (date, dateString) => {
|
||||
parmas.beginTime = dateString[0] + ' 00:00:00';
|
||||
parmas.endTime = dateString[1] + ' 23:59:59';
|
||||
loadDate();
|
||||
};
|
||||
|
||||
async function loadDate() {
|
||||
const res = await sjdtdjeList(parmas);
|
||||
dataSource.value = [];
|
||||
for (let i = 0; i < res.length; i++) {
|
||||
dataSource.value.push({
|
||||
shortHour: `${res[i].shortHour}`,
|
||||
name: `${res[i].shortHour}时`,
|
||||
value: res[i].money,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 查看详情
|
||||
const handleView = async (record) => {
|
||||
detailParmas.shortHour = record.shortHour;
|
||||
loadDetailDate();
|
||||
}
|
||||
|
||||
// 查看详情
|
||||
async function loadDetailDate(){
|
||||
detailVisible.value = true;
|
||||
try {
|
||||
confirmLoading.value = true;
|
||||
detailData.value = [];
|
||||
const res = await orderList({ beginTime:parmas.beginTime,endTime:parmas.endTime,housingestateId:parmas.housingestateId,invalid:detailParmas.invalid,shortHour:detailParmas.shortHour });
|
||||
detailData.value = res;
|
||||
confirmLoading.value = false;
|
||||
} catch (error) {
|
||||
console.error('获取详情失败:', error);
|
||||
}
|
||||
}
|
||||
|
||||
function getPreviousDate(days) {
|
||||
const date = new Date();
|
||||
date.setDate(date.getDate() - days);
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份+1(0-indexed)并补零
|
||||
const day = String(date.getDate()).padStart(2, '0'); // 日期补零
|
||||
const formattedDate = `${year}-${month}-${day}`;
|
||||
return formattedDate;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (parmas.type == '1') {
|
||||
parmas.beginTime = getPreviousDate(0) + ' 00:00:00';
|
||||
parmas.endTime = getPreviousDate(0) + ' 23:59:59';
|
||||
}
|
||||
loadDate();
|
||||
getHousingestates();
|
||||
})
|
||||
|
||||
</script>
|
|
@ -0,0 +1,160 @@
|
|||
<template>
|
||||
<div class="p-4">
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
<a-row>
|
||||
<a-col :span="21">
|
||||
<a-radio-group v-model:value="parmas.type" @change="changeType">
|
||||
<a-radio-button value="1">近7天</a-radio-button>
|
||||
<a-radio-button value="2">近30天</a-radio-button>
|
||||
<a-radio-button value="3">自定义</a-radio-button>
|
||||
</a-radio-group>
|
||||
<span v-show="parmas.type == '3'" style="margin-left: 5px;">
|
||||
<a-range-picker :value-format="valueFormat" @change="changeDate" />
|
||||
</span>
|
||||
</a-col>
|
||||
<a-col :span="3">
|
||||
<a-radio-group v-model:value="izList" button-style="solid" @change="loadDate">
|
||||
<a-radio-button :value="false">统计图</a-radio-button>
|
||||
<a-radio-button :value="true">列表页</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<LineMulti v-show="!izList" :chartData="dataSource" height="75vh"
|
||||
:option="{ title: { text: '违规订单金额统计', left: 'center' } }"
|
||||
:seriesLabel="{show: true, position: 'top'}" type="line"></LineMulti>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="sjdtdjeColumns">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'action'">
|
||||
<a-button type="link" @click="handleView(record)">查看</a-button>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-modal v-model:visible="detailVisible" title="订单详情" width="80%" :footer="null">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-row>
|
||||
<a-col :span="20">
|
||||
<div style="margin: 5px 0px 5px 20px">订单状态
|
||||
<a-select ref="select"
|
||||
placeholder="请选订单状态"
|
||||
v-model:value="detailParmas.invalid"
|
||||
style="width: 200px;margin-left: 5px;"
|
||||
@change="loadDetailDate">
|
||||
<a-select-option value="" >全部</a-select-option>
|
||||
<a-select-option value="1">违规</a-select-option>
|
||||
<a-select-option value="2">部分违规</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-table :dataSource="detailData" :columns="detailColumns" rowKey="rowNumber">
|
||||
</a-table>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, unref, reactive, onMounted } from 'vue';
|
||||
import LineMulti from '/@/components/chart/LineMulti.vue';
|
||||
import {wgOrderList, wgddjetjList} from '../order.api';
|
||||
import { sjdtdjeColumns,detailColumns } from '../order.data';
|
||||
|
||||
const valueFormat = 'YYYY-MM-DD';
|
||||
const dataSource = ref([]);
|
||||
const dateValue = ref();
|
||||
const staffs = ref();
|
||||
const izList = ref(false)
|
||||
const detailVisible = ref(false);
|
||||
const confirmLoading = ref(false);
|
||||
const detailData = ref([]);
|
||||
|
||||
const parmas = reactive<any>({
|
||||
beginTime: '',
|
||||
endTime: '',
|
||||
type: '1',
|
||||
})
|
||||
|
||||
const detailParmas = reactive<any>({
|
||||
invalid: '',
|
||||
beginTime: '',
|
||||
endTime: '',
|
||||
})
|
||||
|
||||
function changeType() {
|
||||
if (parmas.type === '1') {
|
||||
parmas.beginTime = getPreviousDate(6) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
if (parmas.type === '2') {
|
||||
parmas.beginTime = getPreviousDate(29) + ' 00:00:00';
|
||||
loadDate();
|
||||
}
|
||||
}
|
||||
|
||||
const changeDate = (date, dateString) => {
|
||||
parmas.beginTime = dateString[0] + ' 00:00:00';
|
||||
parmas.endTime = dateString[1] + ' 23:59:59';
|
||||
loadDate();
|
||||
};
|
||||
|
||||
async function loadDate() {
|
||||
if(izList.value){
|
||||
parmas.pageSize=-1
|
||||
}else{
|
||||
parmas.pageSize=10
|
||||
}
|
||||
const res = await wgddjetjList(parmas);
|
||||
dataSource.value = [];
|
||||
for (let i = 0; i < res.length; i++) {
|
||||
dataSource.value.push({
|
||||
type: '金额',
|
||||
rowNumber: res[i].rowNumber,
|
||||
name: `${res[i].shortDay}`,
|
||||
value: res[i].money,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 查看详情
|
||||
const handleView = async (record) => {
|
||||
detailParmas.beginTime = record.name+' 00:00:00';
|
||||
detailParmas.endTime = record.name+' 23:59:59';
|
||||
loadDetailDate();
|
||||
}
|
||||
|
||||
// 查看详情
|
||||
async function loadDetailDate(){
|
||||
detailVisible.value = true;
|
||||
try {
|
||||
confirmLoading.value = true;
|
||||
detailData.value = [];
|
||||
const res = await wgOrderList({ beginTime:detailParmas.beginTime,endTime:detailParmas.endTime,invalid:detailParmas.invalid });
|
||||
detailData.value = res;
|
||||
confirmLoading.value = false;
|
||||
} catch (error) {
|
||||
console.error('获取详情失败:', error);
|
||||
}
|
||||
}
|
||||
|
||||
function getPreviousDate(days) {
|
||||
const date = new Date();
|
||||
date.setDate(date.getDate() - days);
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份+1(0-indexed)并补零
|
||||
const day = String(date.getDate()).padStart(2, '0'); // 日期补零
|
||||
const formattedDate = `${year}-${month}-${day}`;
|
||||
return formattedDate;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (parmas.type == '1') {
|
||||
parmas.beginTime = getPreviousDate(6) + ' 00:00:00';
|
||||
parmas.endTime = getPreviousDate(0) + ' 23:59:59';
|
||||
}
|
||||
loadDate();
|
||||
})
|
||||
|
||||
</script>
|
|
@ -1,9 +1,4 @@
|
|||
import {BasicColumn} from '/@/components/Table';
|
||||
import {FormSchema} from '/@/components/Table';
|
||||
import { rules} from '/@/utils/helper/validator';
|
||||
import { render } from '/@/utils/common/renderUtils';
|
||||
import { getWeekMonthQuarterYear } from '/@/utils';
|
||||
import {ref} from "vue";
|
||||
|
||||
export const detailSjqyColumns : BasicColumn[] =[
|
||||
{
|
||||
|
@ -166,7 +161,6 @@ export const sjdqycsColumns : BasicColumn[] =[
|
|||
}
|
||||
]
|
||||
|
||||
|
||||
export const sjdqyzlColumns : BasicColumn[] =[
|
||||
{
|
||||
title: '时间',
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh" :option="{ title: { text: '时间段清运次数统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'清运次数'"></Bar>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '时间段清运次数统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'清运次数'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="sjdqycsColumns" :pagination="false">
|
||||
<template #bodyCell="{ column, record }">
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh" :option="{ title: { text: '时间段清运重量统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'清运重量(吨)'"></Bar>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh" :option="{ title: { text: '时间段清运重量统计', left: 'center' }}" :itemStyle="{ normal: {label : {show: true, position: 'top'}}}" :seriesName="'清运重量(吨)'"></Bar>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
<a-table :dataSource="dataSource" :columns="sjdqyzlColumns" :pagination="false">
|
||||
<template #bodyCell="{ column, record }">
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<LineMulti v-show="!izList" :chartData="dataSource" height="80vh"
|
||||
<LineMulti v-show="!izList" :chartData="dataSource" height="75vh"
|
||||
:option="{ title: { text: '货运司机清运次数统计', left: 'center' } }"
|
||||
:seriesLabel="{show: true, position: 'top'}" type="line"></LineMulti>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<LineMulti v-show="!izList" :chartData="dataSource" height="80vh"
|
||||
<LineMulti v-show="!izList" :chartData="dataSource" height="75vh"
|
||||
:option="{ title: { text: '货运司机清运重量统计', left: 'center' } }"
|
||||
:seriesLabel="{show: true, position: 'top'}" type="line"></LineMulti>
|
||||
<div v-show="izList" style="margin-top: 20px;">
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh"
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh"
|
||||
:option="{ title: { text: '小区清运次数排行榜', left: 'center' } }"
|
||||
:itemStyle="{ normal: { label: { show: true, position: 'top' } } }"
|
||||
:axisLabel="{ rotate: 45}"
|
||||
|
|
|
@ -1,9 +1,4 @@
|
|||
import {BasicColumn} from '/@/components/Table';
|
||||
import {FormSchema} from '/@/components/Table';
|
||||
import { rules} from '/@/utils/helper/validator';
|
||||
import { render } from '/@/utils/common/renderUtils';
|
||||
import { getWeekMonthQuarterYear } from '/@/utils';
|
||||
import {ref} from "vue";
|
||||
//列表数据
|
||||
export const tdcsColumns : BasicColumn[] =[
|
||||
{
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh"
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh"
|
||||
:option="{ title: { text: '设备投递次数排行榜', left: 'center' } }"
|
||||
:itemStyle="{ normal: { label: { show: true, position: 'top' } } }"
|
||||
:axisLabel="{ rotate: 45}"
|
||||
|
|
|
@ -23,7 +23,7 @@
|
|||
</a-row>
|
||||
<a-row style="margin-top:10px">
|
||||
<!-- <BaseAreaLine :chartData="dataSource" height="80vh" :option="{ title: { text: '投递订单次数统计', left: 'center' }}" :seriesLabel="{show: true, position: 'top'}" :seriesName="'投递次数'"></BaseAreaLine>-->
|
||||
<LineMulti :chartData="dataSource" height="80vh" :option="{ title: { text: '投递订单次数统计', left: 'center' }}" :seriesLabel="{show: true, position: 'top'}" type="line"></LineMulti>
|
||||
<LineMulti :chartData="dataSource" height="72vh" :option="{ title: { text: '投递订单次数统计', left: 'center' }}" :seriesLabel="{show: true, position: 'top'}" type="line"></LineMulti>
|
||||
</a-row>
|
||||
</a-card>
|
||||
</div>
|
||||
|
|
|
@ -23,7 +23,7 @@
|
|||
</a-row>
|
||||
<a-row style="margin-top:10px">
|
||||
<!-- <BaseAreaLine :chartData="dataSource" height="80vh" :option="{ title: { text: '投递订单金额统计', left: 'center' }}" :seriesLabel="{show: true, position: 'top'}" :seriesName="'金额'"></BaseAreaLine>-->
|
||||
<LineMulti :chartData="dataSource" height="80vh" :option="{ title: { text: '投递订单金额统计', left: 'center' }}" :seriesLabel="{show: true, position: 'top'}" type="line"></LineMulti>
|
||||
<LineMulti :chartData="dataSource" height="72vh" :option="{ title: { text: '投递订单金额统计', left: 'center' }}" :seriesLabel="{show: true, position: 'top'}" type="line"></LineMulti>
|
||||
</a-row>
|
||||
</a-card>
|
||||
</div>
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="80vh"
|
||||
<Bar v-show="!izList" :chartData="dataSource" height="75vh"
|
||||
:option="{ title: { text: '设备投递重量排行榜', left: 'center' } }"
|
||||
:itemStyle="{ normal: { label: { show: true, position: 'top' } } }"
|
||||
:axisLabel="{ rotate: 45}"
|
||||
|
|
Loading…
Reference in New Issue