<template>
  <div class="demo-count-down-basic">
    <ui-count-down
      :value="deadline1"
      format="D天HH时mm分">
    </ui-count-down>
    <ui-count-down :value="deadline2">
    </ui-count-down>
    <ui-count-down :value="deadline3">
    </ui-count-down>
  </div>
</template>

<script>
import { CountDown } from "amumu-ui"
import { format } from "date-fns"

const dateTime = Date.now() + 1000 * 60 * 8 + 1000 * 30

export default {
  components: {
    "ui-count-down": CountDown,
  },
  data() {
    return {
      deadline1: format(dateTime, "yyyy/MM/dd HH:mm:ss"),
      deadline2: format(dateTime, "yyyy年MM月dd日 HH:mm"),
      deadline3: dateTime,
    }
  },
}
</script>

<style lang="scss">
.demo-count-down-basic {
  .mm-count-down{
    margin-bottom: 8px;
  }
}
</style>
