Compare commits
6 Commits
94fa286f30
...
56aeafbf41
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
56aeafbf41 | ||
|
|
52344892d5 | ||
|
|
f23b37a581 | ||
|
|
7c1c9c6a2f | ||
|
|
091cf65dac | ||
|
|
dda4e482c1 |
@@ -8,5 +8,3 @@ Generated by Gemini CLI.
|
|||||||
|
|
||||||
1. windows 上打包后运行命令会出现黑窗,而且还是会出现找不到 js-runtimes 的问题,但是 quickjs 是正常下载了
|
1. windows 上打包后运行命令会出现黑窗,而且还是会出现找不到 js-runtimes 的问题,但是 quickjs 是正常下载了
|
||||||
2. macos 上未测试
|
2. macos 上未测试
|
||||||
3. 增加日志内容,除了下载日志,把运行日志,包括调用的完整命令也输出一下
|
|
||||||
4. 解析多视频还是有问题,不显示视频列表,缩略图也不对
|
|
||||||
|
|||||||
BIN
app-icon.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
@@ -2,9 +2,8 @@
|
|||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Tauri + Vue + Typescript App</title>
|
<title>Stream Capture</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
BIN
public/placeholder.png
Normal file
|
After Width: | Height: | Size: 4.2 KiB |
@@ -1,6 +0,0 @@
|
|||||||
<svg width="206" height="231" viewBox="0 0 206 231" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M143.143 84C143.143 96.1503 133.293 106 121.143 106C108.992 106 99.1426 96.1503 99.1426 84C99.1426 71.8497 108.992 62 121.143 62C133.293 62 143.143 71.8497 143.143 84Z" fill="#FFC131"/>
|
|
||||||
<ellipse cx="84.1426" cy="147" rx="22" ry="22" transform="rotate(180 84.1426 147)" fill="#24C8DB"/>
|
|
||||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M166.738 154.548C157.86 160.286 148.023 164.269 137.757 166.341C139.858 160.282 141 153.774 141 147C141 144.543 140.85 142.121 140.558 139.743C144.975 138.204 149.215 136.139 153.183 133.575C162.73 127.404 170.292 118.608 174.961 108.244C179.63 97.8797 181.207 86.3876 179.502 75.1487C177.798 63.9098 172.884 53.4021 165.352 44.8883C157.82 36.3744 147.99 30.2165 137.042 27.1546C126.095 24.0926 114.496 24.2568 103.64 27.6274C92.7839 30.998 83.1319 37.4317 75.8437 46.1553C74.9102 47.2727 74.0206 48.4216 73.176 49.5993C61.9292 50.8488 51.0363 54.0318 40.9629 58.9556C44.2417 48.4586 49.5653 38.6591 56.679 30.1442C67.0505 17.7298 80.7861 8.57426 96.2354 3.77762C111.685 -1.01901 128.19 -1.25267 143.769 3.10474C159.348 7.46215 173.337 16.2252 184.056 28.3411C194.775 40.457 201.767 55.4101 204.193 71.404C206.619 87.3978 204.374 103.752 197.73 118.501C191.086 133.25 180.324 145.767 166.738 154.548ZM41.9631 74.275L62.5557 76.8042C63.0459 72.813 63.9401 68.9018 65.2138 65.1274C57.0465 67.0016 49.2088 70.087 41.9631 74.275Z" fill="#FFC131"/>
|
|
||||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M38.4045 76.4519C47.3493 70.6709 57.2677 66.6712 67.6171 64.6132C65.2774 70.9669 64 77.8343 64 85.0001C64 87.1434 64.1143 89.26 64.3371 91.3442C60.0093 92.8732 55.8533 94.9092 51.9599 97.4256C42.4128 103.596 34.8505 112.392 30.1816 122.756C25.5126 133.12 23.9357 144.612 25.6403 155.851C27.3449 167.09 32.2584 177.598 39.7906 186.112C47.3227 194.626 57.153 200.784 68.1003 203.846C79.0476 206.907 90.6462 206.743 101.502 203.373C112.359 200.002 122.011 193.568 129.299 184.845C130.237 183.722 131.131 182.567 131.979 181.383C143.235 180.114 154.132 176.91 164.205 171.962C160.929 182.49 155.596 192.319 148.464 200.856C138.092 213.27 124.357 222.426 108.907 227.222C93.458 232.019 76.9524 232.253 61.3736 227.895C45.7948 223.538 31.8055 214.775 21.0867 202.659C10.3679 190.543 3.37557 175.59 0.949823 159.596C-1.47592 143.602 0.768139 127.248 7.41237 112.499C14.0566 97.7497 24.8183 85.2327 38.4045 76.4519ZM163.062 156.711L163.062 156.711C162.954 156.773 162.846 156.835 162.738 156.897C162.846 156.835 162.954 156.773 163.062 156.711Z" fill="#24C8DB"/>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.5 KiB |
@@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 6.8 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 974 B After Width: | Height: | Size: 2.0 KiB |
BIN
src-tauri/icons/64x64.png
Normal file
|
After Width: | Height: | Size: 5.6 KiB |
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 7.6 KiB After Width: | Height: | Size: 67 KiB |
|
Before Width: | Height: | Size: 903 B After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 8.4 KiB After Width: | Height: | Size: 77 KiB |
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 6.5 KiB |
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 9.3 KiB |
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 3.7 KiB |
@@ -0,0 +1,5 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
|
||||||
|
<foreground android:drawable="@mipmap/ic_launcher_foreground"/>
|
||||||
|
<background android:drawable="@color/ic_launcher_background"/>
|
||||||
|
</adaptive-icon>
|
||||||
BIN
src-tauri/icons/android/mipmap-hdpi/ic_launcher.png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
src-tauri/icons/android/mipmap-hdpi/ic_launcher_foreground.png
Normal file
|
After Width: | Height: | Size: 25 KiB |
BIN
src-tauri/icons/android/mipmap-hdpi/ic_launcher_round.png
Normal file
|
After Width: | Height: | Size: 3.5 KiB |
BIN
src-tauri/icons/android/mipmap-mdpi/ic_launcher.png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
src-tauri/icons/android/mipmap-mdpi/ic_launcher_foreground.png
Normal file
|
After Width: | Height: | Size: 13 KiB |
BIN
src-tauri/icons/android/mipmap-mdpi/ic_launcher_round.png
Normal file
|
After Width: | Height: | Size: 3.3 KiB |
BIN
src-tauri/icons/android/mipmap-xhdpi/ic_launcher.png
Normal file
|
After Width: | Height: | Size: 8.9 KiB |
BIN
src-tauri/icons/android/mipmap-xhdpi/ic_launcher_foreground.png
Normal file
|
After Width: | Height: | Size: 42 KiB |
BIN
src-tauri/icons/android/mipmap-xhdpi/ic_launcher_round.png
Normal file
|
After Width: | Height: | Size: 9.1 KiB |
BIN
src-tauri/icons/android/mipmap-xxhdpi/ic_launcher.png
Normal file
|
After Width: | Height: | Size: 17 KiB |
BIN
src-tauri/icons/android/mipmap-xxhdpi/ic_launcher_foreground.png
Normal file
|
After Width: | Height: | Size: 83 KiB |
BIN
src-tauri/icons/android/mipmap-xxhdpi/ic_launcher_round.png
Normal file
|
After Width: | Height: | Size: 17 KiB |
BIN
src-tauri/icons/android/mipmap-xxxhdpi/ic_launcher.png
Normal file
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 132 KiB |
BIN
src-tauri/icons/android/mipmap-xxxhdpi/ic_launcher_round.png
Normal file
|
After Width: | Height: | Size: 28 KiB |
@@ -0,0 +1,4 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<resources>
|
||||||
|
<color name="ic_launcher_background">#fff</color>
|
||||||
|
</resources>
|
||||||
|
Before Width: | Height: | Size: 85 KiB After Width: | Height: | Size: 45 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 171 KiB |
BIN
src-tauri/icons/ios/AppIcon-20x20@1x.png
Normal file
|
After Width: | Height: | Size: 875 B |
BIN
src-tauri/icons/ios/AppIcon-20x20@2x-1.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
src-tauri/icons/ios/AppIcon-20x20@2x.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
src-tauri/icons/ios/AppIcon-20x20@3x.png
Normal file
|
After Width: | Height: | Size: 4.2 KiB |
BIN
src-tauri/icons/ios/AppIcon-29x29@1x.png
Normal file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
src-tauri/icons/ios/AppIcon-29x29@2x-1.png
Normal file
|
After Width: | Height: | Size: 3.9 KiB |
BIN
src-tauri/icons/ios/AppIcon-29x29@2x.png
Normal file
|
After Width: | Height: | Size: 3.9 KiB |
BIN
src-tauri/icons/ios/AppIcon-29x29@3x.png
Normal file
|
After Width: | Height: | Size: 7.5 KiB |
BIN
src-tauri/icons/ios/AppIcon-40x40@1x.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
src-tauri/icons/ios/AppIcon-40x40@2x-1.png
Normal file
|
After Width: | Height: | Size: 6.5 KiB |
BIN
src-tauri/icons/ios/AppIcon-40x40@2x.png
Normal file
|
After Width: | Height: | Size: 6.5 KiB |
BIN
src-tauri/icons/ios/AppIcon-40x40@3x.png
Normal file
|
After Width: | Height: | Size: 13 KiB |
BIN
src-tauri/icons/ios/AppIcon-512@2x.png
Normal file
|
After Width: | Height: | Size: 387 KiB |
BIN
src-tauri/icons/ios/AppIcon-60x60@2x.png
Normal file
|
After Width: | Height: | Size: 13 KiB |
BIN
src-tauri/icons/ios/AppIcon-60x60@3x.png
Normal file
|
After Width: | Height: | Size: 25 KiB |
BIN
src-tauri/icons/ios/AppIcon-76x76@1x.png
Normal file
|
After Width: | Height: | Size: 6.0 KiB |
BIN
src-tauri/icons/ios/AppIcon-76x76@2x.png
Normal file
|
After Width: | Height: | Size: 19 KiB |
BIN
src-tauri/icons/ios/AppIcon-83.5x83.5@2x.png
Normal file
|
After Width: | Height: | Size: 22 KiB |
@@ -74,7 +74,7 @@ pub async fn download_ytdlp(app: &AppHandle) -> Result<PathBuf> {
|
|||||||
|
|
||||||
let response = reqwest::get(&url).await?;
|
let response = reqwest::get(&url).await?;
|
||||||
if !response.status().is_success() {
|
if !response.status().is_success() {
|
||||||
return Err(anyhow!("Failed to download yt-dlp: Status {}", response.status()));
|
return Err(anyhow!("下载 yt-dlp 失败:状态 {}", response.status()));
|
||||||
}
|
}
|
||||||
|
|
||||||
let bytes = response.bytes().await?;
|
let bytes = response.bytes().await?;
|
||||||
@@ -100,7 +100,7 @@ pub async fn update_ytdlp(app: &AppHandle) -> Result<String> {
|
|||||||
let path = get_ytdlp_path(app)?;
|
let path = get_ytdlp_path(app)?;
|
||||||
if !path.exists() {
|
if !path.exists() {
|
||||||
download_ytdlp(app).await?;
|
download_ytdlp(app).await?;
|
||||||
return Ok("Downloaded fresh yt-dlp".to_string());
|
return Ok("yt-dlp 已全新下载".to_string());
|
||||||
}
|
}
|
||||||
|
|
||||||
// Use built-in update for yt-dlp
|
// Use built-in update for yt-dlp
|
||||||
@@ -110,7 +110,7 @@ pub async fn update_ytdlp(app: &AppHandle) -> Result<String> {
|
|||||||
|
|
||||||
if !output.status.success() {
|
if !output.status.success() {
|
||||||
let stderr = String::from_utf8_lossy(&output.stderr).to_string();
|
let stderr = String::from_utf8_lossy(&output.stderr).to_string();
|
||||||
return Err(anyhow!("yt-dlp update failed: {}", stderr));
|
return Err(anyhow!("yt-dlp 更新失败:{}", stderr));
|
||||||
}
|
}
|
||||||
|
|
||||||
// Update settings timestamp
|
// Update settings timestamp
|
||||||
@@ -118,13 +118,13 @@ pub async fn update_ytdlp(app: &AppHandle) -> Result<String> {
|
|||||||
settings.last_updated = Some(chrono::Utc::now());
|
settings.last_updated = Some(chrono::Utc::now());
|
||||||
storage::save_settings(app, &settings)?;
|
storage::save_settings(app, &settings)?;
|
||||||
|
|
||||||
Ok("yt-dlp updated".to_string())
|
Ok("yt-dlp 已更新".to_string())
|
||||||
}
|
}
|
||||||
|
|
||||||
pub fn get_ytdlp_version(app: &AppHandle) -> Result<String> {
|
pub fn get_ytdlp_version(app: &AppHandle) -> Result<String> {
|
||||||
let path = get_ytdlp_path(app)?;
|
let path = get_ytdlp_path(app)?;
|
||||||
if !path.exists() {
|
if !path.exists() {
|
||||||
return Ok("Not installed".to_string());
|
return Ok("未安装".to_string());
|
||||||
}
|
}
|
||||||
|
|
||||||
let output = std::process::Command::new(&path)
|
let output = std::process::Command::new(&path)
|
||||||
@@ -134,7 +134,7 @@ pub fn get_ytdlp_version(app: &AppHandle) -> Result<String> {
|
|||||||
if output.status.success() {
|
if output.status.success() {
|
||||||
Ok(String::from_utf8_lossy(&output.stdout).trim().to_string())
|
Ok(String::from_utf8_lossy(&output.stdout).trim().to_string())
|
||||||
} else {
|
} else {
|
||||||
Ok("Unknown".to_string())
|
Ok("未知".to_string())
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -156,7 +156,7 @@ pub async fn download_qjs(app: &AppHandle) -> Result<PathBuf> {
|
|||||||
let latest_url = format!("{}/LATEST.json", QJS_REPO_URL);
|
let latest_url = format!("{}/LATEST.json", QJS_REPO_URL);
|
||||||
let latest_resp = reqwest::get(&latest_url).await?;
|
let latest_resp = reqwest::get(&latest_url).await?;
|
||||||
if !latest_resp.status().is_success() {
|
if !latest_resp.status().is_success() {
|
||||||
return Err(anyhow!("Failed to fetch QuickJS version info"));
|
return Err(anyhow!("获取 QuickJS 版本信息失败"));
|
||||||
}
|
}
|
||||||
let latest_info: LatestInfo = latest_resp.json().await?;
|
let latest_info: LatestInfo = latest_resp.json().await?;
|
||||||
let version = latest_info.version;
|
let version = latest_info.version;
|
||||||
@@ -170,14 +170,14 @@ pub async fn download_qjs(app: &AppHandle) -> Result<PathBuf> {
|
|||||||
// Bellard lists: quickjs-cosmo-YYYY-MM-DD.zip
|
// Bellard lists: quickjs-cosmo-YYYY-MM-DD.zip
|
||||||
format!("quickjs-cosmo-{}.zip", version)
|
format!("quickjs-cosmo-{}.zip", version)
|
||||||
} else {
|
} else {
|
||||||
return Err(anyhow!("Unsupported OS for QuickJS auto-download"));
|
return Err(anyhow!("不支持当前操作系统的 QuickJS 自动下载"));
|
||||||
};
|
};
|
||||||
|
|
||||||
let download_url = format!("{}/{}", QJS_REPO_URL, filename);
|
let download_url = format!("{}/{}", QJS_REPO_URL, filename);
|
||||||
let response = reqwest::get(&download_url).await?;
|
let response = reqwest::get(&download_url).await?;
|
||||||
|
|
||||||
if !response.status().is_success() {
|
if !response.status().is_success() {
|
||||||
return Err(anyhow!("Failed to download QuickJS: Status {}", response.status()));
|
return Err(anyhow!("下载 QuickJS 失败:状态 {}", response.status()));
|
||||||
}
|
}
|
||||||
|
|
||||||
let bytes = response.bytes().await?;
|
let bytes = response.bytes().await?;
|
||||||
@@ -210,7 +210,7 @@ pub async fn download_qjs(app: &AppHandle) -> Result<PathBuf> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if !found {
|
if !found {
|
||||||
return Err(anyhow!("Could not find {} in downloaded archive", source_name));
|
return Err(anyhow!("在下载的压缩包中找不到 {}", source_name));
|
||||||
}
|
}
|
||||||
|
|
||||||
let final_path = get_qjs_path(app)?;
|
let final_path = get_qjs_path(app)?;
|
||||||
@@ -228,15 +228,15 @@ pub async fn download_qjs(app: &AppHandle) -> Result<PathBuf> {
|
|||||||
pub async fn update_qjs(app: &AppHandle) -> Result<String> {
|
pub async fn update_qjs(app: &AppHandle) -> Result<String> {
|
||||||
// QuickJS doesn't have self-update, so we just re-download
|
// QuickJS doesn't have self-update, so we just re-download
|
||||||
download_qjs(app).await?;
|
download_qjs(app).await?;
|
||||||
Ok("QuickJS updated/installed".to_string())
|
Ok("QuickJS 已更新/安装".to_string())
|
||||||
}
|
}
|
||||||
|
|
||||||
pub fn get_qjs_version(app: &AppHandle) -> Result<String> {
|
pub fn get_qjs_version(app: &AppHandle) -> Result<String> {
|
||||||
let path = get_qjs_path(app)?;
|
let path = get_qjs_path(app)?;
|
||||||
if !path.exists() {
|
if !path.exists() {
|
||||||
return Ok("Not installed".to_string());
|
return Ok("未安装".to_string());
|
||||||
}
|
}
|
||||||
Ok("Installed".to_string())
|
Ok("已安装".to_string())
|
||||||
}
|
}
|
||||||
|
|
||||||
pub async fn ensure_binaries(app: &AppHandle) -> Result<()> {
|
pub async fn ensure_binaries(app: &AppHandle) -> Result<()> {
|
||||||
|
|||||||
@@ -56,6 +56,12 @@ pub struct LogEvent {
|
|||||||
|
|
||||||
|
|
||||||
pub async fn fetch_metadata(app: &AppHandle, url: &str, parse_mix_playlist: bool) -> Result<MetadataResult> {
|
pub async fn fetch_metadata(app: &AppHandle, url: &str, parse_mix_playlist: bool) -> Result<MetadataResult> {
|
||||||
|
app.emit("download-log", LogEvent {
|
||||||
|
id: "Analysis".to_string(),
|
||||||
|
message: format!("Starting metadata fetch for URL: {}", url),
|
||||||
|
level: "info".to_string(),
|
||||||
|
}).ok();
|
||||||
|
|
||||||
let ytdlp_path = binary_manager::get_ytdlp_path(app)?;
|
let ytdlp_path = binary_manager::get_ytdlp_path(app)?;
|
||||||
let qjs_path = binary_manager::get_qjs_path(app)?; // Get absolute path to quickjs
|
let qjs_path = binary_manager::get_qjs_path(app)?; // Get absolute path to quickjs
|
||||||
|
|
||||||
@@ -79,6 +85,11 @@ pub async fn fetch_metadata(app: &AppHandle, url: &str, parse_mix_playlist: bool
|
|||||||
|
|
||||||
if !output.status.success() {
|
if !output.status.success() {
|
||||||
let stderr = String::from_utf8_lossy(&output.stderr);
|
let stderr = String::from_utf8_lossy(&output.stderr);
|
||||||
|
app.emit("download-log", LogEvent {
|
||||||
|
id: "Analysis".to_string(),
|
||||||
|
message: format!("Metadata fetch failed: {}", stderr),
|
||||||
|
level: "error".to_string(),
|
||||||
|
}).ok();
|
||||||
return Err(anyhow!("yt-dlp error: {}", stderr));
|
return Err(anyhow!("yt-dlp error: {}", stderr));
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -95,16 +106,31 @@ pub async fn fetch_metadata(app: &AppHandle, url: &str, parse_mix_playlist: bool
|
|||||||
entries.push(parse_video_metadata(entry));
|
entries.push(parse_video_metadata(entry));
|
||||||
}
|
}
|
||||||
|
|
||||||
return Ok(MetadataResult::Playlist(PlaylistMetadata {
|
let result = MetadataResult::Playlist(PlaylistMetadata {
|
||||||
id: json["id"].as_str().unwrap_or("").to_string(),
|
id: json["id"].as_str().unwrap_or("").to_string(),
|
||||||
title: json["title"].as_str().unwrap_or("Unknown Playlist").to_string(),
|
title: json["title"].as_str().unwrap_or("Unknown Playlist").to_string(),
|
||||||
entries,
|
entries,
|
||||||
}));
|
});
|
||||||
|
|
||||||
|
app.emit("download-log", LogEvent {
|
||||||
|
id: "Analysis".to_string(),
|
||||||
|
message: "Metadata fetch success (Playlist)".to_string(),
|
||||||
|
level: "info".to_string(),
|
||||||
|
}).ok();
|
||||||
|
|
||||||
|
return Ok(result);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Single video
|
// Single video
|
||||||
Ok(MetadataResult::Video(parse_video_metadata(&json)))
|
let result = MetadataResult::Video(parse_video_metadata(&json));
|
||||||
|
app.emit("download-log", LogEvent {
|
||||||
|
id: "Analysis".to_string(),
|
||||||
|
message: "Metadata fetch success (Video)".to_string(),
|
||||||
|
level: "info".to_string(),
|
||||||
|
}).ok();
|
||||||
|
|
||||||
|
Ok(result)
|
||||||
}
|
}
|
||||||
|
|
||||||
fn parse_video_metadata(json: &serde_json::Value) -> VideoMetadata {
|
fn parse_video_metadata(json: &serde_json::Value) -> VideoMetadata {
|
||||||
@@ -165,6 +191,14 @@ pub async fn download_video(
|
|||||||
// Progress output
|
// Progress output
|
||||||
args.push("--newline".to_string());
|
args.push("--newline".to_string());
|
||||||
|
|
||||||
|
// Log the full command
|
||||||
|
let full_cmd_str = format!("{} {}", ytdlp_path.to_string_lossy(), args.join(" "));
|
||||||
|
app.emit("download-log", LogEvent {
|
||||||
|
id: id.clone(),
|
||||||
|
message: format!("Executing command: {}", full_cmd_str),
|
||||||
|
level: "info".to_string(),
|
||||||
|
}).ok();
|
||||||
|
|
||||||
let mut cmd = Command::new(ytdlp_path);
|
let mut cmd = Command::new(ytdlp_path);
|
||||||
|
|
||||||
let mut child = cmd
|
let mut child = cmd
|
||||||
|
|||||||
@@ -12,7 +12,7 @@
|
|||||||
"app": {
|
"app": {
|
||||||
"windows": [
|
"windows": [
|
||||||
{
|
{
|
||||||
"title": "stream-capture",
|
"title": "Stream Capture",
|
||||||
"width": 1300,
|
"width": 1300,
|
||||||
"height": 850
|
"height": 850
|
||||||
}
|
}
|
||||||
|
|||||||
10
src/App.vue
@@ -28,7 +28,7 @@ onMounted(async () => {
|
|||||||
<div class="w-8 h-8 bg-blue-600 rounded-lg flex items-center justify-center text-white shrink-0">
|
<div class="w-8 h-8 bg-blue-600 rounded-lg flex items-center justify-center text-white shrink-0">
|
||||||
<Download class="w-5 h-5" />
|
<Download class="w-5 h-5" />
|
||||||
</div>
|
</div>
|
||||||
<span class="font-bold text-lg hidden lg:block">StreamCapture</span>
|
<span class="font-bold text-lg hidden lg:block">流萤</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<nav class="flex-1 px-4 space-y-2 mt-4 flex flex-col pb-6">
|
<nav class="flex-1 px-4 space-y-2 mt-4 flex flex-col pb-6">
|
||||||
@@ -38,7 +38,7 @@ onMounted(async () => {
|
|||||||
:class="route.path === '/' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/20 dark:text-blue-400' : 'hover:bg-gray-100 dark:hover:bg-zinc-800'"
|
:class="route.path === '/' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/20 dark:text-blue-400' : 'hover:bg-gray-100 dark:hover:bg-zinc-800'"
|
||||||
>
|
>
|
||||||
<Home class="w-5 h-5 shrink-0" />
|
<Home class="w-5 h-5 shrink-0" />
|
||||||
<span class="hidden lg:block font-medium">Downloader</span>
|
<span class="hidden lg:block font-medium">下载</span>
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
|
|
||||||
<RouterLink to="/history"
|
<RouterLink to="/history"
|
||||||
@@ -46,7 +46,7 @@ onMounted(async () => {
|
|||||||
:class="route.path === '/history' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/20 dark:text-blue-400' : 'hover:bg-gray-100 dark:hover:bg-zinc-800'"
|
:class="route.path === '/history' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/20 dark:text-blue-400' : 'hover:bg-gray-100 dark:hover:bg-zinc-800'"
|
||||||
>
|
>
|
||||||
<History class="w-5 h-5 shrink-0" />
|
<History class="w-5 h-5 shrink-0" />
|
||||||
<span class="hidden lg:block font-medium">History</span>
|
<span class="hidden lg:block font-medium">历史</span>
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
|
|
||||||
<div class="flex-1"></div>
|
<div class="flex-1"></div>
|
||||||
@@ -57,7 +57,7 @@ onMounted(async () => {
|
|||||||
:class="route.path === '/logs' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/20 dark:text-blue-400' : 'hover:bg-gray-100 dark:hover:bg-zinc-800'"
|
:class="route.path === '/logs' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/20 dark:text-blue-400' : 'hover:bg-gray-100 dark:hover:bg-zinc-800'"
|
||||||
>
|
>
|
||||||
<FileText class="w-5 h-5 shrink-0" />
|
<FileText class="w-5 h-5 shrink-0" />
|
||||||
<span class="hidden lg:block font-medium">Logs</span>
|
<span class="hidden lg:block font-medium">日志</span>
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
|
|
||||||
<RouterLink to="/settings"
|
<RouterLink to="/settings"
|
||||||
@@ -65,7 +65,7 @@ onMounted(async () => {
|
|||||||
:class="route.path === '/settings' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/20 dark:text-blue-400' : 'hover:bg-gray-100 dark:hover:bg-zinc-800'"
|
:class="route.path === '/settings' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/20 dark:text-blue-400' : 'hover:bg-gray-100 dark:hover:bg-zinc-800'"
|
||||||
>
|
>
|
||||||
<SettingsIcon class="w-5 h-5 shrink-0" />
|
<SettingsIcon class="w-5 h-5 shrink-0" />
|
||||||
<span class="hidden lg:block font-medium">Settings</span>
|
<span class="hidden lg:block font-medium">设置</span>
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
</nav>
|
</nav>
|
||||||
</aside>
|
</aside>
|
||||||
|
|||||||
@@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
|
|
||||||
|
Before Width: | Height: | Size: 496 B |
@@ -18,6 +18,33 @@ export const useAnalysisStore = defineStore('analysis', () => {
|
|||||||
output_path: ''
|
output_path: ''
|
||||||
})
|
})
|
||||||
|
|
||||||
|
function toggleEntry(id: string) {
|
||||||
|
if (metadata.value && metadata.value.entries) {
|
||||||
|
const entry = metadata.value.entries.find((e: any) => e.id === id)
|
||||||
|
if (entry) {
|
||||||
|
entry.selected = !entry.selected
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function setAllEntries(selected: boolean) {
|
||||||
|
if (metadata.value && metadata.value.entries) {
|
||||||
|
metadata.value.entries = metadata.value.entries.map((e: any) => ({
|
||||||
|
...e,
|
||||||
|
selected
|
||||||
|
}))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function invertSelection() {
|
||||||
|
if (metadata.value && metadata.value.entries) {
|
||||||
|
metadata.value.entries = metadata.value.entries.map((e: any) => ({
|
||||||
|
...e,
|
||||||
|
selected: !e.selected
|
||||||
|
}))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function reset() {
|
function reset() {
|
||||||
url.value = ''
|
url.value = ''
|
||||||
loading.value = false
|
loading.value = false
|
||||||
@@ -27,5 +54,5 @@ export const useAnalysisStore = defineStore('analysis', () => {
|
|||||||
scanMix.value = false
|
scanMix.value = false
|
||||||
}
|
}
|
||||||
|
|
||||||
return { url, loading, error, metadata, options, isMix, scanMix, reset }
|
return { url, loading, error, metadata, options, isMix, scanMix, toggleEntry, setAllEntries, invertSelection, reset }
|
||||||
})
|
})
|
||||||
@@ -50,5 +50,9 @@ export const useLogsStore = defineStore('logs', () => {
|
|||||||
logs.value = []
|
logs.value = []
|
||||||
}
|
}
|
||||||
|
|
||||||
return { logs, addLog, initListener, clearLogs }
|
// UI State Persistence
|
||||||
|
const autoScroll = ref(true)
|
||||||
|
const scrollTop = ref(0)
|
||||||
|
|
||||||
|
return { logs, addLog, initListener, clearLogs, autoScroll, scrollTop }
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
// filepath: src/views/History.vue
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from 'vue'
|
import { ref, onMounted } from 'vue'
|
||||||
import { invoke } from '@tauri-apps/api/core'
|
import { invoke } from '@tauri-apps/api/core'
|
||||||
import { Trash2, FolderOpen } from 'lucide-vue-next'
|
import { Trash2, FolderOpen } from 'lucide-vue-next'
|
||||||
import { formatDistanceToNow } from 'date-fns'
|
import { formatDistanceToNow } from 'date-fns'
|
||||||
|
import { zhCN } from 'date-fns/locale'
|
||||||
|
|
||||||
interface HistoryItem {
|
interface HistoryItem {
|
||||||
id: string
|
id: string
|
||||||
@@ -53,8 +53,8 @@ onMounted(loadHistory)
|
|||||||
<div class="max-w-5xl mx-auto p-8">
|
<div class="max-w-5xl mx-auto p-8">
|
||||||
<header class="mb-8 flex justify-between items-center">
|
<header class="mb-8 flex justify-between items-center">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-3xl font-bold text-zinc-900 dark:text-white">Download History</h1>
|
<h1 class="text-3xl font-bold text-zinc-900 dark:text-white">下载历史</h1>
|
||||||
<p class="text-gray-500 dark:text-gray-400 mt-2">Manage your past downloads.</p>
|
<p class="text-gray-500 dark:text-gray-400 mt-2">管理您的下载记录。</p>
|
||||||
</div>
|
</div>
|
||||||
<button
|
<button
|
||||||
@click="clearHistory"
|
@click="clearHistory"
|
||||||
@@ -62,7 +62,7 @@ onMounted(loadHistory)
|
|||||||
class="text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 px-4 py-2 rounded-lg transition-colors text-sm font-medium flex items-center gap-2"
|
class="text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 px-4 py-2 rounded-lg transition-colors text-sm font-medium flex items-center gap-2"
|
||||||
>
|
>
|
||||||
<Trash2 class="w-4 h-4" />
|
<Trash2 class="w-4 h-4" />
|
||||||
Clear All
|
清空所有
|
||||||
</button>
|
</button>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
@@ -70,8 +70,8 @@ onMounted(loadHistory)
|
|||||||
<div class="bg-gray-100 dark:bg-zinc-900 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
|
<div class="bg-gray-100 dark:bg-zinc-900 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
|
||||||
<FolderOpen class="w-8 h-8 text-gray-400" />
|
<FolderOpen class="w-8 h-8 text-gray-400" />
|
||||||
</div>
|
</div>
|
||||||
<h3 class="text-lg font-medium text-zinc-900 dark:text-white">No downloads yet</h3>
|
<h3 class="text-lg font-medium text-zinc-900 dark:text-white">暂无下载</h3>
|
||||||
<p class="text-gray-500">Your download history will appear here.</p>
|
<p class="text-gray-500">您的下载记录将显示在这里。</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else class="bg-white dark:bg-zinc-900 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800 overflow-hidden">
|
<div v-else class="bg-white dark:bg-zinc-900 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800 overflow-hidden">
|
||||||
@@ -79,11 +79,11 @@ onMounted(loadHistory)
|
|||||||
<table class="w-full text-left">
|
<table class="w-full text-left">
|
||||||
<thead class="bg-gray-50 dark:bg-zinc-800/50 text-xs uppercase text-gray-500 font-medium">
|
<thead class="bg-gray-50 dark:bg-zinc-800/50 text-xs uppercase text-gray-500 font-medium">
|
||||||
<tr>
|
<tr>
|
||||||
<th class="px-6 py-4">Media</th>
|
<th class="px-6 py-4">媒体</th>
|
||||||
<th class="px-6 py-4">Date</th>
|
<th class="px-6 py-4">日期</th>
|
||||||
<th class="px-6 py-4">Format</th>
|
<th class="px-6 py-4">格式</th>
|
||||||
<th class="px-6 py-4">Status</th>
|
<th class="px-6 py-4">状态</th>
|
||||||
<th class="px-6 py-4 text-right">Actions</th>
|
<th class="px-6 py-4 text-right">操作</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody class="divide-y divide-gray-100 dark:divide-zinc-800">
|
<tbody class="divide-y divide-gray-100 dark:divide-zinc-800">
|
||||||
@@ -98,7 +98,7 @@ onMounted(loadHistory)
|
|||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="px-6 py-4 text-sm text-gray-500 whitespace-nowrap">
|
<td class="px-6 py-4 text-sm text-gray-500 whitespace-nowrap">
|
||||||
{{ formatDistanceToNow(new Date(item.timestamp), { addSuffix: true }) }}
|
{{ formatDistanceToNow(new Date(item.timestamp), { addSuffix: true, locale: zhCN }) }}
|
||||||
</td>
|
</td>
|
||||||
<td class="px-6 py-4 text-sm text-gray-500">
|
<td class="px-6 py-4 text-sm text-gray-500">
|
||||||
<span class="bg-gray-100 dark:bg-zinc-800 px-2 py-1 rounded text-xs font-mono">{{ item.format }}</span>
|
<span class="bg-gray-100 dark:bg-zinc-800 px-2 py-1 rounded text-xs font-mono">{{ item.format }}</span>
|
||||||
@@ -109,21 +109,21 @@ onMounted(loadHistory)
|
|||||||
:class="item.status === 'success' ? 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400' : 'bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400'"
|
:class="item.status === 'success' ? 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400' : 'bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400'"
|
||||||
>
|
>
|
||||||
<span class="w-1.5 h-1.5 rounded-full" :class="item.status === 'success' ? 'bg-green-500' : 'bg-red-500'"></span>
|
<span class="w-1.5 h-1.5 rounded-full" :class="item.status === 'success' ? 'bg-green-500' : 'bg-red-500'"></span>
|
||||||
{{ item.status === 'success' ? 'Completed' : 'Failed' }}
|
{{ item.status === 'success' ? '已完成' : '失败' }}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</td>
|
||||||
<td class="px-6 py-4 text-right whitespace-nowrap">
|
<td class="px-6 py-4 text-right whitespace-nowrap">
|
||||||
<button
|
<button
|
||||||
@click="openFolder(item.output_path)"
|
@click="openFolder(item.output_path)"
|
||||||
class="p-2 text-gray-400 hover:text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-900/20 rounded-lg transition-colors"
|
class="p-2 text-gray-400 hover:text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-900/20 rounded-lg transition-colors"
|
||||||
title="Open Output Folder"
|
title="打开输出文件夹"
|
||||||
>
|
>
|
||||||
<FolderOpen class="w-4 h-4" />
|
<FolderOpen class="w-4 h-4" />
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
@click="deleteItem(item.id)"
|
@click="deleteItem(item.id)"
|
||||||
class="p-2 text-gray-400 hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 rounded-lg transition-colors ml-1"
|
class="p-2 text-gray-400 hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 rounded-lg transition-colors ml-1"
|
||||||
title="Delete Record"
|
title="删除记录"
|
||||||
>
|
>
|
||||||
<Trash2 class="w-4 h-4" />
|
<Trash2 class="w-4 h-4" />
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
@@ -1,4 +1,3 @@
|
|||||||
// filepath: src/views/Home.vue
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { watch } from 'vue'
|
import { watch } from 'vue'
|
||||||
import { invoke } from '@tauri-apps/api/core'
|
import { invoke } from '@tauri-apps/api/core'
|
||||||
@@ -13,7 +12,7 @@ const settingsStore = useSettingsStore()
|
|||||||
const analysisStore = useAnalysisStore()
|
const analysisStore = useAnalysisStore()
|
||||||
|
|
||||||
const qualityOptions = [
|
const qualityOptions = [
|
||||||
{ label: 'Best Quality', value: 'best' },
|
{ label: '最佳画质', value: 'best' },
|
||||||
{ label: '1080p', value: '1080' },
|
{ label: '1080p', value: '1080' },
|
||||||
{ label: '720p', value: '720' },
|
{ label: '720p', value: '720' },
|
||||||
{ label: '480p', value: '480' },
|
{ label: '480p', value: '480' },
|
||||||
@@ -66,7 +65,13 @@ async function analyze() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const res = await invoke('fetch_metadata', { url: urlToScan, parseMixPlaylist: parseMix })
|
const res = await invoke<any>('fetch_metadata', { url: urlToScan, parseMixPlaylist: parseMix })
|
||||||
|
|
||||||
|
// Initialize selected state for playlist entries
|
||||||
|
if (res.entries) {
|
||||||
|
res.entries = res.entries.map((e: any) => ({ ...e, selected: true }))
|
||||||
|
}
|
||||||
|
|
||||||
analysisStore.metadata = res
|
analysisStore.metadata = res
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
analysisStore.error = e.toString()
|
analysisStore.error = e.toString()
|
||||||
@@ -84,18 +89,36 @@ async function startDownload() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const metaToSend = analysisStore.metadata.entries ?
|
if (analysisStore.metadata.entries) {
|
||||||
{ title: analysisStore.metadata.title, thumbnail: "", id: analysisStore.metadata.id } :
|
// Playlist Download
|
||||||
analysisStore.metadata;
|
const selectedEntries = analysisStore.metadata.entries.filter((e: any) => e.selected)
|
||||||
|
|
||||||
// Note: We might want to pass the *cleaned* URL if it was cleaned during analyze
|
if (selectedEntries.length === 0) {
|
||||||
// But for now we pass the original URL or whatever was scanned.
|
analysisStore.error = "请至少选择一个要下载的视频。"
|
||||||
// Actually, if we scanned as a single video (unchecked), we should probably download as single video.
|
return
|
||||||
// The user might expect the same result as analysis.
|
}
|
||||||
// Let's reconstruct the URL logic or just use what `analyze` used?
|
|
||||||
// Since `start_download` just takes a URL string, we should probably use the same logic.
|
|
||||||
|
|
||||||
|
for (const entry of selectedEntries) {
|
||||||
|
const videoUrl = `https://www.youtube.com/watch?v=${entry.id}`
|
||||||
|
const id = await invoke<string>('start_download', {
|
||||||
|
url: videoUrl,
|
||||||
|
options: analysisStore.options,
|
||||||
|
metadata: entry // Pass the individual video metadata
|
||||||
|
})
|
||||||
|
|
||||||
|
queueStore.addTask({
|
||||||
|
id,
|
||||||
|
title: entry.title,
|
||||||
|
thumbnail: entry.thumbnail,
|
||||||
|
progress: 0,
|
||||||
|
speed: '等待中...',
|
||||||
|
status: 'pending'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// Single Video Download
|
||||||
let urlToDownload = analysisStore.url;
|
let urlToDownload = analysisStore.url;
|
||||||
|
// Clean URL if it was a mix but we didn't scan it as one
|
||||||
if (analysisStore.isMix && !analysisStore.scanMix) {
|
if (analysisStore.isMix && !analysisStore.scanMix) {
|
||||||
try {
|
try {
|
||||||
const u = new URL(urlToDownload);
|
const u = new URL(urlToDownload);
|
||||||
@@ -111,22 +134,23 @@ async function startDownload() {
|
|||||||
const id = await invoke<string>('start_download', {
|
const id = await invoke<string>('start_download', {
|
||||||
url: urlToDownload,
|
url: urlToDownload,
|
||||||
options: analysisStore.options,
|
options: analysisStore.options,
|
||||||
metadata: metaToSend
|
metadata: analysisStore.metadata
|
||||||
})
|
})
|
||||||
|
|
||||||
queueStore.addTask({
|
queueStore.addTask({
|
||||||
id,
|
id,
|
||||||
title: metaToSend.title,
|
title: analysisStore.metadata.title,
|
||||||
thumbnail: metaToSend.thumbnail,
|
thumbnail: analysisStore.metadata.thumbnail,
|
||||||
progress: 0,
|
progress: 0,
|
||||||
speed: 'Pending...',
|
speed: '等待中...',
|
||||||
status: 'pending'
|
status: 'pending'
|
||||||
})
|
})
|
||||||
|
}
|
||||||
|
|
||||||
// Reset state after successful download start
|
// Reset state after successful download start
|
||||||
analysisStore.reset()
|
analysisStore.reset()
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
analysisStore.error = "Download failed to start: " + e.toString()
|
analysisStore.error = "下载启动失败: " + e.toString()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -134,8 +158,8 @@ async function startDownload() {
|
|||||||
<template>
|
<template>
|
||||||
<div class="max-w-5xl mx-auto p-8">
|
<div class="max-w-5xl mx-auto p-8">
|
||||||
<header class="mb-8">
|
<header class="mb-8">
|
||||||
<h1 class="text-3xl font-bold text-zinc-900 dark:text-white">New Download</h1>
|
<h1 class="text-3xl font-bold text-zinc-900 dark:text-white">新建下载</h1>
|
||||||
<p class="text-gray-500 dark:text-gray-400 mt-2">Paste a URL to start downloading media.</p>
|
<p class="text-gray-500 dark:text-gray-400 mt-2">粘贴 URL 开始下载媒体。</p>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<!-- Input Section -->
|
<!-- Input Section -->
|
||||||
@@ -154,7 +178,7 @@ async function startDownload() {
|
|||||||
class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-3 rounded-xl font-medium transition-colors disabled:opacity-50 flex items-center gap-2 shrink-0"
|
class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-3 rounded-xl font-medium transition-colors disabled:opacity-50 flex items-center gap-2 shrink-0"
|
||||||
>
|
>
|
||||||
<Loader2 v-if="analysisStore.loading" class="animate-spin w-5 h-5" />
|
<Loader2 v-if="analysisStore.loading" class="animate-spin w-5 h-5" />
|
||||||
<span v-else>Analyze</span>
|
<span v-else>解析</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -170,7 +194,7 @@ async function startDownload() {
|
|||||||
:class="analysisStore.scanMix ? 'translate-x-6' : 'translate-x-0'"
|
:class="analysisStore.scanMix ? 'translate-x-6' : 'translate-x-0'"
|
||||||
/>
|
/>
|
||||||
</button>
|
</button>
|
||||||
<span class="text-sm font-medium text-zinc-700 dark:text-gray-300">Scan Playlist (Max 20)</span>
|
<span class="text-sm font-medium text-zinc-700 dark:text-gray-300">解析播放列表 (前20项)</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p v-if="analysisStore.error" class="mt-3 text-red-500 text-sm">{{ analysisStore.error }}</p>
|
<p v-if="analysisStore.error" class="mt-3 text-red-500 text-sm">{{ analysisStore.error }}</p>
|
||||||
@@ -178,7 +202,93 @@ async function startDownload() {
|
|||||||
|
|
||||||
<!-- Analysis Result -->
|
<!-- Analysis Result -->
|
||||||
<div v-if="analysisStore.metadata" class="bg-white dark:bg-zinc-900 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800 overflow-hidden mb-8">
|
<div v-if="analysisStore.metadata" class="bg-white dark:bg-zinc-900 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800 overflow-hidden mb-8">
|
||||||
<div class="p-6 flex flex-col md:flex-row gap-6">
|
|
||||||
|
<!-- Playlist Header / Global Controls -->
|
||||||
|
<div v-if="analysisStore.metadata.entries" class="p-6 border-b border-gray-200 dark:border-zinc-800">
|
||||||
|
<div class="flex items-start justify-between mb-4">
|
||||||
|
<div>
|
||||||
|
<h2 class="text-xl font-bold text-zinc-900 dark:text-white">{{ analysisStore.metadata.title }}</h2>
|
||||||
|
<p class="text-blue-500 mt-1 font-medium">{{ analysisStore.metadata.entries.length }} 个视频</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Global Options Bar -->
|
||||||
|
<div class="flex flex-col md:flex-row items-center justify-between gap-4 bg-gray-50 dark:bg-zinc-800/50 p-4 rounded-xl">
|
||||||
|
|
||||||
|
<!-- Left: Selection Controls -->
|
||||||
|
<div class="flex items-center gap-2 w-full md:w-auto">
|
||||||
|
<button @click="analysisStore.setAllEntries(true)" class="text-xs font-medium px-3 py-1.5 rounded-lg bg-white dark:bg-zinc-700 hover:bg-gray-100 dark:hover:bg-zinc-600 text-zinc-700 dark:text-gray-200 border border-gray-200 dark:border-zinc-600 transition-colors shadow-sm">全选</button>
|
||||||
|
<button @click="analysisStore.setAllEntries(false)" class="text-xs font-medium px-3 py-1.5 rounded-lg bg-white dark:bg-zinc-700 hover:bg-gray-100 dark:hover:bg-zinc-600 text-zinc-700 dark:text-gray-200 border border-gray-200 dark:border-zinc-600 transition-colors shadow-sm">取消全选</button>
|
||||||
|
<button @click="analysisStore.invertSelection()" class="text-xs font-medium px-3 py-1.5 rounded-lg bg-white dark:bg-zinc-700 hover:bg-gray-100 dark:hover:bg-zinc-600 text-zinc-700 dark:text-gray-200 border border-gray-200 dark:border-zinc-600 transition-colors shadow-sm">反选</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Right: Settings -->
|
||||||
|
<div class="flex items-center gap-6 w-full md:w-auto justify-end">
|
||||||
|
<!-- Audio Only Toggle -->
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<span class="font-medium text-sm text-zinc-700 dark:text-gray-300">仅音频</span>
|
||||||
|
<button
|
||||||
|
@click="analysisStore.options.is_audio_only = !analysisStore.options.is_audio_only"
|
||||||
|
class="w-10 h-5 rounded-full relative transition-colors duration-200 ease-in-out shrink-0"
|
||||||
|
:class="analysisStore.options.is_audio_only ? 'bg-blue-600' : 'bg-gray-300 dark:bg-zinc-600'"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="absolute top-1 left-1 w-3 h-3 bg-white rounded-full transition-transform duration-200"
|
||||||
|
:class="analysisStore.options.is_audio_only ? 'translate-x-5' : 'translate-x-0'"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Quality Dropdown -->
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<span class="font-medium text-sm text-zinc-700 dark:text-gray-300">画质</span>
|
||||||
|
<div class="w-44">
|
||||||
|
<AppSelect
|
||||||
|
v-model="analysisStore.options.quality"
|
||||||
|
:options="qualityOptions"
|
||||||
|
:disabled="analysisStore.options.is_audio_only"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Video List (Playlist Mode) -->
|
||||||
|
<div v-if="analysisStore.metadata.entries" class="max-h-[500px] overflow-y-auto p-2 space-y-2 bg-gray-50/50 dark:bg-black/20">
|
||||||
|
<div
|
||||||
|
v-for="entry in analysisStore.metadata.entries"
|
||||||
|
:key="entry.id"
|
||||||
|
class="flex items-center gap-4 p-3 rounded-xl hover:bg-white dark:hover:bg-zinc-800 transition-colors border border-transparent hover:border-gray-200 dark:hover:border-zinc-700 group"
|
||||||
|
:class="entry.selected ? 'opacity-100' : 'opacity-60 grayscale'"
|
||||||
|
>
|
||||||
|
<!-- Checkbox -->
|
||||||
|
<button
|
||||||
|
@click="entry.selected = !entry.selected"
|
||||||
|
class="w-6 h-6 rounded-lg border-2 flex items-center justify-center transition-colors shrink-0"
|
||||||
|
:class="entry.selected ? 'bg-blue-600 border-blue-600 text-white' : 'border-gray-300 dark:border-zinc-600 hover:border-blue-400'"
|
||||||
|
>
|
||||||
|
<svg v-if="entry.selected" xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" viewBox="0 0 20 20" fill="currentColor">
|
||||||
|
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Thumb -->
|
||||||
|
<img :src="entry.thumbnail || '/placeholder.png'" class="w-24 h-14 object-cover rounded-lg bg-gray-200 dark:bg-zinc-700 shrink-0" />
|
||||||
|
|
||||||
|
<!-- Info -->
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<h4 class="font-medium text-zinc-900 dark:text-white truncate text-sm" :title="entry.title">{{ entry.title }}</h4>
|
||||||
|
<p class="text-xs text-gray-500 dark:text-gray-400 mt-0.5">
|
||||||
|
{{ entry.duration ? Math.floor(entry.duration / 60) + ':' + String(Math.floor(entry.duration % 60)).padStart(2, '0') : '' }}
|
||||||
|
<span v-if="entry.uploader" class="mx-1">•</span> {{ entry.uploader }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Single Video Layout -->
|
||||||
|
<div v-else class="p-6 flex flex-col md:flex-row gap-6">
|
||||||
<!-- Thumbnail -->
|
<!-- Thumbnail -->
|
||||||
<img :src="analysisStore.metadata.thumbnail || '/placeholder.png'" class="w-full md:w-64 aspect-video object-cover rounded-lg bg-gray-100 dark:bg-zinc-800" />
|
<img :src="analysisStore.metadata.thumbnail || '/placeholder.png'" class="w-full md:w-64 aspect-video object-cover rounded-lg bg-gray-100 dark:bg-zinc-800" />
|
||||||
|
|
||||||
@@ -186,13 +296,13 @@ async function startDownload() {
|
|||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<h2 class="text-xl font-bold text-zinc-900 dark:text-white line-clamp-2">{{ analysisStore.metadata.title }}</h2>
|
<h2 class="text-xl font-bold text-zinc-900 dark:text-white line-clamp-2">{{ analysisStore.metadata.title }}</h2>
|
||||||
<p v-if="analysisStore.metadata.uploader" class="text-gray-500 dark:text-gray-400 mt-1">{{ analysisStore.metadata.uploader }}</p>
|
<p v-if="analysisStore.metadata.uploader" class="text-gray-500 dark:text-gray-400 mt-1">{{ analysisStore.metadata.uploader }}</p>
|
||||||
<p v-if="analysisStore.metadata.entries" class="text-blue-500 mt-1 font-medium">{{ analysisStore.metadata.entries.length }} videos in playlist</p>
|
<p v-if="analysisStore.metadata.entries" class="text-blue-500 mt-1 font-medium">{{ analysisStore.metadata.entries.length }} 个视频 (播放列表)</p>
|
||||||
|
|
||||||
<!-- Options -->
|
<!-- Options -->
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-6">
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-6">
|
||||||
<!-- Audio Only Toggle -->
|
<!-- Audio Only Toggle -->
|
||||||
<div class="flex items-center justify-between p-3 bg-gray-50 dark:bg-zinc-800 rounded-xl">
|
<div class="flex items-center justify-between p-3 bg-gray-50 dark:bg-zinc-800 rounded-xl">
|
||||||
<span class="font-medium text-sm">Audio Only</span>
|
<span class="font-medium text-sm">仅音频</span>
|
||||||
<button
|
<button
|
||||||
@click="analysisStore.options.is_audio_only = !analysisStore.options.is_audio_only"
|
@click="analysisStore.options.is_audio_only = !analysisStore.options.is_audio_only"
|
||||||
class="w-12 h-6 rounded-full relative transition-colors duration-200 ease-in-out"
|
class="w-12 h-6 rounded-full relative transition-colors duration-200 ease-in-out"
|
||||||
@@ -222,14 +332,14 @@ async function startDownload() {
|
|||||||
@click="startDownload"
|
@click="startDownload"
|
||||||
class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-3 rounded-xl font-bold transition-colors shadow-lg shadow-blue-600/20"
|
class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-3 rounded-xl font-bold transition-colors shadow-lg shadow-blue-600/20"
|
||||||
>
|
>
|
||||||
Download Now
|
立即下载 {{ analysisStore.metadata.entries ? `(${analysisStore.metadata.entries.filter((e: any) => e.selected).length})` : '' }}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Active Downloads -->
|
<!-- Active Downloads -->
|
||||||
<div v-if="queueStore.tasks.length > 0">
|
<div v-if="queueStore.tasks.length > 0">
|
||||||
<h3 class="text-lg font-bold mb-4">Active Downloads</h3>
|
<h3 class="text-lg font-bold mb-4">进行中的任务</h3>
|
||||||
<div class="space-y-3">
|
<div class="space-y-3">
|
||||||
<!-- Reversed to show newest first -->
|
<!-- Reversed to show newest first -->
|
||||||
<div v-for="task in queueStore.tasks.slice().reverse()" :key="task.id" class="bg-white dark:bg-zinc-900 p-4 rounded-xl border border-gray-200 dark:border-zinc-800 flex items-center gap-4">
|
<div v-for="task in queueStore.tasks.slice().reverse()" :key="task.id" class="bg-white dark:bg-zinc-900 p-4 rounded-xl border border-gray-200 dark:border-zinc-800 flex items-center gap-4">
|
||||||
@@ -238,7 +348,7 @@ async function startDownload() {
|
|||||||
<div class="flex justify-between mb-1">
|
<div class="flex justify-between mb-1">
|
||||||
<h4 class="font-medium truncate pr-4">{{ task.title }}</h4>
|
<h4 class="font-medium truncate pr-4">{{ task.title }}</h4>
|
||||||
<span class="text-xs font-mono text-gray-500 whitespace-nowrap">
|
<span class="text-xs font-mono text-gray-500 whitespace-nowrap">
|
||||||
{{ task.status === 'finished' ? 'Completed' : (task.status === 'error' ? 'Failed' : task.speed) }}
|
{{ task.status === 'finished' ? '已完成' : (task.status === 'error' ? '失败' : task.speed) }}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="h-2 bg-gray-100 dark:bg-zinc-800 rounded-full overflow-hidden">
|
<div class="h-2 bg-gray-100 dark:bg-zinc-800 rounded-full overflow-hidden">
|
||||||
|
|||||||
@@ -1,12 +1,10 @@
|
|||||||
// filepath: src/views/Logs.vue
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, nextTick, watch } from 'vue'
|
import { ref, computed, nextTick, watch, onMounted } from 'vue'
|
||||||
import { useLogsStore } from '../stores/logs'
|
import { useLogsStore } from '../stores/logs'
|
||||||
import { Trash2, Search } from 'lucide-vue-next'
|
import { Trash2, Search } from 'lucide-vue-next'
|
||||||
|
|
||||||
const logsStore = useLogsStore()
|
const logsStore = useLogsStore()
|
||||||
const logsContainer = ref<HTMLElement | null>(null)
|
const logsContainer = ref<HTMLElement | null>(null)
|
||||||
const autoScroll = ref(true)
|
|
||||||
const filterLevel = ref<'all' | 'info' | 'error'>('all')
|
const filterLevel = ref<'all' | 'info' | 'error'>('all')
|
||||||
const searchQuery = ref('')
|
const searchQuery = ref('')
|
||||||
|
|
||||||
@@ -18,9 +16,20 @@ const filteredLogs = computed(() => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
// Auto-scroll
|
// Restore scroll position on mount
|
||||||
|
onMounted(() => {
|
||||||
|
if (logsContainer.value) {
|
||||||
|
logsContainer.value.scrollTop = logsStore.scrollTop
|
||||||
|
// If it was auto-scrolling, ensure it's at bottom in case new logs arrived while away
|
||||||
|
if (logsStore.autoScroll) {
|
||||||
|
logsContainer.value.scrollTop = logsContainer.value.scrollHeight
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// Auto-scroll watcher
|
||||||
watch(() => logsStore.logs.length, () => {
|
watch(() => logsStore.logs.length, () => {
|
||||||
if (autoScroll.value) {
|
if (logsStore.autoScroll) {
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
if (logsContainer.value) {
|
if (logsContainer.value) {
|
||||||
logsContainer.value.scrollTop = logsContainer.value.scrollHeight
|
logsContainer.value.scrollTop = logsContainer.value.scrollHeight
|
||||||
@@ -29,6 +38,15 @@ watch(() => logsStore.logs.length, () => {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
function handleScroll(e: Event) {
|
||||||
|
const target = e.target as HTMLElement;
|
||||||
|
logsStore.scrollTop = target.scrollTop;
|
||||||
|
|
||||||
|
// Check if user is near bottom (allow 20px threshold)
|
||||||
|
const isAtBottom = target.scrollTop + target.clientHeight >= target.scrollHeight - 20;
|
||||||
|
logsStore.autoScroll = isAtBottom;
|
||||||
|
}
|
||||||
|
|
||||||
function formatTime(ts: number) {
|
function formatTime(ts: number) {
|
||||||
const d = new Date(ts)
|
const d = new Date(ts)
|
||||||
const year = d.getFullYear()
|
const year = d.getFullYear()
|
||||||
@@ -46,8 +64,8 @@ function formatTime(ts: number) {
|
|||||||
<!-- Header -->
|
<!-- Header -->
|
||||||
<div class="flex justify-between items-center mb-6">
|
<div class="flex justify-between items-center mb-6">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-3xl font-bold text-zinc-900 dark:text-white">Execution Logs</h1>
|
<h1 class="text-3xl font-bold text-zinc-900 dark:text-white">运行日志</h1>
|
||||||
<p class="text-gray-500 dark:text-gray-400 mt-2">Real-time output from download processes.</p>
|
<p class="text-gray-500 dark:text-gray-400 mt-2">下载任务的实时输出。</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex items-center gap-3">
|
<div class="flex items-center gap-3">
|
||||||
@@ -57,7 +75,7 @@ function formatTime(ts: number) {
|
|||||||
<input
|
<input
|
||||||
v-model="searchQuery"
|
v-model="searchQuery"
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Search logs..."
|
placeholder="搜索日志..."
|
||||||
class="pl-9 pr-4 py-2 bg-white dark:bg-zinc-900 border border-gray-200 dark:border-zinc-800 rounded-xl text-sm outline-none focus:ring-2 focus:ring-blue-500 text-zinc-900 dark:text-white w-48"
|
class="pl-9 pr-4 py-2 bg-white dark:bg-zinc-900 border border-gray-200 dark:border-zinc-800 rounded-xl text-sm outline-none focus:ring-2 focus:ring-blue-500 text-zinc-900 dark:text-white w-48"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -68,23 +86,23 @@ function formatTime(ts: number) {
|
|||||||
@click="filterLevel = 'all'"
|
@click="filterLevel = 'all'"
|
||||||
class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors"
|
class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors"
|
||||||
:class="filterLevel === 'all' ? 'bg-gray-100 dark:bg-zinc-800 text-zinc-900 dark:text-white' : 'text-gray-500 hover:text-zinc-900 dark:hover:text-white'"
|
:class="filterLevel === 'all' ? 'bg-gray-100 dark:bg-zinc-800 text-zinc-900 dark:text-white' : 'text-gray-500 hover:text-zinc-900 dark:hover:text-white'"
|
||||||
>All</button>
|
>全部</button>
|
||||||
<button
|
<button
|
||||||
@click="filterLevel = 'info'"
|
@click="filterLevel = 'info'"
|
||||||
class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors"
|
class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors"
|
||||||
:class="filterLevel === 'info' ? 'bg-gray-100 dark:bg-zinc-800 text-zinc-900 dark:text-white' : 'text-gray-500 hover:text-zinc-900 dark:hover:text-white'"
|
:class="filterLevel === 'info' ? 'bg-gray-100 dark:bg-zinc-800 text-zinc-900 dark:text-white' : 'text-gray-500 hover:text-zinc-900 dark:hover:text-white'"
|
||||||
>Info</button>
|
>信息</button>
|
||||||
<button
|
<button
|
||||||
@click="filterLevel = 'error'"
|
@click="filterLevel = 'error'"
|
||||||
class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors"
|
class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors"
|
||||||
:class="filterLevel === 'error' ? 'bg-gray-100 dark:bg-zinc-800 text-zinc-900 dark:text-white' : 'text-gray-500 hover:text-zinc-900 dark:hover:text-white'"
|
:class="filterLevel === 'error' ? 'bg-gray-100 dark:bg-zinc-800 text-zinc-900 dark:text-white' : 'text-gray-500 hover:text-zinc-900 dark:hover:text-white'"
|
||||||
>Error</button>
|
>错误</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button
|
<button
|
||||||
@click="logsStore.clearLogs"
|
@click="logsStore.clearLogs"
|
||||||
class="p-2 text-gray-500 hover:bg-red-50 hover:text-red-600 dark:hover:bg-red-900/20 rounded-xl transition-colors border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-900"
|
class="p-2 text-gray-500 hover:bg-red-50 hover:text-red-600 dark:hover:bg-red-900/20 rounded-xl transition-colors border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-900"
|
||||||
title="Clear Logs"
|
title="清空日志"
|
||||||
>
|
>
|
||||||
<Trash2 class="w-4 h-4" />
|
<Trash2 class="w-4 h-4" />
|
||||||
</button>
|
</button>
|
||||||
@@ -96,13 +114,10 @@ function formatTime(ts: number) {
|
|||||||
<div
|
<div
|
||||||
ref="logsContainer"
|
ref="logsContainer"
|
||||||
class="absolute inset-0 overflow-auto p-4 space-y-1"
|
class="absolute inset-0 overflow-auto p-4 space-y-1"
|
||||||
@scroll="(e) => {
|
@scroll="handleScroll"
|
||||||
const target = e.target as HTMLElement;
|
|
||||||
autoScroll = target.scrollTop + target.clientHeight >= target.scrollHeight - 10;
|
|
||||||
}"
|
|
||||||
>
|
>
|
||||||
<div v-if="filteredLogs.length === 0" class="h-full flex items-center justify-center text-gray-400 dark:text-gray-600">
|
<div v-if="filteredLogs.length === 0" class="h-full flex items-center justify-center text-gray-400 dark:text-gray-600">
|
||||||
No logs to display
|
暂无日志
|
||||||
</div>
|
</div>
|
||||||
<div v-for="log in filteredLogs" :key="log.id" class="flex gap-4 hover:bg-gray-50 dark:hover:bg-zinc-800/50 px-2 py-1 rounded transition-colors">
|
<div v-for="log in filteredLogs" :key="log.id" class="flex gap-4 hover:bg-gray-50 dark:hover:bg-zinc-800/50 px-2 py-1 rounded transition-colors">
|
||||||
<span class="text-gray-400 dark:text-zinc-600 shrink-0 select-none w-36">{{ formatTime(log.timestamp) }}</span>
|
<span class="text-gray-400 dark:text-zinc-600 shrink-0 select-none w-36">{{ formatTime(log.timestamp) }}</span>
|
||||||
@@ -114,12 +129,12 @@ function formatTime(ts: number) {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Auto-scroll indicator -->
|
<!-- Auto-scroll indicator -->
|
||||||
<div v-if="!autoScroll" class="absolute bottom-4 right-4">
|
<div v-if="!logsStore.autoScroll" class="absolute bottom-4 right-4">
|
||||||
<button
|
<button
|
||||||
@click="() => { if(logsContainer) logsContainer.scrollTop = logsContainer.scrollHeight }"
|
@click="() => { if(logsContainer) { logsContainer.scrollTop = logsContainer.scrollHeight; logsStore.autoScroll = true; } }"
|
||||||
class="bg-blue-600 hover:bg-blue-700 text-white text-xs px-3 py-1.5 rounded-full shadow-lg transition-colors"
|
class="bg-blue-600 hover:bg-blue-700 text-white text-xs px-3 py-1.5 rounded-full shadow-lg transition-colors"
|
||||||
>
|
>
|
||||||
Resume Auto-scroll
|
恢复自动滚动
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,10 +1,10 @@
|
|||||||
// filepath: src/views/Settings.vue
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { useSettingsStore } from '../stores/settings'
|
import { useSettingsStore } from '../stores/settings'
|
||||||
import { invoke } from '@tauri-apps/api/core'
|
import { invoke } from '@tauri-apps/api/core'
|
||||||
import { open } from '@tauri-apps/plugin-dialog'
|
import { open } from '@tauri-apps/plugin-dialog'
|
||||||
import { Folder, RefreshCw, Monitor, Sun, Moon, Terminal } from 'lucide-vue-next'
|
import { Folder, RefreshCw, Monitor, Sun, Moon, Terminal } from 'lucide-vue-next'
|
||||||
|
import { format } from 'date-fns' // Import format
|
||||||
|
|
||||||
const settingsStore = useSettingsStore()
|
const settingsStore = useSettingsStore()
|
||||||
const updatingYtdlp = ref(false)
|
const updatingYtdlp = ref(false)
|
||||||
@@ -26,13 +26,13 @@ async function browsePath() {
|
|||||||
|
|
||||||
async function updateYtdlp() {
|
async function updateYtdlp() {
|
||||||
updatingYtdlp.value = true
|
updatingYtdlp.value = true
|
||||||
updateStatus.value = 'Updating yt-dlp...'
|
updateStatus.value = '正在更新 yt-dlp...'
|
||||||
try {
|
try {
|
||||||
const res = await invoke<string>('update_ytdlp')
|
const res = await invoke<string>('update_ytdlp')
|
||||||
updateStatus.value = res
|
updateStatus.value = res
|
||||||
await settingsStore.refreshVersions()
|
await settingsStore.refreshVersions()
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
updateStatus.value = 'yt-dlp Error: ' + e.toString()
|
updateStatus.value = 'yt-dlp 错误:' + e.toString()
|
||||||
} finally {
|
} finally {
|
||||||
updatingYtdlp.value = false
|
updatingYtdlp.value = false
|
||||||
}
|
}
|
||||||
@@ -40,13 +40,13 @@ async function updateYtdlp() {
|
|||||||
|
|
||||||
async function updateQuickjs() {
|
async function updateQuickjs() {
|
||||||
updatingQuickjs.value = true
|
updatingQuickjs.value = true
|
||||||
updateStatus.value = 'Updating QuickJS...'
|
updateStatus.value = '正在更新 QuickJS...'
|
||||||
try {
|
try {
|
||||||
const res = await invoke<string>('update_quickjs')
|
const res = await invoke<string>('update_quickjs')
|
||||||
updateStatus.value = res
|
updateStatus.value = res
|
||||||
await settingsStore.refreshVersions()
|
await settingsStore.refreshVersions()
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
updateStatus.value = 'QuickJS Error: ' + e.toString()
|
updateStatus.value = 'QuickJS 错误:' + e.toString()
|
||||||
} finally {
|
} finally {
|
||||||
updatingQuickjs.value = false
|
updatingQuickjs.value = false
|
||||||
}
|
}
|
||||||
@@ -61,31 +61,31 @@ function setTheme(theme: 'light' | 'dark' | 'system') {
|
|||||||
<template>
|
<template>
|
||||||
<div class="max-w-3xl mx-auto p-8">
|
<div class="max-w-3xl mx-auto p-8">
|
||||||
<header class="mb-8">
|
<header class="mb-8">
|
||||||
<h1 class="text-3xl font-bold text-zinc-900 dark:text-white">Settings</h1>
|
<h1 class="text-3xl font-bold text-zinc-900 dark:text-white">设置</h1>
|
||||||
<p class="text-gray-500 dark:text-gray-400 mt-2">Configure your download preferences.</p>
|
<p class="text-gray-500 dark:text-gray-400 mt-2">配置您的下载偏好。</p>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="space-y-6">
|
<div class="space-y-6">
|
||||||
<!-- Download Path -->
|
<!-- Download Path -->
|
||||||
<section class="bg-white dark:bg-zinc-900 p-6 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800">
|
<section class="bg-white dark:bg-zinc-900 p-6 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800">
|
||||||
<h2 class="text-lg font-bold mb-4 text-zinc-900 dark:text-white">Download Location</h2>
|
<h2 class="text-lg font-bold mb-4 text-zinc-900 dark:text-white">下载位置</h2>
|
||||||
<div class="flex gap-3">
|
<div class="flex gap-3">
|
||||||
<div class="flex-1 bg-gray-50 dark:bg-zinc-800 rounded-xl px-4 py-3 text-sm text-gray-600 dark:text-gray-300 font-mono truncate border border-transparent focus-within:border-blue-500 transition-colors">
|
<div class="flex-1 bg-gray-50 dark:bg-zinc-800 rounded-xl px-4 py-3 text-sm text-gray-600 dark:text-gray-300 font-mono truncate border border-transparent focus-within:border-blue-500 transition-colors">
|
||||||
{{ settingsStore.settings.download_path || 'Not set (using defaults)' }}
|
{{ settingsStore.settings.download_path || '未设置 (使用默认)' }}
|
||||||
</div>
|
</div>
|
||||||
<button
|
<button
|
||||||
@click="browsePath"
|
@click="browsePath"
|
||||||
class="bg-gray-100 hover:bg-gray-200 dark:bg-zinc-800 dark:hover:bg-zinc-700 text-zinc-900 dark:text-white px-4 py-3 rounded-xl font-medium transition-colors flex items-center gap-2"
|
class="bg-gray-100 hover:bg-gray-200 dark:bg-zinc-800 dark:hover:bg-zinc-700 text-zinc-900 dark:text-white px-4 py-3 rounded-xl font-medium transition-colors flex items-center gap-2"
|
||||||
>
|
>
|
||||||
<Folder class="w-5 h-5" />
|
<Folder class="w-5 h-5" />
|
||||||
Browse
|
浏览
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Theme -->
|
<!-- Theme -->
|
||||||
<section class="bg-white dark:bg-zinc-900 p-6 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800">
|
<section class="bg-white dark:bg-zinc-900 p-6 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800">
|
||||||
<h2 class="text-lg font-bold mb-4 text-zinc-900 dark:text-white">Appearance</h2>
|
<h2 class="text-lg font-bold mb-4 text-zinc-900 dark:text-white">外观</h2>
|
||||||
<div class="grid grid-cols-3 gap-4">
|
<div class="grid grid-cols-3 gap-4">
|
||||||
<button
|
<button
|
||||||
@click="setTheme('light')"
|
@click="setTheme('light')"
|
||||||
@@ -93,7 +93,7 @@ function setTheme(theme: 'light' | 'dark' | 'system') {
|
|||||||
:class="settingsStore.settings.theme === 'light' ? 'border-blue-600 bg-blue-50 dark:bg-blue-900/20 text-blue-600' : 'border-transparent bg-gray-50 dark:bg-zinc-800 text-gray-500 hover:bg-gray-100 dark:hover:bg-zinc-700'"
|
:class="settingsStore.settings.theme === 'light' ? 'border-blue-600 bg-blue-50 dark:bg-blue-900/20 text-blue-600' : 'border-transparent bg-gray-50 dark:bg-zinc-800 text-gray-500 hover:bg-gray-100 dark:hover:bg-zinc-700'"
|
||||||
>
|
>
|
||||||
<Sun class="w-6 h-6" />
|
<Sun class="w-6 h-6" />
|
||||||
<span class="font-medium">Light</span>
|
<span class="font-medium">浅色</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
@click="setTheme('dark')"
|
@click="setTheme('dark')"
|
||||||
@@ -101,7 +101,7 @@ function setTheme(theme: 'light' | 'dark' | 'system') {
|
|||||||
:class="settingsStore.settings.theme === 'dark' ? 'border-blue-600 bg-blue-50 dark:bg-blue-900/20 text-blue-600' : 'border-transparent bg-gray-50 dark:bg-zinc-800 text-gray-500 hover:bg-gray-100 dark:hover:bg-zinc-700'"
|
:class="settingsStore.settings.theme === 'dark' ? 'border-blue-600 bg-blue-50 dark:bg-blue-900/20 text-blue-600' : 'border-transparent bg-gray-50 dark:bg-zinc-800 text-gray-500 hover:bg-gray-100 dark:hover:bg-zinc-700'"
|
||||||
>
|
>
|
||||||
<Moon class="w-6 h-6" />
|
<Moon class="w-6 h-6" />
|
||||||
<span class="font-medium">Dark</span>
|
<span class="font-medium">深色</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
@click="setTheme('system')"
|
@click="setTheme('system')"
|
||||||
@@ -109,14 +109,14 @@ function setTheme(theme: 'light' | 'dark' | 'system') {
|
|||||||
:class="settingsStore.settings.theme === 'system' ? 'border-blue-600 bg-blue-50 dark:bg-blue-900/20 text-blue-600' : 'border-transparent bg-gray-50 dark:bg-zinc-800 text-gray-500 hover:bg-gray-100 dark:hover:bg-zinc-700'"
|
:class="settingsStore.settings.theme === 'system' ? 'border-blue-600 bg-blue-50 dark:bg-blue-900/20 text-blue-600' : 'border-transparent bg-gray-50 dark:bg-zinc-800 text-gray-500 hover:bg-gray-100 dark:hover:bg-zinc-700'"
|
||||||
>
|
>
|
||||||
<Monitor class="w-6 h-6" />
|
<Monitor class="w-6 h-6" />
|
||||||
<span class="font-medium">System</span>
|
<span class="font-medium">跟随系统</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Binary Management -->
|
<!-- Binary Management -->
|
||||||
<section class="bg-white dark:bg-zinc-900 p-6 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800">
|
<section class="bg-white dark:bg-zinc-900 p-6 rounded-2xl shadow-sm border border-gray-200 dark:border-zinc-800">
|
||||||
<h2 class="text-lg font-bold mb-4 text-zinc-900 dark:text-white">External Binaries</h2>
|
<h2 class="text-lg font-bold mb-4 text-zinc-900 dark:text-white">外部二进制文件</h2>
|
||||||
|
|
||||||
<div class="space-y-4">
|
<div class="space-y-4">
|
||||||
<!-- yt-dlp -->
|
<!-- yt-dlp -->
|
||||||
@@ -136,7 +136,7 @@ function setTheme(theme: 'light' | 'dark' | 'system') {
|
|||||||
class="text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-900/20 px-4 py-2 rounded-lg transition-colors text-sm font-medium flex items-center gap-2 disabled:opacity-50"
|
class="text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-900/20 px-4 py-2 rounded-lg transition-colors text-sm font-medium flex items-center gap-2 disabled:opacity-50"
|
||||||
>
|
>
|
||||||
<RefreshCw class="w-4 h-4" :class="{ 'animate-spin': updatingYtdlp }" />
|
<RefreshCw class="w-4 h-4" :class="{ 'animate-spin': updatingYtdlp }" />
|
||||||
Update
|
更新
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -157,7 +157,7 @@ function setTheme(theme: 'light' | 'dark' | 'system') {
|
|||||||
class="text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-900/20 px-4 py-2 rounded-lg transition-colors text-sm font-medium flex items-center gap-2 disabled:opacity-50"
|
class="text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-900/20 px-4 py-2 rounded-lg transition-colors text-sm font-medium flex items-center gap-2 disabled:opacity-50"
|
||||||
>
|
>
|
||||||
<RefreshCw class="w-4 h-4" :class="{ 'animate-spin': updatingQuickjs }" />
|
<RefreshCw class="w-4 h-4" :class="{ 'animate-spin': updatingQuickjs }" />
|
||||||
Update
|
更新
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -165,7 +165,7 @@ function setTheme(theme: 'light' | 'dark' | 'system') {
|
|||||||
<div v-if="updateStatus" class="mt-4 p-3 bg-gray-50 dark:bg-zinc-800 rounded-lg text-xs font-mono text-gray-600 dark:text-gray-400 whitespace-pre-wrap border border-gray-200 dark:border-zinc-700">
|
<div v-if="updateStatus" class="mt-4 p-3 bg-gray-50 dark:bg-zinc-800 rounded-lg text-xs font-mono text-gray-600 dark:text-gray-400 whitespace-pre-wrap border border-gray-200 dark:border-zinc-700">
|
||||||
{{ updateStatus }}
|
{{ updateStatus }}
|
||||||
</div>
|
</div>
|
||||||
<p class="text-xs text-gray-400 mt-4 text-right">Last Checked: {{ settingsStore.settings.last_updated ? new Date(settingsStore.settings.last_updated).toLocaleString() : 'Never' }}</p>
|
<p class="text-xs text-gray-400 mt-4 text-right">上次检查: {{ settingsStore.settings.last_updated ? format(new Date(settingsStore.settings.last_updated), 'yyyy-MM-dd HH:mm:ss') : '从未' }}</p>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||