<script setup lang="ts">
import type { CustomerProfileDto } from '#/api/customer';

import { Drawer, Empty, Spin } from 'ant-design-vue';

import CustomerProfilePanel from '#/views/customer/profile/components/CustomerProfilePanel.vue';

interface Props {
  loading: boolean;
  open: boolean;
  profile: CustomerProfileDto | null;
}

const props = defineProps<Props>();

const emit = defineEmits<{
  (event: 'close'): void;
}>();
</script>

<template>
  <Drawer
    :open="props.open"
    width="860"
    title="客户完整画像"
    @close="emit('close')"
  >
    <Spin :spinning="props.loading">
      <template v-if="props.profile">
        <CustomerProfilePanel :profile="props.profile" />
      </template>
      <Empty v-else description="暂无画像" />
    </Spin>
  </Drawer>
</template>
