add page settings page

src/locales/en.js

@@ -975,17 +975,20 @@ export default {
     'Timezone': 'Timezone',
     'System Default': 'System Default',
     'Language Default': 'Language Default',
-    'Auto Update Exchange Rates Data': 'Auto Update Exchange Rates Data',
+    'Auto-update Exchange Rates Data': 'Auto-update Exchange Rates Data',
-    'Auto Get Current Geographic Location': 'Auto Get Current Geographic Location',
     'Enable Thousands Separator': 'Enable Thousands Separator',
     'Currency Display Mode': 'Currency Display Mode',
     'Currency Code': 'Currency Code',
     'Currency Name': 'Currency Name',
     'Currency Symbol': 'Currency Symbol',
-    'Show Amount In Home Page': 'Show Amount In Home Page',
     'Show Account Balance': 'Show Account Balance',
-    'Show Total Amount In Transaction List Page': 'Show Total Amount In Transaction List Page',
+    'Page Settings': 'Page Settings',
-    'Enable Animate': 'Enable Animate',
+    'Overview Page': 'Overview Page',
+    'Transaction List Page': 'Transaction List Page',
+    'Show Monthly Total Amount': 'Show Monthly Total Amount',
+    'Transaction Edit Page': 'Transaction Edit Page',
+    'Automatically Add Geolocation': 'Automatically Add Geolocation',
+    'Enable Animation': 'Enable Animation',
     'Use preset transaction categories': 'Use preset transaction categories',
     'Preset Categories': 'Preset Categories',
     'You have been successfully registered': 'You have been successfully registered',

src/locales/zh_Hans.js

@@ -975,17 +975,20 @@ export default {
     'Timezone': '时区',
     'System Default': '系统默认',
     'Language Default': '语言默认',
-    'Auto Update Exchange Rates Data': '自动更新汇率数据',
+    'Auto-update Exchange Rates Data': '自动更新汇率数据',
-    'Auto Get Current Geographic Location': '自动获取当前地理位置',
     'Enable Thousands Separator': '启用千位分隔符',
     'Currency Display Mode': '货币显示模式',
     'Currency Code': '货币代码',
     'Currency Name': '货币名称',
     'Currency Symbol': '货币符号',
-    'Show Amount In Home Page': '首页显示金额',
     'Show Account Balance': '显示账户余额',
-    'Show Total Amount In Transaction List Page': '交易列表页显示总金额',
+    'Page Settings': '页面设置',
-    'Enable Animate': '启用动画',
+    'Overview Page': '概览页面',
+    'Transaction List Page': '交易列表页面',
+    'Show Monthly Total Amount': '显示月度总金额',
+    'Transaction Edit Page': '交易编辑页面',
+    'Automatically Add Geolocation': '自动添加地理位置',
+    'Enable Animation': '启用动画',
     'Use preset transaction categories': '使用预设交易分类',
     'Preset Categories': '预设分类',
     'You have been successfully registered': '注册成功',

src/router/mobile.js

@@ -17,6 +17,7 @@ import StatisticsAccountFilterSettingsPage from '@/views/mobile/statistics/Accou
 import StatisticsCategoryFilterSettingsPage from '@/views/mobile/statistics/CategoryFilterSettingsPage.vue';
 
 import TextSizeSettingsPage from '@/views/mobile/settings/TextSizeSettingsPage.vue';
+import PageSettingsPage from '@/views/mobile/settings/PageSettingsPage.vue';
 
 import SettingsPage from '@/views/mobile/SettingsPage.vue';
 import ApplicationLockPage from '@/views/mobile/ApplicationLockPage.vue';
@@ -202,6 +203,11 @@ const routes = [
         async: asyncResolve(TextSizeSettingsPage),
         beforeEnter: [checkLogin]
     },
+    {
+        path: '/settings/page',
+        async: asyncResolve(PageSettingsPage),
+        beforeEnter: [checkLogin]
+    },
     {
         path: '/settings',
         async: asyncResolve(SettingsPage),

src/views/mobile/SettingsPage.vue

@@ -44,15 +44,10 @@
             <f7-list-item :title="$t('Exchange Rates Data')" :after="exchangeRatesLastUpdateDate" link="/exchange_rates"></f7-list-item>
 
             <f7-list-item>
-                <span>{{ $t('Auto Update Exchange Rates Data') }}</span>
+                <span>{{ $t('Auto-update Exchange Rates Data') }}</span>
                 <f7-toggle :checked="isAutoUpdateExchangeRatesData" @toggle:change="isAutoUpdateExchangeRatesData = $event"></f7-toggle>
             </f7-list-item>
 
-            <f7-list-item>
-                <span>{{ $t('Auto Get Current Geographic Location') }}</span>
-                <f7-toggle :checked="isAutoGetCurrentGeoLocation" @toggle:change="isAutoGetCurrentGeoLocation = $event"></f7-toggle>
-            </f7-list-item>
-
             <f7-list-item>
                 <span>{{ $t('Enable Thousands Separator') }}</span>
                 <f7-toggle :checked="isEnableThousandsSeparator" @toggle:change="isEnableThousandsSeparator = $event"></f7-toggle>
@@ -70,25 +65,17 @@
                 </select>
             </f7-list-item>
 
-            <f7-list-item>
-                <span>{{ $t('Show Amount In Home Page') }}</span>
-                <f7-toggle :checked="showAmountInHomePage" @toggle:change="showAmountInHomePage = $event"></f7-toggle>
-            </f7-list-item>
-
             <f7-list-item>
                 <span>{{ $t('Show Account Balance') }}</span>
                 <f7-toggle :checked="showAccountBalance" @toggle:change="showAccountBalance = $event"></f7-toggle>
             </f7-list-item>
 
-            <f7-list-item>
+            <f7-list-item :title="$t('Page Settings')" link="/settings/page"></f7-list-item>
-                <span>{{ $t('Show Total Amount In Transaction List Page') }}</span>
-                <f7-toggle :checked="showTotalAmountInTransactionListPage" @toggle:change="showTotalAmountInTransactionListPage = $event"></f7-toggle>
-            </f7-list-item>
 
             <f7-list-item :title="$t('Statistics Settings')" link="/statistic/settings"></f7-list-item>
 
             <f7-list-item>
-                <span>{{ $t('Enable Animate') }}</span>
+                <span>{{ $t('Enable Animation') }}</span>
                 <f7-toggle :checked="isEnableAnimate" @toggle:change="isEnableAnimate = $event"></f7-toggle>
             </f7-list-item>
 
@@ -172,14 +159,6 @@ export default {
         isEnableApplicationLock() {
             return this.settingsStore.appSettings.applicationLock;
         },
-        isAutoGetCurrentGeoLocation: {
-            get: function () {
-                return this.settingsStore.appSettings.autoGetCurrentGeoLocation;
-            },
-            set: function (value) {
-                this.settingsStore.setAutoGetCurrentGeoLocation(value);
-            }
-        },
         isEnableThousandsSeparator: {
             get: function () {
                 return this.settingsStore.appSettings.thousandsSeparator;
@@ -196,14 +175,6 @@ export default {
                 this.settingsStore.setCurrencyDisplayMode(value);
             }
         },
-        showAmountInHomePage: {
-            get: function () {
-                return this.settingsStore.appSettings.showAmountInHomePage;
-            },
-            set: function (value) {
-                this.settingsStore.setShowAmountInHomePage(value);
-            }
-        },
         showAccountBalance: {
             get: function () {
                 return this.settingsStore.appSettings.showAccountBalance;
@@ -212,14 +183,6 @@ export default {
                 this.settingsStore.setShowAccountBalance(value);
             }
         },
-        showTotalAmountInTransactionListPage: {
-            get: function () {
-                return this.settingsStore.appSettings.showTotalAmountInTransactionListPage;
-            },
-            set: function (value) {
-                this.settingsStore.setShowTotalAmountInTransactionListPage(value);
-            }
-        },
         isEnableAnimate: {
             get: function () {
                 return this.settingsStore.appSettings.animate;

src/views/mobile/settings/PageSettingsPage.vue

@@ -0,0 +1,64 @@
+<template>
+    <f7-page>
+        <f7-navbar :title="$t('Page Settings')" :back-link="$t('Back')"></f7-navbar>
+
+        <f7-block-title class="margin-top">{{ $t('Overview Page') }}</f7-block-title>
+        <f7-list strong inset dividers>
+            <f7-list-item>
+                <span>{{ $t('Show Amount') }}</span>
+                <f7-toggle :checked="showAmountInHomePage" @toggle:change="showAmountInHomePage = $event"></f7-toggle>
+            </f7-list-item>
+        </f7-list>
+
+        <f7-block-title>{{ $t('Transaction List Page') }}</f7-block-title>
+        <f7-list strong inset dividers>
+            <f7-list-item>
+                <span>{{ $t('Show Monthly Total Amount') }}</span>
+                <f7-toggle :checked="showTotalAmountInTransactionListPage" @toggle:change="showTotalAmountInTransactionListPage = $event"></f7-toggle>
+            </f7-list-item>
+        </f7-list>
+
+        <f7-block-title>{{ $t('Transaction Edit Page') }}</f7-block-title>
+        <f7-list strong inset dividers>
+            <f7-list-item>
+                <span>{{ $t('Automatically Add Geolocation') }}</span>
+                <f7-toggle :checked="isAutoGetCurrentGeoLocation" @toggle:change="isAutoGetCurrentGeoLocation = $event"></f7-toggle>
+            </f7-list-item>
+        </f7-list>
+    </f7-page>
+</template>
+
+<script>
+import { mapStores } from 'pinia';
+import { useSettingsStore } from '@/stores/setting.js';
+
+export default {
+    computed: {
+        ...mapStores(useSettingsStore),
+        showAmountInHomePage: {
+            get: function () {
+                return this.settingsStore.appSettings.showAmountInHomePage;
+            },
+            set: function (value) {
+                this.settingsStore.setShowAmountInHomePage(value);
+            }
+        },
+        showTotalAmountInTransactionListPage: {
+            get: function () {
+                return this.settingsStore.appSettings.showTotalAmountInTransactionListPage;
+            },
+            set: function (value) {
+                this.settingsStore.setShowTotalAmountInTransactionListPage(value);
+            }
+        },
+        isAutoGetCurrentGeoLocation: {
+            get: function () {
+                return this.settingsStore.appSettings.autoGetCurrentGeoLocation;
+            },
+            set: function (value) {
+                this.settingsStore.setAutoGetCurrentGeoLocation(value);
+            }
+        }
+    }
+};
+</script>