Merge pull request #3991 from vbenjs/update-upgrade-prompt

chore: update UpgradePrompt

src/layouts/default/header/components/UpgradePrompt.vue

@@ -1,16 +1,24 @@
 <script setup lang="ts">
   import { h } from 'vue';
   import { Modal } from 'ant-design-vue';
+  import { useI18n } from '@/hooks/web/useI18n';
 
-  Modal.confirm({
-    title: '新版本发布',
-    content: h('div', {}, [h('p', 'Vben Admin v5.0.0 预览版本已发布')]),
-    onOk() {
-      handleClick();
-    },
-    okText: '前往体验新版',
-    cancelText: '关闭',
-  });
+  const { t } = useI18n();
+
+  const localKey = 'vben-v5.0.0-upgrade-prompt';
+
+  if (!localStorage.getItem(localKey)) {
+    Modal.confirm({
+      title: t('layout.header.upgrade-prompt.title'),
+      content: h('div', {}, [h('p', t('layout.header.upgrade-prompt.content'))]),
+      onOk() {
+        handleClick();
+      },
+      okText: t('layout.header.upgrade-prompt.ok-text'),
+      cancelText: t('common.closeText'),
+    });
+  }
+  localStorage.setItem(localKey, String(Date.now()));
 
   function handleClick() {
     window.open('https://www.vben.pro', '_blank');
@@ -18,6 +26,8 @@
 </script>
 <template>
   <div>
-    <a-button type="primary" @click="handleClick">前往体验新版</a-button>
+    <a-button type="primary" @click="handleClick">{{
+      t('layout.header.upgrade-prompt.ok-text')
+    }}</a-button>
   </div>
 </template>

src/locales/lang/en/layout.json

@@ -15,7 +15,12 @@
     "lockScreenPassword": "Lock screen password",
     "lockScreen": "Lock screen",
     "lockScreenBtn": "Locking",
-    "home": "Home"
+    "home": "Home",
+    "upgrade-prompt": {
+      "title": "New version released",
+      "content": "Vben Admin v5.0.0 preview version has been released",
+      "ok-text": "Go to new version"
+    }
   },
   "multipleTab": {
     "reload": "Refresh current",

src/locales/lang/zh-CN/layout.json

@@ -15,7 +15,12 @@
     "lockScreenPassword": "锁屏密码",
     "lockScreen": "锁定屏幕",
     "lockScreenBtn": "锁定",
-    "home": "首页"
+    "home": "首页",
+    "upgrade-prompt": {
+      "title": "新版本发布",
+      "content": "Vben Admin v5.0.0 预览版本已发布",
+      "ok-text": "前往体验新版"
+    }
   },
   "multipleTab": {
     "reload": "重新加载",