From 48253aaa87bf914241185f62df0f9418d248a9c8 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Tue, 08 Apr 2025 17:42:54 +0800
Subject: [PATCH] feat: 事件概况详情分页列表点击图片定位功能
---
src/views/Home/Footer.vue | 36 ++++++++++++++++++++++--------------
1 files changed, 22 insertions(+), 14 deletions(-)
diff --git a/src/views/Home/Footer.vue b/src/views/Home/Footer.vue
index 5962dba..8c9d4d4 100644
--- a/src/views/Home/Footer.vue
+++ b/src/views/Home/Footer.vue
@@ -26,11 +26,12 @@
import activeImg5 from '@/assets/images/home/footer/orthophoto1.png'
import { useMapAggregation } from '@/views/Home/useMapAggregation/useMapAggregation'
+import { useStore } from 'vuex'
// 机巢聚合
-const { init, removeAll } = useMapAggregation('device');
+const { init, removeAll } = useMapAggregation('device')
// 事件聚合
-const { init: eventInit, removeAll: eventRemove } = useMapAggregation('event');
+const { init: eventInit, removeAll: eventRemove } = useMapAggregation('event')
const list = ref([
{
@@ -55,22 +56,29 @@
{ name: 'event4', img: img4, activeImg: activeImg4, active: false, className: 'threeD' },
{ name: 'event5', img: img5, activeImg: activeImg5, active: false, className: 'orthophoto' },
])
+const store = useStore()
+const imgClick = (toItem,index) => {
+ index !== undefined && store.commit('setFootActiveIndex',index)
+ const fromItem = list.value.find(item => item.active)
+ if (fromItem.name === toItem.name) return
+ fromItem?.removeAll?.()
+ nextTick(() => {
+ toItem?.init?.()
+ })
+ list.value = list.value.map(item => ({ ...item, active: item.name === toItem.name }))
+}
-const imgClick = toItem => {
- const fromItem = list.value.find(item => item.active);
- if (fromItem.name === toItem.name) return;
- fromItem?.removeAll?.();
- nextTick(() => {
- toItem?.init?.();
- });
- list.value = list.value.map(item => ({ ...item, active: item.name === toItem.name }));
-};
+const footActiveIndex = computed(() => store.state.home.footActiveIndex)
+watch(footActiveIndex, val => {
+ console.log(6666666)
+ imgClick(list.value[val])
+},{deep:true})
// 销毁前钩子
onBeforeUnmount(() => {
- removeAll();
- eventRemove()
-});
+ removeAll()
+ eventRemove()
+})
onMounted(() => {
nextTick(() => {
init()
--
Gitblit v1.9.3