refactor:重构街道地图功能

ZhangXianQiang

2024-03-07 47fa84717d17477b69bcb8c2a6794bd8189e1bf3

 src/views/daoAnOffice/right/publicize/index.vue

@@ -48,12 +48,15 @@
import Test3 from '@/assets/img/test_img/t6.jpg';
import Test4 from '@/assets/img/test_img/t7.jpg';

import video1 from '@/assets/video/video1.mp4';
import video2 from '@/assets/video/video2.mp4';


import RightTitle from "@/components/right-title";
import { ref } from 'vue';

// 测试视频
const testVideo = 'https://www.w3schools.com/html/movie.mp4';
const testVideo = ref('');
const isShowVideo = ref(false);
const videoDom = ref(null);
const selectItems = ref([
@@ -66,37 +69,41 @@
    itemIndex: 1,
    time: '2023 12-12',
    type: '道路隐患',
    unit: '都江堰市公安局',
    unit: '全国交通安全日',
    rectTime: '2023-13-23',
    state: '抢修中',
    image: Test1,
    video: video1
  },
  {
    itemIndex: 2,
    time: '2023 12-12',
    type: '道路隐患',
    unit: '都江堰市公安局',
    unit: '冬季交安宣传忙 营造文明出行好氛围',
    rectTime: '2023-13-23',
    state: '抢修中',
    image: Test2,
    video: video2
  },
  {
    itemIndex: 3,
    time: '2023 12-12',
    type: '道路隐患',
    unit: '都江堰市公安局',
    unit: '高速交警强化宣传提示 确保春运交通安全',
    rectTime: '2023-13-23',
    state: '抢修中',
    image: Test3,
    video: video1
  },
  {
    itemIndex: 4,
    time: '2023 12-12',
    type: '道路隐患',
    unit: '都江堰市公安局',
    unit: '云哨警示风险自纠',
    rectTime: '2023-13-23',
    state: '抢修中',
    image: Test4,
    video: video2
  },
]);

@@ -105,9 +112,12 @@
  selectItem.isActive = true;
}

const openVideo = () => {
const openVideo = (item) => {
  isShowVideo.value = true;
  testVideo.value = item.video;
  setTimeout(() => {
  videoDom.value.play();
  },500);
}

const closeVideo = () => {