zxl #218

Merged
zhangxuelin merged 6 commits from zxl into main 2025-01-10 15:07:44 +08:00
2 changed files with 33 additions and 14 deletions

View File

@ -5,11 +5,18 @@
</header> </header>
<div class="flex material-list" v-loading="loading"> <div class="flex material-list" v-loading="loading">
<div class="flex material-item" v-for="item in list" :key="item.id" > <div class="flex material-item" v-for="item in list" :key="item.id" >
<div class="flex"> <div class="flex material-item">
<el-image :src="fileUrl(item)" class="img" /> <el-image v-if="item.fileType.indexOf('image')!=-1" :src="fileUrl(item)" class="img" />
<el-text truncated>{{ item.fileShowName }}</el-text> <svg v-if="item.fileType.indexOf('video')!=-1" class="icon file-icon" aria-hidden="true" :style="{ 'font-size': 100 + 'px' }">
<use :xlink:href="'#icon-video'"></use>
</svg>
<svg class="icon file-icon" v-if="item.fileType.indexOf('audio')!=-1" aria-hidden="true" :style="{ 'font-size': 100 + 'px' }">
<use :xlink:href="'#icon-mp'"></use>
</svg>
<div class="texts">{{ item.fileShowName }}</div>
<!-- <el-text truncated>{{ item.fileShowName }}</el-text> -->
</div> </div>
<el-button type="primary" @click="onInsert(item)">插入</el-button> <el-button style="margin-left: 10px;" type="primary" @click="onInsert(item)">插入</el-button>
</div> </div>
<el-empty description="暂无素材" v-if="!list.length" /> <el-empty description="暂无素材" v-if="!list.length" />
</div> </div>
@ -48,6 +55,7 @@ const init = () => {
if(res.rows && res.rows.length){ if(res.rows && res.rows.length){
// //
list.value = res.rows.filter( item => suffixAry.indexOf(getFileSuffix(item.fileShowName)) != -1) list.value = res.rows.filter( item => suffixAry.indexOf(getFileSuffix(item.fileShowName)) != -1)
console.log(list.value)
} }
}) })
} }
@ -64,16 +72,19 @@ const fileUrl = computed(() => (item) =>{
// //
const onInsert = async (item) =>{ const onInsert = async (item) =>{
loading.value = true loading.value = true
const res = await fetch(item.fileFullPath)
const bolb = await res.blob()
const file = commUtils.blobToFile(bolb, item.fileShowName)
// const res = await fetch(item.fileFullPath)
// const bolb = await res.blob()
// const file = commUtils.blobToFile(bolb, item.fileShowName)
const data=item.fileFullPath
try { try {
const data = await PPTApi.toRousrceUrl(file) console.log('item', item)
// const data = await PPTApi.toRousrceUrl(file)
if(videoSuffix.indexOf(getFileSuffix(item.fileShowName)) != -1){ if(videoSuffix.indexOf(getFileSuffix(item.fileShowName)) != -1){
emit('insertMaterial',{ type: 'video', data }) emit('insertMaterial',{ type: 'video', data })
} }else if(item.fileType.indexOf('audio') != -1){
else{ emit('insertMaterial',{ type: 'audio', data })
}else{
emit('insertMaterial',{ type: 'img', data }) emit('insertMaterial',{ type: 'img', data })
} }
} finally { } finally {
@ -125,11 +136,17 @@ onMounted(() => {
align-items: center; align-items: center;
margin-bottom: 10px; margin-bottom: 10px;
font-size: 14px; font-size: 14px;
justify-content: space-between;
.img{ .img{
width: 100px; width: 100px;
height: 100px; height: 100px;
margin-right: 20px; margin-right: 20px;
} }
} }
.texts{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 600px;
}
</style> </style>

View File

@ -287,6 +287,8 @@ const insertMaterial = async (item: MaterialParams) =>{
const { type, data } = item const { type, data } = item
if(type == 'video'){ if(type == 'video'){
createVideoElement(data) createVideoElement(data)
}else if(type == 'audio'){
createAudioElement(data)
} }
else{ else{
createImageElement(data) createImageElement(data)