fuliqi
2024-04-19 19e559358b907cff913d7aa277fa04496b7fe0a6
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
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
<template>
  <div>
 
    <div class="container">
      <el-row type="flex" justify="start">
        <el-col :span="24">
          <h3 style="color: rgb(104,104,103);padding-top: 20px;padding-bottom: 20px;">视频考核规则</h3>
        </el-col>
      </el-row>
 
      <el-row type="flex" justify="start" v-for="(items, index) in groupData(videoData)">
        <el-col :span="4" v-for="item in items" :key="item.id">
            <el-card :style="{ borderBottomColor: getStatusColor(item.auditStatus) }"style="width:150px;height: 150px;text-align: center;border-bottom-width: 3px;">
              <i style="font-size: 40px;padding: 15px;" :class="item.icon"></i>
              <div style="font-size:12px; text-align: center; height: 25px;">{{ item.name }} </div>
              <div class="bottom clearfix">
                <el-button type="text" class="button" @click="handleUpdate(item)">修改</el-button>
              </div>
            </el-card>
          <br/>
        </el-col>
      </el-row>
    </div>
 
    <div class="container">
      <el-row type="flex" justify="center">
        <el-col :span="24">
          <h3 style="color: rgb(104,104,103);padding-top: 20px;padding-bottom: 20px;">车辆考核规则</h3>
        </el-col>
      </el-row>
 
      <el-row type="flex" justify="start" v-for="(items, index) in groupData(carData)">
        <el-col :span="4" v-for="item in items" :key="item.id">
          <el-card :style="{ borderBottomColor: getStatusColor(item.auditStatus) }"style="width:150px;height: 150px;text-align: center;border-bottom-width: 3px;">
            <i style="font-size: 40px;padding: 15px;" :class="item.icon"></i>
            <div style="font-size:12px; text-align: center; height: 25px;">{{ item.name }} </div>
            <div class="bottom clearfix">
              <el-button type="text" class="button" @click="handleUpdate(item)">修改</el-button>
            </div>
          </el-card>
          <br/>
        </el-col>
      </el-row>
    </div>
 
    <div class="container">
      <el-row type="flex" justify="center">
        <el-col :span="24">
          <h3 style="color: rgb(104,104,103);padding-top: 20px;padding-bottom: 20px;">人脸考核规则</h3>
        </el-col>
      </el-row>
 
      <el-row type="flex" justify="start" v-for="(items, index) in groupData(faceData)">
        <el-col :span="4" v-for="item in items" :key="item.id">
          <el-card :style="{ borderBottomColor: getStatusColor(item.auditStatus) }"style="width:150px;height: 150px;text-align: center;border-bottom-width: 3px;">
            <i style="font-size: 40px;padding: 15px;" :class="item.icon"></i>
            <div style="font-size:12px; text-align: center; height: 25px;">{{ item.name }} </div>
            <div class="bottom clearfix">
              <el-button type="text" class="button" @click="handleUpdate(item)">修改</el-button>
            </div>
          </el-card>
          <br/>
        </el-col>
      </el-row>
    </div>
    <br/><br/><br/><br/>
 
    <!-- 添加或修改考核规则对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="规则名称" prop="ruleName">
          <el-input v-model="form.name" placeholder="请输入规则名称"/>
        </el-form-item>
        <el-form-item label="考核类型" prop="examineCategory">
          <el-select v-model="form.examineCategory" placeholder="考核类型">
            <el-option
              v-for="dict in dict.type.platform_examine_category"
              :key="dict.value"
              :label="dict.label"
              :value="parseInt(dict.value)"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="规则类型" prop="ruleCategory">
          <el-select v-model="form.ruleCategory" placeholder="规则类型">
            <el-option
              v-for="dict in dict.type.platform_rule_category"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="规则描述" prop="ruleDescription">
          <el-input v-model="form.ruleDescription" type="textarea" :autosize="{ minRows: 4, maxRows: 6}" placeholder="请输入规则名称"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
 
 
  <!-- 审核考核规则对话框 -->
  <el-dialog :title="title" :visible.sync="auditOpen" width="600px" append-to-body>
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
      <el-form-item label="规则名称" prop="ruleName">
        <el-input v-model="form.ruleName" placeholder="请输入规则名称" disabled/>
      </el-form-item>
      <el-form-item label="考核类型" prop="examineCategory">
        <el-select v-model="form.examineCategory" placeholder="考核类型" disabled>
          <el-option
            v-for="dict in dict.type.platform_examine_category"
            :key="dict.value"
            :label="dict.label"
            :value="parseInt(dict.value)"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="规则类型" prop="ruleCategory">
        <el-select v-model="form.ruleCategory" placeholder="考核类型" disabled>
          <el-option
            v-for="dict in dict.type.platform_rule_category"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="规则描述" prop="ruleDescription">
        <el-input v-model="form.ruleDescription" type="textarea" placeholder="请输入规则名称" disabled/>
      </el-form-item>
 
 
      <el-form-item label="审核结果" prop="auditState" >
        <el-radio-group v-model="form.auditState">
        <el-radio :label="1">通过</el-radio>
        <el-radio :label="2">驳回</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="审核说明" prop="auditDescription" >
        <el-input v-model="form.auditDescription" type="textarea" show-word-limit maxlength="100" />
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm">确 定</el-button>
      <el-button @click="cancel">取 消</el-button>
    </div>
  </el-dialog>
 
  </div>
</template>
 
<script>
import { listCheckRule, getCheckRule, delCheckRule, addCheckRule, updateCheckRule } from "@/api/platform/check-rule";
import { templateSelect} from   "@/api/platform/check-template"
export default {
  name: "CheckRule",
  dicts: ['platform_audit_state','platform_rule_category'],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      templateList:[],
      // 考核规则表格数据
      checkRuleList: [],
      daterangeCreateTime: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 是否显示弹出层
      auditOpen: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        ruleName: null,
        createTime: null,
        ruleCategory: null,
        templateId: null,
      },
      videoData: [
        { name: '平台在线率', icon: 'el-icon-connection', ruleDescription: '省厅对市级共享和联网平台进行实时监测,市级共享/联网平台每月离线总时长在30分钟以内的平台在线率为100%,每超过30分钟扣10个百分点,扣完为止。' +
            '每个月底最后4个工作日为预留的调试时间,可进行平台对接调试或者升级改造,平台对接调试或者升级改造须提前向省厅报备。除' +
            '每月底4个工作日,其余时间报备每次扣10个百分点,每次报备不超过24小时,每月不超过3次。(重大特殊情况,如重大自然灾害等报厅领导批示)', examineCategory:0,ruleCategory:'0', auditStatus: 'approved'},
        { name: '一机一档合格率', icon: 'el-icon-folder', ruleDescription: '运维平台每月初对各地上传至联网平台的“一机一档”数据库中的摄像机档案数据进行质量校验,对必填项填报准确、规范的档案数据视为合格。\n' +
            '一机一档合格率=合格的档案数据条数/档案数据总条数', examineCategory:0,ruleCategory:'0', auditStatus: 'pending' },
        { name: '一机一档注册率', icon: 'el-icon-folder', ruleDescription: '运维平台每月对省厅视图库的前端摄像机点位数量和一机一档的数据匹配。(上月底最后一天确认一机一档车辆、人脸点位数,1号由视图库侧进行考核)\n' +
            '人脸卡口资产注册率=资产库登记在用的人脸卡口数量/(未注册的在线人脸卡口数量+资产库登记在用的人脸卡口数量)\n' +
            '车辆卡口资产注册率=资产库登记在用的人脸卡口数量/(未注册的在线人脸卡口数量+资产库登记在用的人脸卡口数量)', examineCategory:0,ruleCategory:'0', auditStatus: 'rejected' },
        { name: '档案考核比', icon: 'el-icon-folder', ruleDescription: '描述信息', examineCategory:0,ruleCategory:'0',auditStatus: 'approved' },
        { name: '点位在线率', icon: 'el-icon-search', ruleDescription: '描述信息',  examineCategory:0,ruleCategory:'0',auditStatus: 'approved'},
        { name: '录像可用率', icon: 'el-icon-turn-off', ruleDescription: '描述信息',examineCategory:0,ruleCategory:'0',auditStatus: 'approved'},
        { name: '标注正确率', icon: 'el-icon-place', ruleDescription: '描述信息', examineCategory:0,ruleCategory:'0',auditStatus: 'approved' },
        { name: '校时正确率', icon: 'el-icon-place', ruleDescription: '描述信息', examineCategory:0,ruleCategory:'0',auditStatus: 'approved' },
        { name: '重点点位在线率', icon: 'el-icon-place', ruleDescription: '描述信息',  examineCategory:0,ruleCategory:'0',auditStatus: 'approved'},
        { name: '重点点位校时正确率', icon: 'el-icon-place', ruleDescription: '描述信息', examineCategory:0,ruleCategory:'0',auditStatus: 'approved' },
        { name: '重点指挥图像在线率', icon: 'el-icon-place', ruleDescription: '描述信息', examineCategory:0,ruleCategory:'0',auditStatus: 'approved' },
        { name: '视频图像资源安全管理', icon: 'el-icon-place', ruleDescription: '描述信息', examineCategory:0,ruleCategory:'0',auditStatus: 'approved' },
      ],
      carData: [
        { name: '视图库对接稳定性', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '点位在线率', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '联网卡口设备目录一致率', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '车辆卡口信息采集准确率', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '车辆卡口设备抓拍数据完整性', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '车辆卡口设备抓拍数据准确性', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '车辆卡口设备时钟准确性', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '车辆卡口设备抓拍数据上传及时性', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '车辆卡口设备url可用性', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '车辆卡口设备抓拍数据大图可用性', icon: 'el-icon-truck', ruleDescription: '描述信息', auditStatus: 'approved' },
      ],
      faceData: [
        { name: '视图库对接稳定性', icon: 'el-icon-alarm-clock', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '点位在线率', icon: 'el-icon-user', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '目录一致率', icon: 'el-icon-data-line', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '人脸卡口信息采集准确率', icon: 'el-icon-timer', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '设备抓拍图片合格性', icon: 'el-icon-money', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '设备抓拍图片时钟准确性', icon: 'el-icon-data-analysis', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '抓拍人脸数据上传及时性', icon: 'el-icon-data-analysis', ruleDescription: '描述信息', auditStatus: 'approved' },
        { name: '人脸卡口设备抓拍数据大图可用性', icon: 'el-icon-data-analysis', ruleDescription: '描述信息', auditStatus: 'approved' },
      ],
      activeIndex: '0',
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        ruleName: [
          { required: true, message: "规则名称不能为空", trigger: "blur" }
        ],
      }
    };
  },
  created() {
    this.getList();
  },
  methods: {
    groupData(data) {
      // 将数据按每六个一组进行分组
      const groupedData = [];
      for (let i = 0; i < data.length; i += 6) {
        groupedData.push(data.slice(i, i + 6));
      }
      return groupedData;
    },
 
    /** 查询考核规则列表 */
    getList() {
      this.loading = true;
      if (null != this.daterangeCreateTime && '' != this.daterangeCreateTime) {
        this.queryParams["start"] = this.daterangeCreateTime[0];
        this.queryParams["end"] = this.daterangeCreateTime[1];
      }
      listCheckRule(this.queryParams).then(response => {
        this.checkRuleList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.auditOpen = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        ruleName: null,
        ruleDetail: null,
        videoPointNum: null,
        vehicleCheckpointNum: null,
        faceChceckpointNum: null,
        createTime: null,
        updateTime: null,
        deleted: null
      };
      this.resetForm("form");
    },
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
    },
    getStatusColor(status) {
      switch (status) {
        case 'pending':
          return '#ffffff'; // '#00a1d6'蓝色,表示待审核
        case 'approved':
          return '#ffffff'; // '#00e297'绿色,表示已审核
        case 'rejected':
          return '#f56c6c'; // 红色,表示审核未通过
        default:
          return '#ffffff'; // 白色,默认状态
      }
    },
 
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加考核规则";
    },
    /** 修改按钮操作 */
    handleUpdate(item) {
      this.reset();
      const id = item.id || this.ids
      this.form = item;
      this.open = true;
      this.title = "修改考核规则";
    },
    /** 审核按钮操作 */
    handleAudit(row) {
      this.reset();
      const id = row.id || this.ids
      getCheckRule(id).then(response => {
        this.form = response.data;
        this.auditOpen = true;
        this.title = "审核考核规则";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateCheckRule(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.auditOpen = false;
              this.getList();
            });
          } else {
            addCheckRule(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.auditOpen = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal.confirm('是否确认删除考核规则编号为"' + ids + '"的数据项?').then(function() {
        return delCheckRule(ids);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
 
    /** 导出按钮操作 */
    handleExport() {
      this.download('system/checkRule/export', {
        ...this.queryParams
      }, `checkRule_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>
 
<style scoped>
.container {
  width: 90%;
  margin: 10px auto;
}
.el-menu{
  margin: 10px auto;
}
</style>