feat:完善功能

This commit is contained in:
zjc
2024-12-27 18:06:19 +08:00
parent f906515858
commit cb35986d1a
6 changed files with 50 additions and 255 deletions

View File

@@ -1,7 +1,8 @@
<template>
<div class="core-video">
<div class="title">核心景区视频</div>
<ul class="list" v-loading="loading">
<ul class="list">
<li
class="item"
:style="{ backgroundImage: `url(${index == 0 ? primary : error})` }"
@@ -12,7 +13,17 @@
<p :class="[index % 2 === 0 ? 'item-title--primary' : 'item-title--error']">
三峡之巅-最新异常名称三峡之巅-最新异常名称三峡之巅-最新异常名称
</p>
<img class="item-img" src="@/assets/images/cover.png" />
<!-- <img class="item-img" src="@/assets/images/cover.png" /> -->
<video
class="item-img"
:ref="(el) => getRefs(el, index)"
muted
autoplay
controls
style="object-fit: fill"
>
<source src="" type="application/x-mpegURL" />
</video>
</div>
</li>
</ul>
@@ -22,13 +33,28 @@
<script setup>
import primary from '@/assets/images/item-primary.png'
import error from '@/assets/images/item-error.png'
let loading = ref(true)
let list = ref(0)
import { getVideoListApi } from '@/api/home'
import Hls from 'hls.js'
let list = ref(2)
const getRefs = (el) => {
if (el) {
const hls = new Hls()
hls.loadSource('https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8')
hls.attachMedia(el)
hls.on(Hls.Events.MANIFEST_PARSED, () => {
el.play()
})
}
}
const getVideoList = async () => {
let res = await getVideoListApi({
businessVideoDisplayPosition: ''
})
}
onMounted(() => {
setTimeout(() => {
loading.value = false
list.value = 10
}, 2000)
getVideoList()
})
</script>

View File

@@ -50,7 +50,6 @@
const emit = defineEmits(['change'])
const router = useRouter()
const currentRoute = router.currentRoute.value
let currentDate = ref('')
let weatherData = ref({})