From dd5ff36b7f7f2e8a8aa373b0729de8d9cb77fa7a Mon Sep 17 00:00:00 2001
From: WhiteMind <WhiteMind@qq.com>
Date: Fri, 1 Mar 2024 17:43:04 +0800
Subject: [PATCH] feat: disable history item actions when the file removed

---
 packages/http-server/src/routes/api_types.ts |  2 +-
 packages/http-server/src/routes/record.ts    |  8 +++++-
 packages/web/src/views/Records/index.vue     | 28 +++++++++++++++-----
 3 files changed, 30 insertions(+), 8 deletions(-)

diff --git a/packages/http-server/src/routes/api_types.ts b/packages/http-server/src/routes/api_types.ts
index 38d01e0..d3b4d71 100644
--- a/packages/http-server/src/routes/api_types.ts
+++ b/packages/http-server/src/routes/api_types.ts
@@ -27,7 +27,7 @@ export type ClientRecorder = Omit<
   recordHandle?: Omit<RecordHandle, 'stop'>
 }
 
-export type ClientRecord = RecordModel
+export type ClientRecord = RecordModel & { isFileExists?: boolean }
 
 export namespace API {
   export namespace getRecorders {
diff --git a/packages/http-server/src/routes/record.ts b/packages/http-server/src/routes/record.ts
index 3f7aa38..82a62d7 100644
--- a/packages/http-server/src/routes/record.ts
+++ b/packages/http-server/src/routes/record.ts
@@ -16,7 +16,13 @@ async function getRecords(args: API.getRecords.Args): Promise<API.getRecords.Res
       start: startIdx,
       count,
     })
-    return { items, total }
+    return {
+      items: items.map((item) => ({
+        ...item,
+        isFileExists: fs.existsSync(item.savePath),
+      })),
+      total,
+    }
   })
   return pagedGetter(args.page, args.pageSize)
 }
diff --git a/packages/web/src/views/Records/index.vue b/packages/web/src/views/Records/index.vue
index dba59cd..995ddad 100644
--- a/packages/web/src/views/Records/index.vue
+++ b/packages/web/src/views/Records/index.vue
@@ -66,14 +66,30 @@
       <template v-slot:header.actions="{ column }">
         <span class="pl-3">{{ column.title }}</span>
       </template>
+
       <template v-slot:item.actions="{ value: record }">
         <div class="flex gap-0">
-          <router-link :to="{ name: RouteNames.Player, query: { id: record.id } }" target="_blank" tabindex="-1">
-            <v-btn size="small" variant="text">播放</v-btn>
-          </router-link>
-          <v-btn @click="genSRT(record)" size="small" variant="text" :loading="record.generatingSRT">
-            生成 srt 字幕
-          </v-btn>
+          <component
+            :is="!record.isFileExists ? 'span' : 'router-link'"
+            :to="{ name: RouteNames.Player, query: { id: record.id } }"
+            target="_blank"
+            tabindex="-1"
+            :title="!record.isFileExists ? '文件不存在' : ''"
+          >
+            <v-btn size="small" variant="text" :disabled="!record.isFileExists">播放</v-btn>
+          </component>
+
+          <span :title="!record.isFileExists ? '文件不存在' : ''">
+            <v-btn
+              @click="genSRT(record)"
+              size="small"
+              variant="text"
+              :loading="record.generatingSRT"
+              :disabled="!record.isFileExists"
+            >
+              生成 srt 字幕
+            </v-btn>
+          </span>
         </div>
       </template>
     </v-data-table>