<template>
  <span class="table_row_status">
    <span :class=" statusNumToName(props.useStatus)?.themeClass "></span>
    {{ statusNumToName(props.useStatus)?.title  }}
  </span>
</template>  

<script setup lang="ts">
interface statusItm {
  statusFlag:Number | String,
  title:String,
  themeClass: 'not_included_icon' | 'no_release_icon' 
              | 'normal_icon' | 'abnormal_icon' | 'audit_icon' 
              | 'yes_release_icon' | 'right_icon' | 'ready_close_icon' | 'need_summary_icon'
}

const props = defineProps({
    useStatus:{
        required:true,
        type:[String,Number,null],
        default:null
    },
    statusMsg:{
      required:true,
      type:Array<statusItm>
    }
})
    
const statusNumToName=(useStatus)=>{
  let result =  props?.statusMsg?.find(item=>item.statusFlag == useStatus)
  if(result){
    return result
  }else{
    return {
      title:'',
      themeClass:''
    }
  }
}

</script>

<style lang="scss" scoped>

</style>