<template>
  <div class="wrap">
    <div class="empty-box">
      <img src="/src/assets/workflow/Frame.png" class="empty-icon" />
      <div class="title">{{ title }}</div>
      <div class="desc">{{ desc }}</div>
    </div>
  </div>
</template>
<script lang="ts">
  import { useI18n } from '/@/hooks/web/useI18n';
  const { t } = useI18n();
  const defaultMsg = t('暂无数据');

  export default {};
</script>
<script setup lang="ts">
  defineProps({
    title: {
      type: String,
      default: defaultMsg,
    },
    desc: {
      type: String,
      default: defaultMsg,
    },
  });
</script>

<style lang="less" scoped>
  .wrap {
    width: 100%;
    height: 100%;
    min-height: 80px;
  }

  .empty-box {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  .empty-icon {
    font-size: 60px;
  }

  .title {
    margin: 22px 0 10px;
    color: #333;
    line-height: 14px;
  }

  .desc {
    font-size: 14px;
    color: #c3c8cf;
    line-height: 14px;
  }
</style>
