From 828f2f412b36e03384d62874d3283f05afa7d4ea Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Tue, 15 Apr 2025 17:33:39 +0800
Subject: [PATCH] feat: 事件根据日期更新
---
src/components/CommonDateTime.vue | 19 ++++++++-
src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue | 30 ++++++++++++++-
src/store/modules/home.js | 12 ++++++
src/hooks/useMapAggregation/useMapAggregation.js | 32 ++++++++++++++-
src/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventOverviewDetailLeft.vue | 14 +++++--
src/views/SignMachineNest/MachineLeft/InspectionRaskDetails.vue | 4 +-
6 files changed, 98 insertions(+), 13 deletions(-)
diff --git a/src/components/CommonDateTime.vue b/src/components/CommonDateTime.vue
index 07202e5..393e9b7 100644
--- a/src/components/CommonDateTime.vue
+++ b/src/components/CommonDateTime.vue
@@ -25,8 +25,10 @@
<script setup>
import dayjs from 'dayjs';
+import { useStore } from 'vuex'
import { ref, defineEmits } from 'vue';
+const store = useStore()
const emit = defineEmits(['change']);
const model = defineModel();
@@ -57,9 +59,22 @@
let timeClick = (item,index) => {
checked.value = item;
- model.value = dateRanges[item];
- emit('change', dateRanges[item],timeListEnum[index]);
+ const newDateRange = dateRanges[item];
+ store.commit('setEventTimeType', [checked.value, timeListEnum[index]]);
+ model.value = newDateRange;
+ emit('change', newDateRange, timeListEnum[index]);
};
+onMounted(() => {
+ // 如果父组件传入了值，就使用父组件的值 by cpz
+ if (model.value && model.value.length === 2) {
+ // 根据传入的日期判断是哪个时间范围
+ const startDate = model.value[0];
+ const endDate = model.value[1];
+ if (startDate !== endDate) {
+ checked.value = 'week';
+ }
+ }
+});
</script>
<style scoped lang="scss">
diff --git a/src/hooks/useMapAggregation/useMapAggregation.js b/src/hooks/useMapAggregation/useMapAggregation.js
index 246ef47..df7750a 100644
--- a/src/hooks/useMapAggregation/useMapAggregation.js
+++ b/src/hooks/useMapAggregation/useMapAggregation.js
@@ -13,6 +13,7 @@
import cesiumOperation from '@/utils/cesium-tsa'
import { getDeviceRegion, getDeviceRegionCount, getEventDetails, getMapEvents } from '@/api/home/aggregation'
import { PolyGradientMaterial } from '@/utils/cesium/Material'
+import { start } from 'nprogress'
/**
* 机巢聚合功能
*/
@@ -53,6 +54,8 @@
const store = useStore()
const userAreaCode = computed(() => store.state.user.userInfo.detail.areaCode)
const selectedAreaCode = computed(() => store.state.user.selectedAreaCode)
+ let saveAreaCode = null;
+ let saveParams = { area_code: '',date_enum:'CURRENT_WEEK' };
// 确定缩放比例
@@ -105,6 +108,7 @@
// 事件散点
let eventList = []
function processChildren (childrens) {
+ // console.log(childrens, '事件点')
return (childrens || []).map(item => {
const arr = processChildren(item.childrens)
if (item.data) {
@@ -118,13 +122,15 @@
if (arr.length !== 0) {
returnObj.childrens = arr
}
+ console.log(returnObj, '111111')
return returnObj
})
}
// 获取事件聚合
- function getMapEventCount (area_code) {
- return getMapEvents({ area_code,date_enum:'CURRENT_WEEK' }).then(res => {
+ function getMapEventCount (params) {
+ console.log(5555555)
+ return getMapEvents(params).then(res => {
const resData = res?.data?.data
if (resData?.data) {
eventList = resData?.data
@@ -163,7 +169,10 @@
const initMapData = async areaCode => {
eventList = []
if (!areaCode) return
- const list = type === 'device' ? await getDeviceCount(areaCode) : await getMapEventCount(areaCode)
+ saveAreaCode = areaCode;
+ saveParams.area_code = areaCode;
+ console.log(type, '444')
+ const list = type === 'device' ? await getDeviceCount(areaCode) : await getMapEventCount(saveParams)
const splashedList = type === 'device'
? await getDeviceList(areaCode)
: eventList.map(i => ({ eventId: i.id, latitude: Number(i.latitude), longitude: Number(i.longitude), type: 'event' }))
@@ -235,6 +244,23 @@
{ deep: true }
)
+ // 监听 日 周 月 年
+ watch(() => store.state.home.eventTimeType, (newVal) => {
+ if (!saveAreaCode) return
+ if (newVal) {
+ saveParams = { area_code:saveAreaCode,date_enum: store.state.home.eventTimeParams }
+ initMapData(saveAreaCode);
+ }
+ });
+ // 监听事件右侧日期范围
+ watch(() => store.state.home.eventTimeRang, (newVal) => {
+ if (!saveAreaCode) return
+ if (newVal) {
+ saveParams = { area_code:saveAreaCode,start_date: newVal[0], end_date: newVal[1]}
+ initMapData(saveAreaCode);
+ }
+ });
+
//散点机巢
function splashed (row) {
row.splashedList.forEach((item, index) => {
diff --git a/src/store/modules/home.js b/src/store/modules/home.js
index ee79c47..73618a3 100644
--- a/src/store/modules/home.js
+++ b/src/store/modules/home.js
@@ -14,6 +14,10 @@
singleTotal: {}, // 统计单个机巢数据
// 项目id
selectedWorkSpaceId: window.localStorage.getItem('bs_workspace_id'),
+ // 事件 日 周 月 年
+ eventTimeType: 'day',
+ eventTimeParams: 'CURRENT_WEEK',
+ eventTimeRang: '',
wsMessage: {},
deviceState: {
gatewayInfo: {},
@@ -113,6 +117,14 @@
dock.work_osd = info.host
}
},
+ setEventTimeType : (state, data) => {
+ console.log('33333')
+ state.eventTimeType = data[0]
+ state.eventTimeParams = data[1]
+ },
+ setEventTimeRang : (state, time) => {
+ state.eventTimeRang = time
+ },
},
getters: {
test(state) {
diff --git a/src/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventOverviewDetailLeft.vue b/src/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventOverviewDetailLeft.vue
index 1b6ba6d..276130c 100644
--- a/src/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventOverviewDetailLeft.vue
+++ b/src/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventOverviewDetailLeft.vue
@@ -23,12 +23,18 @@
import EventTrendAnalysis from '@/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventTrendAnalysis.vue'
import EventTop5 from '@/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventTop5.vue'
-const today = dayjs().format('YYYY-MM-DD')
-const timeArr = ref([today, today])
+// 选中机巢默认日
+// const today = dayjs().format('YYYY-MM-DD')
+// const timeArr = ref([today, today])
+// 选中事件默认为周
+const startOfWeek = dayjs().startOf('week').add(1, 'day').format('YYYY-MM-DD')
+const endOfWeek = dayjs().endOf('week').add(1, 'day').format('YYYY-MM-DD')
+const timeArr = ref([startOfWeek, endOfWeek])
+
const store = useStore()
const params = ref({
- date_enum: 'TODAY',
+ date_enum: 'CURRENT_WEEK',
end_date: undefined,
start_date: undefined,
})
@@ -65,7 +71,7 @@
align-items: center;
.dateTime {
- width: 356px;
+ width: 400px;
margin: 0 0 8px 0;
}
diff --git a/src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue b/src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue
index 43638a5..edfc854 100644
--- a/src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue
+++ b/src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue
@@ -114,11 +114,17 @@
import cesiumOperation from '@/utils/cesium-tsa'
import CommonTitle from '@/components/CommonTitle.vue'
import { pxToRem } from '@/utils/rem'
+import { useStore } from 'vuex'
+const store = useStore()
+// const eventTimeRange = computed(() => store.state.home.eventTimeRange)
const timeFormat = 'YYYY-MM-DD HH:mm:ss'
const today = dayjs().format(timeFormat)
-const oneWeekAgo = dayjs().subtract(7, 'day').format(timeFormat)
-const timeArr = ref([oneWeekAgo, today])
+// const oneWeekAgo = dayjs().subtract(7, 'day').format(timeFormat)
+// const timeArr = ref([oneWeekAgo, today])
+const startOfWeek = dayjs().startOf('week').add(1, 'day').format(timeFormat)
+const endOfWeek = dayjs().endOf('week').add(1, 'day').format(timeFormat)
+const timeArr = ref([startOfWeek, endOfWeek])
const deviceList = ref([])
const total = ref(0)
@@ -211,6 +217,8 @@
const [start_date, end_date] = timeArr.value
params.value.start_date = start_date
params.value.end_date = end_date
+ // 提交数据，更新聚合
+ store.commit('setEventTimeRang', timeArr.value);
// 重置
getEventStatusNumFun()
getEventList()
@@ -237,6 +245,24 @@
})
}
+const getDateRange = unit => {
+ if (unit === 'today') {
+ return [dayjs().format('YYYY-MM-DD HH:mm:ss'), dayjs().format('YYYY-MM-DD HH:mm:ss')];
+ }
+ return [dayjs().startOf(unit).format('YYYY-MM-DD HH:mm:ss'), dayjs().endOf(unit).format('YYYY-MM-DD HH:mm:ss')];
+};
+
+// 监听事件时间范围变化
+watch(() => store.state.home.eventTimeType, (newVal) => {
+ timeArr.value = getDateRange(newVal);
+ const [start_date, end_date] = getDateRange(newVal);
+ params.value.start_date = start_date
+ params.value.end_date = end_date
+ getEventStatusNumFun()
+ getEventList()
+ getList()
+}, { immediate: false,deep: true })
+
onMounted(() => {
getDeviceList()
getDictList()
diff --git a/src/views/SignMachineNest/MachineLeft/InspectionRaskDetails.vue b/src/views/SignMachineNest/MachineLeft/InspectionRaskDetails.vue
index 42e9381..98c6ac5 100644
--- a/src/views/SignMachineNest/MachineLeft/InspectionRaskDetails.vue
+++ b/src/views/SignMachineNest/MachineLeft/InspectionRaskDetails.vue
@@ -1,6 +1,6 @@
-<!-- 巡检任务数据 -->
+<!-- 任务事件概况 -->
<template>
- <common-title title="巡检任务详情" :style="{ marginLeft: pxToRem(14) }"></common-title>
+ <common-title title="任务事件概况" :style="{ marginLeft: pxToRem(14) }"></common-title>
<div class="inspection-rask-details">
<CommonDateTime :style="{ top: pxToRem(14),marginLeft: pxToRem(10) }" v-model="newTime" @change="getData"></CommonDateTime>
<div class="chart-container" ref="chartRef"></div>
--
Gitblit v1.9.3