<template>
  <div class="container">
    <el-tabs v-model="activeName" style="background-color: #EEEEEE;" @tab-click="handleClick">
      <el-tab-pane
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :name="item.value"
      >
        <comment-page :comment-type="item.value" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import page from './page'
import { setStatus } from '@/utils'

export default {
  name: 'CommentManagement',

  components: {
    'comment-page': page
  },

  data() {
    return {
      options: setStatus(['全部', '已查看', '未查看'], ['ALL', 'READ', 'UNREAD']),
      activeName: 'ALL'
    }
  },

  methods: {
    handleClick(e) {
    }
  }
}
</script>

<style scoped>
.btn-right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
</style>
