support custom quick save button styles on the mobile transaction edit page

This commit is contained in:
MaysWind
2026-03-17 00:16:37 +08:00
parent 5ee93a5db1
commit 9772d9ca62
27 changed files with 215 additions and 6 deletions
+7 -1
View File
@@ -1,7 +1,10 @@
import { type WeekDayValue, WeekDay } from './datetime.ts';
import { TimezoneTypeForStatistics } from './timezone.ts';
import { CurrencySortingType } from './currency.ts';
import { TransactionQuickAddButtonActionType } from './transaction.ts';
import {
TransactionQuickSaveButtonStyle,
TransactionQuickAddButtonActionType
} from './transaction.ts';
import {
CategoricalChartType,
TrendChartType,
@@ -44,6 +47,7 @@ export interface ApplicationSettings extends BaseApplicationSetting {
overviewAccountFilterInHomePage: Record<string, boolean>;
overviewTransactionCategoryFilterInHomePage: Record<string, boolean>;
// Transaction List Page
quickSaveButtonStyleInMobileTransactionListPage: number;
quickAddButtonActionInMobileTransactionEditPage: number;
itemsCountInTransactionListPage: number;
showTotalAmountInTransactionListPage: boolean;
@@ -125,6 +129,7 @@ export const ALL_ALLOWED_CLOUD_SYNC_APP_SETTING_KEY_TYPES: Record<string, UserAp
'showTotalAmountInTransactionListPage': UserApplicationCloudSettingType.Boolean,
'showTagInTransactionListPage': UserApplicationCloudSettingType.Boolean,
// Transaction Edit Page
'quickSaveButtonStyleInMobileTransactionListPage': UserApplicationCloudSettingType.Number,
'quickAddButtonActionInMobileTransactionEditPage': UserApplicationCloudSettingType.Number,
'autoSaveTransactionDraft': UserApplicationCloudSettingType.String,
'autoGetCurrentGeoLocation': UserApplicationCloudSettingType.Boolean,
@@ -184,6 +189,7 @@ export const DEFAULT_APPLICATION_SETTINGS: ApplicationSettings = {
showTotalAmountInTransactionListPage: true,
showTagInTransactionListPage: true,
// Transaction Edit Page
quickSaveButtonStyleInMobileTransactionListPage: TransactionQuickSaveButtonStyle.Default.type,
quickAddButtonActionInMobileTransactionEditPage: TransactionQuickAddButtonActionType.Default.type,
autoSaveTransactionDraft: 'disabled',
autoGetCurrentGeoLocation: false,
+32
View File
@@ -67,6 +67,38 @@ export class TransactionTagFilterType implements TypeAndName {
}
}
export class TransactionQuickSaveButtonStyle implements TypeAndName {
private static readonly allInstances: TransactionQuickSaveButtonStyle[] = [];
private static readonly allInstancesByType: Record<number, TransactionQuickSaveButtonStyle> = {};
public static readonly Disabled = new TransactionQuickSaveButtonStyle(0, 'Disabled');
public static readonly BottomFixed = new TransactionQuickSaveButtonStyle(1, 'Bottom Fixed');
public static readonly BottomLeftFloating = new TransactionQuickSaveButtonStyle(2, 'Bottom Left Floating');
public static readonly BottomCenterFloating = new TransactionQuickSaveButtonStyle(3, 'Bottom Center Floating');
public static readonly BottomRightFloating = new TransactionQuickSaveButtonStyle(4, 'Bottom Right Floating');
public static readonly Default = TransactionQuickSaveButtonStyle.BottomRightFloating;
public readonly type: number;
public readonly name: string;
private constructor(type: number, name: string) {
this.type = type;
this.name = name;
TransactionQuickSaveButtonStyle.allInstances.push(this);
TransactionQuickSaveButtonStyle.allInstancesByType[type] = this;
}
public static values(): TransactionQuickSaveButtonStyle[] {
return TransactionQuickSaveButtonStyle.allInstances;
}
public static valueOf(type: number): TransactionQuickSaveButtonStyle | undefined {
return TransactionQuickSaveButtonStyle.allInstancesByType[type];
}
}
export class TransactionQuickAddButtonActionType implements TypeAndName {
private static readonly allInstances: TransactionQuickAddButtonActionType[] = [];
private static readonly allInstancesByType: Record<number, TransactionQuickAddButtonActionType> = {};
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Monatlichen Gesamtbetrag anzeigen",
"Show Transaction Tags": "Transaktions-Tag anzeigen",
"Transaction Edit Page": "Transaktionsbearbeitungsseite",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Entwurf automatisch speichern",
"Always Show Confirmation": "Bestätigung jedes mal anzeigen",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Show Monthly Total Amount",
"Show Transaction Tags": "Show Transaction Tags",
"Transaction Edit Page": "Transaction Edit Page",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Automatically Save Draft",
"Always Show Confirmation": "Always Show Confirmation",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Mostrar Importe Total Mensual",
"Show Transaction Tags": "Mostrar Etiqueta de Transacción",
"Transaction Edit Page": "Página de Edición de Transacciones",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Guardar Borrador Automáticamente",
"Always Show Confirmation": "Mostrar Confirmación Cada Vez",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Afficher le montant total mensuel",
"Show Transaction Tags": "Afficher l'étiquette de transaction",
"Transaction Edit Page": "Page de modification de transaction",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Enregistrer automatiquement le brouillon",
"Always Show Confirmation": "Afficher la confirmation à chaque fois",
+2
View File
@@ -129,6 +129,7 @@ import {
import {
TransactionEditScopeType,
TransactionQuickSaveButtonStyle,
TransactionQuickAddButtonActionType
} from '@/core/transaction.ts';
@@ -2434,6 +2435,7 @@ export function useI18n() {
getAllStatisticsDateAggregationTypes: (analysisType: StatisticsAnalysisType) => getLocalizedChartDateAggregationTypeAndDisplayName(analysisType, true),
getAllStatisticsDateAggregationTypesWithShortName: (analysisType: StatisticsAnalysisType) => getLocalizedChartDateAggregationTypeAndDisplayName(analysisType, false),
getAllTransactionEditScopeTypes: () => getLocalizedDisplayNameAndType(TransactionEditScopeType.values()),
getAllTransactionQuickSaveButtonStyles: () => getLocalizedDisplayNameAndType(TransactionQuickSaveButtonStyle.values()),
getAllTransactionQuickAddButtonActionTypes: () => getLocalizedDisplayNameAndType(TransactionQuickAddButtonActionType.values()),
getAllTransactionScheduledFrequencyTypes: () => getLocalizedDisplayNameAndType(ScheduledTemplateFrequencyType.values()),
getAllImportTransactionColumnTypes: () => getLocalizedDisplayNameAndType(ImportTransactionColumnType.values()),
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Mostra importo totale mensile",
"Show Transaction Tags": "Mostra tag transazione",
"Transaction Edit Page": "Pagina modifica transazione",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Salva automaticamente bozza",
"Always Show Confirmation": "Mostra conferma ogni volta",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "毎月の合計金額を表示",
"Show Transaction Tags": "取引タグを表示",
"Transaction Edit Page": "取引編集ページ",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "下書きの自動保存",
"Always Show Confirmation": "確認を毎回表示",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "ಮಾಸಿಕ ಒಟ್ಟು ಮೊತ್ತ ತೋರಿಸಿ",
"Show Transaction Tags": "ವಹಿವಾಟು ಟ್ಯಾಗ್ ತೋರಿಸಿ",
"Transaction Edit Page": "ವಹಿವಾಟು ಸಂಪಾದನೆ ಪುಟ",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "ಕರಡು ಸ್ವಯಂ ಉಳಿಸಿ",
"Always Show Confirmation": "ಪ್ರತಿ ಬಾರಿ ದೃಢೀಕರಣ ತೋರಿಸಿ",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "월별 총 금액 표시",
"Show Transaction Tags": "거래 태그 표시",
"Transaction Edit Page": "거래 편집 페이지",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "초안 자동 저장",
"Always Show Confirmation": "매번 확인 표시",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Maandelijks totaalbedrag tonen",
"Show Transaction Tags": "Transactietag tonen",
"Transaction Edit Page": "Transactiebewerkingspagina",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Concept automatisch opslaan",
"Always Show Confirmation": "Elke keer bevestiging tonen",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Mostrar Valor Total Mensal",
"Show Transaction Tags": "Mostrar Tag da Transação",
"Transaction Edit Page": "Página de Edição de Transação",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Ação do Botão de Adição Rápida",
"Automatically Save Draft": "Salvar Rascunho Automaticamente",
"Always Show Confirmation": "Mostrar Confirmação Toda Vez",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Показать общую сумму за месяц",
"Show Transaction Tags": "Показать тег транзакции",
"Transaction Edit Page": "Страница редактирования транзакции",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Действие кнопки быстрого добавления",
"Automatically Save Draft": "Автоматически сохранять черновик",
"Always Show Confirmation": "Показывать подтверждение каждый раз",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Prikaži mesečni skupni znesek",
"Show Transaction Tags": "Prikaži oznako transakcije",
"Transaction Edit Page": "Stran za urejanje transakcij",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Samodejno shrani osnutek",
"Always Show Confirmation": "Vsakič prikaži potrditev",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "மாதாந்திர மொத்தம் தொகை காட்டு",
"Show Transaction Tags": "பரிவர்த்தனை குறிச்சொல் காட்டு",
"Transaction Edit Page": "பரிவர்த்தனை திருத்தம் பக்கம்",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "வரைவு தானியங்கி சேமி",
"Always Show Confirmation": "ஒவ்வொரு முறை அங்கீகாரம் காட்டு",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "แสดงจำนวนเงินรวมรายเดือน",
"Show Transaction Tags": "แสดงแท็กรายการ",
"Transaction Edit Page": "หน้าการแก้ไขรายการ",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "บันทึกร่างอัตโนมัติ",
"Always Show Confirmation": "แสดงการยืนยันทุกครั้ง",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Aylık Toplam Tutarı Göster",
"Show Transaction Tags": "İşlem Etiketini Göster",
"Transaction Edit Page": "İşlem Düzenleme Sayfası",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Taslağı Otomatik Kaydet",
"Always Show Confirmation": "Her Seferinde Onay Göster",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Показати місячну загальну суму",
"Show Transaction Tags": "Показати тег транзакції",
"Transaction Edit Page": "Сторінка редагування транзакції",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Автоматично зберігати чернетку",
"Always Show Confirmation": "Показувати підтвердження щоразу",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "Hiển thị tổng số tiền hàng tháng",
"Show Transaction Tags": "Hiển thị thẻ giao dịch",
"Transaction Edit Page": "Trang chỉnh sửa giao dịch",
"Quick Save Button Style": "Quick Save Button Style",
"Bottom Left Floating": "Bottom Left Floating",
"Bottom Center Floating": "Bottom Center Floating",
"Bottom Right Floating": "Bottom Right Floating",
"Bottom Fixed": "Bottom Fixed",
"Quick Add Button Action": "Quick Add Button Action",
"Automatically Save Draft": "Tự động lưu bản nháp",
"Always Show Confirmation": "Hiển thị xác nhận mỗi lần",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "显示月度总金额",
"Show Transaction Tags": "显示交易标签",
"Transaction Edit Page": "交易编辑页面",
"Quick Save Button Style": "快速保存按钮样式",
"Bottom Left Floating": "左下角悬浮",
"Bottom Center Floating": "底部居中悬浮",
"Bottom Right Floating": "右下角悬浮",
"Bottom Fixed": "底部固定",
"Quick Add Button Action": "快速添加按钮操作",
"Automatically Save Draft": "自动保存草稿",
"Always Show Confirmation": "每次提示确认",
+5
View File
@@ -2255,6 +2255,11 @@
"Show Monthly Total Amount": "顯示月度總金額",
"Show Transaction Tags": "顯示交易標籤",
"Transaction Edit Page": "交易編輯頁面",
"Quick Save Button Style": "快速儲存按鈕樣式",
"Bottom Left Floating": "左下角浮動",
"Bottom Center Floating": "底部中央浮動",
"Bottom Right Floating": "右下浮動",
"Bottom Fixed": "底部固定",
"Quick Add Button Action": "快速新增按鈕動作",
"Automatically Save Draft": "自動儲存草稿",
"Always Show Confirmation": "每次提示確認",
+7
View File
@@ -234,6 +234,12 @@ export const useSettingsStore = defineStore('settings', () => {
}
// Transaction Edit Page
function setQuickSaveButtonStyleInMobileTransactionListPage(value: number): void {
updateApplicationSettingsValue('quickSaveButtonStyleInMobileTransactionListPage', value);
appSettings.value.quickSaveButtonStyleInMobileTransactionListPage = value;
updateUserApplicationCloudSettingValue('quickSaveButtonStyleInMobileTransactionListPage', value);
}
function setQuickAddButtonActionInMobileTransactionEditPage(value: number): void {
updateApplicationSettingsValue('quickAddButtonActionInMobileTransactionEditPage', value);
appSettings.value.quickAddButtonActionInMobileTransactionEditPage = value;
@@ -537,6 +543,7 @@ export const useSettingsStore = defineStore('settings', () => {
setShowTotalAmountInTransactionListPage,
setShowTagInTransactionListPage,
// -- Transaction Edit Page
setQuickSaveButtonStyleInMobileTransactionListPage,
setQuickAddButtonActionInMobileTransactionEditPage,
setAutoSaveTransactionDraft,
setAutoGetCurrentGeoLocation,
@@ -53,6 +53,7 @@ export const ALL_APPLICATION_CLOUD_SETTINGS: CategorizedApplicationCloudSettingI
{
categoryName: 'Transaction Edit Page',
items: [
{ settingKey: 'quickSaveButtonStyleInMobileTransactionListPage', settingName: 'Quick Save Button Style', mobile: true, desktop: false },
{ settingKey: 'quickAddButtonActionInMobileTransactionEditPage', settingName: 'Quick Add Button Action', mobile: true, desktop: false },
{ settingKey: 'autoSaveTransactionDraft', settingName: 'Automatically Save Draft', mobile: true, desktop: true },
{ settingKey: 'autoGetCurrentGeoLocation', settingName: 'Automatically Add Geolocation', mobile: true, desktop: true },
+40 -1
View File
@@ -95,6 +95,33 @@
<f7-list-item
class="item-truncate-after-text"
link="#"
@click="showQuickSaveButtonStyleInMobileTransactionListPagePopup = true"
>
<template #after-title>
<div class="item-actual-title">
<span>{{ tt('Quick Save Button Style') }}</span>
</div>
</template>
<template #after>
{{ findDisplayNameByType(allTransactionQuickSaveButtonStyles, quickSaveButtonStyleInMobileTransactionListPage) }}
</template>
<list-item-selection-popup value-type="item"
key-field="type" value-field="type"
title-field="displayName"
:title="tt('Quick Save Button Style')"
:enable-filter="true"
:filter-placeholder="tt('Quick Save Button Style')"
:filter-no-items-text="tt('No results')"
:items="allTransactionQuickSaveButtonStyles"
v-model:show="showQuickSaveButtonStyleInMobileTransactionListPagePopup"
v-model="quickSaveButtonStyleInMobileTransactionListPage">
</list-item-selection-popup>
</f7-list-item>
<f7-list-item
class="item-truncate-after-text"
link="#"
:disabled="quickSaveButtonStyleInMobileTransactionListPage === TransactionQuickSaveButtonStyle.Disabled.type"
@click="showQuickAddButtonActionInMobileTransactionEditPagePopup = true"
>
<template #after-title>
@@ -237,10 +264,15 @@ import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
import type { TypeAndDisplayName } from '@/core/base.ts';
import { CategoryType } from '@/core/category.ts';
import { TransactionQuickSaveButtonStyle } from '@/core/transaction.ts';
import { findNameByValue, findDisplayNameByType } from '@/lib/common.ts';
const { tt, getAllTransactionQuickAddButtonActionTypes } = useI18n();
const {
tt,
getAllTransactionQuickSaveButtonStyles,
getAllTransactionQuickAddButtonActionTypes
} = useI18n();
const { showToast } = useI18nUIComponents();
const {
loadingAccounts,
@@ -269,12 +301,19 @@ const accountsStore = useAccountsStore();
const transactionCategoriesStore = useTransactionCategoriesStore();
const showTimezoneUsedForStatisticsInHomePagePopup = ref<boolean>(false);
const showQuickSaveButtonStyleInMobileTransactionListPagePopup = ref<boolean>(false);
const showQuickAddButtonActionInMobileTransactionEditPagePopup = ref<boolean>(false);
const showAutoSaveTransactionDraftPopup = ref<boolean>(false);
const showCurrencySortByInExchangeRatesPagePopup = ref<boolean>(false);
const allTransactionQuickSaveButtonStyles = computed<TypeAndDisplayName[]>(() => getAllTransactionQuickSaveButtonStyles());
const allTransactionQuickAddButtonActionTypes = computed<TypeAndDisplayName[]>(() => getAllTransactionQuickAddButtonActionTypes());
const quickSaveButtonStyleInMobileTransactionListPage = computed<number>({
get: () => settingsStore.appSettings.quickSaveButtonStyleInMobileTransactionListPage,
set: (value) => settingsStore.setQuickSaveButtonStyleInMobileTransactionListPage(value)
});
const quickAddButtonActionInMobileTransactionEditPage = computed<number>({
get: () => settingsStore.appSettings.quickAddButtonActionInMobileTransactionEditPage,
set: (value) => settingsStore.setQuickAddButtonActionInMobileTransactionEditPage(value)
+30 -4
View File
@@ -469,14 +469,20 @@
</f7-actions-group>
</f7-actions>
<template #fixed>
<f7-fab id="quick-save-fab" position="right-bottom" :class="{ 'disabled': inputIsEmpty || submitting }"
<template #fixed v-if="quickSaveButtonStyleType === TransactionQuickSaveButtonStyle.BottomLeftFloating.type || quickSaveButtonStyleType === TransactionQuickSaveButtonStyle.BottomCenterFloating.type || quickSaveButtonStyleType === TransactionQuickSaveButtonStyle.BottomRightFloating.type">
<f7-fab id="quick-save-button" :class="{ 'disabled': inputIsEmpty || submitting }" :position="quickSaveButtonFloatingPosition"
:text="tt(quickSaveButtonTitle)"
@click="quickSave" v-if="mode !== TransactionEditPageMode.View">
</f7-fab>
</template>
<f7-popover class="quick-save-popover" target-el="#quick-save-fab"
<f7-toolbar id="quick-save-button" tabbar bottom v-if="quickSaveButtonStyleType === TransactionQuickSaveButtonStyle.BottomFixed.type && mode !== TransactionEditPageMode.View">
<f7-link :class="{ 'disabled': inputIsEmpty || submitting }" @click="quickSave">
<span class="tabbar-primary-link">{{ tt(quickSaveButtonTitle) }}</span>
</f7-link>
</f7-toolbar>
<f7-popover class="quick-save-popover" target-el="#quick-save-button"
v-model:opened="showQuickSavePopover">
<f7-list>
<f7-list-item link="#" no-chevron popover-close
@@ -521,8 +527,14 @@ import { useTransactionsStore } from '@/stores/transaction.ts';
import { useTransactionTemplatesStore } from '@/stores/transactionTemplate.ts';
import { CategoryType } from '@/core/category.ts';
import { TransactionType, TransactionEditScopeType, TransactionQuickAddButtonActionType } from '@/core/transaction.ts';
import {
TransactionType,
TransactionEditScopeType,
TransactionQuickSaveButtonStyle,
TransactionQuickAddButtonActionType
} from '@/core/transaction.ts';
import { ScheduledTemplateFrequencyType, TemplateType } from '@/core/template.ts';
import { TRANSACTION_MAX_AMOUNT, TRANSACTION_MIN_AMOUNT } from '@/consts/transaction.ts';
import { KnownErrorCode } from '@/consts/api.ts';
import { SUPPORTED_IMAGE_EXTENSIONS } from '@/consts/file.ts';
@@ -650,6 +662,20 @@ const showTransactionPictures = ref<boolean>(pageTypeAndMode?.type === Transacti
&& (pageTypeAndMode?.mode === TransactionEditPageMode.Add || pageTypeAndMode?.mode === TransactionEditPageMode.Edit)
&& settingsStore.appSettings.alwaysShowTransactionPicturesInMobileTransactionEditPage);
const quickSaveButtonStyleType = computed<number>(() => settingsStore.appSettings.quickSaveButtonStyleInMobileTransactionListPage);
const quickSaveButtonFloatingPosition = computed<string>(() => {
switch (settingsStore.appSettings.quickSaveButtonStyleInMobileTransactionListPage) {
case TransactionQuickSaveButtonStyle.BottomLeftFloating.type:
return 'left-bottom';
case TransactionQuickSaveButtonStyle.BottomCenterFloating.type:
return 'center-bottom';
case TransactionQuickSaveButtonStyle.BottomRightFloating.type:
return 'right-bottom';
default:
return 'right-bottom';
}
});
const sourceAmountClass = computed<Record<string, boolean>>(() => {
const classes: Record<string, boolean> = {
'readonly': mode.value === TransactionEditPageMode.View,