add refresh browser cache when client version not match server version

src/views/desktop/AboutPage.vue

@@ -1,22 +1,34 @@
 <template>
     <v-row class="match-height">
         <v-col cols="12">
-            <v-card :title="tt('global.app.title')">
+            <v-card>
+                <template #title>
+                    <div class="d-flex align-center">
+                        <span>{{ tt('global.app.title') }}</span>
+                        <v-btn density="compact" color="default" variant="text" size="24"
+                               class="ml-2" :icon="true" @click="refreshBrowserCache"
+                               v-if="!clientVersionMatchServerVersion">
+                            <v-icon :icon="mdiWebRefresh" size="24" />
+                            <v-tooltip activator="parent">{{ tt('Refresh Browser Cache') }}</v-tooltip>
+                        </v-btn>
+                    </div>
+                </template>
+
                 <v-card-text>
                     <v-row no-gutters>
                         <v-col cols="12" md="2">
                             <span class="text-body-1">{{ tt('Version') }}</span>
                         </v-col>
                         <v-col cols="12" md="10" class="mb-6">
-                            <span class="text-body-1">{{ version }}</span>
+                            <span class="text-body-1">{{ clientVersion }}</span>
                         </v-col>
                     </v-row>
-                    <v-row no-gutters v-if="buildTime">
+                    <v-row no-gutters v-if="clientBuildTime">
                         <v-col cols="12" md="2">
                             <span class="text-body-1">{{ tt('Build Time') }}</span>
                         </v-col>
                         <v-col cols="12" md="10" class="mb-6">
-                            <span class="text-body-1">{{ buildTime }}</span>
+                            <span class="text-body-1">{{ clientBuildTime }}</span>
                         </v-col>
                     </v-row>
                     <v-row no-gutters>
@@ -123,15 +135,24 @@
 import { useI18n } from '@/locales/helpers.ts';
 import { useAboutPageBase } from '@/views/base/AboutPageBase.ts';
 
+import {
+    mdiWebRefresh
+} from '@mdi/js';
+
 const { tt } = useI18n();
 const {
-    version,
-    buildTime,
+    clientVersion,
+    clientVersionMatchServerVersion,
+    clientBuildTime,
     exchangeRatesData,
     isUserCustomExchangeRates,
     mapProviderName,
     mapProviderWebsite,
     licenseLines,
-    thirdPartyLicenses
+    thirdPartyLicenses,
+    refreshBrowserCache,
+    init
 } = useAboutPageBase();
+
+init();
 </script>

src/views/desktop/ForgetPasswordPage.vue

@@ -101,7 +101,7 @@ import { useRootStore } from '@/stores/index.ts';
 
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';
 import { ThemeType } from '@/core/theme.ts';
-import { getVersion } from '@/lib/version.ts';
+import { getClientDisplayVersion } from '@/lib/version.ts';
 
 import {
     mdiChevronLeft,
@@ -115,7 +115,7 @@ const { tt } = useI18n();
 
 const rootStore = useRootStore();
 
-const version = `v${getVersion()}`;
+const version = `${getClientDisplayVersion()}`;
 
 const snackbar = useTemplateRef<SnackBarType>('snackbar');
 

src/views/desktop/ResetPasswordPage.vue

@@ -130,7 +130,7 @@ import { useRootStore } from '@/stores/index.ts';
 
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';
 import { ThemeType } from '@/core/theme.ts';
-import { getVersion } from '@/lib/version.ts';
+import { getClientDisplayVersion } from '@/lib/version.ts';
 
 import {
     mdiChevronLeft
@@ -150,7 +150,7 @@ const { tt } = useI18n();
 
 const rootStore = useRootStore();
 
-const version = `v${getVersion()}`;
+const version = `${getClientDisplayVersion()}`;
 
 const passwordInput = useTemplateRef<VTextField>('passwordInput');
 const confirmPasswordInput = useTemplateRef<VTextField>('confirmPasswordInput');

src/views/desktop/VerifyEmailPage.vue

@@ -110,7 +110,7 @@ import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';
 import { ThemeType } from '@/core/theme.ts';
 import { isUserVerifyEmailEnabled } from '@/lib/server_settings.ts';
 import { isUserLogined } from '@/lib/userstate.ts';
-import { getVersion } from '@/lib/version.ts';
+import { getClientDisplayVersion } from '@/lib/version.ts';
 
 import {
     mdiChevronLeft
@@ -132,7 +132,7 @@ const { tt, te } = useI18n();
 
 const rootStore = useRootStore();
 
-const version = `v${getVersion()}`;
+const version = `${getClientDisplayVersion()}`;
 
 const confirmDialog = useTemplateRef<ConfirmDialogType>('confirmDialog');
 const snackbar = useTemplateRef<SnackBarType>('snackbar');