vue computed的传参和element-plus弹窗的显示过程

<template>
    <el-tag :type="computedProcessTypeStyle(scope.row.processType)" size="large">
                {{ computedProcessTypeName(scope.row.processType) }}
   </el-tag>
 </template>
 
<script setup lang="ts">
const computedProcessTypeStyle = computed(() => (type: string) => {
  if (type === 'new' || type === 'fail') {
    return 'danger';
  }
  if (type === 'processed') {
    return 'success';
  }
  if (type === 'ticket') {
    return '';
  }
  if (type === 'close') {
    return 'info';
  }
  if (type === 'unknown') {
    return 'warning';
  }
});
</script>

<template>
  <el-dialog v-model="visible" title="选择组件" width="35%" :height="600">
	...
  </el-dialog>
</template>
<script setup lang="ts">
  const visible = defineModel('visible', { local: true, default: false });
  
</script>

<template>
      <ReportTreeDialog v-model:visible="reportTreeVisible" ></ReportTreeDialog>
</template>
<script setup lang="ts">
  import ReportTreeDialog from './form-item/ReportTreeDialog.vue';
</script>