feat(version): 添加版本更新检测功能

添加 version-polling 依赖并实现版本更新检测功能
移除旧的 CheckUpdates 组件，改用新的版本检测方案

apps/web-antd/package.json

@@ -52,6 +52,7 @@
     "pinia": "catalog:",
     "tinymce": "7.9.1",
     "unplugin-vue-components": "^0.27.3",
+    "version-polling": "^1.3.3",
     "vue": "catalog:",
     "vue-router": "catalog:"
   },

apps/web-antd/src/layouts/basic.vue

@@ -29,6 +29,7 @@ import { $t } from '#/locales';
 import { resetRoutes } from '#/router';
 import { useAuthStore, useNotifyStore } from '#/store';
 import { useTenantStore } from '#/store/tenant';
+import { useVersionUpdate } from '#/utils/check-update';
 import LoginForm from '#/views/_core/authentication/login.vue';
 
 const userStore = useUserStore();
@@ -131,6 +132,8 @@ watch(
     immediate: true,
   },
 );
+// 检测版本更新
+useVersionUpdate();
 </script>
 
 <template>

apps/web-antd/src/utils/check-update.tsx

@@ -0,0 +1,64 @@
+import { onMounted } from 'vue';
+
+import { preferences } from '@vben/preferences';
+
+import { Button, Space } from 'antdv-next';
+import { createVersionPolling } from 'version-polling';
+
+import { $t } from '#/locales';
+
+export function useVersionUpdate() {
+  onMounted(() => {
+    // 可能会有用dev打包的需求 所以这里不判断环境变量
+    if (
+      location.hostname === 'localhost' ||
+      location.hostname === '127.0.0.1'
+    ) {
+      return null;
+    }
+
+    createVersionPolling({
+      // 默认一分钟
+      pollingInterval: preferences.app.checkUpdatesInterval * 60 * 1000,
+      silent: !preferences.app.enableCheckUpdates,
+      htmlFileUrl: location.origin + import.meta.env.VITE_BASE,
+      onUpdate: (self) => {
+        window.notification.info({
+          title: $t('ui.widgets.checkUpdatesTitle'),
+          closable: false,
+          // placement: 'bottomRight',
+          description: (
+            <div
+              class="mt-3 flex justify-between text-sm"
+              style={{ color: 'var(--ant-color-text-2)' }}
+            >
+              <span class="mr-2 font-semibold">
+                {$t('ui.widgets.checkUpdatesDescription')}
+              </span>
+              <Space>
+                <Button
+                  onClick={() => {
+                    window.notification.destroy();
+                  }}
+                  size="small"
+                >
+                  {$t('common.cancel')}
+                </Button>
+                <Button
+                  onClick={() => {
+                    self.onRefresh();
+                  }}
+                  size="small"
+                  type="primary"
+                >
+                  {$t('common.refresh')}
+                </Button>
+              </Space>
+            </div>
+          ),
+          duration: 0,
+        });
+      },
+    });
+  });
+}

packages/effects/layouts/src/basic/layout.vue

@@ -20,7 +20,7 @@ import { cloneDeep, mapTree } from '@vben/utils';
 import { VbenAdminLayout } from '@vben-core/layout-ui';
 import { VbenBackTop, VbenLogo } from '@vben-core/shadcn-ui';
 
-import { Breadcrumb, CheckUpdates, Preferences } from '../widgets';
+import { Breadcrumb, Preferences } from '../widgets';
 import { LayoutContent, LayoutContentSpinner } from './content';
 import { Copyright } from './copyright';
 import { LayoutFooter } from './footer';
@@ -389,10 +389,10 @@ const headerSlots = computed(() => {
 
     <template #extra>
       <slot name="extra"></slot>
-      <CheckUpdates
+      <!-- <CheckUpdates
         v-if="preferences.app.enableCheckUpdates"
         :check-updates-interval="preferences.app.checkUpdatesInterval"
-      />
+      /> -->
 
       <Transition v-if="preferences.widget.lockScreen" name="slide-up">
         <slot v-if="accessStore.isLockScreen" name="lock-screen"></slot>