refactor: standardize design

Signed-off-by: Sebastian Krupinski <krupinski01@gmail.com>
This commit is contained in:
2026-03-03 21:55:48 -05:00
parent 31a33d8758
commit a59dbff9f1
25 changed files with 994 additions and 306 deletions

View File

@@ -1,29 +1,32 @@
<script setup lang="ts">
import { ref } from 'vue'
import { FileCollectionObject } from '@FilesManager/models/collection'
import { FileEntityObject } from '@FilesManager/models/entity'
import { CollectionObject } from '@DocumentsManager/models/collection'
import { EntityObject } from '@DocumentsManager/models/entity'
defineProps<{
item: FileCollectionObject | FileEntityObject
item: CollectionObject | EntityObject
size?: 'x-small' | 'small' | 'default'
variant?: 'text' | 'flat' | 'elevated' | 'tonal' | 'outlined' | 'plain'
buttonClass?: string
}>()
const emit = defineEmits<{
'rename': [item: FileCollectionObject | FileEntityObject]
'delete': [item: FileCollectionObject | FileEntityObject]
'download': [item: FileCollectionObject | FileEntityObject]
'show-details': [item: FileCollectionObject | FileEntityObject]
'open': [item: CollectionObject | EntityObject]
'rename': [item: CollectionObject | EntityObject]
'delete': [item: CollectionObject | EntityObject]
'download': [item: CollectionObject | EntityObject]
'show-details': [item: CollectionObject | EntityObject]
}>()
const menuOpen = ref(false)
function handleAction(action: string, item: FileCollectionObject | FileEntityObject, event: Event) {
function handleAction(action: string, item: CollectionObject | EntityObject, event: Event) {
event.stopPropagation()
menuOpen.value = false
if (action === 'rename') {
if (action === 'open') {
emit('open', item)
} else if (action === 'rename') {
emit('rename', item)
} else if (action === 'delete') {
emit('delete', item)
@@ -34,8 +37,8 @@ function handleAction(action: string, item: FileCollectionObject | FileEntityObj
}
}
function isEntity(item: FileCollectionObject | FileEntityObject): item is FileEntityObject {
return item['@type'] === 'files.entity'
function isEntity(item: CollectionObject | EntityObject): item is EntityObject {
return item instanceof EntityObject
}
</script>
@@ -52,6 +55,10 @@ function isEntity(item: FileCollectionObject | FileEntityObject): item is FileEn
/>
</template>
<v-list density="compact">
<v-list-item v-if="isEntity(item)" @click="(e: Event) => handleAction('open', item, e)">
<template #prepend><v-icon size="small">mdi-open-in-app</v-icon></template>
<v-list-item-title>Open</v-list-item-title>
</v-list-item>
<v-list-item @click="(e: Event) => handleAction('details', item, e)">
<template #prepend><v-icon size="small">mdi-information-outline</v-icon></template>
<v-list-item-title>Details</v-list-item-title>