<template>
  <ul>
    <li class="flex justify-start items-center py-1 pr-4" v-for="(act, index) in data" :key="index + act">
      <span class="material-symbols-outlined disc text-sm align-middle mr-1">fiber_manual_record</span>
      <span class="mr-2 block w-12">{{ act.category }}</span>
      <span class="px-2 py-1 border border-neutral-500 w-full whitespace-nowrap break-keep text-ellipsis overflow-hidden block">{{ act.task }}</span>
    </li>
  </ul>
</template>
<script>
export default {
  name: 'ResultDot',
  props:['timeResultData', 'select'],
    data() {
    return {
      data: null,
    }
  },
  watch: {
    timeResultData: {
      handler(newValue) {
        this.data = newValue;
      },
      immediate: true,
      deep: true,
    },
  },
  created() {
    this.data = this.select;
    this.$emitter.on('reset', data => this.data = data);
  },
}
</script>
