<template>
  <div class="step">
    <el-steps direction="vertical" :active="stapesDate.length">
      <el-step v-for="i in stapesDate" :title="i.activityName">
        <template #description>
          <div class="direction">时间:{{ i.endTime}}</div>
          <div class="direction">
            分配人:{{ i.assigneeName  }}
          </div>
          <div class="direction">
            任务备注:{{ i.comment  }}
          </div>
        </template>
      </el-step>
    </el-steps>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
const stapesDate = ref([
  {
    activityName: 'xxxx',
    endTime: '2023-10-24',
    assigneeName: 'xxxx',
    comment: 'xxx'
  },
  {
    activityName: 'xxxx',
    endTime: '2023-10-24',
    assigneeName: 'xxxx',
    comment: 'xxx'
  }
])
onMounted(() => {

})
</script>

<style lang="scss" scoped>
.step {
  padding-left: 30px;
}
</style>