Several fixes, improvements, refactor for authentication

This commit is contained in:
2024-12-27 19:00:53 +01:00
parent 9d0f810ab3
commit 18b07d2f46
20 changed files with 113 additions and 131 deletions

View File

@ -11,7 +11,13 @@
</div>
<div v-bind="containerProps" class="overflow-y-auto relative p-2.5 rounded-md default-border bg-gray" @scroll="onScroll">
<div v-bind="wrapperProps" ref="elementToScroll">
<a v-for="{ data: characterHair } in list" :key="characterHair.id" class="relative p-2.5 cursor-pointer block rounded hover:bg-cyan group" :class="{ 'bg-cyan': assetManagerStore.selectedCharacterHair?.id === characterHair.id }" @click="assetManagerStore.setSelectedCharacterHair(characterHair as CharacterHair)">
<a
v-for="{ data: characterHair } in list"
:key="characterHair.id"
class="relative p-2.5 cursor-pointer block rounded hover:bg-cyan group"
:class="{ 'bg-cyan': assetManagerStore.selectedCharacterHair?.id === characterHair.id }"
@click="assetManagerStore.setSelectedCharacterHair(characterHair as CharacterHair)"
>
<div class="flex items-center gap-2.5">
<span class="group-hover:text-white" :class="{ 'text-white': assetManagerStore.selectedCharacterHair?.id === characterHair.id }">{{ characterHair.name }}</span>
</div>

View File

@ -11,7 +11,13 @@
</div>
<div v-bind="containerProps" class="overflow-y-auto relative p-2.5 rounded-md default-border bg-gray" @scroll="onScroll">
<div v-bind="wrapperProps" ref="elementToScroll">
<a v-for="{ data: characterType } in list" :key="characterType.id" class="relative p-2.5 cursor-pointer block rounded hover:bg-cyan group" :class="{ 'bg-cyan': assetManagerStore.selectedCharacterType?.id === characterType.id }" @click="assetManagerStore.setSelectedCharacterType(characterType as CharacterType)">
<a
v-for="{ data: characterType } in list"
:key="characterType.id"
class="relative p-2.5 cursor-pointer block rounded hover:bg-cyan group"
:class="{ 'bg-cyan': assetManagerStore.selectedCharacterType?.id === characterType.id }"
@click="assetManagerStore.setSelectedCharacterType(characterType as CharacterType)"
>
<div class="flex items-center gap-2.5">
<span class="group-hover:text-white" :class="{ 'text-white': assetManagerStore.selectedCharacterType?.id === characterType.id }">{{ characterType.name }}</span>
</div>

View File

@ -140,4 +140,4 @@ onMounted(() => {
onBeforeUnmount(() => {
assetManagerStore.setSelectedItem(null)
})
</script>
</script>

View File

@ -64,10 +64,7 @@ const filteredItems = computed(() => {
if (!searchQuery.value) {
return assetManagerStore.itemList
}
return assetManagerStore.itemList.filter((item) =>
item.name.toLowerCase().includes(searchQuery.value.toLowerCase()) ||
item.itemType.toLowerCase().includes(searchQuery.value.toLowerCase())
)
return assetManagerStore.itemList.filter((item) => item.name.toLowerCase().includes(searchQuery.value.toLowerCase()) || item.itemType.toLowerCase().includes(searchQuery.value.toLowerCase()))
})
const { list, containerProps, wrapperProps, scrollTo } = useVirtualList(filteredItems, {
@ -95,4 +92,4 @@ onMounted(() => {
assetManagerStore.setItemList(response)
})
})
</script>
</script>