kjh2064
c41e5063b7
Removed entire kbx-foundation-v36 directory as it's been replaced by the new KBX Foundation v4 patterns implemented in this session: - Registry-driven screen definitions - Density-aware UI adapter components - Feature module templates (ShadowRun, Models) Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
55 lines
5.2 KiB
Vue
55 lines
5.2 KiB
Vue
<script setup lang="ts">
|
|
import type { KbxAsyncState, KbxProblem, KbxScreenDefinition, KbxSummaryItem, KbxTemplateContext, KbxWorkQueueCounter } from '@kbx/contracts'
|
|
import KbxExceptionSummary from './KbxExceptionSummary.vue'
|
|
import KbxScreenFrame from './KbxScreenFrame.vue'
|
|
import KbxSummaryBar from './KbxSummaryBar.vue'
|
|
import KbxTemplateContextBar from './KbxTemplateContextBar.vue'
|
|
import KbxTemplateStateBoundary from './KbxTemplateStateBoundary.vue'
|
|
import KbxProblemFeedback from './KbxProblemFeedback.vue'
|
|
import KbxSectionHeader from './KbxSectionHeader.vue'
|
|
|
|
withDefaults(defineProps<{
|
|
screen:KbxScreenDefinition
|
|
selectionCount?:number
|
|
can?:(permission:string)=>boolean
|
|
breadcrumb?:string
|
|
context?:KbxTemplateContext|null
|
|
contentState?:KbxAsyncState
|
|
refreshing?:boolean
|
|
summaryItems?:KbxSummaryItem[]
|
|
exceptionCounters?:KbxWorkQueueCounter[]
|
|
activeExceptionKey?:string|null
|
|
problem?:KbxProblem|null
|
|
problemActionAllowlist?:readonly string[]
|
|
emptyTitle?:string
|
|
emptyDetail?:string
|
|
emptyActionLabel?:string
|
|
errorTitle?:string
|
|
errorDetail?:string
|
|
retryLabel?:string
|
|
errorRetryable?:boolean
|
|
queueTitle?:string
|
|
queueDescription?:string
|
|
queueCount?:number
|
|
}>(), { context:null, contentState:'ready', refreshing:false, summaryItems:()=>[], exceptionCounters:()=>[], activeExceptionKey:null, problem:null, problemActionAllowlist:()=>[], emptyTitle:'', emptyDetail:'', emptyActionLabel:'', errorTitle:'', errorDetail:'', retryLabel:'다시 조회', errorRetryable:true, queueTitle:'작업 Queue', queueDescription:'' })
|
|
const emit=defineEmits<{ command:[string]; exceptionFilter:[string|null]; problemAction:[string]; retryProblem:[]; dismissProblem:[]; emptyAction:[] }>()
|
|
</script>
|
|
|
|
<template>
|
|
<KbxScreenFrame expected-type="queue" template-code="T06" :screen="screen" :selection-count="selectionCount" :can="can" :breadcrumb="breadcrumb" :suppress-default-utility="Boolean($slots.utility)" @command="emit('command',$event)">
|
|
<template #utility><slot name="utility" /></template><template #notice><KbxProblemFeedback v-if="problem" :problem="problem" :allowed-action-ids="problemActionAllowlist" @action="emit('problemAction',$event)" @retry="emit('retryProblem')" @dismiss="emit('dismissProblem')" /><slot name="notice" /></template>
|
|
<div v-if="$slots.search" class="kbx-queue-page__search" data-kbx-surface="search"><slot name="search" /></div>
|
|
<section v-if="$slots.summary || summaryItems.length" class="kbx-queue-page__summary" data-kbx-surface="work-summary"><slot name="summary"><KbxSummaryBar :items="summaryItems" /></slot></section>
|
|
<section v-if="$slots.exceptions || exceptionCounters.length" class="kbx-queue-page__exceptions" data-kbx-surface="exception-summary"><slot name="exceptions"><KbxExceptionSummary :counters="exceptionCounters" :active-key="activeExceptionKey" @select="emit('exceptionFilter',$event)" /></slot></section>
|
|
<div v-if="$slots.context || context" data-kbx-surface="context"><slot name="context"><KbxTemplateContextBar :context="context" /></slot></div>
|
|
<section v-if="$slots.contextual" class="kbx-queue-page__contextual" data-kbx-surface="bulk-action"><slot name="contextual" /></section>
|
|
<main class="kbx-queue-page__content" data-kbx-surface="queue/content"><slot name="queue-heading"><KbxSectionHeader :title="queueTitle" :description="queueDescription" :count="queueCount" /></slot><div class="kbx-queue-page__content-body"><KbxTemplateStateBoundary :state="contentState" :refreshing="refreshing" idle-action-label="조회 F3" :empty-title="emptyTitle" :empty-detail="emptyDetail" :empty-action-label="emptyActionLabel" :error-title="errorTitle" :error-detail="errorDetail" :retry-label="retryLabel" :error-retryable="errorRetryable" @idle-action="emit('command','search')" @empty-action="emit('emptyAction')" @retry="emit('command','search')"><slot name="content" /></KbxTemplateStateBoundary></div></main>
|
|
<footer v-if="$slots.footer" class="kbx-queue-page__footer" data-kbx-surface="footer"><slot name="footer" /></footer>
|
|
<div v-if="$slots.detail" data-kbx-surface="detail"><slot name="detail" /></div>
|
|
</KbxScreenFrame>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.kbx-queue-page__summary,.kbx-queue-page__exceptions{border:var(--kbx-border-width) solid var(--kbx-color-border);background:var(--kbx-color-surface);padding:var(--kbx-space-2);box-shadow:var(--kbx-shadow-shell)}.kbx-queue-page__summary{border-left:var(--kbx-accent-border-width) solid var(--kbx-color-module-accent)}.kbx-queue-page__exceptions{border-left:var(--kbx-accent-border-width) solid var(--kbx-color-warning)}.kbx-queue-page__summary :deep(.kbx-summary-bar){border-top:0}.kbx-queue-page__content{min-height:var(--kbx-content-min-height);flex:1;display:flex;flex-direction:column;border:var(--kbx-border-width) solid var(--kbx-color-border);background:var(--kbx-color-surface);box-shadow:var(--kbx-shadow-shell)}.kbx-queue-page__content :deep(.kbx-section-header){padding:0 var(--kbx-space-2);background:var(--kbx-color-section-heading)}.kbx-queue-page__content-body{min-height:0;flex:1}.kbx-queue-page__contextual{position:sticky;top:var(--kbx-command-bar-height);z-index:6}.kbx-queue-page__footer{min-height:var(--kbx-control-sm);border-top:var(--kbx-border-width) solid var(--kbx-color-border)}
|
|
</style>
|