riku
2023-12-25 440522ea896377c45ffd80f4b70927d27e701c64
src/views/fysp/evaluation/components/precheck/CompCheckSource.vue
@@ -1,10 +1,47 @@
<template>
  <el-card shadow="never">
    Never2
    <template #header>
      <div><el-text tag="b" size="large">数据源检查</el-text></div>
      <el-text size="small" type="info">检查评估所需数据源是否完整</el-text>
    </template>
    <FormCol>
      <el-form-item align="middle" v-for="(v, i) in checkResults" :key="i">
        <el-col :span="14">
          <el-row align="middle">
            <el-text size="default" :class="v.required ? 'required' : 'not-required'">*</el-text>
            <el-text size="default">{{ v.name }}</el-text>
          </el-row>
        </el-col>
        <el-col :span="5">
          <el-row align="middle">
            <el-space>
              <template v-if="v.loading">
                <el-icon class="is-loading"><Loading /></el-icon>
                <el-text size="default" type="default">检查中...</el-text>
              </template>
              <template v-else-if="v.pass">
                <el-icon color="var(--el-color-success)"><Check /></el-icon>
                <el-text size="default" type="success">通过</el-text>
              </template>
              <template v-else>
                <el-icon color="var(--el-color-danger)"><Close /></el-icon>
                <el-text size="default" type="danger">缺失</el-text>
              </template>
            </el-space>
          </el-row>
        </el-col>
        <el-col :span="5">
          <el-button v-if="!v.pass" type="primary" size="small" @click="goto(v.path)">
            去完善
            <el-icon style="margin-left: 4px"><Right /></el-icon>
          </el-button>
        </el-col>
      </el-form-item>
    </FormCol>
    <template #footer>
      <el-row justify="space-around">
        <el-button type="primary" size="default" @click="lastStep">上一步</el-button>
        <el-button type="primary" size="default" @click="nextStep">下一步</el-button>
        <el-button :disabled="!checkPass" type="primary" size="default" @click="nextStep">下一步</el-button>
      </el-row>
    </template>
  </el-card>
@@ -22,18 +59,88 @@
  emits: ['update:modelValue'],
  data() {
    return {
      // 数据源检查记录
      checkResults: [
        {
          required: true,
          name: '自动评估规则表',
          loading: false,
          pass: true,
          path: ''
        },
        {
          name: '现场监管巡查总任务',
          loading: false,
          pass: true,
          path: ''
        },
        {
          name: '现场监测数据',
          loading: false,
          pass: false,
          path: ''
        },
        {
          name: '现场监管问题类型',
          loading: false,
          pass: true,
          path: ''
        },
        {
          name: '信访投诉',
          loading: false,
          pass: true,
          path: ''
        },
        {
          name: '行政处罚',
          loading: false,
          pass: true,
          path: ''
        }
      ]
    };
  },
  computed: {
    /**
     * 判断数据源检查是否通过
     * 全部加载完成后,必要项必须通过,可选项非必须通过
     */
    checkPass() {
      let res = true;
      this.checkResults.forEach((e) => {
        if (e.loading) {
          res = res && false
        } else if (e.required) {
          res = res && e.pass;
        }
      });
      return res;
    }
  },
  methods: {
    // 跳转下一步
    nextStep() {
      this.$emit('update:modelValue', this.modelValue + 1);
    },
    // 跳转下一步
    // 跳转上一步
    lastStep() {
      this.$emit('update:modelValue', this.modelValue - 1);
    },
    goto(path) {
      if (path && path != '') {
        this.$router.push(path);
      }
    }
  }
};
</script>
<style scoped>
.required {
  color: var(--el-color-danger);
}
.not-required {
  color: transparent;
}
</style>