This commit is contained in:
caoqianming 2024-12-30 15:04:44 +08:00
commit d0b79ab921
4 changed files with 79 additions and 68 deletions

View File

@ -160,7 +160,7 @@
<div class="flexItem"> <div class="flexItem">
<div class="itemTitle"> <div class="itemTitle">
<div class="itemTitleIcon"></div> <div class="itemTitleIcon"></div>
<div>本月主机设备电耗</div> <div>本月工序电量</div>
</div> </div>
<div class="itemBody itemBodyFlex"> <div class="itemBody itemBodyFlex">
<div id="radar" style="height: 100%"></div> <div id="radar" style="height: 100%"></div>

View File

@ -20,16 +20,15 @@
<el-date-picker <el-date-picker
v-model="daterange" v-model="daterange"
type="datetimerange" type="datetimerange"
:shortcuts="shortcuts" value-format="YYYY-MM-DD HH:mm:ss"
range-separator="To" range-separator=""
start-placeholder="Start date" start-placeholder="开始时间"
end-placeholder="End date" end-placeholder="结束时间"
placeholder="时间范围" format="YYYY-MM-DD HH"
value-format="YYYY-MM-DD hh:mm:ss" popper-class="tpc"
v-if="query.type==3" v-if="query.type==3"
style="margin-right: 6px" @change="changeDate"/>
@change="changeDate"
/>
<el-date-picker <el-date-picker
v-model="query.day" v-model="query.day"
type="date" type="date"
@ -397,7 +396,7 @@ export default {
bar_option: { bar_option: {
legend: { legend: {
top: "2%", top: "2%",
data: ["烧成车间压缩空气", "原料车间压缩空气", "水泥磨压缩空气"] data: ["烧成车间压缩空气(m3)", "原料车间压缩空气(m3)", "水泥磨压缩空气(m3)"]
}, },
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
@ -411,11 +410,11 @@ export default {
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
name: '压缩空气' name: ''
}, },
series: [ series: [
{ {
name: '烧成车间压缩空气', // name: '烧成车间压缩空气(m3)', //
type: 'bar', type: 'bar',
data: [], data: [],
itemStyle: { itemStyle: {
@ -424,7 +423,7 @@ export default {
}, },
{ {
name: '原料车间压缩空气', // name: '原料车间压缩空气(m3)', //
type: 'bar', type: 'bar',
data: [], data: [],
itemStyle: { itemStyle: {
@ -433,7 +432,7 @@ export default {
}, },
{ {
name: '水泥磨压缩空气', // name: '水泥磨压缩空气(m3)', //
type: 'bar', type: 'bar',
data: [], data: [],
itemStyle: { itemStyle: {
@ -869,13 +868,23 @@ export default {
}, },
} }
}; };
</script> </script>
<style scoped> <style scoped>
.printWrap { .printWrap {
width: 100%; width: 100%;
overflow-x: scroll; overflow-x: scroll;
} }
.chartWrap {
width: 1500px;
margin-top: 20px;
border: 1px solid #eeeeee;
}
.printContainer { .printContainer {
width: 100%; width: 100%;
} }
.chartTitle{
text-align: center;
width: 100%;
}
</style> </style>

View File

@ -29,21 +29,14 @@
<el-date-picker <el-date-picker
v-model="daterange" v-model="daterange"
type="datetimerange" type="datetimerange"
:shortcuts="shortcuts" value-format="YYYY-MM-DD HH:mm:ss"
range-separator="To" range-separator=""
start-placeholder="Start date" start-placeholder="开始时间"
end-placeholder="End date" end-placeholder="结束时间"
placeholder="时间范围" format="YYYY-MM-DD HH"
value-format="YYYY-MM-DD hh:mm:ss" popper-class="tpc"
v-if="query.type==1" v-if="query.type==1"
style="margin-right: 6px" @change="changeDate"/>
@change="changeDate"
/>
<!-- <el-button
type="primary"
icon="el-icon-search"
@click="dateChange"
></el-button> -->
<el-button <el-button
type="primary" type="primary"
@click="exportExcel()" @click="exportExcel()"

View File

@ -20,16 +20,15 @@
<el-date-picker <el-date-picker
v-model="daterange" v-model="daterange"
type="datetimerange" type="datetimerange"
:shortcuts="shortcuts" value-format="YYYY-MM-DD HH:mm:ss"
range-separator="To" range-separator=""
start-placeholder="Start date" start-placeholder="开始时间"
end-placeholder="End date" end-placeholder="结束时间"
placeholder="时间范围" format="YYYY-MM-DD HH"
value-format="YYYY-MM-DD hh:mm:ss" popper-class="tpc"
v-if="query.type==3" v-if="query.type==3"
style="margin-right: 6px" @change="changeDate"/>
@change="changeDate"
/>
<el-date-picker <el-date-picker
v-model="query.day" v-model="query.day"
type="date" type="date"
@ -243,8 +242,9 @@
<script> <script>
let legend = { let legend = {
top: "2%", top: "2%",
data: ["工业水", "绿化水", "生活水"], data: ["工业水(t)", "绿化水(t)", "生活水(t)"],
}; };
let colors = ["##36492E", "#4BA328", "#C6F47D"];
import scEcharts from "@/components/scEcharts"; import scEcharts from "@/components/scEcharts";
export default { export default {
components: { components: {
@ -303,7 +303,6 @@ export default {
sourceData: {}, sourceData: {},
option: { option: {
title: { title: {
// text: "",
x: "center", x: "center",
}, },
grid: { grid: {
@ -423,6 +422,7 @@ export default {
for (let n = 1; n <= that.days; n++) { for (let n = 1; n <= that.days; n++) {
that.xAxisData_day.push(n + "日"); that.xAxisData_day.push(n + "日");
} }
let colors = ["##36492E", "#4BA328", "#C6F47D"];
this.getMPoints(); this.getMPoints();
let heightContainer = let heightContainer =
document.getElementById("app-container").clientHeight; document.getElementById("app-container").clientHeight;
@ -606,32 +606,32 @@ export default {
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
name: '用水量' name: ''
}, },
series: [{ series: [{
name: '工业水', // name: '工业水(t)', //
type: 'bar', type: 'bar',
data: gyhourlyData, // data: gyhourlyData, //
itemStyle: { itemStyle: {
color: '#a9b6fe', color: '#518A3A',
}, },
}, },
{ {
name: '绿化水', // name: '绿化水(t)', //
type: 'bar', type: 'bar',
data: lvhourlyData, // data: lvhourlyData, //
itemStyle: { itemStyle: {
color: '#3398DB', color: '#DCE6CB',
}, },
}, },
{ {
name: '生活水', // name: '生活水(t)', //
type: 'bar', type: 'bar',
data: shhourlyData, // data: shhourlyData, //
itemStyle: { itemStyle: {
color: '#EE6666', color: '#93F607',
}, },
}, },
@ -707,32 +707,32 @@ export default {
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
name: '用水量' name: ''
}, },
series: [{ series: [{
name: '工业水', // name: '工业水(t)', //
type: 'bar', type: 'bar',
data: gyhourlyData, // data: gyhourlyData, //
itemStyle: { itemStyle: {
color: '#a9b6fe', color: '#518A3A',
}, },
}, },
{ {
name: '绿化水', // name: '绿化水(t)', //
type: 'bar', type: 'bar',
data: lvhourlyData, // data: lvhourlyData, //
itemStyle: { itemStyle: {
color: '#3398DB', color: '#DCE6CB',
}, },
}, },
{ {
name: '生活水', // name: '生活水(t)', //
type: 'bar', type: 'bar',
data: shhourlyData, // data: shhourlyData, //
itemStyle: { itemStyle: {
color: '#EE6666', color: '#93F607',
}, },
}, },
@ -837,14 +837,14 @@ export default {
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
name: '用水量' name: ''
}, },
series: [{ series: [{
name: '工业水', // name: '工业水', //
type: 'bar', type: 'bar',
data: gyhourlyData, // data: gyhourlyData, //
itemStyle: { itemStyle: {
color: '#a9b6fe', color: '#518A3A',
}, },
}, },
@ -853,7 +853,7 @@ export default {
type: 'bar', type: 'bar',
data: lvhourlyData, // data: lvhourlyData, //
itemStyle: { itemStyle: {
color: '#3398DB', color: '#DCE6CB',
}, },
}, },
@ -862,7 +862,7 @@ export default {
type: 'bar', type: 'bar',
data: shhourlyData, // data: shhourlyData, //
itemStyle: { itemStyle: {
color: '#EE6666', color: '#93F607',
}, },
}, },
@ -964,4 +964,13 @@ export default {
.printContainer { .printContainer {
width: 100%; width: 100%;
} }
.chartTitle{
text-align: center;
width: 100%;
}
.chartWrap {
width: 1500px;
margin-top: 20px;
border: 1px solid #eeeeee;
}
</style> </style>