<template>
    <div style="overflow: auto;background-color: #FFFFFF;">
      <div class="row" v-for="(i,row) in defnames">
        <div :class="row.defname === selectdata.defname ? 'item selectIndex' : 'item'">
          {{ row.defname }}
          <br>
          {{i === (defnames.length) - 1 ? row.sendtime : row.finishtime}}
        </div>
        <div class="arrow glyphicon glyphicon-menu-down" v-if="i !== defnames.length-1" aria-hidden="true"></div>
      </div>
    </div>
</template>

<script>
  import  {HttpResetClass} from 'vue-client'
  export default {
    title: "流程节点",
    props:['selectdata'],
    data(){
      return{
        defnames: [] // 所有节点
      }
    },
    created () {
      this.initial()
    },
    methods :{
      async initial () {
        // 获取流程节点信息

        let data = {
          processid: this.selectdata.f_process_id
        }

        let res = await this.$resetpost(
          'rs/sql/getAllNode',
          {data: data},
          {resolveMsg: null, rejectMsg: '流程节点信息获取失败！！！'}
        )

        this.defnames = res.data
      }
    },
    watch:{
      'selectdata' () {
        this.initial()
      }
    }
  }
</script>

<style scoped>
.row{
  text-align: center;
  height: auto;
  margin-right: 20px;
}
.item{
  border-radius: 2em;
  border: 1px solid silver;
  line-height: 25px;
}
.arrow{
  width: 100%;
  color: #5ac0d9;
  font-weight: bold;
}
.selectIndex{
  background-color: #5ac0d9;
  color: #ffffff;
}
</style>
