zhengchen.tao/ezbookkeeping
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

code refactor

Browse Source
This commit is contained in:
MaysWind
2024-05-26 19:42:30 +08:00
parent 0884af038d
commit a917d16c26
8 changed files with 111 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/consts/statistics.js
+16 -4
View File
@@ -1,11 +1,22 @@
import datetime from './datetime.js';
const allChartTypes = {
const allCategoricalChartTypes = {
Pie: 0,
Bar: 1
};
const defaultChartType = allChartTypes.Pie;
const allCategoricalChartTypesArray = [
{
name: 'Pie Chart',
type: allCategoricalChartTypes.Pie
},
{
name: 'Bar Chart',
type: allCategoricalChartTypes.Bar
}
];
const defaultCategoricalChartType = allCategoricalChartTypes.Pie;
const allChartDataTypes = {
ExpenseByAccount: {
@@ -71,8 +82,9 @@ const allSortingTypesArray = [
const defaultSortingType = allSortingTypes.Amount.type;
export default {
allChartTypes: allChartTypes,
defaultChartType: defaultChartType,
allCategoricalChartTypes: allCategoricalChartTypes,
allCategoricalChartTypesArray: allCategoricalChartTypesArray,
defaultCategoricalChartType: defaultCategoricalChartType,
allChartDataTypes: allChartDataTypes,
defaultChartDataType: defaultChartDataType,
defaultDataRangeType: datetime.allDateRanges.ThisMonth.type,
src/lib/i18n.js
+16
View File
@@ -808,6 +808,21 @@ function getAllAccountTypes(translateFn) {
return allAccountTypes;
}
function getAllCategoricalChartTypes(translateFn) {
const allChartTypes = [];
for (let i = 0; i < statistics.allCategoricalChartTypesArray.length; i++) {
const chartType = statistics.allCategoricalChartTypesArray[i];
allChartTypes.push({
type: chartType.type,
displayName: translateFn(chartType.name)
});
}
return allChartTypes;
}
function getAllStatisticsChartDataTypes(translateFn) {
const allChartDataTypes = [];
@@ -1351,6 +1366,7 @@ export function i18nFunctions(i18nGlobal) {
getAllTimezoneTypesUsedForStatistics: (currentTimezone) => getAllTimezoneTypesUsedForStatistics(currentTimezone, i18nGlobal.t),
getAllAccountCategories: () => getAllAccountCategories(i18nGlobal.t),
getAllAccountTypes: () => getAllAccountTypes(i18nGlobal.t),
getAllCategoricalChartTypes: () => getAllCategoricalChartTypes(i18nGlobal.t),
getAllStatisticsChartDataTypes: () => getAllStatisticsChartDataTypes(i18nGlobal.t),
getAllStatisticsSortingTypes: () => getAllStatisticsSortingTypes(i18nGlobal.t),
getAllTransactionEditScopeTypes: () => getAllTransactionEditScopeTypes(i18nGlobal.t),
src/lib/settings.js
+1 -1
View File
@@ -21,7 +21,7 @@ const defaultSettings = {
showTotalAmountInTransactionListPage: true,
showAccountBalance: true,
statistics: {
defaultChartType: statisticsConstants.defaultChartType,
defaultChartType: statisticsConstants.defaultCategoricalChartType,
defaultChartDataType: statisticsConstants.defaultChartDataType,
defaultDataRangeType: statisticsConstants.defaultDataRangeType,
defaultTimezoneType: timezoneConstants.defaultTimezoneTypesUsedForStatistics,
src/stores/statistics.js
+21 -21
View File
@@ -28,16 +28,16 @@ export const useStatisticsStore = defineStore('statistics', {
dateType: statisticsConstants.defaultDataRangeType,
startTime: 0,
endTime: 0,
chartType: statisticsConstants.defaultChartType,
chartType: statisticsConstants.defaultCategoricalChartType,
chartDataType: statisticsConstants.defaultChartDataType,
filterAccountIds: {},
filterCategoryIds: {}
},
transactionStatisticsData: {},
transactionCategoryStatisticsData: {},
transactionStatisticsStateInvalid: true
}),
getters: {
transactionStatisticsChartDataCategory(state) {
categoricalAnalysisChartDataCategory(state) {
if (state.transactionStatisticsFilter.chartDataType === statisticsConstants.allChartDataTypes.ExpenseByAccount.type ||
state.transactionStatisticsFilter.chartDataType === statisticsConstants.allChartDataTypes.IncomeByAccount.type ||
state.transactionStatisticsFilter.chartDataType === statisticsConstants.allChartDataTypes.AccountTotalAssets.type ||
@@ -52,8 +52,8 @@ export const useStatisticsStore = defineStore('statistics', {
return '';
}
},
transactionStatistics(state) {
const statistics = state.transactionStatisticsData;
transactionCategoryStatisticsDataWithCategoryAndAccountInfo(state) {
const statistics = state.transactionCategoryStatisticsData;
const finalStatistics = {
startTime: statistics.startTime,
endTime: statistics.endTime,
@@ -114,8 +114,8 @@ export const useStatisticsStore = defineStore('statistics', {
return finalStatistics;
},
statisticsItemsByTransactionStatisticsData(state) {
if (!state.transactionStatistics || !state.transactionStatistics.items) {
transactionCategoryTotalAmountAnalysisData(state) {
if (!state.transactionCategoryStatisticsDataWithCategoryAndAccountInfo || !state.transactionCategoryStatisticsDataWithCategoryAndAccountInfo.items) {
return null;
}
@@ -123,8 +123,8 @@ export const useStatisticsStore = defineStore('statistics', {
let totalAmount = 0;
let totalNonNegativeAmount = 0;
for (let i = 0; i < state.transactionStatistics.items.length; i++) {
const item = state.transactionStatistics.items[i];
for (let i = 0; i < state.transactionCategoryStatisticsDataWithCategoryAndAccountInfo.items.length; i++) {
const item = state.transactionCategoryStatisticsDataWithCategoryAndAccountInfo.items[i];
if (!item.primaryAccount || !item.account || !item.primaryCategory || !item.category) {
continue;
@@ -247,7 +247,7 @@ export const useStatisticsStore = defineStore('statistics', {
items: allDataItems
}
},
statisticsItemsByAccountsData(state) {
accountTotalAmountAnalysisData(state) {
const userStore = useUserStore();
const accountsStore = useAccountsStore();
const exchangeRatesStore = useExchangeRatesStore();
@@ -323,7 +323,7 @@ export const useStatisticsStore = defineStore('statistics', {
items: allDataItems
}
},
statisticsData(state) {
categoricalAnalysisData(state) {
let combinedData = {
items: [],
totalAmount: 0
@@ -335,10 +335,10 @@ export const useStatisticsStore = defineStore('statistics', {
state.transactionStatisticsFilter.chartDataType === statisticsConstants.allChartDataTypes.IncomeByAccount.type ||
state.transactionStatisticsFilter.chartDataType === statisticsConstants.allChartDataTypes.IncomeByPrimaryCategory.type ||
state.transactionStatisticsFilter.chartDataType === statisticsConstants.allChartDataTypes.IncomeBySecondaryCategory.type) {
combinedData = state.statisticsItemsByTransactionStatisticsData;
combinedData = state.transactionCategoryTotalAmountAnalysisData;
} else if (state.transactionStatisticsFilter.chartDataType === statisticsConstants.allChartDataTypes.AccountTotalAssets.type ||
state.transactionStatisticsFilter.chartDataType === statisticsConstants.allChartDataTypes.AccountTotalLiabilities.type) {
combinedData = state.statisticsItemsByAccountsData;
combinedData = state.accountTotalAmountAnalysisData;
}
const allStatisticsItems = [];
@@ -410,11 +410,11 @@ export const useStatisticsStore = defineStore('statistics', {
this.transactionStatisticsFilter.dateType = statisticsConstants.defaultDataRangeType;
this.transactionStatisticsFilter.startTime = 0;
this.transactionStatisticsFilter.endTime = 0;
this.transactionStatisticsFilter.chartType = statisticsConstants.defaultChartType;
this.transactionStatisticsFilter.chartType = statisticsConstants.defaultCategoricalChartType;
this.transactionStatisticsFilter.chartDataType = statisticsConstants.defaultChartDataType;
this.transactionStatisticsFilter.filterAccountIds = {};
this.transactionStatisticsFilter.filterCategoryIds = {};
this.transactionStatisticsData = {};
this.transactionCategoryStatisticsData = {};
this.transactionStatisticsStateInvalid = true;
},
initTransactionStatisticsFilter(filter) {
@@ -424,8 +424,8 @@ export const useStatisticsStore = defineStore('statistics', {
let defaultChartType = settingsStore.appSettings.statistics.defaultChartType;
if (defaultChartType !== statisticsConstants.allChartTypes.Pie && defaultChartType !== statisticsConstants.allChartTypes.Bar) {
defaultChartType = statisticsConstants.defaultChartType;
if (defaultChartType !== statisticsConstants.allCategoricalChartTypes.Pie && defaultChartType !== statisticsConstants.allCategoricalChartTypes.Bar) {
defaultChartType = statisticsConstants.defaultCategoricalChartType;
}
let defaultChartDataType = settingsStore.appSettings.statistics.defaultChartDataType;
@@ -481,7 +481,7 @@ export const useStatisticsStore = defineStore('statistics', {
if (filter && isNumber(filter.chartType)) {
this.transactionStatisticsFilter.chartType = filter.chartType;
} else {
this.transactionStatisticsFilter.chartType = statisticsConstants.defaultChartType;
this.transactionStatisticsFilter.chartType = statisticsConstants.defaultCategoricalChartType;
}
if (filter && isNumber(filter.chartDataType)) {
@@ -578,7 +578,7 @@ export const useStatisticsStore = defineStore('statistics', {
return querys.join('&');
},
loadTransactionStatistics({ force }) {
loadCategoricalAnalysis({ force }) {
const self = this;
const settingsStore = useSettingsStore();
@@ -599,12 +599,12 @@ export const useStatisticsStore = defineStore('statistics', {
self.updateTransactionStatisticsInvalidState(false);
}
if (force && data.result && isEquals(self.transactionStatisticsData, data.result)) {
if (force && data.result && isEquals(self.transactionCategoryStatisticsData, data.result)) {
reject({ message: 'Data is up to date' });
return;
}
self.transactionStatisticsData = data.result;
self.transactionCategoryStatisticsData = data.result;
resolve(data.result);
}).catch(error => {
src/views/desktop/app/settings/tabs/AppStatisticsSettingTab.vue
+3 -6
View File
@@ -12,10 +12,7 @@
persistent-placeholder
:label="$t('Default Chart Type')"
:placeholder="$t('Default Chart Type')"
:items="[
{ type: allChartTypes.Pie, displayName: $t('Pie Chart') },
{ type: allChartTypes.Bar, displayName: $t('Bar Chart') }
]"
:items="allCategoricalChartTypes"
v-model="defaultChartType"
/>
</v-col>
@@ -99,8 +96,8 @@ export default {
},
computed: {
...mapStores(useSettingsStore),
allChartTypes() {
return statisticsConstants.allChartTypes;
allCategoricalChartTypes() {
return this.$locale.getAllCategoricalChartTypes();
},
allChartDataTypes() {
return this.$locale.getAllStatisticsChartDataTypes();
src/views/desktop/statistics/TransactionPage.vue
+24 -49
View File
@@ -13,42 +13,26 @@
<div class="mx-6 mt-4" v-if="activeTab === 'categoricalAnalysis'">
<span class="text-subtitle-2">{{ $t('Chart Type') }}</span>
<v-select
item-title="name"
item-title="displayName"
item-value="type"
class="mt-2"
density="compact"
:disabled="loading"
:items="allChartTypesArray"
:items="allChartTypes"
v-model="queryChartType"
>
<template #selection="{ item }">
<span class="cursor-pointer">{{ $t(item.title) }}</span>
</template>
<template #item="{ props, item }">
<v-list-item v-bind="props" :title="$t(item.title)"></v-list-item>
</template>
</v-select>
/>
</div>
<div class="mx-6 mt-4" v-if="activeTab === 'categoricalAnalysis'">
<span class="text-subtitle-2">{{ $t('Sort Order') }}</span>
<v-select
item-title="name"
item-title="displayName"
item-value="type"
class="mt-2"
density="compact"
:disabled="loading"
:items="allSortingTypesArray"
v-model="querySortingType"
>
<template #selection="{ item }">
<span class="cursor-pointer">{{ $t(item.title) }}</span>
</template>
<template #item="{ props, item }">
<v-list-item v-bind="props" :title="$t(item.title)"></v-list-item>
</template>
</v-select>
/>
</div>
<v-tabs show-arrows class="my-4" direction="vertical"
:disabled="loading" v-model="query.chartDataType"
@@ -134,12 +118,12 @@
</template>
<v-card-text class="statistics-overview-title pt-0" :class="{ 'disabled': loading }"
v-if="initing || (statisticsData && statisticsData.items && statisticsData.items.length)">
v-if="initing || (categoricalAnalysisData && categoricalAnalysisData.items && categoricalAnalysisData.items.length)">
<span class="statistics-subtitle">{{ totalAmountName }}</span>
<span class="statistics-overview-amount ml-3"
:class="statisticsTextColor"
v-if="!initing && statisticsData && statisticsData.items && statisticsData.items.length">
{{ getDisplayAmount(statisticsData.totalAmount, defaultCurrency) }}
v-if="!initing && categoricalAnalysisData && categoricalAnalysisData.items && categoricalAnalysisData.items.length">
{{ getDisplayAmount(categoricalAnalysisData.totalAmount, defaultCurrency) }}
</span>
<v-skeleton-loader class="skeleton-no-margin ml-3 mb-2"
width="120px" type="text" :loading="true"
@@ -147,11 +131,11 @@
</v-card-text>
<v-card-text class="statistics-overview-title pt-0"
v-else-if="!initing && (!statisticsData || !statisticsData.items || !statisticsData.items.length)">
v-else-if="!initing && (!categoricalAnalysisData || !categoricalAnalysisData.items || !categoricalAnalysisData.items.length)">
<span class="statistics-subtitle statistics-overview-empty-tip">{{ $t('No transaction data') }}</span>
</v-card-text>
<v-card-text :class="{ 'readonly': loading }" v-if="query.chartType === allChartTypes.Pie">
<v-card-text :class="{ 'readonly': loading }" v-if="query.chartType === allCategoricalChartTypes.Pie">
<pie-chart
:items="[
{id: '1', name: '---', value: 60, color: '7c7c7f'},
@@ -166,7 +150,7 @@
v-if="initing"
></pie-chart>
<pie-chart
:items="statisticsData && statisticsData.items && statisticsData.items.length ? statisticsData.items : []"
:items="categoricalAnalysisData && categoricalAnalysisData.items && categoricalAnalysisData.items.length ? categoricalAnalysisData.items : []"
:min-valid-percent="0.0001"
:show-value="showAmountInChart"
:enable-click-item="true"
@@ -182,7 +166,7 @@
/>
</v-card-text>
<v-card-text :class="{ 'readonly': loading }" v-if="query.chartType === allChartTypes.Bar">
<v-card-text :class="{ 'readonly': loading }" v-if="query.chartType === allCategoricalChartTypes.Bar">
<v-list rounded lines="two" v-if="initing">
<template :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]">
<v-list-item class="pl-0">
@@ -204,9 +188,9 @@
<v-divider v-if="itemIdx < 3"/>
</template>
</v-list>
<v-list class="py-0" rounded lines="two" v-else-if="!initing && statisticsData && statisticsData.items && statisticsData.items.length">
<v-list class="py-0" rounded lines="two" v-else-if="!initing && categoricalAnalysisData && categoricalAnalysisData.items && categoricalAnalysisData.items.length">
<template :key="idx"
v-for="(item, idx) in statisticsData.items">
v-for="(item, idx) in categoricalAnalysisData.items">
<v-list-item class="pl-0" v-if="!item.hidden">
<template #prepend>
<router-link class="statistics-list-item" :to="getItemLinkUrl(item)">
@@ -232,7 +216,7 @@
</div>
</router-link>
</v-list-item>
<v-divider v-if="!item.hidden && idx !== statisticsData.items.length - 1"/>
<v-divider v-if="!item.hidden && idx !== categoricalAnalysisData.items.length - 1"/>
</template>
</v-list>
</v-card-text>
@@ -348,7 +332,7 @@ export default {
return this.statisticsStore.transactionStatisticsFilter;
},
queryChartDataCategory() {
return this.statisticsStore.transactionStatisticsChartDataCategory;
return this.statisticsStore.categoricalAnalysisChartDataCategory;
},
queryChartType: {
get: function () {
@@ -373,19 +357,10 @@ export default {
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.endTime);
},
allChartTypes() {
return statisticsConstants.allChartTypes;
return this.$locale.getAllCategoricalChartTypes();
},
allChartTypesArray() {
return [
{
name: 'Pie Chart',
type: this.allChartTypes.Pie
},
{
name: 'Bar Chart',
type: this.allChartTypes.Bar
}
];
allCategoricalChartTypes() {
return statisticsConstants.allCategoricalChartTypes;
},
allChartDataTypes() {
return statisticsConstants.allChartDataTypes;
@@ -394,7 +369,7 @@ export default {
return statisticsConstants.allSortingTypes;
},
allSortingTypesArray() {
return statisticsConstants.allSortingTypesArray;
return this.$locale.getAllStatisticsSortingTypes();
},
allDateRanges() {
return datetimeConstants.allDateRanges;
@@ -419,8 +394,8 @@ export default {
return this.$t('Total Amount');
},
statisticsData() {
return this.statisticsStore.statisticsData;
categoricalAnalysisData() {
return this.statisticsStore.categoricalAnalysisData;
},
statisticsTextColor() {
if (this.query.chartDataType === this.allChartDataTypes.ExpenseByAccount.type ||
@@ -467,7 +442,7 @@ export default {
self.accountsStore.loadAllAccounts({ force: false }),
self.transactionCategoriesStore.loadAllCategories({ force: false })
]).then(() => {
return self.statisticsStore.loadTransactionStatistics({
return self.statisticsStore.loadCategoricalAnalysis({
force: false
});
}).then(() => {
@@ -504,7 +479,7 @@ export default {
self.query.chartDataType === self.allChartDataTypes.IncomeByAccount.type ||
self.query.chartDataType === self.allChartDataTypes.IncomeByPrimaryCategory.type ||
self.query.chartDataType === self.allChartDataTypes.IncomeBySecondaryCategory.type) {
dispatchPromise = self.statisticsStore.loadTransactionStatistics({
dispatchPromise = self.statisticsStore.loadCategoricalAnalysis({
force: force
});
} else if (self.query.chartDataType === self.allChartDataTypes.AccountTotalAssets.type ||
src/views/mobile/statistics/SettingsPage.vue
+5 -4
View File
@@ -7,8 +7,9 @@
:title="$t('Default Chart Type')"
smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Chart Type'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
<select v-model="defaultChartType">
<option :value="allChartTypes.Pie">{{ $t('Pie Chart') }}</option>
<option :value="allChartTypes.Bar">{{ $t('Bar Chart') }}</option>
<option :value="chartType.type"
:key="chartType.type"
v-for="chartType in allCategoricalChartTypes">{{ chartType.displayName }}</option>
</select>
</f7-list-item>
@@ -68,8 +69,8 @@ import statisticsConstants from '@/consts/statistics.js';
export default {
computed: {
...mapStores(useSettingsStore),
allChartTypes() {
return statisticsConstants.allChartTypes;
allCategoricalChartTypes() {
return this.$locale.getAllCategoricalChartTypes();
},
allChartDataTypes() {
return this.$locale.getAllStatisticsChartDataTypes();
src/views/mobile/statistics/TransactionPage.vue
+25 -24
View File
@@ -28,7 +28,7 @@
</f7-list>
</f7-popover>
<f7-card v-if="query.chartType === allChartTypes.Pie">
<f7-card v-if="query.chartType === allCategoricalChartTypes.Pie">
<f7-card-header class="no-border display-block">
<div class="statistics-chart-header full-line text-align-right">
<span style="margin-right: 4px;">{{ $t('Sort by') }}</span>
@@ -48,7 +48,7 @@
v-if="loading"
></pie-chart>
<pie-chart
:items="statisticsData.items"
:items="categoricalAnalysisData.items"
:min-valid-percent="0.0001"
:show-value="showAmountInChart"
:show-center-text="true"
@@ -64,20 +64,20 @@
v-else-if="!loading"
@click="clickPieChartItem"
>
<text class="statistics-pie-chart-total-amount-title" v-if="statisticsData.items && statisticsData.items.length">
<text class="statistics-pie-chart-total-amount-title" v-if="categoricalAnalysisData.items && categoricalAnalysisData.items.length">
{{ totalAmountName }}
</text>
<text class="statistics-pie-chart-total-amount-value" v-if="statisticsData.items && statisticsData.items.length">
{{ getDisplayAmount(statisticsData.totalAmount, defaultCurrency, 16) }}
<text class="statistics-pie-chart-total-amount-value" v-if="categoricalAnalysisData.items && categoricalAnalysisData.items.length">
{{ getDisplayAmount(categoricalAnalysisData.totalAmount, defaultCurrency, 16) }}
</text>
<text class="statistics-pie-chart-total-no-data" cy="50%" v-if="!statisticsData.items || !statisticsData.items.length">
<text class="statistics-pie-chart-total-no-data" cy="50%" v-if="!categoricalAnalysisData.items || !categoricalAnalysisData.items.length">
{{ $t('No data') }}
</text>
</pie-chart>
</f7-card-content>
</f7-card>
<f7-card v-else-if="query.chartType === allChartTypes.Bar">
<f7-card v-else-if="query.chartType === allCategoricalChartTypes.Bar">
<f7-card-header class="no-border display-block">
<div class="statistics-chart-header display-flex full-line justify-content-space-between">
<div>
@@ -90,10 +90,10 @@
</div>
<div class="display-flex full-line">
<div :class="{ 'statistics-list-item-overview-amount': true, 'text-color-teal': query.chartDataType === allChartDataTypes.ExpenseByAccount.type || query.chartDataType === allChartDataTypes.ExpenseByPrimaryCategory.type || query.chartDataType === allChartDataTypes.ExpenseBySecondaryCategory.type, 'text-color-red': query.chartDataType === allChartDataTypes.IncomeByAccount.type || query.chartDataType === allChartDataTypes.IncomeByPrimaryCategory.type || query.chartDataType === allChartDataTypes.IncomeBySecondaryCategory.type }">
<span v-if="!loading && statisticsData && statisticsData.items && statisticsData.items.length">
{{ getDisplayAmount(statisticsData.totalAmount, defaultCurrency) }}
<span v-if="!loading && categoricalAnalysisData && categoricalAnalysisData.items && categoricalAnalysisData.items.length">
{{ getDisplayAmount(categoricalAnalysisData.totalAmount, defaultCurrency) }}
</span>
<span :class="{ 'skeleton-text': loading }" v-else-if="loading || !statisticsData || !statisticsData.items || !statisticsData.items.length">
<span :class="{ 'skeleton-text': loading }" v-else-if="loading || !categoricalAnalysisData || !categoricalAnalysisData.items || !categoricalAnalysisData.items.length">
{{ loading ? '***.**' : '---' }}
</span>
</div>
@@ -128,15 +128,15 @@
</f7-list-item>
</f7-list>
<f7-list v-else-if="!loading && (!statisticsData || !statisticsData.items || !statisticsData.items.length)">
<f7-list v-else-if="!loading && (!categoricalAnalysisData || !categoricalAnalysisData.items || !categoricalAnalysisData.items.length)">
<f7-list-item :title="$t('No transaction data')"></f7-list-item>
</f7-list>
<f7-list v-else-if="!loading && statisticsData && statisticsData.items && statisticsData.items.length">
<f7-list v-else-if="!loading && categoricalAnalysisData && categoricalAnalysisData.items && categoricalAnalysisData.items.length">
<f7-list-item class="statistics-list-item"
:link="getItemLinkUrl(item)"
:key="idx"
v-for="(item, idx) in statisticsData.items"
v-for="(item, idx) in categoricalAnalysisData.items"
v-show="!item.hidden"
>
<template #media>
@@ -196,11 +196,9 @@
<f7-link :class="{ 'disabled': reloading || query.dateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type }" @click="shiftDateRange(query.startTime, query.endTime, 1)">
<f7-icon f7="arrow_right_square"></f7-icon>
</f7-link>
<f7-link class="tabbar-text-with-ellipsis" @click="setChartType(allChartTypes.Pie)">
<span :class="{ 'tabbar-item-changed': query.chartType === allChartTypes.Pie }">{{ $t('Pie Chart') }}</span>
</f7-link>
<f7-link class="tabbar-text-with-ellipsis" @click="setChartType(allChartTypes.Bar)">
<span :class="{ 'tabbar-item-changed': query.chartType === allChartTypes.Bar }">{{ $t('Bar Chart') }}</span>
<f7-link class="tabbar-text-with-ellipsis" :key="chartType.type"
v-for="chartType in allChartTypes" @click="setChartType(chartType.type)">
<span :class="{ 'tabbar-item-changed': query.chartType === chartType.type }">{{ chartType.displayName }}</span>
</f7-link>
</f7-toolbar>
@@ -295,7 +293,7 @@ export default {
return this.statisticsStore.transactionStatisticsFilter;
},
queryChartDataCategory() {
return this.statisticsStore.transactionStatisticsChartDataCategory;
return this.statisticsStore.categoricalAnalysisChartDataCategory;
},
queryChartDataTypeName() {
const queryChartDataTypeName = getNameByKeyValue(this.allChartDataTypes, this.query.chartDataType, 'type', 'name', 'Statistics');
@@ -312,7 +310,10 @@ export default {
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.endTime);
},
allChartTypes() {
return statisticsConstants.allChartTypes;
return this.$locale.getAllCategoricalChartTypes();
},
allCategoricalChartTypes() {
return statisticsConstants.allCategoricalChartTypes;
},
allChartDataTypes() {
return statisticsConstants.allChartDataTypes;
@@ -343,8 +344,8 @@ export default {
return this.$t('Total Amount');
},
statisticsData() {
return this.statisticsStore.statisticsData;
categoricalAnalysisData() {
return this.statisticsStore.categoricalAnalysisData;
},
showAmountInChart() {
if (!this.showAccountBalance
@@ -364,7 +365,7 @@ export default {
self.accountsStore.loadAllAccounts({ force: false }),
self.transactionCategoriesStore.loadAllCategories({ force: false })
]).then(() => {
return self.statisticsStore.loadTransactionStatistics({
return self.statisticsStore.loadCategoricalAnalysis({
force: false
});
}).then(() => {
@@ -399,7 +400,7 @@ export default {
self.query.chartDataType === self.allChartDataTypes.IncomeByAccount.type ||
self.query.chartDataType === self.allChartDataTypes.IncomeByPrimaryCategory.type ||
self.query.chartDataType === self.allChartDataTypes.IncomeBySecondaryCategory.type) {
dispatchPromise = self.statisticsStore.loadTransactionStatistics({
dispatchPromise = self.statisticsStore.loadCategoricalAnalysis({
force: force
});
} else if (self.query.chartDataType === self.allChartDataTypes.AccountTotalAssets.type ||