show time difference between the transaction timezone and the default timezone on the transaction edit/view page

src/lib/datetime.js

@@ -149,6 +149,16 @@ export function getUnixTimeAfterUnixTime(unixTime, amount, unit) {
     return moment.unix(unixTime).add(amount, unit).unix();
 }
 
+export function getTimeDifferenceHoursAndMinutes(timeDifferenceInMinutes) {
+    let offsetHours = parseInt(Math.abs(timeDifferenceInMinutes) / 60);
+    let offsetMinutes = Math.abs(timeDifferenceInMinutes) - offsetHours * 60;
+
+    return {
+        offsetHours: offsetHours,
+        offsetMinutes: offsetMinutes,
+    };
+}
+
 export function getMinuteFirstUnixTime(date) {
     const datetime = moment(date);
     return datetime.set({ second: 0, millisecond: 0 }).unix();

src/locales/en.js

@@ -65,6 +65,12 @@ export default {
         },
         'currency': {
             'symbol': '{symbol} {amount}'
+        },
+        'misc': {
+            'hoursBehindDefaultTimezone': '{hours} hour(s) behind default timezone',
+            'hoursAheadOfDefaultTimezone': '{hours} hour(s) ahead of default timezone',
+            'hoursMinutesBehindDefaultTimezone': '{hours} hour(s) and {minutes} minutes behind default timezone',
+            'hoursMinutesAheadOfDefaultTimezone': '{hours} hour(s) and {minutes} minutes ahead of default timezone'
         }
     },
     'dataExport': {
@@ -878,6 +884,7 @@ export default {
     'Destination Account': 'Destination Account',
     'Transaction Time': 'Transaction Time',
     'Transaction Time Zone': 'Transaction Time Zone',
+    'Same time as default timezone': 'Same time as default timezone',
     'Geographic Location': 'Geographic Location',
     'No Location': 'No Location',
     'Getting Location...': 'Getting Location...',

src/locales/zh_Hans.js

@@ -65,6 +65,12 @@ export default {
         },
         'currency': {
             'symbol': '{symbol} {amount}'
+        },
+        'misc': {
+            'hoursBehindDefaultTimezone': '比默认时区晚{hours}小时',
+            'hoursAheadOfDefaultTimezone': '比默认时区早{hours}小时',
+            'hoursMinutesBehindDefaultTimezone': '比默认时区晚{hours}小时{minutes}分',
+            'hoursMinutesAheadOfDefaultTimezone': '比默认时区早{time}小时{minutes}分'
         }
     },
     'dataExport': {
@@ -878,6 +884,7 @@ export default {
     'Destination Account': '目标账户',
     'Transaction Time': '交易时间',
     'Transaction Time Zone': '交易时区',
+    'Same time as default timezone': '与默认时区时间相同',
     'Geographic Location': '地理位置',
     'No Location': '没有位置',
     'Getting Location...': '正在获取位置...',

src/views/mobile/transactions/EditPage.vue

@@ -233,6 +233,7 @@
                     <f7-block class="list-item-custom-title no-padding no-margin">
                         <span>{{ `(${transactionDisplayTimezone})` }}</span>
                         <span class="transaction-edit-timezone-name" v-if="transaction.timeZone || transaction.timeZone === ''">{{ transactionDisplayTimezoneName }}</span>
+                        <span class="transaction-edit-timezone-name" v-else-if="!transaction.timeZone && transaction.timeZone !== ''">{{ transactionTimezoneTimeDifference }}</span>
                     </f7-block>
                 </template>
             </f7-list-item>
@@ -347,6 +348,7 @@ import {
 } from '@/lib/common.js';
 import {
     getCurrentUnixTime,
+    getTimeDifferenceHoursAndMinutes,
     getTimezoneOffsetMinutes,
     getBrowserTimezoneOffsetMinutes,
     getUtcOffsetByUtcOffsetMinutes,
@@ -605,6 +607,36 @@ export default {
         transactionDisplayTimezoneName() {
             return getNameByKeyValue(this.allTimezones, this.transaction.timeZone, 'name', 'displayName');
         },
+        transactionTimezoneTimeDifference() {
+            const defaultTimezoneOffset = getTimezoneOffsetMinutes();
+            const offsetTime = getTimeDifferenceHoursAndMinutes(this.transaction.utcOffset - defaultTimezoneOffset);
+
+            if (this.transaction.utcOffset > defaultTimezoneOffset) {
+                if (offsetTime.offsetMinutes) {
+                    return this.$t('format.misc.hoursMinutesAheadOfDefaultTimezone', {
+                        hours: offsetTime.offsetHours,
+                        minutes: offsetTime.offsetMinutes
+                    });
+                } else {
+                    return this.$t('format.misc.hoursAheadOfDefaultTimezone', {
+                        hours: offsetTime.offsetHours
+                    });
+                }
+            } else if (this.transaction.utcOffset < defaultTimezoneOffset) {
+                if (offsetTime.offsetMinutes) {
+                    return this.$t('format.misc.hoursMinutesBehindDefaultTimezone', {
+                        hours: offsetTime.offsetHours,
+                        minutes: offsetTime.offsetMinutes
+                    });
+                } else {
+                    return this.$t('format.misc.hoursBehindDefaultTimezone', {
+                        hours: offsetTime.offsetHours
+                    });
+                }
+            } else {
+                return this.$t('Same time as default timezone');
+            }
+        },
         sourceAmountClass() {
             const classes = {
                 'readonly': this.mode === 'view',