MaysWind
123 lines
5.5 KiB
Vue
123 lines
5.5 KiB
Vue
<template>
|
|
<f7-page>
|
|
<f7-navbar :title="$t('Statistics Settings')" :back-link="$t('Back')"></f7-navbar>
|
|
|
|
<f7-list strong inset dividers class="margin-top">
|
|
<f7-list-item
|
|
: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>
|
|
</select>
|
|
</f7-list-item>
|
|
|
|
<f7-list-item
|
|
:title="$t('Default Chart Data Type')"
|
|
smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Chart Data Type'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
|
|
<select v-model="defaultChartDataType">
|
|
<option :value="chartDataType.type"
|
|
:key="chartDataType.type"
|
|
v-for="chartDataType in allChartDataTypes">{{ $t(chartDataType.name) }}</option>
|
|
</select>
|
|
</f7-list-item>
|
|
|
|
<f7-list-item
|
|
:title="$t('Default Date Range')"
|
|
smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Date Range'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
|
|
<select v-model="defaultDateRange">
|
|
<option :value="dateRange.type"
|
|
:key="dateRange.type"
|
|
v-for="dateRange in allDateRanges">{{ $t(dateRange.name) }}</option>
|
|
</select>
|
|
</f7-list-item>
|
|
|
|
<f7-list-item :title="$t('Default Account Filter')" link="/statistic/filter/account?modifyDefault=1"></f7-list-item>
|
|
|
|
<f7-list-item :title="$t('Default Transaction Category Filter')" link="/statistic/filter/category?modifyDefault=1"></f7-list-item>
|
|
|
|
<f7-list-item
|
|
:title="$t('Default Sort By')"
|
|
smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Sort By'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
|
|
<select v-model="defaultSortingType">
|
|
<option :value="sortingType.type"
|
|
:key="sortingType.type"
|
|
v-for="sortingType in allSortingTypes">{{ $t(sortingType.name) }}</option>
|
|
</select>
|
|
</f7-list-item>
|
|
</f7-list>
|
|
</f7-page>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapStores } from 'pinia';
|
|
import { useSettingsStore } from '@/stores/setting.js';
|
|
|
|
import datetimeConstants from '@/consts/datetime.js';
|
|
import statisticsConstants from '@/consts/statistics.js';
|
|
|
|
export default {
|
|
computed: {
|
|
...mapStores(useSettingsStore),
|
|
allChartTypes() {
|
|
return statisticsConstants.allChartTypes;
|
|
},
|
|
allChartDataTypes() {
|
|
return statisticsConstants.allChartDataTypes;
|
|
},
|
|
allSortingTypes() {
|
|
return statisticsConstants.allSortingTypes;
|
|
},
|
|
allDateRanges() {
|
|
const allDateRanges = [];
|
|
|
|
for (let dateRangeField in datetimeConstants.allDateRanges) {
|
|
if (!Object.prototype.hasOwnProperty.call(datetimeConstants.allDateRanges, dateRangeField)) {
|
|
continue;
|
|
}
|
|
|
|
const dateRangeType = datetimeConstants.allDateRanges[dateRangeField];
|
|
|
|
if (dateRangeType.type !== datetimeConstants.allDateRanges.Custom.type) {
|
|
allDateRanges.push(dateRangeType);
|
|
}
|
|
}
|
|
|
|
return allDateRanges;
|
|
},
|
|
defaultChartType: {
|
|
get: function () {
|
|
return this.settingsStore.appSettings.statistics.defaultChartType;
|
|
},
|
|
set: function (value) {
|
|
this.settingsStore.setStatisticsDefaultChartType(value);
|
|
}
|
|
},
|
|
defaultChartDataType: {
|
|
get: function () {
|
|
return this.settingsStore.appSettings.statistics.defaultChartDataType;
|
|
},
|
|
set: function (value) {
|
|
this.settingsStore.setStatisticsDefaultChartDataType(value);
|
|
}
|
|
},
|
|
defaultDateRange: {
|
|
get: function () {
|
|
return this.settingsStore.appSettings.statistics.defaultDataRangeType;
|
|
},
|
|
set: function (value) {
|
|
this.settingsStore.setStatisticsDefaultDateRange(value);
|
|
}
|
|
},
|
|
defaultSortingType: {
|
|
get: function () {
|
|
return this.settingsStore.appSettings.statistics.defaultSortingType;
|
|
},
|
|
set: function (value) {
|
|
this.settingsStore.setStatisticsSortingType(value);
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|