<template>
  <div class="view-bar">
    <div class="content">
      <span class="view-bar-name" >{{viewBarData.index}}、</span>
      <span v-if="viewBarData.formBusinessName" class="view-bar-name">{{viewBarData.formBusinessName}}</span>
      <span v-if="viewBarData.assigneeName">处理人：{{viewBarData.assigneeName}}</span>
      <span v-if="viewBarData.status">状态：{{viewBarData.status}}</span>
      <span v-if="viewBarData.startTime">开始时间：{{viewBarData.startTime}}</span>
      <span v-if="viewBarData.endTime">完成时间：{{viewBarData.endTime}}</span>
    </div>
  </div>
</template>

<script>
module.exports = {
  props: {
    viewBarData: {
      type: Object,
      default: () => {}
    },
  },
  data() {
    return {
    }
  },
  watch: {
  },
  methods: {

  },
}
</script>

<style scoped>
.view-bar .content span {
  margin-right: 20px;
  font-size: 14px;
}
.view-bar .content span:first-child {
  margin-right: 0px;
}
.view-bar .view-bar-name {
  font-size: 14px;
  font-weight: bold;
  color: #5AC4FC;
}
</style>
