<template>
<div id="centerRight1">
<div class="bg-color-black">
<div class="d-flex pt-2 pl-2">
<span>
<icon name="chart-line" class="text-icon"></icon>
</span>
<div class="d-flex">
<span class="fs-xl text mx-2">考核任务排行榜</span>
</div>
</div>
<div class="d-flex jc-center body-box">
<dv-scroll-board class="dv-scr-board" :config="config" />
</div>
</div>
</div>
</template>
<script>
import {
listRules, getRules, delRules, addRules, updateRules } from "@/api/rules/rules";
export default {
data() {
return {
config: {
header: ['考核任务名称', '驾驶员', '分数'],
data: [
// [{eventName}, '张三', "<span class='colorGrass'>是</span>"],
// ['暴雨考核', '李四', "<span class='colorRed'>是</span>"],
// ['暴风考核', '王五', "<span class='colorGrass'>是</span>"],
// ['暴雪考核', '赵雷', "<span class='colorGrass'>是</span>"],
// ['暴雪考核', '吕帅', "<span class='colorGrass'>是</span>"],
// ['暴雪考核', '余征', "<span class='colorGrass'>否</span>"],
// ['暴雪考核', '李九', "<span class='colorGrass'>否</span>"],
// ['暴雪考核', '王五', "<span class='colorRed'>否</span>"],
// ['暴雪考核', '张三', "<span class='colorRed'>是</span>"],
// ['暴雪考核', '李四', "<span class='colorGrass'>否</span>"]
],
rowNum: 7, //表格行数
headerHeight: 35,
headerBGC: '#0f1325', //表头
oddRowBGC: '#0f1325', //奇数行
evenRowBGC: '#171c33', //偶数行
index: true,
columnWidth: [80,150,120],
align: ['center']
},
// 查询参数
queryParams: {
eventName: null,
roleId: undefined,
eventScore: null,
updateBy: null,
deptId: undefined
},
}
},
created() {
this.getList();
},
methods: {
/** 查询事件规则名称列表 */
getList() {
listRules(this.queryParams).then(response => {
let projectList = response.rows;
let arrList = [];
for (let i = 0; i < projectList.length; i++) {
let arr = [];
arr.push(projectList[i]['eventName']);
arr.push(projectList[i]['eventUserName']);
arr.push(projectList[i]['eventScore']);
arrList.push(arr);
}
this.config.data = arrList;
this.config = {
...this.config};//必不可少,不可省略
});
},
},
}
</script>
<style lang="scss" scoped>
$box-height: 410px;
$box-width: 500px;
#centerRight1 {
padding: 16px;
padding-top: 20px;
height: $box-height;
width: $box-width;
border-radius: 5px;
.bg-color-black {
height: $box-height - 30px;
border-radius: 10px;
}
.text {
color: #c3cbde;
}
.body-box {
border-radius: 10px;
overflow: hidden;
.dv-scr-board {
width: 500px;
height: 340px;
}
}
}
</style>
屏幕滚动代码(前端)
猜你喜欢
转载自blog.csdn.net/m0_56095048/article/details/130887676
今日推荐
周排行