提交 3e4399da authored 作者: matian's avatar matian

bug fixes

上级 1da55d69
...@@ -14,38 +14,73 @@ if (props.url?.indexOf('.pdf') !== -1 || props.url?.indexOf('.txt') !== -1) { ...@@ -14,38 +14,73 @@ if (props.url?.indexOf('.pdf') !== -1 || props.url?.indexOf('.txt') !== -1) {
isShowType.value = 3 isShowType.value = 3
} else if (props.url?.indexOf('.mp3') !== -1) { } else if (props.url?.indexOf('.mp3') !== -1) {
isShowType.value = 4 isShowType.value = 4
} else if (props.url?.indexOf('.png') !== -1 || props.url?.indexOf('.jpg') !== -1 || props.url?.indexOf('.jpeg') !== -1) { } else if (
props.url?.indexOf('.png') !== -1 ||
props.url?.indexOf('.jpg') !== -1 ||
props.url?.indexOf('.jpeg') !== -1
) {
isShowType.value = 5 isShowType.value = 5
} else if (props.url?.indexOf('.rar') !== -1 || props.url?.indexOf('.zip') !== -1) {
isShowType.value = 6
} }
</script> </script>
<template> <template>
<div class="max-w-h"> <div class="max-w-h">
<iframe <iframe v-if="isShowType === 1" :src="`https://view.officeapps.live.com/op/view.aspx?src=${props.url}`"></iframe>
v-if="isShowType === 1" <embed :src="props.url" v-else-if="isShowType === 2" />
:src="`https://view.officeapps.live.com/op/view.aspx?src=${props.url}`" <video v-else-if="isShowType === 3" controls id="video">
></iframe> <source :src="props.url" />
<embed :src="props.url" v-else-if="isShowType === 2" /> </video>
<video v-else-if="isShowType === 3" controls id="video"> <audio v-else-if="isShowType === 4" :src="props.url" controls></audio>
<source :src="props.url" /> <img v-else-if="isShowType === 5" :src="props.url" />
</video> <div v-else-if="isShowType === 6" class="zip_con">
<audio v-else-if="isShowType === 4" :src="props.url" controls></audio> <img
<img v-else-if="isShowType === 5" :src="props.url"> v-if="props.url?.indexOf('.rar') !== -1"
</div> src="https://webapp-pub.ezijing.com/center_resource/rar.png"
class="img_zip"
/>
<img
v-else-if="props.url?.indexOf('.zip') !== -1"
src="https://webapp-pub.ezijing.com/center_resource/zip.png"
class="img_zip"
/>
<div class="zip_tips">* 该文件格式暂不支持预览</div>
</div>
</div>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.max-w-h{ .max-w-h {
max-width: 1200px; max-width: 1200px;
width: 100%; width: 100%;
height: 500px; height: 500px;
margin: 0 auto; margin: 0 auto;
display: flex; display: flex;
justify-content: center; justify-content: center;
iframe,embed,video{ iframe,
embed,
video {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
img{ .zip_con {
border: 1px solid #ccc;
width: 100%;
display: block;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.img_zip {
width: 100px;
height: 100px;
}
.zip_tips {
font-size: 14px;
margin-top: 10px;
}
img {
width: 100%; width: 100%;
display: block; display: block;
} }
......
...@@ -183,7 +183,7 @@ const liveOptions = computed(() => { ...@@ -183,7 +183,7 @@ const liveOptions = computed(() => {
<div class="bottom-info"> <div class="bottom-info">
<div class="lecturer-list"> <div class="lecturer-list">
<div v-for="item in props.data.lecturers" :key="item.id"> <div v-for="item in props.data.lecturers" :key="item.id">
<el-popover placement="top-start" :title="item.name" trigger="hover"> <el-popover :title="item.name" trigger="hover" placement="right">
<div v-html="item.summarize"></div> <div v-html="item.summarize"></div>
<template #reference> <template #reference>
<div class="item"> <div class="item">
......
...@@ -214,7 +214,6 @@ watch( ...@@ -214,7 +214,6 @@ watch(
</script> </script>
<template> <template>
<AppCard title="查阅课程"> <AppCard title="查阅课程">
{{ resourceData }}
<div class="chapter-box"> <div class="chapter-box">
<div class="title">{{ chapterDetails?.name }}</div> <div class="title">{{ chapterDetails?.name }}</div>
<div class="chapter-content"> <div class="chapter-content">
......
...@@ -11,7 +11,7 @@ const props = defineProps(['data']) ...@@ -11,7 +11,7 @@ const props = defineProps(['data'])
class="img" class="img"
:style="`width: 210px;height: 140px;background-size: cover;background-image: url(${props.data.cover});`" :style="`width: 210px;height: 140px;background-size: cover;background-image: url(${props.data.cover});`"
></div> ></div>
<el-icon v-else :size="50" color="#ccc"> <el-icon v-else :size="200" color="#ccc">
<PictureFilled></PictureFilled> <PictureFilled></PictureFilled>
</el-icon> </el-icon>
<!-- <img :src="props.data.cover"> --> <!-- <img :src="props.data.cover"> -->
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论