<script setup lang="ts">
/**
 * 空状态组件
 */

defineProps<{
  description?: string
}>()
</script>

<template>
  <div class="empty-state">
    <div class="empty-icon">📦</div>
    <p class="empty-text">{{ description || '暂无数据' }}</p>
  </div>
</template>

<style lang="scss" scoped>
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
}

.empty-icon {
  font-size: 56px;
  margin-bottom: 16px;
  opacity: 0.6;
}

.empty-text {
  margin: 0;
  font-size: $font-size-md;
  color: $color-text-secondary;
}
</style>
