done 窑车温度
This commit is contained in:
parent
62ab300c60
commit
f5bab979c9
@ -1,15 +1,70 @@
|
||||
export default {
|
||||
const colors = {
|
||||
line: '#555'
|
||||
}
|
||||
|
||||
export default (x_data, y_data) => ({
|
||||
title: {
|
||||
text: "窑车温度",
|
||||
},
|
||||
grid: {
|
||||
show: true,
|
||||
top: 96,
|
||||
left: 52,
|
||||
right: 32,
|
||||
bottom: 24,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
|
||||
type: "category",
|
||||
data: Array(65)
|
||||
.fill(1)
|
||||
.map((val, index) => {
|
||||
return val + index;
|
||||
}),
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: colors.line
|
||||
},
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
type: "value",
|
||||
name: "温度",
|
||||
nameTextStyle: {
|
||||
fontSize: 18,
|
||||
align: "right",
|
||||
verticalAlign: "bottom",
|
||||
lineHeight: 36,
|
||||
padding: 10,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors.line,
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: '{value} ℃'
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: '#ddd'
|
||||
}
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
formatter: '<strong style="font-size: 16px">位置</strong> ({b}) <span style="font-size: 16px; font-weight: bold;">{c}</span> ℃'
|
||||
},
|
||||
dataZoom: {
|
||||
type: 'inside'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [150, 230, 224, 218, 135, 147, 260],
|
||||
type: 'line'
|
||||
}
|
||||
]
|
||||
};
|
||||
data: y_data,
|
||||
// data: Array(65)
|
||||
// .fill(1)
|
||||
// .map((val) => Math.floor(Math.random() * 1000)),
|
||||
type: "line",
|
||||
},
|
||||
],
|
||||
})
|
@ -5,10 +5,10 @@ export default [
|
||||
// { prop: "createTime", label: "添加时间", filter: timeFilter },
|
||||
// { prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent
|
||||
// { prop: "stateDictValue", label: "温度", subcomponent: StateSelect },
|
||||
{ prop: "code", label: "位置" },
|
||||
{ prop: "temp1", label: "温度" },
|
||||
{ prop: "press1", label: "窑内压力" },
|
||||
{ prop: "press2", label: "车下压力" },
|
||||
{ width: 60, prop: "code", label: "位置" },
|
||||
{ width: 60, prop: "temp1", label: "温度" },
|
||||
{ width: 80, prop: "press1", label: "窑内压力" },
|
||||
{ width: 80, prop: "press2", label: "车下压力" },
|
||||
{ prop: "createTime", label: "时间", filter: timeFilter },
|
||||
// { prop: "endTime", label: "结束时间", filter: timeFilter },
|
||||
// {
|
||||
|
@ -36,7 +36,7 @@
|
||||
|
||||
<script>
|
||||
import BaseListTable from "@/components/BaseListTable.vue";
|
||||
import chartConfig from "./configs/chart";
|
||||
import loadChartConfig from "./configs/chart";
|
||||
import tableConfig from "./configs/tableProps";
|
||||
import * as echarts from "echarts";
|
||||
|
||||
@ -48,7 +48,6 @@ export default {
|
||||
return {
|
||||
visible: false,
|
||||
hisId: null,
|
||||
chartConfig,
|
||||
tableConfig,
|
||||
chart: null,
|
||||
dataList: [],
|
||||
@ -98,26 +97,27 @@ export default {
|
||||
} else {
|
||||
this.dataList.splice(0);
|
||||
}
|
||||
this.dataList = [
|
||||
{ id: 1, code: 1, press1: 1, press2: 1, createTime: "2023-4-21 01:00:00", temp1: 1000 },
|
||||
{ id: 2, code: 2, press1: 2, press2: 2, createTime: "2023-4-21 02:00:00", temp1: 2000 },
|
||||
{ id: 3, code: 3, press1: 3, press2: 3, createTime: "2023-4-21 03:00:00", temp1: 3000 },
|
||||
{ id: 4, code: 4, press1: 4, press2: 4, createTime: "2023-4-21 04:00:00", temp1: 4000 },
|
||||
{ id: 5, code: 5, press1: 5, press2: 5, createTime: "2023-4-21 05:00:00", temp1: 5000 },
|
||||
{ id: 6, code: 6, press1: 6, press2: 6, createTime: "2023-4-21 06:00:00", temp1: 6000 },
|
||||
{ id: 7, code: 7, press1: 7, press2: 7, createTime: "2023-4-21 07:00:00", temp1: 7000 },
|
||||
{ id: 8, code: 8, press1: 8, press2: 8, createTime: "2023-4-21 08:00:00", temp1: 8000 },
|
||||
{ id: 9, code: 9, press1: 9, press2: 9, createTime: "2023-4-21 09:00:00", temp1: 9000 },
|
||||
{ id: 10, code: 10, press1: 10, press2: 10, createTime: "2023-4-21 10:00:00", temp1: 10000 },
|
||||
{ id: 11, code: 11, press1: 11, press2: 11, createTime: "2023-4-21 11:00:00", temp1: 11000 },
|
||||
{ id: 12, code: 12, press1: 12, press2: 12, createTime: "2023-4-21 12:00:00", temp1: 12000 },
|
||||
];
|
||||
// this.dataList = [
|
||||
// { id: 1, code: 1, press1: 1, press2: 1, createTime: "2023-4-21 01:00:00", temp1: 1000 },
|
||||
// { id: 2, code: 2, press1: 2, press2: 2, createTime: "2023-4-21 02:00:00", temp1: 2000 },
|
||||
// { id: 3, code: 3, press1: 3, press2: 3, createTime: "2023-4-21 03:00:00", temp1: 3000 },
|
||||
// { id: 4, code: 4, press1: 4, press2: 4, createTime: "2023-4-21 04:00:00", temp1: 4000 },
|
||||
// { id: 5, code: 5, press1: 5, press2: 5, createTime: "2023-4-21 05:00:00", temp1: 5000 },
|
||||
// { id: 6, code: 6, press1: 6, press2: 6, createTime: "2023-4-21 06:00:00", temp1: 6000 },
|
||||
// { id: 7, code: 7, press1: 7, press2: 7, createTime: "2023-4-21 07:00:00", temp1: 7000 },
|
||||
// { id: 8, code: 8, press1: 8, press2: 8, createTime: "2023-4-21 08:00:00", temp1: 8000 },
|
||||
// { id: 9, code: 9, press1: 9, press2: 9, createTime: "2023-4-21 09:00:00", temp1: 9000 },
|
||||
// { id: 10, code: 10, press1: 10, press2: 10, createTime: "2023-4-21 10:00:00", temp1: 10000 },
|
||||
// { id: 11, code: 11, press1: 11, press2: 11, createTime: "2023-4-21 11:00:00", temp1: 11000 },
|
||||
// { id: 12, code: 12, press1: 12, press2: 12, createTime: "2023-4-21 12:00:00", temp1: 12000 },
|
||||
// ];
|
||||
});
|
||||
},
|
||||
drawChart() {
|
||||
// 根据 dataList 绘制折线图
|
||||
if (!this.chart) this.chart = echarts.init(document.getElementById("temp-chart"));
|
||||
this.chart.setOption(this.chartConfig);
|
||||
// const y_data = Array(65).fill(0)
|
||||
this.chart.setOption(loadChartConfig(null, this.dataList.map(i => i.temp1)));
|
||||
},
|
||||
handleOperate() {},
|
||||
handlePageChange(page) {
|
||||
@ -147,7 +147,7 @@ export default {
|
||||
.data-list,
|
||||
.temp-chart {
|
||||
/* border: 1px solid #ccc; */
|
||||
width: 45%;
|
||||
width: 35%;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
}
|
||||
@ -157,7 +157,7 @@ export default {
|
||||
/* margin-left: 18px; */
|
||||
padding-left: 10px;
|
||||
margin-left: 10px;
|
||||
border-left: 1px solid #ccc;
|
||||
background-color: lightblue;
|
||||
/* border-left: 1px solid #ccc; */
|
||||
/* background-color: lightblue; */
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user