1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
| <template>
| <el-card shadow="never">
| <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 :disabled="!checkPass" type="primary" size="default" @click="nextStep">下一步</el-button>
| </el-row>
| </template>
| </el-card>
| </template>
|
| <script>
| /**
| * 评估数据源完整性检查
| */
| export default {
| props: {
| // 步骤下标
| modelValue: Number
| },
| 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>
|
|
