首次提交

src/components/CacheManager.vue

@@ -2,48 +2,85 @@
   <v-card>
     <v-card-title class="d-flex align-center">
       <span>缓存管理</span>
-      <v-spacer></v-spacer>
-      <v-btn :loading="loading" color="error" @click="clearAllCaches">
+      <v-spacer />
+      <v-btn
+        :loading="loading"
+        color="error"
+        @click="clearAllCaches"
+      >
         清除所有缓存
       </v-btn>
-      <v-btn class="ml-2" icon @click="refreshCaches">
+      <v-btn
+        class="ml-2"
+        icon
+        @click="refreshCaches"
+      >
         <v-icon>mdi-refresh</v-icon>
       </v-btn>
     </v-card-title>
 
     <v-card-text>
-      <v-alert v-if="!serviceWorkerActive" class="mb-4" type="warning">
+      <v-alert
+        v-if="!serviceWorkerActive"
+        class="mb-4"
+        type="warning"
+      >
         Service Worker 未激活，缓存管理功能不可用。
       </v-alert>
 
-      <v-alert v-if="message" :type="messageType" class="mb-4">
+      <v-alert
+        v-if="message"
+        :type="messageType"
+        class="mb-4"
+      >
         {{ message }}
       </v-alert>
 
       <v-expansion-panels v-if="caches.length > 0">
-        <v-expansion-panel v-for="cache in caches" :key="cache.name">
+        <v-expansion-panel
+          v-for="cache in caches"
+          :key="cache.name"
+        >
           <v-expansion-panel-title>
             <div class="d-flex align-center">
               <span>{{ formatCacheName(cache.name) }}</span>
-              <v-chip class="ml-2" size="small">{{ cache.urls.length }} 个文件</v-chip>
+              <v-chip
+                class="ml-2"
+                size="small"
+              >
+                {{ cache.urls.length }} 个文件
+              </v-chip>
             </div>
           </v-expansion-panel-title>
           <v-expansion-panel-text>
             <div class="d-flex justify-end mb-2">
-              <v-btn :loading="loading" color="error" size="small" @click="clearCache(cache.name)">
+              <v-btn
+                :loading="loading"
+                color="error"
+                size="small"
+                @click="clearCache(cache.name)"
+              >
                 清除此缓存
               </v-btn>
             </div>
             <v-list lines="two">
-              <v-list-item v-for="(url, index) in cache.urls" :key="index">
+              <v-list-item
+                v-for="(url, index) in cache.urls"
+                :key="index"
+              >
                 <v-list-item-title class="text-truncate">
                   {{ getFileName(url) }}
                 </v-list-item-title>
                 <v-list-item-subtitle class="text-truncate">
                   {{ url }}
                 </v-list-item-subtitle>
-                <template v-slot:append>
-                  <v-btn color="error" icon size="small" @click="clearUrl(cache.name, url)">
+                <template #append>
+                  <v-btn
+                    color="error"
+                    icon
+                    size="small"
+                    @click="clearUrl(cache.name, url)"
+                  >
                     <v-icon>mdi-delete</v-icon>
                   </v-btn>
                 </template>
@@ -53,9 +90,15 @@
         </v-expansion-panel>
       </v-expansion-panels>
 
-      <v-skeleton-loader v-else-if="loading" type="article"/>
+      <v-skeleton-loader
+        v-else-if="loading"
+        type="article"
+      />
 
-      <v-alert v-else type="info">
+      <v-alert
+        v-else
+        type="info"
+      >
         没有找到缓存数据。
       </v-alert>
     </v-card-text>