support changing account category order

src/views/base/settings/AccountCategoryDisplayOrderSettingsPageBase.ts

@@ -0,0 +1,63 @@
+import { ref } from 'vue';
+
+import { AccountCategory } from '@/core/account.ts';
+
+import { useSettingsStore } from '@/stores/setting.ts';
+
+export function useAccountCategoryDisplayOrderSettingsPageBase() {
+    const settingsStore = useSettingsStore();
+
+    const accountCategories = ref<AccountCategory[]>(AccountCategory.values(settingsStore.appSettings.accountCategoryOrders));
+
+    function isDisplayOrderModified(): boolean {
+        const currentOrders = AccountCategory.values(settingsStore.appSettings.accountCategoryOrders);
+
+        if (currentOrders.length !== accountCategories.value.length) {
+            return true;
+        }
+
+        for (let i = 0; i < currentOrders.length; i++) {
+            const accountCategory = accountCategories.value[i];
+            const currentCategory = currentOrders[i];
+
+            if (!accountCategory || !currentCategory) {
+                return true;
+            }
+
+            if (accountCategory.type !== currentCategory.type) {
+                return true;
+            }
+        }
+
+        return false;
+    }
+
+    function loadDisplayOrderFromSettings(): void {
+        accountCategories.value = AccountCategory.values(settingsStore.appSettings.accountCategoryOrders);
+    }
+
+    function saveDisplayOrderToSettings(): void {
+        const displayOrders = accountCategories.value.map(category => category.type).join(',');
+        const defaultOrders = AccountCategory.values('').map(category => category.type).join(',');
+
+        if (displayOrders === defaultOrders) {
+            settingsStore.setAccountCategoryOrders('');
+        } else {
+            settingsStore.setAccountCategoryOrders(displayOrders);
+        }
+    }
+
+    function resetDisplayOrderToDefault(): void {
+        accountCategories.value = AccountCategory.values('');
+    }
+
+    return {
+        // states
+        accountCategories,
+        // functions
+        isDisplayOrderModified,
+        loadDisplayOrderFromSettings,
+        saveDisplayOrderToSettings,
+        resetDisplayOrderToDefault
+    };
+}

src/views/base/settings/AccountFilterSettingPageBase.ts

@@ -7,7 +7,7 @@ import { useStatisticsStore } from '@/stores/statistics.ts';
 import { useOverviewStore } from '@/stores/overview.ts';
 
 import { keys, keysIfValueEquals, values } from '@/core/base.ts';
-import type {Account, CategorizedAccount} from '@/models/account.ts';
+import type { Account, CategorizedAccount } from '@/models/account.ts';
 
 import {
     filterCategorizedAccounts,
@@ -49,11 +49,12 @@ export function useAccountFilterSettingPageBase(type?: AccountFilterType, select
         return type === 'statisticsDefault' || type === 'statisticsCurrent' || type === 'homePageOverview' || type === 'transactionListCurrent' || type === 'custom';
     });
 
-    const allCategorizedAccounts = computed<Record<number, CategorizedAccount>>(() => filterCategorizedAccounts(accountsStore.allCategorizedAccountsMap, filterContent.value, showHidden.value));
+    const customAccountCategoryOrder = computed<string>(() => settingsStore.appSettings.accountCategoryOrders);
+    const allCategorizedAccounts = computed<CategorizedAccount[]>(() => filterCategorizedAccounts(accountsStore.allCategorizedAccountsMap, customAccountCategoryOrder.value, filterContent.value, showHidden.value));
     const allVisibleAccountMap = computed<Record<string, Account>>(() => {
         const accountMap: Record<string, Account> = {};
 
-        for (const accountCategory of values(allCategorizedAccounts.value)) {
+        for (const accountCategory of allCategorizedAccounts.value) {
             for (const account of accountCategory.accounts) {
                 accountMap[account.id] = account;
 
@@ -69,7 +70,7 @@ export function useAccountFilterSettingPageBase(type?: AccountFilterType, select
     });
     const hasAnyAvailableAccount = computed<boolean>(() => accountsStore.allAvailableAccountsCount > 0);
     const hasAnyVisibleAccount = computed<boolean>(() => {
-        for (const accountCategory of values(allCategorizedAccounts.value)) {
+        for (const accountCategory of allCategorizedAccounts.value) {
             if (accountCategory.accounts.length > 0) {
                 return true;
             }
@@ -204,6 +205,7 @@ export function useAccountFilterSettingPageBase(type?: AccountFilterType, select
         title,
         applyText,
         allowHiddenAccount,
+        customAccountCategoryOrder,
         allCategorizedAccounts,
         allVisibleAccountMap,
         hasAnyAvailableAccount,

src/views/base/settings/AppCloudSyncPageBase.ts

@@ -61,6 +61,7 @@ export const ALL_APPLICATION_CLOUD_SETTINGS: CategorizedApplicationCloudSettingI
         categoryName: 'Account List Page',
         items: [
             { settingKey: 'totalAmountExcludeAccountIds', settingName: 'Accounts Included in Total', mobile: true, desktop: true },
+            { settingKey: 'accountCategoryOrders', settingName: 'Account Category Order', mobile: true, desktop: true },
             { settingKey: 'hideCategoriesWithoutAccounts', settingName: 'Hide Categories Without Accounts', mobile: false, desktop: true }
         ]
     },

src/views/base/settings/AppSettingsPageBase.ts

@@ -134,6 +134,14 @@ export function useAppSettingPageBase() {
         return getIncludedAccountsDisplayContent(excludeAccountIds, accountsStore.allVisiblePlainAccounts);
     });
 
+    const accountCategorysDisplayOrderContent = computed<string>(() => {
+        if (!settingsStore.appSettings.accountCategoryOrders) {
+            return tt('Default');
+        }
+
+        return tt('Custom');
+    });
+
     const transactionCategoriesIncludedInHomePageOverviewDisplayContent = computed<string>(() => {
         const excludeAccountIds = settingsStore.appSettings.overviewTransactionCategoryFilterInHomePage;
         return getIncludedTransactionCategoriesDisplayContent(excludeAccountIds);
@@ -237,6 +245,7 @@ export function useAppSettingPageBase() {
         currencySortByInExchangeRatesPage,
         accountsIncludedInHomePageOverviewDisplayContent,
         accountsIncludedInTotalDisplayContent,
+        accountCategorysDisplayOrderContent,
         transactionCategoriesIncludedInHomePageOverviewDisplayContent
     };
 }