Showing
1 changed file
with
16 additions
and
16 deletions
| ... | @@ -10,12 +10,12 @@ export function useMediaPreview() { | ... | @@ -10,12 +10,12 @@ export function useMediaPreview() { |
| 10 | const previewVisible = ref(false); | 10 | const previewVisible = ref(false); |
| 11 | const previewImages = ref([]); | 11 | const previewImages = ref([]); |
| 12 | const previewIndex = ref(0); | 12 | const previewIndex = ref(0); |
| 13 | - | 13 | + |
| 14 | // 视频预览相关状态 | 14 | // 视频预览相关状态 |
| 15 | const videoVisible = ref(false); | 15 | const videoVisible = ref(false); |
| 16 | const currentVideo = ref(null); | 16 | const currentVideo = ref(null); |
| 17 | const videoId = ref(Date.now()); | 17 | const videoId = ref(Date.now()); |
| 18 | - | 18 | + |
| 19 | /** | 19 | /** |
| 20 | * 处理媒体项目点击事件 | 20 | * 处理媒体项目点击事件 |
| 21 | * @param {Object} item - 媒体项目 | 21 | * @param {Object} item - 媒体项目 |
| ... | @@ -26,7 +26,7 @@ export function useMediaPreview() { | ... | @@ -26,7 +26,7 @@ export function useMediaPreview() { |
| 26 | // 图片预览 | 26 | // 图片预览 |
| 27 | const imageItems = mediaList.filter(media => media.type === 'image'); | 27 | const imageItems = mediaList.filter(media => media.type === 'image'); |
| 28 | previewImages.value = imageItems.map(img => ({ src: img.url })); | 28 | previewImages.value = imageItems.map(img => ({ src: img.url })); |
| 29 | - | 29 | + |
| 30 | // 计算当前图片在图片列表中的索引 | 30 | // 计算当前图片在图片列表中的索引 |
| 31 | const imageIndex = imageItems.findIndex(img => img.url === item.url); | 31 | const imageIndex = imageItems.findIndex(img => img.url === item.url); |
| 32 | previewIndex.value = imageIndex >= 0 ? imageIndex : 0; | 32 | previewIndex.value = imageIndex >= 0 ? imageIndex : 0; |
| ... | @@ -38,7 +38,7 @@ export function useMediaPreview() { | ... | @@ -38,7 +38,7 @@ export function useMediaPreview() { |
| 38 | videoVisible.value = true; | 38 | videoVisible.value = true; |
| 39 | } | 39 | } |
| 40 | }; | 40 | }; |
| 41 | - | 41 | + |
| 42 | /** | 42 | /** |
| 43 | * 预览单张图片 | 43 | * 预览单张图片 |
| 44 | * @param {string} imageUrl - 图片URL | 44 | * @param {string} imageUrl - 图片URL |
| ... | @@ -48,7 +48,7 @@ export function useMediaPreview() { | ... | @@ -48,7 +48,7 @@ export function useMediaPreview() { |
| 48 | previewIndex.value = 0; | 48 | previewIndex.value = 0; |
| 49 | previewVisible.value = true; | 49 | previewVisible.value = true; |
| 50 | }; | 50 | }; |
| 51 | - | 51 | + |
| 52 | /** | 52 | /** |
| 53 | * 预览多张图片 | 53 | * 预览多张图片 |
| 54 | * @param {Array} images - 图片URL数组 | 54 | * @param {Array} images - 图片URL数组 |
| ... | @@ -59,7 +59,7 @@ export function useMediaPreview() { | ... | @@ -59,7 +59,7 @@ export function useMediaPreview() { |
| 59 | previewIndex.value = index; | 59 | previewIndex.value = index; |
| 60 | previewVisible.value = true; | 60 | previewVisible.value = true; |
| 61 | }; | 61 | }; |
| 62 | - | 62 | + |
| 63 | /** | 63 | /** |
| 64 | * 播放视频 | 64 | * 播放视频 |
| 65 | * @param {Object} video - 视频对象 {url, thumbnail, duration} | 65 | * @param {Object} video - 视频对象 {url, thumbnail, duration} |
| ... | @@ -69,14 +69,14 @@ export function useMediaPreview() { | ... | @@ -69,14 +69,14 @@ export function useMediaPreview() { |
| 69 | videoId.value = Date.now(); | 69 | videoId.value = Date.now(); |
| 70 | videoVisible.value = true; | 70 | videoVisible.value = true; |
| 71 | }; | 71 | }; |
| 72 | - | 72 | + |
| 73 | /** | 73 | /** |
| 74 | * 关闭图片预览 | 74 | * 关闭图片预览 |
| 75 | */ | 75 | */ |
| 76 | const closePreview = () => { | 76 | const closePreview = () => { |
| 77 | previewVisible.value = false; | 77 | previewVisible.value = false; |
| 78 | }; | 78 | }; |
| 79 | - | 79 | + |
| 80 | /** | 80 | /** |
| 81 | * 关闭视频播放 | 81 | * 关闭视频播放 |
| 82 | */ | 82 | */ |
| ... | @@ -84,28 +84,28 @@ export function useMediaPreview() { | ... | @@ -84,28 +84,28 @@ export function useMediaPreview() { |
| 84 | videoVisible.value = false; | 84 | videoVisible.value = false; |
| 85 | currentVideo.value = null; | 85 | currentVideo.value = null; |
| 86 | }; | 86 | }; |
| 87 | - | 87 | + |
| 88 | /** | 88 | /** |
| 89 | * 处理视频播放 | 89 | * 处理视频播放 |
| 90 | */ | 90 | */ |
| 91 | const handleVideoPlay = () => { | 91 | const handleVideoPlay = () => { |
| 92 | // 视频开始播放 | 92 | // 视频开始播放 |
| 93 | }; | 93 | }; |
| 94 | - | 94 | + |
| 95 | /** | 95 | /** |
| 96 | * 处理视频暂停 | 96 | * 处理视频暂停 |
| 97 | */ | 97 | */ |
| 98 | const handleVideoPause = () => { | 98 | const handleVideoPause = () => { |
| 99 | // 视频暂停播放 | 99 | // 视频暂停播放 |
| 100 | }; | 100 | }; |
| 101 | - | 101 | + |
| 102 | /** | 102 | /** |
| 103 | * 处理全屏状态变化 | 103 | * 处理全屏状态变化 |
| 104 | */ | 104 | */ |
| 105 | const handleFullscreenChange = () => { | 105 | const handleFullscreenChange = () => { |
| 106 | // 全屏状态变化 | 106 | // 全屏状态变化 |
| 107 | }; | 107 | }; |
| 108 | - | 108 | + |
| 109 | /** | 109 | /** |
| 110 | * 处理视频播放错误 | 110 | * 处理视频播放错误 |
| 111 | * @param {Event} error - 错误事件 | 111 | * @param {Event} error - 错误事件 |
| ... | @@ -120,7 +120,7 @@ export function useMediaPreview() { | ... | @@ -120,7 +120,7 @@ export function useMediaPreview() { |
| 120 | // 关闭视频弹框 | 120 | // 关闭视频弹框 |
| 121 | closeVideo(); | 121 | closeVideo(); |
| 122 | }; | 122 | }; |
| 123 | - | 123 | + |
| 124 | /** | 124 | /** |
| 125 | * 格式化视频时长 | 125 | * 格式化视频时长 |
| 126 | * @param {number} seconds - 秒数 | 126 | * @param {number} seconds - 秒数 |
| ... | @@ -131,7 +131,7 @@ export function useMediaPreview() { | ... | @@ -131,7 +131,7 @@ export function useMediaPreview() { |
| 131 | const remainingSeconds = seconds % 60; | 131 | const remainingSeconds = seconds % 60; |
| 132 | return `${minutes}:${remainingSeconds.toString().padStart(2, '0')}`; | 132 | return `${minutes}:${remainingSeconds.toString().padStart(2, '0')}`; |
| 133 | }; | 133 | }; |
| 134 | - | 134 | + |
| 135 | return { | 135 | return { |
| 136 | // 状态 | 136 | // 状态 |
| 137 | previewVisible, | 137 | previewVisible, |
| ... | @@ -140,7 +140,7 @@ export function useMediaPreview() { | ... | @@ -140,7 +140,7 @@ export function useMediaPreview() { |
| 140 | videoVisible, | 140 | videoVisible, |
| 141 | currentVideo, | 141 | currentVideo, |
| 142 | videoId, | 142 | videoId, |
| 143 | - | 143 | + |
| 144 | // 方法 | 144 | // 方法 |
| 145 | handleMediaClick, | 145 | handleMediaClick, |
| 146 | previewSingleImage, | 146 | previewSingleImage, |
| ... | @@ -154,4 +154,4 @@ export function useMediaPreview() { | ... | @@ -154,4 +154,4 @@ export function useMediaPreview() { |
| 154 | handleVideoError, | 154 | handleVideoError, |
| 155 | formatDuration | 155 | formatDuration |
| 156 | }; | 156 | }; |
| 157 | -} | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
| 157 | +} | ... | ... |
-
Please register or login to post a comment