zhengchen.tao/ezbookkeeping
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

code refactor

Browse Source
This commit is contained in:
MaysWind
2025-02-06 00:15:04 +08:00
parent b077b99806
commit 1579882475
3 changed files with 127 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/base/TwoColumnListItemSelectionBase.ts
+89
View File
@@ -0,0 +1,89 @@
import { type Ref } from 'vue';
import { getItemByKeyValue, getPrimaryValueBySecondaryValue } from '@/lib/common.ts';
export interface CommonTwoColumnListItemSelectionProps {
modelValue: unknown;
primaryKeyField?: string;
primaryValueField?: string;
primaryTitleField?: string;
primaryTitleI18n?: boolean;
primaryHeaderField?: string;
primaryHeaderI18n?: boolean;
primaryFooterField?: string;
primaryFooterI18n?: boolean;
primaryIconField?: string;
primaryIconType?: string;
primaryColorField?: string;
primaryHiddenField?: string;
primarySubItemsField: string;
secondaryKeyField?: string;
secondaryValueField?: string;
secondaryTitleField?: string;
secondaryTitleI18n?: boolean;
secondaryHeaderField?: string;
secondaryHeaderI18n?: boolean;
secondaryFooterField?: string;
secondaryFooterI18n?: boolean;
secondaryIconField?: string;
secondaryIconType?: string;
secondaryColorField?: string;
secondaryHiddenField?: string;
items: unknown[];
}
export function useTwoColumnListItemSelectionBase(props: CommonTwoColumnListItemSelectionProps) {
function getCurrentPrimaryValueBySecondaryValue(secondaryValue: unknown): unknown {
return getPrimaryValueBySecondaryValue(props.items as Record<string, Record<string, unknown>[]>[] | Record<string, Record<string, Record<string, unknown>[]>>, props.primarySubItemsField, props.primaryValueField, props.primaryHiddenField, props.secondaryValueField, props.secondaryHiddenField, secondaryValue);
}
function isSecondaryValueSelected(currentSecondaryValue: unknown, subItem: unknown): boolean {
if (props.secondaryValueField) {
return currentSecondaryValue === (subItem as Record<string, unknown>)[props.secondaryValueField];
} else {
return currentSecondaryValue === subItem;
}
}
function getSelectedPrimaryItem(currentPrimaryValue: unknown) {
if (props.primaryValueField) {
return getItemByKeyValue(props.items as Record<string, unknown>[] | Record<string, Record<string, unknown>>, currentPrimaryValue, props.primaryValueField);
} else {
return currentPrimaryValue;
}
}
function getSelectedSecondaryItem(currentSecondaryValue: unknown, selectedPrimaryItem: unknown) {
if (currentSecondaryValue && selectedPrimaryItem && (selectedPrimaryItem as Record<string, unknown>)[props.primarySubItemsField]) {
return getItemByKeyValue((selectedPrimaryItem as Record<string, unknown>)[props.primarySubItemsField] as Record<string, unknown>[] | Record<string, Record<string, unknown>>, currentSecondaryValue, props.secondaryValueField as string);
} else {
return null;
}
}
function updateCurrentPrimaryValue(currentPrimaryValue: Ref<unknown>, item: unknown): void {
if (props.primaryValueField) {
currentPrimaryValue.value = (item as Record<string, unknown>)[props.primaryValueField];
} else {
currentPrimaryValue.value = item;
}
}
function updateCurrentSecondaryValue(currentSecondaryValue: Ref<unknown>, subItem: unknown): void {
if (props.secondaryValueField) {
currentSecondaryValue.value = (subItem as Record<string, unknown>)[props.secondaryValueField];
} else {
currentSecondaryValue.value = subItem;
}
}
return {
// functions
getCurrentPrimaryValueBySecondaryValue,
isSecondaryValueSelected,
getSelectedPrimaryItem,
getSelectedSecondaryItem,
updateCurrentPrimaryValue,
updateCurrentSecondaryValue
};
}
src/components/desktop/TwoColumnSelect.vue
+20 -65
View File
@@ -77,12 +77,12 @@
import { ref, computed, useTemplateRef, nextTick } from 'vue';
import { useI18n } from '@/locales/helpers.ts';
import { type CommonTwoColumnListItemSelectionProps, useTwoColumnListItemSelectionBase } from '@/components/base/TwoColumnListItemSelectionBase.ts';
import {
getFirstVisibleItem,
getItemByKeyValue,
getNameByKeyValue,
getPrimaryValueBySecondaryValue
getNameByKeyValue
} from '@/lib/common.ts';
import { scrollToSelectedItem } from '@/lib/ui/desktop.ts';
@@ -90,8 +90,7 @@ import {
mdiChevronRight
} from '@mdi/js';
const props = defineProps<{
modelValue: unknown;
interface DesktopTwoColumnListItemSelectionProps extends CommonTwoColumnListItemSelectionProps {
density?: string;
variant?: string;
disabled?: boolean;
@@ -101,34 +100,10 @@ const props = defineProps<{
showSelectionSecondaryIcon?: boolean;
customSelectionPrimaryText?: string;
customSelectionSecondaryText?: string;
primaryKeyField?: string;
primaryValueField?: string;
primaryTitleField?: string;
primaryTitleI18n?: boolean;
primaryHeaderField?: string;
primaryHeaderI18n?: boolean;
primaryFooterField?: string;
primaryFooterI18n?: boolean;
primaryIconField?: string;
primaryIconType?: string;
primaryColorField?: string;
primaryHiddenField?: string;
primarySubItemsField: string;
secondaryKeyField?: string;
secondaryValueField?: string;
secondaryTitleField?: string;
secondaryTitleI18n?: boolean;
secondaryHeaderField?: string;
secondaryHeaderI18n?: boolean;
secondaryFooterField?: string;
secondaryFooterI18n?: boolean;
secondaryIconField?: string;
secondaryIconType?: string;
secondaryColorField?: string;
secondaryHiddenField?: string;
items: unknown[];
noItemText?: string;
}>();
}
const props = defineProps<DesktopTwoColumnListItemSelectionProps>();
const emit = defineEmits<{
(e: 'update:modelValue', value: unknown): void;
@@ -136,6 +111,15 @@ const emit = defineEmits<{
const { tt, ti } = useI18n();
const {
getCurrentPrimaryValueBySecondaryValue,
isSecondaryValueSelected,
getSelectedPrimaryItem,
getSelectedSecondaryItem,
updateCurrentPrimaryValue,
updateCurrentSecondaryValue
} = useTwoColumnListItemSelectionBase(props);
const icons = {
chevronRight: mdiChevronRight
};
@@ -175,21 +159,8 @@ const currentSecondaryValue = computed<unknown>({
}
});
const selectedPrimaryItem = computed<unknown>(() => {
if (props.primaryValueField) {
return getItemByKeyValue(props.items as Record<string, unknown>[] | Record<string, Record<string, unknown>>, currentPrimaryValue.value, props.primaryValueField);
} else {
return currentPrimaryValue.value;
}
});
const selectedSecondaryItem = computed<unknown>(() => {
if (currentSecondaryValue.value && selectedPrimaryItem.value && (selectedPrimaryItem.value as Record<string, unknown>)[props.primarySubItemsField]) {
return getItemByKeyValue((selectedPrimaryItem.value as Record<string, unknown>)[props.primarySubItemsField] as Record<string, unknown>[] | Record<string, Record<string, unknown>>, currentSecondaryValue.value, props.secondaryValueField as string);
} else {
return null;
}
});
const selectedPrimaryItem = computed<unknown>(() => getSelectedPrimaryItem(currentPrimaryValue.value));
const selectedSecondaryItem = computed<unknown>(() => getSelectedSecondaryItem(currentSecondaryValue.value, selectedPrimaryItem.value));
const noSelectionText = computed<string>(() => props.noItemText ? props.noItemText : tt('None'));
@@ -217,32 +188,16 @@ const selectionSecondaryItemText = computed<string>(() => {
}
});
function getCurrentPrimaryValueBySecondaryValue(secondaryValue: unknown): unknown {
return getPrimaryValueBySecondaryValue(props.items as Record<string, Record<string, unknown>[]>[] | Record<string, Record<string, Record<string, unknown>[]>>, props.primarySubItemsField, props.primaryValueField, props.primaryHiddenField, props.secondaryValueField, props.secondaryHiddenField, secondaryValue);
}
function isSecondarySelected(subItem: unknown): boolean {
if (props.secondaryValueField) {
return currentSecondaryValue.value === (subItem as Record<string, unknown>)[props.secondaryValueField];
} else {
return currentSecondaryValue.value === subItem;
}
return isSecondaryValueSelected(currentSecondaryValue.value, subItem);
}
function onPrimaryItemClicked(item: unknown): void {
if (props.primaryValueField) {
currentPrimaryValue.value = (item as Record<string, unknown>)[props.primaryValueField];
} else {
currentPrimaryValue.value = item;
}
updateCurrentPrimaryValue(currentPrimaryValue, item);
}
function onSecondaryItemClicked(subItem: unknown): void {
if (props.secondaryValueField) {
currentSecondaryValue.value = (subItem as Record<string, unknown>)[props.secondaryValueField];
} else {
currentSecondaryValue.value = subItem;
}
updateCurrentSecondaryValue(currentSecondaryValue, subItem);
}
function onMenuStateChanged(state: boolean): void {
src/components/mobile/TwoColumnListItemSelectionSheet.vue
+18 -60
View File
@@ -65,43 +65,15 @@
import { ref, computed } from 'vue';
import { useI18n } from '@/locales/helpers.ts';
import { type CommonTwoColumnListItemSelectionProps, useTwoColumnListItemSelectionBase } from '@/components/base/TwoColumnListItemSelectionBase.ts';
import {
getItemByKeyValue,
getPrimaryValueBySecondaryValue
} from '@/lib/common.ts';
import { type Framework7Dom, scrollToSelectedItem } from '@/lib/ui/mobile.ts';
const props = defineProps<{
modelValue: unknown;
primaryKeyField?: string;
primaryValueField?: string;
primaryTitleField?: string;
primaryTitleI18n?: boolean;
primaryHeaderField?: string;
primaryHeaderI18n?: boolean;
primaryFooterField?: string;
primaryFooterI18n?: boolean;
primaryIconField?: string;
primaryIconType?: string;
primaryColorField?: string;
primaryHiddenField?: string;
primarySubItemsField: string;
secondaryKeyField?: string;
secondaryValueField?: string;
secondaryTitleField?: string;
secondaryTitleI18n?: boolean;
secondaryHeaderField?: string;
secondaryHeaderI18n?: boolean;
secondaryFooterField?: string;
secondaryFooterI18n?: boolean;
secondaryIconField?: string;
secondaryIconType?: string;
secondaryColorField?: string;
secondaryHiddenField?: string;
items: unknown[];
interface MobileTwoColumnListItemSelectionProps extends CommonTwoColumnListItemSelectionProps {
show: boolean;
}>();
}
const props = defineProps<MobileTwoColumnListItemSelectionProps>();
const emit = defineEmits<{
(e: 'update:modelValue', value: unknown): void;
@@ -110,48 +82,34 @@ const emit = defineEmits<{
const { tt, ti } = useI18n();
const {
getCurrentPrimaryValueBySecondaryValue,
isSecondaryValueSelected,
getSelectedPrimaryItem,
updateCurrentPrimaryValue,
updateCurrentSecondaryValue
} = useTwoColumnListItemSelectionBase(props);
const currentPrimaryValue = ref<unknown>(getCurrentPrimaryValueBySecondaryValue(props.modelValue));
const currentSecondaryValue = ref<unknown>(props.modelValue);
function getCurrentPrimaryValueBySecondaryValue(secondaryValue: unknown): unknown {
return getPrimaryValueBySecondaryValue(props.items as Record<string, Record<string, unknown>[]>[] | Record<string, Record<string, Record<string, unknown>[]>>, props.primarySubItemsField, props.primaryValueField, props.primaryHiddenField, props.secondaryValueField, props.secondaryHiddenField, secondaryValue);
}
const selectedPrimaryItem = computed<unknown>(() => getSelectedPrimaryItem(currentPrimaryValue.value));
function isSecondarySelected(subItem: unknown): boolean {
if (props.secondaryValueField) {
return currentSecondaryValue.value === (subItem as Record<string, unknown>)[props.secondaryValueField];
} else {
return currentSecondaryValue.value === subItem;
}
return isSecondaryValueSelected(currentSecondaryValue.value, subItem);
}
const selectedPrimaryItem = computed<unknown>(() => {
if (props.primaryValueField) {
return getItemByKeyValue(props.items as Record<string, unknown>[] | Record<string, Record<string, unknown>>, currentPrimaryValue.value, props.primaryValueField);
} else {
return currentPrimaryValue.value;
}
});
function close(): void {
emit('update:show', false);
}
function onPrimaryItemClicked(item: unknown): void {
if (props.primaryValueField) {
currentPrimaryValue.value = (item as Record<string, unknown>)[props.primaryValueField];
} else {
currentPrimaryValue.value = item;
}
updateCurrentPrimaryValue(currentPrimaryValue, item);
}
function onSecondaryItemClicked(subItem: unknown): void {
if (props.secondaryValueField) {
currentSecondaryValue.value = (subItem as Record<string, unknown>)[props.secondaryValueField];
} else {
currentSecondaryValue.value = subItem;
}
updateCurrentSecondaryValue(currentSecondaryValue, subItem);
emit('update:modelValue', currentSecondaryValue.value);
close();
}