2025.7.23 监管地图（待完成）

riku

2025-07-23 fe7fd6e4b1450c01faba724bb22b1d050e896c92

 src/components/map/SceneMap.vue

@@ -9,11 +9,22 @@
    ></FYOptionScene>
    <slot name="left-top"></slot>
  </el-row>
  <el-scrollbar class="right-wrap">
    <div v-for="s in selectedSceneList" :key="s.guid">
      <el-checkbox
        v-model="s._checked"
        :label="s.name"
        @change="handleChange"
      />
      <!-- <el-text>{{ s.name }}</el-text> -->
    </div>
  </el-scrollbar>
</template>
<script setup>
import { ref, watch } from 'vue';
import { ref, watch, computed } from 'vue';
import { map, onMapMounted } from '@/utils/map/index';
import marks from '@/utils/map/marks';
import mapUtil from '@/utils/map/util';
import { sceneIcon } from '@/assets/scene-icon';
const props = defineProps({
  // 场景点位信息
@@ -24,6 +35,17 @@
let markViewList = [];

const scenetype = ref();

const selectedSceneList = computed(() => {
  return props.data.filter((v) => {
    v._checked = true;
    return (
      scenetype.value == undefined ||
      scenetype.value.value == null ||
      v.typeid + '' == scenetype.value.value
    );
  });
});

watch(
  () => props.data,
@@ -43,6 +65,12 @@
    filterMarkViews();
  }
});

function handleChange(value) {
  console.log(value);

  filterMarkViews();
}

function createSceneMarks() {
  onMapMounted(() => {
@@ -64,15 +92,15 @@
            content: ''
            // direction: 'bottom'
          });
          _extData._show = false
          ev.target.setExtData(_extData)
          _extData._show = false;
          ev.target.setExtData(_extData);
        } else {
          ev.target.setLabel({
            content: _extData.name
            // direction: 'bottom'
          });
          _extData._show = true
          ev.target.setExtData(_extData)
          _extData._show = true;
          ev.target.setExtData(_extData);
        }
      });
      allMarkViews.push(mark);
@@ -95,9 +123,22 @@
        );
      });
    }
    markViewList = markViewList.filter((v) => {
      const _index = selectedSceneList.value.findIndex((s) => {
        console.log(s.guid, v.getExtData().guid);

        s.guid == v.getExtData().guid;
      });
      return _index != -1;
    });
    map.add(markViewList);
    setTimeout(() => {
      map.setFitView(markViewList);
      // const list = markViewList.map((v) => {
      //   const _extData = v.getExtData();
      //   return [_extData.longitude, _extData.latitude];
      // });
      // mapUtil.setBound(list);
    }, 1000);
  });
}
@@ -116,4 +157,14 @@
  left: 0;
  top: 0;
}
.right-wrap {
  position: absolute;
  right: 0px;
  bottom: 0;
  height: 50%;
  background-color: white;
  border-radius: 4px;
  padding: 2px 8px;
  max-width: 300px;
}
</style>