<template>
|
<div class="zdmax">
|
<div class="title">本月监测站点最大值TOP10</div>
|
<dv-scroll-board :config="config" />
|
</div>
|
</template>
|
|
<script>
|
import dayjs from "dayjs";
|
|
import { getWarningTopData, qxshControllerByTime } from "@/api/api.js";
|
import { de } from "element-plus/es/locale";
|
export default {
|
data() {
|
return {
|
config: {
|
header: ["名称", "数值", "日期"],
|
data: [],
|
// index: true,
|
columnWidth: [],
|
align: ["center", "center", "center"],
|
headerBGC: "transparent",
|
oddRowBGC: "transparent",
|
evenRowBGC: "transparent",
|
rowNum: 10,
|
},
|
};
|
},
|
mounted() {
|
// this.getList();
|
this.getWaringList();
|
},
|
methods: {
|
sequence(a, b) {
|
// console.log(a, b);
|
return b[1] - a[1];
|
},
|
async getWaringList() {
|
let dt = await getWarningTopData();
|
if (dt.code === 200 && dt.result.length > 0) {
|
const sotrArr = dt.result.sort((a, b) => b - a);
|
let result = sotrArr.slice(0, 10);
|
const data = result.map((item) => {
|
item.value = Number(item.value).toFixed(2);
|
item.time =
|
item.time.slice(0, 4) +
|
"-" +
|
item.time.slice(4, 6) +
|
"-" +
|
item.time.slice(6, 8);
|
return [item.name, item.value, item.time];
|
});
|
data.sort(this.sequence);
|
|
this.config.data = data;
|
this.config = { ...this.config };
|
}
|
},
|
async getList() {
|
const start = dayjs().subtract(1, "month").format("YYYYMMDDHH");
|
const end = dayjs().format("YYYYMMDDHH");
|
// console.log(start, end);
|
let dt = await qxshControllerByTime({
|
leftTime: start,
|
rightTime: end,
|
// name: e,
|
});
|
if (dt.code === 200 && dt.result.length > 0) {
|
const sotrArr = dt.result.sort((a, b) => b - a);
|
let result = sotrArr.slice(0, 10);
|
const data = result.map((item) => {
|
item.value = Number(item.value).toFixed(2);
|
return [item.name, item.value, item.time];
|
});
|
data.sort(this.sequence);
|
|
this.config.data = data;
|
this.config = { ...this.config };
|
}
|
// console.log(dt);
|
},
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.zdmax {
|
// position: absolute;
|
// top: 1049px;
|
// right: 70px;
|
width: 763px;
|
height: 684px;
|
background: url("~@/assets/img/xgzs/gjfx.png");
|
background-size: 100% 100%;
|
box-sizing: border-box;
|
padding: 40px;
|
.title {
|
font-size: 30px;
|
font-weight: bold;
|
color: #ffffff;
|
padding-bottom: 10px;
|
}
|
:deep(.dv-scroll-board) {
|
margin: 10px;
|
width: 100%;
|
height: 550px;
|
.header {
|
font-size: 24px;
|
}
|
.rows {
|
height: 449px;
|
.row-item {
|
font-size: 24px;
|
}
|
}
|
}
|
}
|
</style>
|
|
<style lang="less">
|
.zdmax {
|
}
|
</style>
|
