Files
KArtSell.Aegis/docs/Design/kbx-foundation-v36/packages/kbx-ui/src/components/KbxExceptionCenter.vue
T

31 lines
1.1 KiB
Vue

<script setup lang="ts">
import type { KbxWorkItem, KbxWorkItemAction, KbxWorkQueueCounter } from '@kbx/contracts'
import KbxExceptionSummary from './KbxExceptionSummary.vue'
import KbxExceptionDetailDrawer from './KbxExceptionDetailDrawer.vue'
defineProps<{
counters: KbxWorkQueueCounter[]
activeKey?: string | null
selectedItem?: KbxWorkItem | null
can?: (permission: string) => boolean
}>()
const emit = defineEmits<{
filter: [string | null]
closeDetail: []
action: [KbxWorkItemAction]
}>()
</script>
<template>
<section class="kbx-exception-center">
<KbxExceptionSummary :counters="counters" :active-key="activeKey" @select="emit('filter', $event)" />
<div class="kbx-exception-center__queue"><slot /></div>
<KbxExceptionDetailDrawer :item="selectedItem ?? null" :can="can" @close="emit('closeDetail')" @action="emit('action', $event)" />
</section>
</template>
<style scoped>
.kbx-exception-center { display:flex; flex-direction:column; gap:8px; min-height:0; height:100%; }
.kbx-exception-center__queue { min-height:0; flex:1; }
</style>