riku
2024-10-22 a7ac91bc5ae3c2ce0badca1ae9fc7ed57af95758
src/components/list-item/ItemSubTask.vue
@@ -1,6 +1,21 @@
<template>
  <div class="wrapper">
    <el-row justify="space-between" class="m-t-4">
      <el-col :span="20">
    <div class="text-title">
          <el-tag
            size="small"
            :type="statusType.type"
            effect="plain"
            class="m-r-4 m-b-4"
          >
            <el-space :size="4">
              <el-icon size="16">
                <component :is="statusType.icon"></component>
              </el-icon>
              {{ item.status }}
            </el-space>
          </el-tag>
      {{ item.name }}
    </div>
    <div class="text-info">
@@ -25,12 +40,29 @@
      </div>
      {{ item.executorrealtimes }}
    </div>
    <el-row justify="end" style="margin-top: 4px">
        <el-space class="m-t-4">
          <el-tag size="small" type="info" effect=""
            >问题:{{ status.proNum }}</el-tag
          >
          <el-tag size="small" type="info" effect=""
            >整改:{{ status.changeNum }}</el-tag
          >
          <el-tag size="small" :type="changePerType" effect=""
            >整改率:{{ status.changePer }}</el-tag
          >
        </el-space>
      </el-col>
      <el-col :span="4">
      <slot :item="item"></slot>
      </el-col>
    </el-row>
  </div>
</template>
<script setup>
import { ref, watch, computed } from 'vue';
import taskApi from '@/api/fysp/taskApi';
import ProCheckProxy from '@/views/fysp/check/ProCheckProxy';
/**
 * 监管对象
 */
@@ -40,6 +72,72 @@
    default: () => {}
  }
});
const loading = ref(false);
const proList = ref([]);
const status = ref({});
const statusType = computed(() => {
  switch (props.item.status) {
    case '未执行':
      return {
        type: 'danger',
        icon: 'WarningFilled'
      };
    case '正在执行':
      return {
        type: 'success',
        icon: 'Timer'
      };
    case '已结束':
      return {
        type: 'info',
        icon: 'SuccessFilled'
      };
    default:
      return {
        type: 'danger',
        icon: 'Warning'
      };
  }
});
const changePerType = computed(() => {
  if (status.value.changeNum == 0) {
    if (status.value.proNum == 0) {
      return 'success';
    } else {
      return 'danger';
    }
  } else if (status.value.proNum == status.value.changeNum) {
    return 'success';
  } else {
    return 'warning';
  }
});
watch(
  () => props.item,
  (nV, oV) => {
    if (nV != oV) {
      fetchProblems(nV);
    }
  },
  { immediate: true }
);
function fetchProblems(subtask) {
  loading.value = true;
  taskApi
    .getProBySubtask(subtask.stguid)
    .then((res) => {
      proList.value = res;
      status.value = ProCheckProxy.calProStatus(res);
    })
    .finally(() => {
      loading.value = false;
    });
}
</script>
<style scoped>
.wrapper {