<!--
/**
 * @fileoverview TaskListItem component
 * @license MIT
 * @author Rafal Pospiech <neuronet.io@gmail.com>
 * @package GanttElastic
 */
-->
<template>
  <div :style="{ ...root.style['task-list-item'] }" class="gantt-elastic__task-list-item" style="color: red">
    <item-column v-for="column in columns" :key="column._id" :column="column" :task="task">
      <task-list-expander
        v-if="column.expander"
        :tasks="[task]"
        :options="root.state.options.taskList.expander"
        type="taskList"
      />
    </item-column >
  </div>
</template>
<script>
import TaskListExpander from '../Expander.vue'
import ItemColumn from './ItemColumn.vue'

export default {
  name: 'TaskListItem',
  components: {
    TaskListExpander,
    ItemColumn
  },
  inject: ['root'],
  // eslint-disable-next-line vue/require-prop-types
  props: ['task'],
  data() {
    return {}
  },
  computed: {
    columns() {
      return this.root.state.options.taskList.columns
    }
  },
  methods: {
  }
}
</script>
