add ffmpeg

src/stores/settings.ts

@@ -18,6 +18,7 @@ export const useSettingsStore = defineStore('settings', () => {
 
   const ytdlpVersion = ref('Checking...')
   const quickjsVersion = ref('Checking...')
+    const ffmpegVersion = ref('Checking...')
   const isInitializing = ref(true)
 
   async function loadSettings() {
@@ -49,6 +50,7 @@ export const useSettingsStore = defineStore('settings', () => {
         console.error(e)
         ytdlpVersion.value = 'Error'
         quickjsVersion.value = 'Error'
+      ffmpegVersion.value = 'Error'
     } finally {
         isInitializing.value = false
     }
@@ -57,6 +59,7 @@ export const useSettingsStore = defineStore('settings', () => {
   async function refreshVersions() {
       ytdlpVersion.value = await invoke('get_ytdlp_version')
       quickjsVersion.value = await invoke('get_quickjs_version')
+      ffmpegVersion.value = await invoke('get_ffmpeg_version')
   }
 
   function applyTheme(theme: string) {
@@ -76,5 +79,5 @@ export const useSettingsStore = defineStore('settings', () => {
       }
   })
 
-  return { settings, loadSettings, save, initYtdlp, refreshVersions, ytdlpVersion, quickjsVersion, isInitializing }
+  return { settings, loadSettings, save, initYtdlp, refreshVersions, ytdlpVersion, quickjsVersion, ffmpegVersion, isInitializing }
 })

src/views/Settings.vue

@@ -9,6 +9,7 @@ import { format } from 'date-fns' // Import format
 const settingsStore = useSettingsStore()
 const updatingYtdlp = ref(false)
 const updatingQuickjs = ref(false)
+const updatingFfmpeg = ref(false)
 const updateStatus = ref('')
 
 async function browsePath() {
@@ -52,6 +53,20 @@ async function updateQuickjs() {
   }
 }
 
+async function updateFfmpeg() {
+  updatingFfmpeg.value = true
+  updateStatus.value = '正在更新 FFmpeg...'
+  try {
+    const res = await invoke<string>('update_ffmpeg')
+    updateStatus.value = res
+    await settingsStore.refreshVersions()
+  } catch (e: any) {
+    updateStatus.value = 'FFmpeg 错误：' + e.toString()
+  } finally {
+    updatingFfmpeg.value = false
+  }
+}
+
 function setTheme(theme: 'light' | 'dark' | 'system') {
     settingsStore.settings.theme = theme
     settingsStore.save()
@@ -160,6 +175,27 @@ function setTheme(theme: 'light' | 'dark' | 'system') {
                     更新
                   </button>
               </div>
+
+              <!-- FFmpeg -->
+              <div class="flex items-center justify-between p-4 bg-gray-50 dark:bg-zinc-800 rounded-xl">
+                  <div class="flex items-center gap-4">
+                      <div class="w-10 h-10 bg-white dark:bg-zinc-700 rounded-lg flex items-center justify-center shadow-sm">
+                          <Terminal class="w-5 h-5 text-purple-600" />
+                      </div>
+                      <div>
+                          <div class="font-medium text-zinc-900 dark:text-white">FFmpeg</div>
+                          <div class="text-xs text-gray-500 mt-0.5 font-mono">{{ settingsStore.ffmpegVersion === '未安装' ? '未安装' : '已安装' }}</div>
+                      </div>
+                  </div>
+                  <button 
+                    @click="updateFfmpeg"
+                    :disabled="updatingFfmpeg"
+                    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': updatingFfmpeg }" />
+                    更新
+                  </button>
+              </div>
           </div>
 
           <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">