| | |
| | | <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 class="m-l-4"><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> |
| | |
| | | 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> |