316702372/anxinyan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: make work app video attachments playable

Browse Source
This commit is contained in:
wushumin
2026-05-17 00:39:56 +08:00
parent fbbc3bd8b9
commit ba987283dc
4 changed files with 95 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
work-app/src/pages/task/detail.vue
View File

@@ -704,19 +704,14 @@ onShow(() => {
<view v-for="item in evidenceFiles" :key="item.file_url" class="attachment-tile">
<view class="attachment-preview" @click="previewAttachment(evidenceFiles, item)">
<image v-if="isImageAsset(item)" class="attachment-thumb" :src="item.thumbnail_url || item.file_url" mode="aspectFill" />
<video
v-else-if="isVideoAsset(item)"
class="attachment-thumb attachment-video-thumb"
:src="item.file_url"
:controls="false"
:muted="true"
:show-center-play-btn="false"
:enable-progress-gesture="false"
object-fit="cover"
@click.stop="previewAttachment(evidenceFiles, item)"
/>
<template v-else-if="isVideoAsset(item)">
<image v-if="item.thumbnail_url" class="attachment-thumb" :src="item.thumbnail_url" mode="aspectFill" />
<view v-else class="attachment-video-thumb">
<text class="attachment-video-label">视频</text>
</view>
</template>
<view v-else class="attachment-file-thumb">附件</view>
<view v-if="isVideoAsset(item)" class="attachment-play">▶</view>
<view v-if="isVideoAsset(item)" class="attachment-play" @click.stop="previewAttachment(evidenceFiles, item)">▶</view>
</view>
<view class="attachment-meta">
<view class="attachment-name">{{ item.name || item.file_id }}</view>
@@ -774,19 +769,14 @@ onShow(() => {
<view v-for="item in zhongjianFiles" :key="item.file_url" class="attachment-tile">
<view class="attachment-preview" @click="previewAttachment(zhongjianFiles, item)">
<image v-if="isImageAsset(item)" class="attachment-thumb" :src="item.thumbnail_url || item.file_url" mode="aspectFill" />
<video
v-else-if="isVideoAsset(item)"
class="attachment-thumb attachment-video-thumb"
:src="item.file_url"
:controls="false"
:muted="true"
:show-center-play-btn="false"
:enable-progress-gesture="false"
object-fit="cover"
@click.stop="previewAttachment(zhongjianFiles, item)"
/>
<template v-else-if="isVideoAsset(item)">
<image v-if="item.thumbnail_url" class="attachment-thumb" :src="item.thumbnail_url" mode="aspectFill" />
<view v-else class="attachment-video-thumb">
<text class="attachment-video-label">视频</text>
</view>
</template>
<view v-else class="attachment-file-thumb">附件</view>
<view v-if="isVideoAsset(item)" class="attachment-play">▶</view>
<view v-if="isVideoAsset(item)" class="attachment-play" @click.stop="previewAttachment(zhongjianFiles, item)">▶</view>
</view>
<view class="attachment-meta">
<view class="attachment-name">{{ item.name || item.file_id }}</view>
@@ -820,7 +810,7 @@ onShow(() => {
<text class="video-preview-title">{{ activePreviewVideo.name || "附件视频" }}</text>
<text class="video-preview-close" @click="closePreviewVideo">关闭</text>
</view>
<video class="video-preview-player" :src="activePreviewVideo.file_url" controls autoplay />
<video class="video-preview-player" :src="activePreviewVideo.file_url" :poster="activePreviewVideo.thumbnail_url || ''" controls autoplay />
</view>
</view>
@@ -914,16 +904,26 @@ onShow(() => {
height: 100%;
}
.attachment-video-thumb {
background: #202124;
}
.attachment-video-thumb,
.attachment-file-thumb {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
.attachment-video-thumb {
background: linear-gradient(135deg, #f8fafc 0%, #e8edf3 100%);
color: var(--work-text);
}
.attachment-video-label {
font-size: 24rpx;
font-weight: 900;
}
.attachment-file-thumb {
color: var(--work-text-soft);
font-size: 24rpx;
font-weight: 800;