feat:事件弹窗显示调整

shuishen

2025-04-16 a7e6761ba0cfccdf33ed552eb2d3b783c8e4ab4a

feat:事件弹窗显示调整

 src/hooks/components/EventPopUpBox.vue

@@ -1,14 +1,23 @@
<template>
  <div class="mapPopUpBox">
    <div class="title">
      {{ info.event_name }}
            <span>{{ info.event_name }}</span>

      <el-icon class="header-close" @click="props.removeLabel">
        <Close />
      </el-icon>
    </div>
    <div class="content">
      <div class="medium">
        <img v-if="info.media_type === 'PHOTO_TYPE'" class="eventImage" :src="info.url" alt="Event Image" />
                <el-image
                    v-if="info.media_type === 'PHOTO_TYPE'"
                    class="eventImage"
                    :src="info.url"
                    fit="cover"
                    :preview-src-list="[info.url]"
                    preview-teleported
                />

        <video v-else :src="info.url" autoplay muted playsinline preload="metadata" />
      </div>

@@ -22,13 +31,14 @@
  </div>
</template>
<script setup>
import { ElImage } from 'element-plus'
// src="@/assets/images/home/useEventOperate/eventErr.png"
import { Close } from '@element-plus/icons-vue';
import { getEventDetails } from '@/api/home/aggregation';
import _ from 'lodash';
import { Close } from '@element-plus/icons-vue'
import { getEventDetails } from '@/api/home/aggregation'
import _ from 'lodash'

const props = defineProps(['data', 'removeLabel']);
const loading = ref(true);
const props = defineProps(['data', 'removeLabel'])
const loading = ref(true)

const info = ref({
  event_name: '',
@@ -38,13 +48,15 @@
  latitude: '',
  create_time: '04/01 12:41',
  media_type: 'PHOTO_TYPE',
});
})
onMounted(async () => {
  loading.value = true;
  const res = await getEventDetails({ id: props.data.eventId });
  info.value = res.data.data;
  loading.value = false;
});
    loading.value = true
    const res = await getEventDetails({ id: props.data.eventId })
    info.value = res.data.data

    info.value.url = import.meta.env.VITE_APP_AIRLINE_URL + info.value.url
    loading.value = false
})
</script>

<style scoped lang="scss">