schedule.vue 1.68 KB
<template>
  <div>
    <el-progress :percentage="num" :format="format" />
  </div>
</template>

<script setup >
import { ref, watch } from 'vue'
const props = defineProps({
  auditProcess: {}
})
const rList = ref([])
const rInx = ref()
const num = ref(0)
const format = ref()
watch(() => props.auditProcess, (newV, oldV) => {
  if (newV) {
    if (props.auditProcess) {
      rList.value = newV.rules
      rInx.value = newV.nowLevel
      if (!rInx.value) {
        num.value = 0
        format.value = (percentage) => {
          percentage = 0 + '/' + 0 
          return percentage
        }
        return 
      }
      if (rInx.value < 0) {
        rInx.value = rList.value?.findIndex(item => item == (rInx.value * -1))
        if (rInx.value <= 0) {
          num.value = 0
          format.value = (percentage) => {
            percentage = 0 + '/' + rList.value?.length 
            return percentage
          }
        } else {
          num.value = ((rInx.value / rList.value?.length) * 100).toFixed(0)
          format.value = (percentage) => {
            percentage = rInx.value + '/' + rList.value?.length 
            return percentage
          }
        }
      } else {
        rInx.value = rList.value?.findIndex(item => item == rInx.value) + 1
        num.value = ((rInx.value / rList.value?.length) * 100).toFixed(0)
        format.value = (percentage) => {
          percentage = rInx.value + '/' + rList.value?.length 
          return percentage
        }
      }
    } else {
      format.value = (percentage) => {
        percentage = 0 + '/' + 0 
        return percentage
      }
    }
  }
}, { deep: true, immediate: true })


defineExpose({
  open

})
</script>

<style scope>

</style>