mirrors/homebox
1
0
Fork 1
mirror of https://github.com/hay-kot/homebox.git synced 2024-11-16 13:48:44 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix: auto-select bug (#59)

Browse source
This commit is contained in:
Hayden 2022-10-13 16:45:18 -08:00 committed by GitHub
parent ae73b194c4
commit 889197994b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 26 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

51
frontend/components/Form/Select.vue
View file

@ -42,50 +42,31 @@
default: null,
required: false,
},
selectFirst: {
type: Boolean,
default: false,
},
});
function syncSelect() {
if (!props.modelValue) {
if (props.selectFirst) {
selectedIdx.value = 0;
}
return;
}
// Check if we're already synced
if (props.value) {
if (props.modelValue[props.value] === props.items[selectedIdx.value][props.value]) {
return;
}
} else if (props.modelValue === props.items[selectedIdx.value]) {
return;
}
const selectedIdx = ref(-1);
const internalSelected = useVModel(props, "modelValue", emit);
const idx = props.items.findIndex(item => {
if (props.value) {
return item[props.value] === props.modelValue;
}
return item === props.modelValue;
watch(selectedIdx, newVal => {
internalSelected.value = props.items[newVal];
});
selectedIdx.value = idx;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
function compare(a: any, b: any): boolean {
if (props.value != null) {
return a[props.value] === b[props.value];
}
return a === b;
}
watch(() => props.items, syncSelect);
watch(() => props.modelValue, syncSelect);
const selectedIdx = ref(0);
watch(
() => selectedIdx.value,
internalSelected,
() => {
if (props.value) {
emit("update:modelValue", props.items[selectedIdx.value][props.value]);
return;
}
emit("update:modelValue", props.items[selectedIdx.value]);
const idx = props.items.findIndex(item => compare(item, internalSelected.value));
selectedIdx.value = idx;
},
{
immediate: true,
}
);
</script>

2
frontend/components/Item/CreateModal.vue
View file

@ -2,7 +2,7 @@
<BaseModal v-model="modal">
<template #title> Create Item </template>
<form @submit.prevent="create">
<FormSelect v-model="form.location" label="Location" :items="locations ?? []" select-first />
<FormSelect v-model="form.location" label="Location" :items="locations ?? []" />
<FormTextField
ref="locationNameRef"
v-model="form.name"

9
frontend/pages/item/[id]/edit.vue
View file

@ -30,6 +30,13 @@
return;
}
if (locations) {
const location = locations.value.find(l => l.id === data.location.id);
if (location) {
data.location = location;
}
}
return data;
});
onMounted(() => {
@ -308,7 +315,7 @@
</template>
</BaseSectionHeader>
<div class="px-5 mb-6 grid md:grid-cols-2 gap-4">
<FormSelect v-model="item.location" label="Location" :items="locations ?? []" select-first />
<FormSelect v-if="item" v-model="item.location" label="Location" :items="locations ?? []" />
<FormMultiselect v-model="item.labels" label="Labels" :items="labels ?? []" />
</div>