<script>
export default {
  name: "HiddenDangerTotal",
  props: {
    number: {
      type: String,
      default: "",
    },
    label: {
      type: String,
      default: "",
    },
    unit: {
      type: String,
      default: "",
    },
  },
};
</script>

<template>
  <div class="hidden-danger-total">
    <div class="hidden-danger-total__number">
      <linear-text :text="number" fontSize="22px"></linear-text>
      <linear-text
        :text="label"
        fontSize="12px"
        style="font-family: 'YouSheBiaoTiHei'"
      ></linear-text>
    </div>
    <linear-text
      :text="unit"
      fontSize="12px"
      style="font-family: 'YouSheBiaoTiHei'"
    ></linear-text>
  </div>
</template>

<style scoped lang="less">
.hidden-danger-total {
  background: url("../assets/images/bg003.svg") center no-repeat;
  width: 166px;
  height: 35px;
  display: flex;
  .hidden-danger-total__number {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding-right: 10px;
  }
}
</style>
