yangjun
/
huanzi-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

会员注册时间段统计

This commit is contained in:
曹磊 2025-07-01 15:46:20 +08:00
parent c1a5ec1e93
commit e7f44639c7
4 changed files with 159 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/chart/Bar.vue
View File

@ -24,6 +24,14 @@
type: String as PropType<string>,
default: 'calc(100vh - 78px)',
},
itemStyleLabel: {
type: Boolean as PropType<boolean>,
default: true,
},
seriesName: {
type: String as PropType<string>,
default: 'bar',
},
// update-begin--author:liaozhiyang---date:20240407---for：【QQYUN-8762】首页默认及echars颜色调整
seriesColor: {
type: String,
@ -54,10 +62,11 @@
},
series: [
{
name: 'bar',
name: props.seriesName,
type: 'bar',
data: [],
color: props.seriesColor,
itemStyle : { normal: {label : {show: props.itemStyleLabel, position: 'inside'}}},
},
],
});
@ -78,7 +87,9 @@
});
option.series[0].data = seriesData;
// update-begin--author:liaozhiyang---date:20240407---for：【QQYUN-8762】首页默认及echars颜色调整
option.series[0].name = props.seriesName;
option.series[0].color = props.seriesColor;
option.series[0].itemStyle.normal.label.show = props.itemStyleLabel;
// update-end--author:liaozhiyang---date:20240407---for：【QQYUN-8762】首页默认及echars颜色调整
option.xAxis.data = xAxisData;
setOptions(option);

11
src/views/zh/hy/zc/hy.api.ts Normal file
View File

@ -0,0 +1,11 @@
import { defHttp } from '/@/utils/http/axios';
enum Api {
registerList = '/zh/hy/queryPageList',
}
/**
* 会员注册时间段统计
* @param params
*/
export const registerList = (params) => defHttp.get({ url: Api.registerList, params });

56
src/views/zh/hy/zc/index.vue Normal file
View File

@ -0,0 +1,56 @@
<template>
<div class="p-4">
<a-card :bordered="false" style="height: 100%">
<a-row>
<a-col :span="10">
<a-date-picker :value-format="valueFormat" :default-value="defaultValue" v-model:value="parmas.dateString" @change="changeDate" />
</a-col>
</a-row>
<Bar :chartData="dataSource" height="80vh" :option="{ title: { text: '会员注册时间段统计', left: 'center' }}" :itemStyleLabel="false" :seriesName="'个数'"></Bar>
</a-card>
</div>
</template>
<script lang="ts" setup>
import {ref, unref, reactive, onMounted} from 'vue';
import Bar from '/@/components/chart/Bar.vue';
import { registerList } from './hy.api';
import type { Dayjs } from 'dayjs';
const valueFormat = 'YYYY-MM-DD';
const dataSource = ref([]);
const dateValue = ref();
const parmas = reactive<any>({
beginTime: '',
endTime: '',
dateString: '',
housingestateId: '',
})
const changeDate = (date, dateString) => {
parmas.dateString = dateString;
};
async function loadDate() {
if(parmas.dateString!=''){
parmas.beginTime = parmas.dateString+' 00:00:00';
parmas.endTime = parmas.dateString+' 23:59:59';
}
const res = await registerList(parmas);
console.log(res);
dataSource.value = [];
for (let i = 0; i < res.length; i++) {
dataSource.value.push({
name: `${res[i].shortHour}时`,
value: res[i].cn,
});
}
}
onMounted(() => {
if(parmas.dateString==''){
parmas.dateString='2025-06-30';
}
loadDate();
})
</script>

80
src/views/zh/monitor/index.vue Normal file
View File

@ -0,0 +1,80 @@
<template>
<div>
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleHousingestate"> 1获取区域信息</a-button>
</div>
<div>
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleDevice"> 2获取设备信息</a-button>
</div>
<div>
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleUser"> 3获取用户信息</a-button>
</div>
<div>
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleDeviceOverflow"> 4获取设备满溢</a-button>
</div>
<div>
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleDeviceClear"> 5获取设备清运</a-button>
</div>
<div>
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleOrder"> 6获取订单信息</a-button>
</div>
<div>新增日期：
<a-date-picker v-model:value="startedAt" />
<a-date-picker v-model:value="endedAt" />
</div>
<!-- <div>新增时间：
<a-date-picker show-time v-model:value="startedAt" />
<a-date-picker show-time v-model:value="endedAt" />
</div>-->
<div>更新时间：
<a-date-picker show-time v-model:value="updatedStartAt" />
<a-date-picker show-time v-model:value="updatedEndAt" />
</div>
</template>
<script lang="ts" name="system-role" setup>
import { ref } from 'vue';
import type { Dayjs } from 'dayjs';
type RangeValue = [Dayjs, Dayjs];
import {
monitorDevice,
monitorOverflow,
monitorClear,
monitorUser,
monitorHousingestate,
monitorOrder
} from './monitor.api';
const startedAt = ref<RangeValue>();
const endedAt = ref<RangeValue>();
const updatedStartAt = ref<RangeValue>();
const updatedEndAt = ref<RangeValue>();
function handleHousingestate() {
monitorHousingestate({});
}
function handleDevice() {
monitorDevice({updatedStartAt: updatedStartAt.value,updatedEndAt: updatedEndAt.value});
}
function handleUser() {
monitorUser({startedAt: startedAt.value,endedAt: endedAt.value,updatedStartAt: updatedStartAt.value,updatedEndAt: updatedEndAt.value});
}
function handleDeviceOverflow() {
monitorOverflow({});
}
function handleDeviceClear() {
monitorClear({startedAt: startedAt.value,endedAt: endedAt.value,updatedStartAt: updatedStartAt.value,updatedEndAt: updatedEndAt.value});
}
function handleOrder() {
monitorOrder({startedAt: startedAt.value,endedAt: endedAt.value,updatedStartAt: updatedStartAt.value,updatedEndAt: updatedEndAt.value});
}
</script>
<style scoped="scoped">
div {
margin: 10px 10px 10px 50px;
}
</style>