web_dist/src/components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/OrderProgress.vue

<template>
  <div class="order__progress" v-show="isShow()">
    <div>
      X
    </div>
    <div class="steps__mian">
      <el-steps direction="vertical" :active="active">
        <el-step v-for="(item,index) in stepList"
                 :title="item"
                 :description="descriptionFunc(index)"/>
      </el-steps>
    </div>
  </div>
</template>

<script setup name='OrderProgress'>
let stepList = ['录入医嘱', '确认医嘱', '执行医嘱', '停止医嘱']
const descriptionList = ref([])
const active = ref(1)

const isShow = () => {
  return false
}

const descriptionFunc = (index) => {
  return descriptionList.value[index]
}
const fillOrder = (val) => {
  descriptionList.value = []
  active.value = parseInt(val.statusFlag)
  if (val.statusFlag === '4') {
    active.value = 3
  } else if (val.statusFlag === '5') {
    active.value = 4
  }

  descriptionList.value.push(val.enterOperName + '\n' + val.enterTime)
  if (val.confirmTime) {
    descriptionList.value.push(val.signerName + ' ' + val.confirmTime)
  }
}

defineExpose({
  fillOrder
})

</script>

<style scoped lang="scss">
.order__progress {
  width: 190px;
  height: 100%;
  top: 0;
  right: 0;
  position: fixed;

  background-color: white;
  z-index: 999;

  .steps__mian {
    height: calc(100% - 40%);
  }
}
</style>