mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-15 23:47:33 +08:00
code refactor
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
import { ref, computed } from 'vue';
|
||||
|
||||
import { type TimeRangeAndDateType, type PresetDateRange, type UnixTimeRange, DateRange } from '@/core/datetime.ts';
|
||||
import { type TimeRangeAndDateType, type PresetDateRange, type UnixTimeRange, type WeekDayValue, DateRange } from '@/core/datetime.ts';
|
||||
import { arrangeArrayWithNewStartIndex } from '@/lib/common.ts';
|
||||
import {
|
||||
getCurrentUnixTime,
|
||||
@@ -60,7 +60,7 @@ export function useDateRangeSelectionBase(props: CommonDateRangeSelectionProps)
|
||||
getLocalDatetimeFromUnixTime(getDummyUnixTimeForLocalUsage(maxDate, getTimezoneOffsetMinutes(), getBrowserTimezoneOffsetMinutes()))
|
||||
]);
|
||||
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const dayNames = computed<string[]>(() => arrangeArrayWithNewStartIndex(getAllMinWeekdayNames(), firstDayOfWeek.value));
|
||||
const isYearFirst = computed<boolean>(() => isLongDateMonthAfterYear());
|
||||
const is24Hour = computed<boolean>(() => isLongTime24HourFormat());
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { ref, computed } from 'vue';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
import { FiscalYearStart } from '@/core/fiscalyear.ts';
|
||||
import { arrangeArrayWithNewStartIndex } from '@/lib/common.ts';
|
||||
|
||||
@@ -78,7 +79,7 @@ export function useFiscalYearStartSelectionBase(props: CommonFiscalYearStartSele
|
||||
return formatMonthDayToLongDay(fiscalYearStart.toMonthDashDayString());
|
||||
});
|
||||
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const dayNames = computed<string[]>(() => arrangeArrayWithNewStartIndex(getAllMinWeekdayNames(), firstDayOfWeek.value));
|
||||
|
||||
return {
|
||||
|
||||
@@ -41,8 +41,8 @@ const zoomLevel = ref<number>(1);
|
||||
const mapSupported = computed<boolean>(() => !!mapInstance.value);
|
||||
const mapDependencyLoaded = computed<boolean>(() => mapInstance.value?.dependencyLoaded || false);
|
||||
|
||||
const finalMapStyle = computed<Record<string, unknown>>(() => {
|
||||
const styles: Record<string, unknown> = Object.assign({}, props.mapStyle);
|
||||
const finalMapStyle = computed<Record<string, string>>(() => {
|
||||
const styles: Record<string, string> = Object.assign({}, props.mapStyle);
|
||||
|
||||
if (props.height) {
|
||||
styles['height'] = props.height;
|
||||
|
||||
@@ -2,12 +2,12 @@
|
||||
<div class="pin-codes-input" :style="`grid-template-columns: repeat(${length}, minmax(0, 1fr))`">
|
||||
<div class="pin-code-input pin-code-input-outline"
|
||||
:class="{ 'pin-code-input-focued': codes[index].focused }" :key="index"
|
||||
v-for="(code, index) in codes">
|
||||
v-for="(_, index) in codes">
|
||||
<input ref="pin-code-input" min="0" maxlength="1" pattern="[0-9]*"
|
||||
:value="codes[index].value"
|
||||
:type="codes[index].inputType"
|
||||
:disabled="disabled ? 'disabled' : undefined"
|
||||
:autofocus="autofocus && index === 0 ? 'autofocus' : undefined"
|
||||
:disabled="disabled ? true : undefined"
|
||||
:autofocus="autofocus && index === 0 ? true : undefined"
|
||||
@focus="codes[index].focused = true"
|
||||
@blur="codes[index].focused = false"
|
||||
@keydown="onKeydown(index, $event)"
|
||||
|
||||
@@ -61,6 +61,7 @@ import { type CommonDateRangeSelectionProps, useDateRangeSelectionBase } from '@
|
||||
|
||||
import { useUserStore } from '@/stores/user.ts';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
import { ThemeType } from '@/core/theme.ts';
|
||||
|
||||
import {
|
||||
@@ -89,7 +90,7 @@ const { yearRange, dateRange, dayNames, isYearFirst, is24Hour, beginDateTime, en
|
||||
const userStore = useUserStore();
|
||||
|
||||
const isDarkMode = computed<boolean>(() => theme.global.name.value === ThemeType.Dark);
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const showState = computed<boolean>({
|
||||
get: () => props.show || false,
|
||||
set: (value) => emit('update:show', value)
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
:disabled="disabled"
|
||||
:clearable="modelValue ? clearable : false"
|
||||
:label="label"
|
||||
:menu-props="{ 'content-class': 'date-select-menu' }"
|
||||
:menu-props="{ contentClass: 'date-select-menu' }"
|
||||
v-model="dateTime"
|
||||
>
|
||||
<template #selection>
|
||||
@@ -44,6 +44,7 @@ import { useI18n } from '@/locales/helpers.ts';
|
||||
|
||||
import { useUserStore } from '@/stores/user.ts';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
import { ThemeType } from '@/core/theme.ts';
|
||||
import { arrangeArrayWithNewStartIndex } from '@/lib/common.ts';
|
||||
import { getCurrentYear } from '@/lib/datetime.ts';
|
||||
@@ -76,7 +77,7 @@ const dateTime = computed<string>({
|
||||
});
|
||||
|
||||
const isDarkMode = computed<boolean>(() => theme.global.name.value === ThemeType.Dark);
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const dayNames = computed<string[]>(() => arrangeArrayWithNewStartIndex(getAllMinWeekdayNames(), firstDayOfWeek.value));
|
||||
const isYearFirst = computed<boolean>(() => isLongDateMonthAfterYear());
|
||||
const displayTime = computed<string>(() => {
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
:readonly="readonly"
|
||||
:disabled="disabled"
|
||||
:label="label"
|
||||
:menu-props="{ 'content-class': 'date-time-select-menu' }"
|
||||
:menu-props="{ contentClass: 'date-time-select-menu' }"
|
||||
v-model="dateTime"
|
||||
>
|
||||
<template #selection>
|
||||
@@ -45,6 +45,7 @@ import { useI18n } from '@/locales/helpers.ts';
|
||||
|
||||
import { useUserStore } from '@/stores/user.ts';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
import { ThemeType } from '@/core/theme.ts';
|
||||
import { arrangeArrayWithNewStartIndex } from '@/lib/common.ts';
|
||||
import {
|
||||
@@ -95,7 +96,7 @@ const dateTime = computed<Date>({
|
||||
});
|
||||
|
||||
const isDarkMode = computed<boolean>(() => theme.global.name.value === ThemeType.Dark);
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const dayNames = computed<string[]>(() => arrangeArrayWithNewStartIndex(getAllMinWeekdayNames(), firstDayOfWeek.value));
|
||||
const isYearFirst = computed<boolean>(() => isLongDateMonthAfterYear());
|
||||
const is24Hour = computed<boolean>(() => isLongTime24HourFormat());
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
:readonly="readonly"
|
||||
:disabled="disabled"
|
||||
:label="label"
|
||||
:menu-props="{ 'content-class': 'schedule-frequency-select-menu' }"
|
||||
:menu-props="{ contentClass: 'schedule-frequency-select-menu' }"
|
||||
v-model="frequencyType"
|
||||
v-model:menu="menuState"
|
||||
@update:menu="onMenuStateChanged"
|
||||
@@ -62,6 +62,7 @@ import { type CommonScheduleFrequencySelectionProps, useScheduleFrequencySelecti
|
||||
|
||||
import { useUserStore } from '@/stores/user.ts';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
import { ScheduledTemplateFrequencyType } from '@/core/template.ts';
|
||||
import { sortNumbersArray } from '@/lib/common.ts';
|
||||
import { scrollToSelectedItem } from '@/lib/ui/desktop.ts';
|
||||
@@ -81,7 +82,7 @@ const dropdownMenu = useTemplateRef<HTMLElement>('dropdownMenu');
|
||||
|
||||
const menuState = ref<boolean>(false);
|
||||
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
|
||||
const frequencyType = computed<number>({
|
||||
get: () => props.type,
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
:readonly="readonly"
|
||||
:disabled="disabled"
|
||||
:label="label"
|
||||
:menu-props="{ 'content-class': 'two-column-select-menu' }"
|
||||
:menu-props="{ contentClass: 'two-column-select-menu' }"
|
||||
v-model="currentSecondaryValue"
|
||||
v-model:menu="menuState"
|
||||
@update:menu="onMenuStateChanged"
|
||||
@@ -41,7 +41,7 @@
|
||||
<div class="primary-list-container">
|
||||
<v-list :class="{ 'list-item-with-header': !!primaryHeaderField, 'list-item-with-footer': !!primaryFooterField }">
|
||||
<v-list-item :class="{ 'primary-list-item-selected v-list-item--active text-primary': item === selectedPrimaryItem }"
|
||||
:key="primaryKeyField ? (item as Record<string, unknown>)[primaryKeyField] : item"
|
||||
:key="primaryKeyField ? (item as Record<string, unknown>)[primaryKeyField] as string : JSON.stringify(item)"
|
||||
v-for="item in filteredItems"
|
||||
@click="onPrimaryItemClicked(item)">
|
||||
<template #prepend>
|
||||
@@ -60,7 +60,7 @@
|
||||
<v-list :class="{ 'list-item-with-header': !!secondaryHeaderField, 'list-item-with-footer': !!secondaryFooterField }"
|
||||
v-if="selectedPrimaryItem && primarySubItemsField && (selectedPrimaryItem as Record<string, unknown>)[primarySubItemsField]">
|
||||
<v-list-item :class="{ 'secondary-list-item-selected v-list-item--active text-primary': isSecondarySelected(subItem) }"
|
||||
:key="secondaryKeyField ? subItem[secondaryKeyField] : subItem"
|
||||
:key="secondaryKeyField ? subItem[secondaryKeyField] as string : JSON.stringify(subItem)"
|
||||
v-for="subItem in filteredSubItems"
|
||||
@click="onSecondaryItemClicked(subItem)">
|
||||
<template #prepend>
|
||||
|
||||
@@ -63,6 +63,8 @@ import { type CommonDateRangeSelectionProps, useDateRangeSelectionBase } from '@
|
||||
import { useEnvironmentsStore } from '@/stores/environment.ts';
|
||||
import { useUserStore } from '@/stores/user.ts';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
|
||||
import {
|
||||
getLocalDatetimeFromUnixTime,
|
||||
getDummyUnixTimeForLocalUsage,
|
||||
@@ -87,7 +89,7 @@ const userStore = useUserStore();
|
||||
|
||||
const datetimepicker = useTemplateRef<VueDatePickerType>('datetimepicker');
|
||||
const isDarkMode = computed<boolean>(() => environmentsStore.framework7DarkMode || false);
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
|
||||
function confirm(): void {
|
||||
try {
|
||||
|
||||
@@ -45,6 +45,7 @@ import { useI18n } from '@/locales/helpers.ts';
|
||||
import { useEnvironmentsStore } from '@/stores/environment.ts';
|
||||
import { useUserStore } from '@/stores/user.ts';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
import { arrangeArrayWithNewStartIndex } from '@/lib/common.ts';
|
||||
import { getCurrentYear } from '@/lib/datetime.ts';
|
||||
|
||||
@@ -70,7 +71,7 @@ const yearRange = ref<number[]>([
|
||||
const dateTime = ref<string>('');
|
||||
|
||||
const isDarkMode = computed<boolean>(() => environmentsStore.framework7DarkMode || false);
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const dayNames = computed<string[]>(() => arrangeArrayWithNewStartIndex(getAllMinWeekdayNames(), firstDayOfWeek.value));
|
||||
const isYearFirst = computed<boolean>(() => isLongDateMonthAfterYear());
|
||||
|
||||
|
||||
@@ -37,7 +37,7 @@
|
||||
<div class="block block-outline no-margin no-padding padding-vertical-half" v-show="mode === 'time'">
|
||||
<div id="time-picker-container" class="time-picker-container"></div>
|
||||
</div>
|
||||
<input id="time-picker-input" style="display: none" type="text" readonly="readonly"/>
|
||||
<input id="time-picker-input" style="display: none" type="text" :readonly="true"/>
|
||||
<div class="margin-top text-align-center">
|
||||
<div class="display-flex padding-horizontal justify-content-space-between">
|
||||
<div class="align-self-center">{{ displayTime }}</div>
|
||||
@@ -59,6 +59,7 @@ import { useI18nUIComponents, createInlinePicker } from '@/lib/ui/mobile.ts';
|
||||
import { useEnvironmentsStore } from '@/stores/environment.ts';
|
||||
import { useUserStore } from '@/stores/user.ts';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
import { arrangeArrayWithNewStartIndex } from '@/lib/common.ts';
|
||||
import {
|
||||
getCurrentUnixTime,
|
||||
@@ -106,7 +107,7 @@ const timeValues = ref<string[]>(getTimeValues(dateTime.value, is24Hour, isMerid
|
||||
const datetimepicker = useTemplateRef<VueDatePickerType>('datetimepicker');
|
||||
|
||||
const isDarkMode = computed<boolean>(() => environmentsStore.framework7DarkMode || false);
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const dayNames = computed<string[]>(() => arrangeArrayWithNewStartIndex(getAllMinWeekdayNames(), firstDayOfWeek.value));
|
||||
const isYearFirst = computed<boolean>(() => isLongDateMonthAfterYear());
|
||||
const displayTime = computed<string>(() => formatUnixTimeToLongDateTime(getActualUnixTimeForStore(getUnixTime(dateTime.value), getTimezoneOffsetMinutes(), getBrowserTimezoneOffsetMinutes())));
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
v-if="enableCopy"
|
||||
></f7-link>
|
||||
</p>
|
||||
<textarea class="information-content full-line" readonly="readonly" :rows="rowCount" :value="information"></textarea>
|
||||
<textarea class="information-content full-line" :readonly="true" :rows="rowCount" :value="information"></textarea>
|
||||
<div class="margin-top text-align-center">
|
||||
<f7-link @click="close" :text="tt('Close')"></f7-link>
|
||||
</div>
|
||||
|
||||
@@ -72,6 +72,7 @@ import { type CommonScheduleFrequencySelectionProps, useScheduleFrequencySelecti
|
||||
|
||||
import { useUserStore } from '@/stores/user.ts';
|
||||
|
||||
import { type WeekDayValue } from '@/core/datetime.ts';
|
||||
import { ScheduledTemplateFrequencyType } from '@/core/template.ts';
|
||||
import { sortNumbersArray } from '@/lib/common.ts';
|
||||
import { type Framework7Dom, scrollToSelectedItem } from '@/lib/ui/mobile.ts';
|
||||
@@ -95,7 +96,7 @@ const userStore = useUserStore();
|
||||
const currentFrequencyType = ref<number>(props.type);
|
||||
const currentFrequencyValue = ref<number[]>(getFrequencyValues(props.modelValue));
|
||||
|
||||
const firstDayOfWeek = computed<number>(() => userStore.currentUserFirstDayOfWeek);
|
||||
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
|
||||
|
||||
function isChecked(value: number): boolean {
|
||||
return currentFrequencyValue.value.indexOf(value) >= 0;
|
||||
|
||||
Reference in New Issue
Block a user