allow users to set coordinate display type (#141)

This commit is contained in:
MaysWind
2025-05-27 01:01:55 +08:00
parent e338c7190d
commit 626d3895aa
36 changed files with 516 additions and 144 deletions
+4 -2
View File
@@ -338,7 +338,7 @@
>
<template #title>
<f7-block class="list-item-custom-title no-padding no-margin">
<span v-if="transaction.geoLocation">{{ `(${transaction.geoLocation.longitude}, ${transaction.geoLocation.latitude})` }}</span>
<span v-if="transaction.geoLocation">{{ `(${formatCoordinate(transaction.geoLocation, coordinateDisplayType)})` }}</span>
<span v-else-if="!transaction.geoLocation">{{ geoLocationStatusInfo }}</span>
</f7-block>
</template>
@@ -515,6 +515,7 @@ import {
getTimezoneOffset,
getTimezoneOffsetMinutes
} from '@/lib/datetime.ts';
import { formatCoordinate } from '@/lib/coordinate.ts';
import { generateRandomUUID } from '@/lib/misc.ts';
import { getTransactionPrimaryCategoryName, getTransactionSecondaryCategoryName } from '@/lib/category.ts';
import { setTransactionModelByTransaction } from '@/lib/transaction.ts';
@@ -554,8 +555,9 @@ const {
transaction,
currentTimezoneOffsetMinutes,
defaultCurrency,
firstDayOfWeek,
defaultAccountId,
firstDayOfWeek,
coordinateDisplayType,
allTimezones,
allVisibleAccounts,
allAccountsMap,
@@ -41,6 +41,10 @@
<f7-list-item class="list-item-with-header-and-title list-item-no-item-after" header="Decimal Separator" title="Dot (.)" link="#"></f7-list-item>
</f7-list>
<f7-list strong inset dividers class="margin-vertical skeleton-text" v-if="loading">
<f7-list-item class="list-item-with-header-and-title list-item-no-item-after" header="Geographic Location Format" title="Coordinate Format" link="#"></f7-list-item>
</f7-list>
<f7-list strong inset dividers class="margin-vertical skeleton-text" v-if="loading">
<f7-list-item class="list-item-with-header-and-title list-item-no-item-after" header="Expense Amount Color" title="Amount Color" link="#"></f7-list-item>
<f7-list-item class="list-item-with-header-and-title list-item-no-item-after" header="Income Amount Color" title="Amount Color" link="#"></f7-list-item>
@@ -365,6 +369,28 @@
</f7-list-item>
</f7-list>
<f7-list form strong inset dividers class="margin-vertical" v-if="!loading">
<f7-list-item
link="#"
class="list-item-with-header-and-title list-item-no-item-after"
:header="tt('Geographic Location Format')"
:title="findDisplayNameByType(allCoordinateDisplayTypes, newProfile.coordinateDisplayType)"
@click="showCoordinateDisplayTypePopup = true"
>
<list-item-selection-popup value-type="item"
key-field="type" value-field="type"
title-field="displayName"
:title="tt('Geographic Location Format')"
:enable-filter="true"
:filter-placeholder="tt('Geographic Location Format')"
:filter-no-items-text="tt('No results')"
:items="allCoordinateDisplayTypes"
v-model:show="showCoordinateDisplayTypePopup"
v-model="newProfile.coordinateDisplayType">
</list-item-selection-popup>
</f7-list-item>
</f7-list>
<f7-list form strong inset dividers class="margin-vertical" v-if="!loading">
<f7-list-item
link="#"
@@ -477,6 +503,7 @@ const {
allDigitGroupingSymbols,
allDigitGroupingTypes,
allCurrencyDisplayTypes,
allCoordinateDisplayTypes,
allExpenseAmountColorTypes,
allIncomeAmountColorTypes,
allTransactionEditScopeTypes,
@@ -514,6 +541,7 @@ const showCurrencyDisplayTypePopup = ref<boolean>(false);
const showDigitGroupingPopup = ref<boolean>(false);
const showDigitGroupingSymbolPopup = ref<boolean>(false);
const showDecimalSeparatorPopup = ref<boolean>(false);
const showCoordinateDisplayTypePopup = ref<boolean>(false);
const showExpenseAmountColorPopup = ref<boolean>(false);
const showIncomeAmountColorPopup = ref<boolean>(false);
const showMoreActionSheet = ref<boolean>(false);