From 8f44a2603766dd43fe9c8f9581932a788e696c4e Mon Sep 17 00:00:00 2001
From: MaysWind <i@mayswind.net>
Date: Mon, 10 Jul 2023 00:14:33 +0800
Subject: [PATCH] code refactor

---
 src/consts/asset.js              | 6 ++++++
 src/views/desktop/LoginPage.vue  | 6 +++++-
 src/views/desktop/MainLayout.vue | 8 ++++++--
 src/views/desktop/SignupPage.vue | 6 +++++-
 src/views/desktop/UnlockPage.vue | 6 +++++-
 src/views/mobile/LoginPage.vue   | 6 +++++-
 src/views/mobile/UnlockPage.vue  | 6 +++++-
 7 files changed, 37 insertions(+), 7 deletions(-)
 create mode 100644 src/consts/asset.js

diff --git a/src/consts/asset.js b/src/consts/asset.js
new file mode 100644
index 00000000..a503f0ce
--- /dev/null
+++ b/src/consts/asset.js
@@ -0,0 +1,6 @@
+const baseImagePath = '/img';
+const ezBookkeepingLogoPath = baseImagePath + '/ezbookkeeping-192.png';
+
+export default {
+    ezBookkeepingLogoPath: ezBookkeepingLogoPath
+}
diff --git a/src/views/desktop/LoginPage.vue b/src/views/desktop/LoginPage.vue
index c4d16b80..e21c0cb5 100644
--- a/src/views/desktop/LoginPage.vue
+++ b/src/views/desktop/LoginPage.vue
@@ -2,7 +2,7 @@
     <div class="layout-wrapper">
         <router-link to="/">
             <div class="auth-logo d-flex align-start gap-x-3">
-                <img alt="logo" class="login-page-logo" src="/img/ezbookkeeping-192.png" />
+                <img alt="logo" class="login-page-logo" :src="ezBookkeepingLogoPath" />
                 <h1 class="font-weight-medium leading-normal text-2xl">{{ $t('global.app.title') }}</h1>
             </div>
         </router-link>
@@ -164,6 +164,7 @@ import { useRootStore } from '@/stores/index.js';
 import { useSettingsStore } from '@/stores/setting.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 
+import assetConstants from '@/consts/asset.js';
 import { isUserRegistrationEnabled } from '@/lib/server_settings.js';
 
 import {
@@ -197,6 +198,9 @@ export default {
     },
     computed: {
         ...mapStores(useRootStore, useSettingsStore, useExchangeRatesStore),
+        ezBookkeepingLogoPath() {
+            return assetConstants.ezBookkeepingLogoPath;
+        },
         version() {
             return 'v' + this.$version;
         },
diff --git a/src/views/desktop/MainLayout.vue b/src/views/desktop/MainLayout.vue
index 12a067b6..f77270bc 100644
--- a/src/views/desktop/MainLayout.vue
+++ b/src/views/desktop/MainLayout.vue
@@ -5,7 +5,7 @@
             <div class="nav-header">
                 <router-link to="/" class="app-logo d-flex align-center gap-x-3 app-title-wrapper">
                     <div class="d-flex">
-                        <img alt="logo" class="main-logo" src="/img/ezbookkeeping-192.png" />
+                        <img alt="logo" class="main-logo" :src="ezBookkeepingLogoPath" />
                     </div>
                     <h1 class="font-weight-medium text-xl">{{ $t('global.app.title') }}</h1>
                 </router-link>
@@ -97,7 +97,7 @@
                         </v-btn>
                         <div class="app-logo d-flex align-center gap-x-3 app-title-wrapper" v-if="mdAndDown">
                             <div class="d-flex">
-                                <img alt="logo" class="main-logo" src="/img/ezbookkeeping-192.png" />
+                                <img alt="logo" class="main-logo" :src="ezBookkeepingLogoPath" />
                             </div>
                             <h1 class="font-weight-medium text-xl">{{ $t('global.app.title') }}</h1>
                         </div>
@@ -186,6 +186,7 @@ import { useRootStore } from '@/stores/index.js';
 import { useSettingsStore } from '@/stores/setting.js';
 import { useUserStore } from '@/stores/user.js';
 
+import assetConstants from '@/consts/asset.js';
 import { getSystemTheme } from '@/lib/ui.js';
 
 import {
@@ -241,6 +242,9 @@ export default {
     },
     computed: {
         ...mapStores(useRootStore, useSettingsStore, useUserStore),
+        ezBookkeepingLogoPath() {
+            return assetConstants.ezBookkeepingLogoPath;
+        },
         mdAndDown() {
             const { mdAndDown } = useDisplay();
             return mdAndDown.value;
diff --git a/src/views/desktop/SignupPage.vue b/src/views/desktop/SignupPage.vue
index 999064d8..58b6a505 100644
--- a/src/views/desktop/SignupPage.vue
+++ b/src/views/desktop/SignupPage.vue
@@ -2,7 +2,7 @@
     <div class="layout-wrapper">
         <router-link to="/">
             <div class="auth-logo d-flex align-start gap-x-3">
-                <img alt="logo" class="login-page-logo" src="/img/ezbookkeeping-192.png" />
+                <img alt="logo" class="login-page-logo" :src="ezBookkeepingLogoPath" />
                 <h1 class="font-weight-medium leading-normal text-2xl">{{ $t('global.app.title') }}</h1>
             </div>
         </router-link>
@@ -248,6 +248,7 @@ import { useSettingsStore } from '@/stores/setting.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 
+import assetConstants from '@/consts/asset.js';
 import categoryConstants from '@/consts/category.js';
 import { getNameByKeyValue, copyArrayTo } from '@/lib/common.js';
 
@@ -296,6 +297,9 @@ export default {
     },
     computed: {
         ...mapStores(useRootStore, useSettingsStore, useTransactionCategoriesStore, useExchangeRatesStore),
+        ezBookkeepingLogoPath() {
+            return assetConstants.ezBookkeepingLogoPath;
+        },
         allLanguages() {
             return this.$locale.getAllLanguageInfoArray(false);
         },
diff --git a/src/views/desktop/UnlockPage.vue b/src/views/desktop/UnlockPage.vue
index bb253fb9..87fd1d42 100644
--- a/src/views/desktop/UnlockPage.vue
+++ b/src/views/desktop/UnlockPage.vue
@@ -2,7 +2,7 @@
     <div class="layout-wrapper">
         <router-link to="/">
             <div class="auth-logo d-flex align-start gap-x-3">
-                <img alt="logo" class="login-page-logo" src="/img/ezbookkeeping-192.png" />
+                <img alt="logo" class="login-page-logo" :src="ezBookkeepingLogoPath" />
                 <h1 class="font-weight-medium leading-normal text-2xl">{{ $t('global.app.title') }}</h1>
             </div>
         </router-link>
@@ -115,6 +115,7 @@ import { useUserStore } from '@/stores/user.js';
 import { useTokensStore } from '@/stores/token.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 
+import assetConstants from '@/consts/asset.js';
 import logger from '@/lib/logger.js';
 import webauthn from '@/lib/webauthn.js';
 
@@ -128,6 +129,9 @@ export default {
     },
     computed: {
         ...mapStores(useRootStore, useSettingsStore, useUserStore, useTokensStore, useExchangeRatesStore),
+        ezBookkeepingLogoPath() {
+            return assetConstants.ezBookkeepingLogoPath;
+        },
         version() {
             return 'v' + this.$version;
         },
diff --git a/src/views/mobile/LoginPage.vue b/src/views/mobile/LoginPage.vue
index a93a051c..004321df 100644
--- a/src/views/mobile/LoginPage.vue
+++ b/src/views/mobile/LoginPage.vue
@@ -1,7 +1,7 @@
 <template>
     <f7-page no-toolbar no-navbar no-swipeback login-screen>
         <f7-login-screen-title>
-            <img alt="logo" class="login-page-logo" src="/img/ezbookkeeping-192.png" />
+            <img alt="logo" class="login-page-logo" :src="ezBookkeepingLogoPath" />
             <f7-block class="login-page-tile margin-vertical-half">{{ $t('global.app.title') }}</f7-block>
         </f7-login-screen-title>
 
@@ -127,6 +127,7 @@ import { useRootStore } from '@/stores/index.js';
 import { useSettingsStore } from '@/stores/setting.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 
+import assetConstants from '@/consts/asset.js';
 import { isUserRegistrationEnabled } from '@/lib/server_settings.js';
 import { getDesktopVersionPath } from '@/lib/version.js';
 import { isModalShowing } from '@/lib/ui.mobile.js';
@@ -150,6 +151,9 @@ export default {
     },
     computed: {
         ...mapStores(useRootStore, useSettingsStore, useExchangeRatesStore),
+        ezBookkeepingLogoPath() {
+            return assetConstants.ezBookkeepingLogoPath;
+        },
         version() {
             return 'v' + this.$version;
         },
diff --git a/src/views/mobile/UnlockPage.vue b/src/views/mobile/UnlockPage.vue
index d450c2cc..7ebf7472 100644
--- a/src/views/mobile/UnlockPage.vue
+++ b/src/views/mobile/UnlockPage.vue
@@ -1,7 +1,7 @@
 <template>
     <f7-page no-toolbar no-navbar no-swipeback login-screen>
         <f7-login-screen-title>
-            <img alt="logo" class="login-page-logo" src="/img/ezbookkeeping-192.png" />
+            <img alt="logo" class="login-page-logo" :src="ezBookkeepingLogoPath" />
             <f7-block class="login-page-tile margin-vertical-half">{{ $t('global.app.title') }}</f7-block>
         </f7-login-screen-title>
 
@@ -76,6 +76,7 @@ import { useUserStore } from '@/stores/user.js';
 import { useTokensStore } from '@/stores/token.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 
+import assetConstants from '@/consts/asset.js';
 import logger from '@/lib/logger.js';
 import webauthn from '@/lib/webauthn.js';
 import { getDesktopVersionPath } from '@/lib/version.js';
@@ -92,6 +93,9 @@ export default {
     },
     computed: {
         ...mapStores(useRootStore, useSettingsStore, useUserStore, useTokensStore, useExchangeRatesStore),
+        ezBookkeepingLogoPath() {
+            return assetConstants.ezBookkeepingLogoPath;
+        },
         version() {
             return 'v' + this.$version;
         },