mirror of
https://github.com/kuaifan/dootask.git
synced 2026-01-06 12:28:13 +00:00
perf: 优化客户端媒体浏览器
This commit is contained in:
parent
71f13a0b50
commit
8afc1db72f
46
electron/electron.js
vendored
46
electron/electron.js
vendored
@ -468,6 +468,44 @@ function updateChildWindow(browser, args) {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建媒体浏览器窗口
|
||||
* @param args
|
||||
* @param type
|
||||
*/
|
||||
function createMediaWindow(args, type = 'image') {
|
||||
const imageWindow = new BrowserWindow({
|
||||
width: args.width || 970,
|
||||
height: args.height || 700,
|
||||
minWidth: 360,
|
||||
minHeight: 360,
|
||||
webPreferences: {
|
||||
nodeIntegration: true,
|
||||
contextIsolation: false,
|
||||
webSecurity: false,
|
||||
plugins: true
|
||||
},
|
||||
show: false
|
||||
});
|
||||
|
||||
// 加载图片浏览器的HTML
|
||||
let filePath = './render/viewer/index.html';
|
||||
if (type === 'video') {
|
||||
filePath = './render/video/index.html';
|
||||
}
|
||||
imageWindow.loadFile(filePath, {}).then(_ => { }).catch(_ => { })
|
||||
|
||||
// 设置右键菜单
|
||||
electronMenu.webContentsMenu(imageWindow.webContents)
|
||||
|
||||
// 窗口准备好后显示
|
||||
imageWindow.on('ready-to-show', () => {
|
||||
imageWindow.show();
|
||||
// 发送图片数据到渲染进程
|
||||
imageWindow.webContents.send('load-media', args);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建内置浏览器
|
||||
* @param args {url, ?}
|
||||
@ -963,6 +1001,14 @@ ipcMain.handle('getChildWindow', (event, args) => {
|
||||
return null;
|
||||
});
|
||||
|
||||
/**
|
||||
* 打开媒体浏览器
|
||||
*/
|
||||
ipcMain.on('openMediaViewer', (event, args) => {
|
||||
createMediaWindow(args, ['image', 'video'].includes(args.type) ? args.type : 'image');
|
||||
event.returnValue = "ok"
|
||||
});
|
||||
|
||||
/**
|
||||
* 内置浏览器 - 打开创建
|
||||
* @param args {url, ?}
|
||||
|
||||
366
electron/render/video/index.html
Normal file
366
electron/render/video/index.html
Normal file
@ -0,0 +1,366 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Video</title>
|
||||
<link rel="stylesheet" href="./plyr.css" />
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #000;
|
||||
overflow: hidden;
|
||||
user-select: none;
|
||||
}
|
||||
#video-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.plyr {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
/* 自定义播放器主题色 */
|
||||
:root {
|
||||
--plyr-color-main: #409eff;
|
||||
}
|
||||
/* 黑色背景主题 */
|
||||
.plyr--video {
|
||||
background: #000;
|
||||
}
|
||||
.plyr__control--overlaid {
|
||||
background: rgba(64, 158, 255, 0.8);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="video-container">
|
||||
<video id="player" playsinline controls>
|
||||
Your browser does not support the video tag.
|
||||
</video>
|
||||
</div>
|
||||
|
||||
<script src="./plyr.polyfilled.js"></script>
|
||||
<script>
|
||||
const { ipcRenderer } = require('electron');
|
||||
|
||||
// 多语言翻译
|
||||
const translations = {
|
||||
zh: {
|
||||
speed: '播放速度',
|
||||
normal: '正常',
|
||||
quality: '视频质量',
|
||||
loop: '循环播放',
|
||||
play: '播放',
|
||||
pause: '暂停',
|
||||
played: '已播放',
|
||||
buffered: '已缓冲',
|
||||
currentTime: '当前时间',
|
||||
duration: '总时长',
|
||||
volume: '音量',
|
||||
mute: '静音',
|
||||
unmute: '取消静音',
|
||||
enableCaptions: '启用字幕',
|
||||
disableCaptions: '禁用字幕',
|
||||
enterFullscreen: '进入全屏',
|
||||
exitFullscreen: '退出全屏',
|
||||
frameTitle: '视频播放器',
|
||||
captions: '字幕',
|
||||
settings: '设置',
|
||||
menuBack: '返回上级菜单',
|
||||
restart: '重新播放',
|
||||
rewind: '后退 {seektime} 秒',
|
||||
forward: '前进 {seektime} 秒'
|
||||
},
|
||||
'zh-CHT': {
|
||||
speed: '播放速度',
|
||||
normal: '正常',
|
||||
quality: '視頻質量',
|
||||
loop: '循環播放',
|
||||
play: '播放',
|
||||
pause: '暫停',
|
||||
played: '已播放',
|
||||
buffered: '已緩衝',
|
||||
currentTime: '當前時間',
|
||||
duration: '總時長',
|
||||
volume: '音量',
|
||||
mute: '靜音',
|
||||
unmute: '取消靜音',
|
||||
enableCaptions: '啟用字幕',
|
||||
disableCaptions: '禁用字幕',
|
||||
enterFullscreen: '進入全屏',
|
||||
exitFullscreen: '退出全屏',
|
||||
frameTitle: '視頻播放器',
|
||||
captions: '字幕',
|
||||
settings: '設置',
|
||||
menuBack: '返回上級菜單',
|
||||
restart: '重新播放',
|
||||
rewind: '後退 {seektime} 秒',
|
||||
forward: '前進 {seektime} 秒'
|
||||
},
|
||||
en: {
|
||||
speed: 'Speed',
|
||||
normal: 'Normal',
|
||||
quality: 'Quality',
|
||||
loop: 'Loop',
|
||||
play: 'Play',
|
||||
pause: 'Pause',
|
||||
played: 'Played',
|
||||
buffered: 'Buffered',
|
||||
currentTime: 'Current time',
|
||||
duration: 'Duration',
|
||||
volume: 'Volume',
|
||||
mute: 'Mute',
|
||||
unmute: 'Unmute',
|
||||
enableCaptions: 'Enable captions',
|
||||
disableCaptions: 'Disable captions',
|
||||
enterFullscreen: 'Enter fullscreen',
|
||||
exitFullscreen: 'Exit fullscreen',
|
||||
frameTitle: 'Video player',
|
||||
captions: 'Captions',
|
||||
settings: 'Settings',
|
||||
menuBack: 'Go back to previous menu',
|
||||
restart: 'Restart',
|
||||
rewind: 'Rewind {seektime}s',
|
||||
forward: 'Forward {seektime}s'
|
||||
},
|
||||
ja: {
|
||||
speed: '再生速度',
|
||||
normal: '標準',
|
||||
quality: '画質',
|
||||
loop: 'ループ',
|
||||
play: '再生',
|
||||
pause: '一時停止',
|
||||
played: '再生済み',
|
||||
buffered: 'バッファリング済み',
|
||||
currentTime: '現在の時間',
|
||||
duration: '合計時間',
|
||||
volume: '音量',
|
||||
mute: 'ミュート',
|
||||
unmute: 'ミュート解除',
|
||||
enableCaptions: '字幕をオン',
|
||||
disableCaptions: '字幕をオフ',
|
||||
enterFullscreen: '全画面表示',
|
||||
exitFullscreen: '全画面解除',
|
||||
frameTitle: 'ビデオプレーヤー',
|
||||
captions: '字幕',
|
||||
settings: '設定',
|
||||
menuBack: '前のメニューに戻る',
|
||||
restart: '最初から再生',
|
||||
rewind: '{seektime}秒戻る',
|
||||
forward: '{seektime}秒進む'
|
||||
},
|
||||
ko: {
|
||||
speed: '재생 속도',
|
||||
normal: '보통',
|
||||
quality: '품질',
|
||||
loop: '반복',
|
||||
play: '재생',
|
||||
pause: '일시정지',
|
||||
played: '재생됨',
|
||||
buffered: '버퍼링됨',
|
||||
currentTime: '현재 시간',
|
||||
duration: '총 시간',
|
||||
volume: '볼륨',
|
||||
mute: '음소거',
|
||||
unmute: '음소거 해제',
|
||||
enableCaptions: '자막 켜기',
|
||||
disableCaptions: '자막 끄기',
|
||||
enterFullscreen: '전체화면',
|
||||
exitFullscreen: '전체화면 나가기',
|
||||
frameTitle: '비디오 플레이어',
|
||||
captions: '자막',
|
||||
settings: '설정',
|
||||
menuBack: '이전 메뉴로 돌아가기',
|
||||
restart: '다시 시작',
|
||||
rewind: '{seektime}초 뒤로',
|
||||
forward: '{seektime}초 앞으로'
|
||||
},
|
||||
de: {
|
||||
speed: 'Geschwindigkeit',
|
||||
normal: 'Normal',
|
||||
quality: 'Qualität',
|
||||
loop: 'Wiederholen',
|
||||
play: 'Abspielen',
|
||||
pause: 'Pause',
|
||||
played: 'Gespielt',
|
||||
buffered: 'Gepuffert',
|
||||
currentTime: 'Aktuelle Zeit',
|
||||
duration: 'Gesamtzeit',
|
||||
volume: 'Lautstärke',
|
||||
mute: 'Stummschalten',
|
||||
unmute: 'Ton einschalten',
|
||||
enableCaptions: 'Untertitel aktivieren',
|
||||
disableCaptions: 'Untertitel deaktivieren',
|
||||
enterFullscreen: 'Vollbild',
|
||||
exitFullscreen: 'Vollbild beenden',
|
||||
frameTitle: 'Video-Player',
|
||||
captions: 'Untertitel',
|
||||
settings: 'Einstellungen',
|
||||
menuBack: 'Zurück zum vorherigen Menü',
|
||||
restart: 'Neu starten',
|
||||
rewind: '{seektime}s zurück',
|
||||
forward: '{seektime}s vorwärts'
|
||||
},
|
||||
fr: {
|
||||
speed: 'Vitesse',
|
||||
normal: 'Normale',
|
||||
quality: 'Qualité',
|
||||
loop: 'Boucle',
|
||||
play: 'Lecture',
|
||||
pause: 'Pause',
|
||||
played: 'Lu',
|
||||
buffered: 'Tamponné',
|
||||
currentTime: 'Temps actuel',
|
||||
duration: 'Durée',
|
||||
volume: 'Volume',
|
||||
mute: 'Muet',
|
||||
unmute: 'Son activé',
|
||||
enableCaptions: 'Activer les sous-titres',
|
||||
disableCaptions: 'Désactiver les sous-titres',
|
||||
enterFullscreen: 'Plein écran',
|
||||
exitFullscreen: 'Quitter le plein écran',
|
||||
frameTitle: 'Lecteur vidéo',
|
||||
captions: 'Sous-titres',
|
||||
settings: 'Paramètres',
|
||||
menuBack: 'Retour au menu précédent',
|
||||
restart: 'Redémarrer',
|
||||
rewind: 'Reculer de {seektime}s',
|
||||
forward: 'Avancer de {seektime}s'
|
||||
},
|
||||
id: {
|
||||
speed: 'Kecepatan',
|
||||
normal: 'Normal',
|
||||
quality: 'Kualitas',
|
||||
loop: 'Putar Ulang',
|
||||
play: 'Putar',
|
||||
pause: 'Jeda',
|
||||
played: 'Telah Diputar',
|
||||
buffered: 'Telah Buffer',
|
||||
currentTime: 'Waktu Saat Ini',
|
||||
duration: 'Durasi',
|
||||
volume: 'Volume',
|
||||
mute: 'Bisukan',
|
||||
unmute: 'Suarakan',
|
||||
enableCaptions: 'Aktifkan Teks',
|
||||
disableCaptions: 'Nonaktifkan Teks',
|
||||
enterFullscreen: 'Layar Penuh',
|
||||
exitFullscreen: 'Keluar Layar Penuh',
|
||||
frameTitle: 'Pemutar Video',
|
||||
captions: 'Teks',
|
||||
settings: 'Pengaturan',
|
||||
menuBack: 'Kembali ke menu sebelumnya',
|
||||
restart: 'Mulai Ulang',
|
||||
rewind: 'Mundur {seektime} detik',
|
||||
forward: 'Maju {seektime} detik'
|
||||
},
|
||||
ru: {
|
||||
speed: 'Скорость',
|
||||
normal: 'Нормальная',
|
||||
quality: 'Качество',
|
||||
loop: 'Повтор',
|
||||
play: 'Воспроизвести',
|
||||
pause: 'Пауза',
|
||||
played: 'Воспроизведено',
|
||||
buffered: 'Буферизовано',
|
||||
currentTime: 'Текущее время',
|
||||
duration: 'Продолжительность',
|
||||
volume: 'Громкость',
|
||||
mute: 'Без звука',
|
||||
unmute: 'Со звуком',
|
||||
enableCaptions: 'Включить субтитры',
|
||||
disableCaptions: 'Отключить субтитры',
|
||||
enterFullscreen: 'Полноэкранный режим',
|
||||
exitFullscreen: 'Выйти из полноэкранного режима',
|
||||
frameTitle: 'Видеоплеер',
|
||||
captions: 'Субтитры',
|
||||
settings: 'Настройки',
|
||||
menuBack: 'Вернуться в предыдущее меню',
|
||||
restart: 'Перезапустить',
|
||||
rewind: 'Назад на {seektime} сек',
|
||||
forward: 'Вперед на {seektime} сек'
|
||||
}
|
||||
};
|
||||
|
||||
// 标题翻译
|
||||
const titleTranslations = {
|
||||
zh: '视频播放器',
|
||||
'zh-CHT': '視頻播放器',
|
||||
en: 'Video Player',
|
||||
ko: '비디오 플레이어',
|
||||
ja: 'ビデオプレーヤー',
|
||||
de: 'Video-Player',
|
||||
fr: 'Lecteur Vidéo',
|
||||
id: 'Pemutar Video',
|
||||
ru: 'Видеоплеер'
|
||||
};
|
||||
|
||||
let player = null;
|
||||
|
||||
// 接收主进程传来的视频路径
|
||||
ipcRenderer.on('load-media', (event, args) => {
|
||||
const videoElement = document.querySelector('video');
|
||||
videoElement.src = args.video;
|
||||
|
||||
// 销毁旧的播放器实例
|
||||
if (player) {
|
||||
player.destroy();
|
||||
}
|
||||
|
||||
// 设置语言
|
||||
const currentLang = args.lang || 'en';
|
||||
|
||||
// 创建新的播放器实例
|
||||
player = new Plyr('#player', {
|
||||
controls: [
|
||||
'play-large', // 大播放按钮
|
||||
'play', // 播放/暂停
|
||||
'progress', // 进度条
|
||||
'current-time', // 当前时间
|
||||
'duration', // 总时长
|
||||
'mute', // 静音
|
||||
'volume', // 音量
|
||||
'settings', // 设置
|
||||
'fullscreen' // 全屏
|
||||
],
|
||||
settings: ['captions', 'quality', 'speed', 'loop'], // 设置菜单选项
|
||||
speed: { selected: 1, options: [0.5, 0.75, 1, 1.25, 1.5, 2] }, // 播放速度选项
|
||||
keyboard: { focused: true, global: true }, // 启用键盘快捷键
|
||||
tooltips: { controls: true, seek: true }, // 显示工具提示
|
||||
hideControls: true, // 自动隐藏控制栏
|
||||
i18n: translations[currentLang] || translations['en'] // 设置语言
|
||||
});
|
||||
|
||||
// 错误处理
|
||||
player.on('error', (event) => {
|
||||
console.error('Player error:', event);
|
||||
});
|
||||
|
||||
// 更新网页标题
|
||||
document.title = args.title || titleTranslations[currentLang] || titleTranslations['en'];
|
||||
|
||||
// 自动播放
|
||||
player.play().catch(e => {
|
||||
console.log('Auto-play failed:', e);
|
||||
});
|
||||
});
|
||||
|
||||
// 快捷键处理
|
||||
document.addEventListener('keydown', (e) => {
|
||||
// ESC 键关闭窗口
|
||||
if (e.key === 'Escape' && player && !player.fullscreen.active) {
|
||||
window.close();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
1
electron/render/video/plyr.css
vendored
Normal file
1
electron/render/video/plyr.css
vendored
Normal file
File diff suppressed because one or more lines are too long
2
electron/render/video/plyr.polyfilled.js
vendored
Normal file
2
electron/render/video/plyr.polyfilled.js
vendored
Normal file
File diff suppressed because one or more lines are too long
184
electron/render/viewer/index.html
Normal file
184
electron/render/viewer/index.html
Normal file
@ -0,0 +1,184 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Viewer</title>
|
||||
<link href="./viewer.min.css" rel="stylesheet">
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
background: #1a1a1a;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#image-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.viewer-close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 加载动画 */
|
||||
.loading {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border: 3px solid rgba(255, 255, 255, 0.3);
|
||||
border-radius: 50%;
|
||||
border-top-color: #fff;
|
||||
animation: spin 1s ease-in-out infinite;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to { transform: translate(-50%, -50%) rotate(360deg); }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="image-container"></div>
|
||||
<div class="loading"></div>
|
||||
|
||||
<script src="./viewer.min.js"></script>
|
||||
<script>
|
||||
const {ipcRenderer} = require('electron');
|
||||
let viewer = null;
|
||||
|
||||
// 标题翻译
|
||||
const titleTranslations = {
|
||||
zh: '图片查看器',
|
||||
'zh-CHT': '圖片查看器',
|
||||
en: 'Image Viewer',
|
||||
ko: '이미지 뷰어',
|
||||
ja: '画像ビューア',
|
||||
de: 'Bildbetrachter',
|
||||
fr: 'Visionneuse d\'images',
|
||||
id: 'Penampil Gambar',
|
||||
ru: 'Просмотр изображений'
|
||||
};
|
||||
|
||||
// 接收主进程发送的图片数据
|
||||
ipcRenderer.on('load-media', (event, args) => {
|
||||
const container = document.getElementById('image-container');
|
||||
const loading = document.querySelector('.loading');
|
||||
|
||||
loading.style.display = 'block';
|
||||
container.innerHTML = ''; // 清空容器
|
||||
|
||||
// 更新网页标题
|
||||
const currentLang = args.lang || 'en';
|
||||
document.title = args.title || titleTranslations[currentLang] || titleTranslations['en'];
|
||||
|
||||
// 创建图片元素
|
||||
args.images.forEach((src, index) => {
|
||||
const img = document.createElement('img');
|
||||
img.src = src;
|
||||
container.appendChild(img);
|
||||
});
|
||||
|
||||
// 如果已存在查看器,则销毁
|
||||
if (viewer) {
|
||||
viewer.destroy();
|
||||
}
|
||||
|
||||
// 初始化 ViewerJS
|
||||
viewer = new Viewer(container, {
|
||||
// 是否使用内联模式显示
|
||||
// false: 以模态框形式显示(推荐,支持完整键盘快捷键)
|
||||
// true: 直接在页面中显示
|
||||
inline: false,
|
||||
|
||||
// 是否显示图片标题
|
||||
title: false,
|
||||
|
||||
// 工具栏按钮配置
|
||||
toolbar: {
|
||||
zoomIn: true, // 放大按钮
|
||||
zoomOut: true, // 缩小按钮
|
||||
oneToOne: true, // 1:1 原始尺寸按钮
|
||||
reset: true, // 重置按钮
|
||||
prev: true, // 上一张图片按钮
|
||||
next: true, // 下一张图片按钮
|
||||
rotateLeft: true, // 向左旋转按钮
|
||||
rotateRight: true, // 向右旋转按钮
|
||||
flipHorizontal: true, // 水平翻转按钮
|
||||
flipVertical: true, // 垂直翻转按钮
|
||||
},
|
||||
|
||||
// 是否显示缩略图导航栏
|
||||
navbar: true,
|
||||
|
||||
// 是否显示工具提示
|
||||
tooltip: true,
|
||||
|
||||
// 是否允许拖动图片
|
||||
movable: true,
|
||||
|
||||
// 是否允许缩放图片
|
||||
zoomable: true,
|
||||
|
||||
// 是否允许旋转图片
|
||||
rotatable: true,
|
||||
|
||||
// 是否允许翻转图片
|
||||
scalable: true,
|
||||
|
||||
// 是否启用过渡动画效果
|
||||
transition: false,
|
||||
|
||||
// 是否启用全屏模式
|
||||
fullscreen: false,
|
||||
|
||||
// 是否启用键盘快捷键
|
||||
// 支持的快捷键:
|
||||
// ← / →:上一张/下一张图片
|
||||
// ↑ / ↓:放大/缩小
|
||||
// Ctrl + ← / Ctrl + →:向左/向右旋转
|
||||
// Space:切换1:1模式
|
||||
// Esc:关闭查看器
|
||||
keyboard: true,
|
||||
|
||||
// 背景遮罩层设置
|
||||
// 'static':点击背景不会关闭查看器
|
||||
backdrop: 'static',
|
||||
|
||||
// 初始显示第几张图片(从0开始计数)
|
||||
initialViewIndex: args.currentIndex || 0,
|
||||
|
||||
// 图片加载完成后的回调函数
|
||||
viewed() {
|
||||
loading.style.display = 'none';
|
||||
},
|
||||
|
||||
// 查看器隐藏时的回调函数
|
||||
hidden() {
|
||||
window.close();
|
||||
}
|
||||
});
|
||||
|
||||
// 立即显示查看器
|
||||
viewer.show();
|
||||
|
||||
// 监听键盘事件
|
||||
document.addEventListener('keydown', (e) => {
|
||||
if (e.key === 'Escape' && !document.fullscreenElement) {
|
||||
window.close();
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
9
electron/render/viewer/viewer.min.css
vendored
Normal file
9
electron/render/viewer/viewer.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
10
electron/render/viewer/viewer.min.js
vendored
Normal file
10
electron/render/viewer/viewer.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@ -5,6 +5,7 @@
|
||||
<script>
|
||||
import {mapState} from "vuex";
|
||||
import PreviewImage from "./index";
|
||||
import {getLanguage} from "../../language";
|
||||
|
||||
export default {
|
||||
name: 'PreviewImageState',
|
||||
@ -31,7 +32,7 @@ export default {
|
||||
},
|
||||
previewImageList(l) {
|
||||
if (l.length > 0) {
|
||||
if ($A.isEEUiApp) {
|
||||
if ($A.isEEUiApp || $A.isElectron) {
|
||||
let position = Math.min(Math.max(this.$store.state.previewImageIndex, 0), this.$store.state.previewImageList.length - 1)
|
||||
let paths = l.map(item => {
|
||||
if ($A.isJson(item)) {
|
||||
@ -61,22 +62,47 @@ export default {
|
||||
return /\.mp4$/i.test(src)
|
||||
});
|
||||
if (videoPath) {
|
||||
$A.eeuiAppSendMessage({
|
||||
action: 'videoPreview',
|
||||
path: videoPath
|
||||
});
|
||||
return
|
||||
this.videoPreview(videoPath);
|
||||
} else {
|
||||
this.imagePreview(position, paths);
|
||||
}
|
||||
$A.eeuiAppSendMessage({
|
||||
action: 'picturePreview',
|
||||
position,
|
||||
paths
|
||||
});
|
||||
} else {
|
||||
this.show = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
videoPreview(path) {
|
||||
if ($A.isEEUiApp) {
|
||||
$A.eeuiAppSendMessage({
|
||||
action: 'videoPreview',
|
||||
path
|
||||
});
|
||||
} else if ($A.isElectron) {
|
||||
this.$Electron.sendMessage('openMediaViewer', {
|
||||
type: 'video',
|
||||
lang: getLanguage(),
|
||||
video: path,
|
||||
})
|
||||
}
|
||||
},
|
||||
imagePreview(index, paths) {
|
||||
if ($A.isEEUiApp) {
|
||||
$A.eeuiAppSendMessage({
|
||||
action: 'picturePreview',
|
||||
position: index,
|
||||
paths
|
||||
});
|
||||
} else if ($A.isElectron) {
|
||||
this.$Electron.sendMessage('openMediaViewer', {
|
||||
type: 'image',
|
||||
lang: getLanguage(),
|
||||
currentIndex: index,
|
||||
images: paths,
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user