noxious/client
6
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

npm run format

Browse Source
This commit is contained in:
Dennis Postma
2024-07-20 20:17:46 +02:00
parent dca773b8c9
commit 87815dd68e
10 changed files with 70 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/utilities/assetManager/partials/ObjectDetails.vue
View File

@ -124,5 +124,4 @@ onMounted(() => {
onBeforeUnmount(() => {
assetManagerStore.setSelectedObject(null)
})
</script>

23
src/components/utilities/assetManager/partials/ObjectList.vue
View File

@ -9,13 +9,7 @@
</div>
<div v-bind="containerProps" class="overflow-y-auto relative" @scroll="onScroll">
<div v-bind="wrapperProps" ref="elementToScroll">
<a
v-for="{ data: object } in list"
:key="object.id"
class="relative p-2.5 cursor-pointer block"
:class="{ 'bg-cyan/80': assetManagerStore.selectedObject?.id === object.id }"
@click="assetManagerStore.setSelectedObject(object as Object)"
>
<a v-for="{ data: object } in list" :key="object.id" class="relative p-2.5 cursor-pointer block" :class="{ 'bg-cyan/80': assetManagerStore.selectedObject?.id === object.id }" @click="assetManagerStore.setSelectedObject(object as Object)">
<div class="flex items-center gap-2.5">
<div class="h-[28px] w-[75px] max-w-[75px] flex justify-center">
<img class="h-[28px]" :src="`${config.server_endpoint}/assets/objects/${object.id}.png`" alt="Object" />
@ -76,22 +70,17 @@ const filteredObjects = computed(() => {
if (!searchQuery.value) {
return assetManagerStore.objectList
}
return assetManagerStore.objectList.filter((object) =>
object.name.toLowerCase().includes(searchQuery.value.toLowerCase())
)
return assetManagerStore.objectList.filter((object) => object.name.toLowerCase().includes(searchQuery.value.toLowerCase()))
})
const { list, containerProps, wrapperProps, scrollTo } = useVirtualList(
filteredObjects,
{
itemHeight: 48,
},
)
const { list, containerProps, wrapperProps, scrollTo } = useVirtualList(filteredObjects, {
itemHeight: 48
})
const virtualList = ref({ scrollTo })
const onScroll = () => {
let scrollTop = elementToScroll.value.style.marginTop.replace('px', '');
let scrollTop = elementToScroll.value.style.marginTop.replace('px', '')
if (scrollTop > 80) {
hasScrolled.value = true

25
src/components/utilities/assetManager/partials/TileList.vue
View File

@ -9,13 +9,7 @@
</div>
<div v-bind="containerProps" class="overflow-y-auto relative" @scroll="onScroll">
<div v-bind="wrapperProps" ref="elementToScroll">
<a
v-for="{ data: tile } in list"
:key="tile.id"
class="relative p-2.5 cursor-pointer block"
:class="{ 'bg-cyan/80': assetManagerStore.selectedTile?.id === tile.id }"
@click="assetManagerStore.setSelectedTile(tile)"
>
<a v-for="{ data: tile } in list" :key="tile.id" class="relative p-2.5 cursor-pointer block" :class="{ 'bg-cyan/80': assetManagerStore.selectedTile?.id === tile.id }" @click="assetManagerStore.setSelectedTile(tile)">
<div class="flex items-center gap-2.5">
<div class="h-[28px] w-[75px] max-w-[75px] flex justify-center">
<img class="h-[28px]" :src="`${config.server_endpoint}/assets/tiles/${tile.id}.png`" alt="Tile" />
@ -76,22 +70,17 @@ const filteredTiles = computed(() => {
if (!searchQuery.value) {
return assetManagerStore.tileList
}
return assetManagerStore.tileList.filter((tile) =>
tile.name.toLowerCase().includes(searchQuery.value.toLowerCase())
)
return assetManagerStore.tileList.filter((tile) => tile.name.toLowerCase().includes(searchQuery.value.toLowerCase()))
})
const { list, containerProps, wrapperProps, scrollTo } = useVirtualList(
filteredTiles,
{
itemHeight: 48,
},
)
const { list, containerProps, wrapperProps, scrollTo } = useVirtualList(filteredTiles, {
itemHeight: 48
})
const virtualList = ref({ scrollTo })
const onScroll = () => {
let scrollTop = elementToScroll.value.style.marginTop.replace('px', '');
let scrollTop = elementToScroll.value.style.marginTop.replace('px', '')
if (scrollTop > 80) {
hasScrolled.value = true
@ -109,4 +98,4 @@ onMounted(() => {
assetManagerStore.setTileList(response)
})
})
</script>
</script>