fix service worker reload prompt

rwv · Nov 19, 2023 · f12f196 · f12f196
1 parent 8ca026b
commit f12f196
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 9 deletions.
diff --git a/src/components/Misc/ServiceWorkerReloadPrompt.vue b/src/components/Misc/ServiceWorkerReloadPrompt.vue
@@ -8,7 +8,7 @@ import { useI18n } from 'vue-i18n'
 
 const { t } = useI18n()
 
-const { offlineReady, needRefresh } = useRegisterSW()
+const { offlineReady, needRefresh, updateServiceWorker } = useRegisterSW()
 
 const message = useMessage()
 
@@ -22,12 +22,27 @@ watch(offlineReady, (ready) => {
 watch(needRefresh, (refresh) => {
   if (refresh) {
     console.log('Service Worker need to refresh')
-    message.info(t('base.serviceWorker.needRefresh'), {
-      icon: () => h(NIcon, null, { default: () => h(Refresh) }),
-      closable: true,
-      keepAliveOnHover: true,
-      duration: 5000
-    })
+    message.info(
+      () =>
+        h(
+          'span',
+          {
+            onClick: () => {
+              message.destroyAll()
+              console.log('updateServiceWorker')
+              updateServiceWorker(true)
+            },
+            style: 'cursor: pointer'
+          },
+          t('base.serviceWorker.needRefresh')
+        ),
+      {
+        icon: () => h(NIcon, null, { default: () => h(Refresh) }),
+        closable: true,
+        keepAliveOnHover: true,
+        duration: 5000
+      }
+    )
   }
 })
 </script>

diff --git a/src/locale/en/base.ts b/src/locale/en/base.ts
@@ -5,6 +5,6 @@ export const base = {
   scanTitle: 'Scan',
   serviceWorker: {
     offlineReady: 'App ready to work offline',
-    needRefresh: 'New content available, reload to update.'
+    needRefresh: 'New version available, click to refresh.'
   }
 }
diff --git a/src/locale/zh-CN/base.ts b/src/locale/zh-CN/base.ts
@@ -5,6 +5,6 @@ export const base = {
   scanTitle: '扫描',
   serviceWorker: {
     offlineReady: '离线缓存已准备就绪',
-    needRefresh: '网站代码已更新，刷新界面可享受新版本。不刷新也可继续使用'
+    needRefresh: '网站代码已更新，点此可享受新版本。'
   }
 }