<template>
  <div style="height: 100%;">
    <div class="my-document-box">
      <div v-for="(item,i) in dateList" :key="i" :class="{'dee-active-row-background': index === i}" class="time dee-row-item" @click="timeSearch(item.value,i)">{{ item.label }}</div>
    </div>
  </div>
</template>

<script>
export default {
// import引入的组件需要注入到对象中才能使用
  components: {},

  props: {},

  data() {
    // 这里存放数据
    return {
      index: 0,
      dateList: [
        {
          label: '全部',
          value: 'all'
        },
        {
          label: '最近一天',
          value: -1
        },
        {
          label: '最近三天',
          value: -3
        },
        {
          label: '最近七天',
          value: -7
        },
        {
          label: '最近一个月',
          value: -30
        }
      ]
    }
  },
  // 监听属性 类似于data概念
  computed: {},
  // 监控data中的数据变化
  watch: {},
  // 生命周期 - 创建完成(可以访问当前this实例)
  created() {

  },
  // 生命周期 - 挂载完成(可以访问DOM元素)
  mounted() {
    this.timeSearch('all', 0)
  },
  activated() {
  },
  // 方法集合
  methods: {
    timeSearch(time, index) {
      this.index = index
      this.$emit('getVisitTime', time === 'all' ? '' : this.$utils.getComputeDay(time, ' 00:00:00'))
    }
  }
}
</script>
<style lang='scss'>

</style>