<template> <div class="XiangXiXinXi"> <div class="img"> <el-carousel trigger="click" type="card" height="347px" v-if="allImages?.underConstructionFileList.length > 0"> <el-carousel-item v-for="item in allImages?.underConstructionFileList" :key="item" > <el-image class="img_age" preview-teleported :src="item.url" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2" :preview-src-list="[item.url]" :initial-index="4" /> </el-carousel-item> </el-carousel> <el-empty :image-size="30" v-else /> </div> </div> </template> <script setup name="XiangXiXinXi"> import { inject } from 'vue'; import { selectProjectImageList } from '@/api/sponeScreen/gcpjApi'; import bus from '@/bus'; const projectData = ref({}); const allImages = ref({}) async function selectProjectImage(p) { let { data } = await selectProjectImageList(p) allImages.value = data[0] } bus.on('getProjectDate', (v) => { projectData.value = v selectProjectImage({ projectNo: v.projectNo }) }) </script> <style lang="scss" scoped> .img_age{ width:500px; height:347px } </style>