projects/mescc/zhp
into projects/mescc/develop
2 months ago
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-06-20 16:13:36 | * @Date: 2024-06-20 16:13:36 | ||||
* @LastEditTime: 2024-06-26 14:48:49 | |||||
* @LastEditTime: 2024-06-26 16:53:39 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -36,7 +36,7 @@ export default { | |||||
color: [], | color: [], | ||||
// color: ["#8EF0AB", "#63BDFF", "#288AFF"], | // color: ["#8EF0AB", "#63BDFF", "#288AFF"], | ||||
grid: { | grid: { | ||||
left: -60, | |||||
left: 20, | |||||
right: 0, | right: 0, | ||||
bottom: 31, | bottom: 31, | ||||
top: 30, | top: 30, | ||||
@@ -136,6 +136,10 @@ export default { | |||||
type: Number, | type: Number, | ||||
default: 300, | default: 300, | ||||
}, | }, | ||||
gridLeft: { | |||||
type: Boolean, | |||||
default: true, | |||||
}, | |||||
type: { | type: { | ||||
type: Number, | type: Number, | ||||
default: 2, | default: 2, | ||||
@@ -166,7 +170,12 @@ export default { | |||||
handler(newVal) { | handler(newVal) { | ||||
this.chartHeight = newVal; | this.chartHeight = newVal; | ||||
}, | }, | ||||
}, | }, | ||||
// gridLeft(val) { | |||||
// console.log(val) | |||||
// }, | |||||
type() { | type() { | ||||
this.canvasReset(); | this.canvasReset(); | ||||
}, | }, | ||||
@@ -190,6 +199,12 @@ export default { | |||||
}, 500)(); | }, 500)(); | ||||
}, | }, | ||||
getMes() { | getMes() { | ||||
console.log(this.gridLeft) | |||||
if (this.gridLeft === false) { | |||||
this.option.grid.left = 20 | |||||
} else { | |||||
this.option.grid.left = -80 | |||||
} | |||||
// console.log('222222', this.chartMsg); | // console.log('222222', this.chartMsg); | ||||
if (this.myChart) { | if (this.myChart) { | ||||
this.myChart.dispose(); | this.myChart.dispose(); | ||||
@@ -197,7 +212,7 @@ export default { | |||||
var chartDom = document.getElementById(this.chartId); | var chartDom = document.getElementById(this.chartId); | ||||
this.myChart = echarts.init(chartDom); | this.myChart = echarts.init(chartDom); | ||||
this.option.color = this.chartMsg.color; | this.option.color = this.chartMsg.color; | ||||
this.option.xAxis.data = this.chartMsg.xData; | |||||
this.option.xAxis.data = this.chartMsg.xData | |||||
// this.option.yAxis.name = this.chartMsg.yName; | // this.option.yAxis.name = this.chartMsg.yName; | ||||
// this.option.yAxis.axisLabel = this.chartMsg.yAxisLabel; | // this.option.yAxis.axisLabel = this.chartMsg.yAxisLabel; | ||||
@@ -176,12 +176,12 @@ export default { | |||||
type: "value", | type: "value", | ||||
name: "单位/MW", | name: "单位/MW", | ||||
// splitNumber: 5, | // splitNumber: 5, | ||||
min: function (value) {//取最小值向下取整为最小刻度 | |||||
return 0 | |||||
}, | |||||
max: function (value) {//取最大值向上取整为最大刻度 | |||||
return Math.ceil(value.max) | |||||
}, | |||||
// min: function (value) {//取最小值向下取整为最小刻度 | |||||
// return 0 | |||||
// }, | |||||
// max: function (value) {//取最大值向上取整为最大刻度 | |||||
// return Math.ceil(value.max) | |||||
// }, | |||||
alignTicks: true, | alignTicks: true, | ||||
nameTextStyle: { | nameTextStyle: { | ||||
fontSize: 12, | fontSize: 12, | ||||
@@ -192,12 +192,12 @@ export default { | |||||
{ | { | ||||
type: 'value', | type: 'value', | ||||
alignTicks: true, | alignTicks: true, | ||||
min: 0, | |||||
max: 100, | |||||
// min: 0, | |||||
// max: 100, | |||||
// scale: true, | // scale: true, | ||||
interval: 25,//间隔 | |||||
// interval: 25,//间隔 | |||||
// inverse: true, | // inverse: true, | ||||
splitNumber: 5, | |||||
// splitNumber: 5, | |||||
name: "单位/%", | name: "单位/%", | ||||
nameTextStyle: { | nameTextStyle: { | ||||
fontSize: 12, | fontSize: 12, | ||||
@@ -248,15 +248,15 @@ export default { | |||||
{ | { | ||||
type: "value", | type: "value", | ||||
name: "单位/片", | name: "单位/片", | ||||
min: function (value) {//取最小值向下取整为最小刻度 | |||||
return 0 | |||||
}, | |||||
max: function (value) {//取最大值向上取整为最大刻度 | |||||
return Math.ceil(value.max) | |||||
}, | |||||
// min: function (value) {//取最小值向下取整为最小刻度 | |||||
// return 0 | |||||
// }, | |||||
// max: function (value) {//取最大值向上取整为最大刻度 | |||||
// return Math.ceil(value.max) | |||||
// }, | |||||
alignTicks: true, | alignTicks: true, | ||||
// splitNumber: 5, | // splitNumber: 5, | ||||
scale: true, | |||||
// scale: true, | |||||
nameTextStyle: { | nameTextStyle: { | ||||
fontSize: 12, | fontSize: 12, | ||||
align: "right", | align: "right", | ||||
@@ -269,10 +269,10 @@ export default { | |||||
name: "单位/%", | name: "单位/%", | ||||
scale: true, | scale: true, | ||||
alignTicks: true, | alignTicks: true, | ||||
min: 0, | |||||
max: 100, | |||||
// min: 0, | |||||
// max: 100, | |||||
// scale: true, | // scale: true, | ||||
interval: 25,//间隔 | |||||
// interval: 25,//间隔 | |||||
// splitNumber: 5, | // splitNumber: 5, | ||||
nameTextStyle: { | nameTextStyle: { | ||||
fontSize: 12, | fontSize: 12, | ||||
@@ -521,6 +521,7 @@ export default { | |||||
this.chartMsg.series[2].data = [] | this.chartMsg.series[2].data = [] | ||||
this.chartMsgYearTarget.series[0].data = [] | this.chartMsgYearTarget.series[0].data = [] | ||||
this.chartMsgYearTarget.series[1].data = [] | this.chartMsgYearTarget.series[1].data = [] | ||||
this.title = '' | |||||
if (!this.listQuery.beginTime && !this.listQuery.endTime) { | if (!this.listQuery.beginTime && !this.listQuery.endTime) { | ||||
return this.$message('请选择起止时间') | return this.$message('请选择起止时间') | ||||
} | } | ||||
@@ -64,7 +64,7 @@ | |||||
</el-col> | </el-col> | ||||
<el-col :span="6" style="margin-top: 30px"> | <el-col :span="6" style="margin-top: 30px"> | ||||
<bm-line-bar-target :type="listQuery.type" :chartHeight="chartHeight" :legendList="legendList" | <bm-line-bar-target :type="listQuery.type" :chartHeight="chartHeight" :legendList="legendList" | ||||
:chartMsg="chartMsgTarget" :chartId="'chartTarget'" :chartNum="chartNum" /> | |||||
:chartMsg="chartMsgTarget" :gridLeft="gridLeft" :chartId="'chartTarget'" :chartNum="chartNum" /> | |||||
</el-col> | </el-col> | ||||
<el-col :span="6"> | <el-col :span="6"> | ||||
<div class="blueTip"> | <div class="blueTip"> | ||||
@@ -84,7 +84,7 @@ | |||||
</el-col> | </el-col> | ||||
<el-col :span="6" style="margin-top: 30px"> | <el-col :span="6" style="margin-top: 30px"> | ||||
<bm-line-bar-target :type="listQuery.type" :chartHeight="chartHeight" :legendList="legendList" | <bm-line-bar-target :type="listQuery.type" :chartHeight="chartHeight" :legendList="legendList" | ||||
:chartMsg="chartMsgTarget" :chartId="'chartDayTarget'" :chartNum="chartNum" /> | |||||
:chartMsg="chartMsgTarget" :gridLeft="gridLeft" :chartId="'chartDayTarget'" :chartNum="chartNum" /> | |||||
</el-col> | </el-col> | ||||
<!-- <el-col :span="6"> | <!-- <el-col :span="6"> | ||||
<div class="blueTip"> | <div class="blueTip"> | ||||
@@ -103,8 +103,8 @@ | |||||
:chartId="chartId" :chartNum="chartNum" /> | :chartId="chartId" :chartNum="chartNum" /> | ||||
<!-- </el-col> --> | <!-- </el-col> --> | ||||
</el-row> | </el-row> | ||||
<base-table :key="showTable" :table-props="tableProps" :page="listQuery.current" | |||||
:limit="listQuery.size" :table-data="tableData" :max-height="tableH" /> | |||||
<base-table :key="showTable" :table-props="tableProps" :page="listQuery.current" :limit="listQuery.size" | |||||
:table-data="tableData" :max-height="tableH" /> | |||||
</div> | </div> | ||||
<!-- <div class="containerBottom"> | <!-- <div class="containerBottom"> | ||||
@@ -130,6 +130,7 @@ export default { | |||||
currentMenu: '邯郸', | currentMenu: '邯郸', | ||||
end: undefined, | end: undefined, | ||||
title: '', | title: '', | ||||
gridLeft:true, | |||||
listQuery: { | listQuery: { | ||||
pageNo: 1, | pageNo: 1, | ||||
pageSize: 999, | pageSize: 999, | ||||
@@ -529,7 +530,11 @@ export default { | |||||
this.chartMsg.yAxis.interval = (this.chartMsg.yAxis.max - this.chartMsg.yAxis.min) / 4 | this.chartMsg.yAxis.interval = (this.chartMsg.yAxis.max - this.chartMsg.yAxis.min) / 4 | ||||
this.chartMsgTarget.yAxis.interval = (this.chartMsgTarget.yAxis.max - this.chartMsgTarget.yAxis.min) / 4 | this.chartMsgTarget.yAxis.interval = (this.chartMsgTarget.yAxis.max - this.chartMsgTarget.yAxis.min) / 4 | ||||
if (this.listQuery.type === 2) { | if (this.listQuery.type === 2) { | ||||
if (res.data.list.length === 3) { | |||||
this.gridLeft = false | |||||
} else { | |||||
this.gridLeft = true | |||||
} | |||||
// res.data.list.forEach((ele) => { | // res.data.list.forEach((ele) => { | ||||
res.data.list.slice(0, res.data.list.length - 3).forEach((ele, index) => { | res.data.list.slice(0, res.data.list.length - 3).forEach((ele, index) => { | ||||
// let i = index + 1 | // let i = index + 1 | ||||
@@ -693,6 +698,11 @@ export default { | |||||
}) | }) | ||||
// }) | // }) | ||||
} else if (this.listQuery.type === 1 || this.listQuery.type === 0) { | } else if (this.listQuery.type === 1 || this.listQuery.type === 0) { | ||||
if (res.data.list.length === 2) { | |||||
this.gridLeft = false | |||||
} else { | |||||
this.gridLeft = true | |||||
} | |||||
// res.data.list.forEach((ele) => { | // res.data.list.forEach((ele) => { | ||||
res.data.list.slice(0, res.data.list.length - 2).forEach((ele, index) => { | res.data.list.slice(0, res.data.list.length - 2).forEach((ele, index) => { | ||||
// let i = index + 1 | // let i = index + 1 | ||||
@@ -64,7 +64,8 @@ | |||||
</el-col> | </el-col> | ||||
<el-col :span="6" style="margin-top: 30px"> | <el-col :span="6" style="margin-top: 30px"> | ||||
<bm-line-bar-target :type="listQuery.type" :chartHeight="chartHeight" :legendList="legendList" | <bm-line-bar-target :type="listQuery.type" :chartHeight="chartHeight" :legendList="legendList" | ||||
:chartMsg="chartMsgTarget" ref="dayTargetChart" :chartId=" 'chartTarget'" :chartNum="chartNum" /> | |||||
:chartMsg="chartMsgTarget" :gridLeft="gridLeft" ref="dayTargetChart" :chartId=" 'chartTarget'" | |||||
:chartNum="chartNum" /> | |||||
</el-col> | </el-col> | ||||
<el-col :span="6"> | <el-col :span="6"> | ||||
<div class="blueTip"> | <div class="blueTip"> | ||||
@@ -84,7 +85,7 @@ | |||||
</el-col> | </el-col> | ||||
<el-col :span="6" style="margin-top: 30px"> | <el-col :span="6" style="margin-top: 30px"> | ||||
<bm-line-bar-target :type="listQuery.type" :chartHeight="chartHeight" :legendList="legendList" | <bm-line-bar-target :type="listQuery.type" :chartHeight="chartHeight" :legendList="legendList" | ||||
:chartMsg="chartMsgTarget" :chartId=" 'chartDayTarget'" :chartNum="chartNum" /> | |||||
:chartMsg="chartMsgTarget" :gridLeft="gridLeft" :chartId=" 'chartDayTarget'" :chartNum="chartNum" /> | |||||
</el-col> | </el-col> | ||||
<!-- <el-col :span="6"> | <!-- <el-col :span="6"> | ||||
<div class="blueTip"> | <div class="blueTip"> | ||||
@@ -129,6 +130,7 @@ export default { | |||||
currentMenu:'邯郸', | currentMenu:'邯郸', | ||||
end: undefined, | end: undefined, | ||||
title: '', | title: '', | ||||
gridLeft:true, | |||||
showTable:false, | showTable:false, | ||||
listQuery: { | listQuery: { | ||||
pageNo: 1, | pageNo: 1, | ||||
@@ -673,6 +675,11 @@ export default { | |||||
// }) | // }) | ||||
}) | }) | ||||
if (this.listQuery.type === 2) { | if (this.listQuery.type === 2) { | ||||
if (res.data.list.length === 3) { | |||||
this.gridLeft = false | |||||
} else { | |||||
this.gridLeft = true | |||||
} | |||||
console.log(res.data.list.length); | console.log(res.data.list.length); | ||||
// res.data.list.forEach((ele) => { | // res.data.list.forEach((ele) => { | ||||
res.data.list.slice(0, res.data.list.length - 3).forEach((ele, index) => { | res.data.list.slice(0, res.data.list.length - 3).forEach((ele, index) => { | ||||
@@ -948,6 +955,11 @@ export default { | |||||
}) | }) | ||||
// }) | // }) | ||||
} else if (this.listQuery.type === 1 || this.listQuery.type === 0) { | } else if (this.listQuery.type === 1 || this.listQuery.type === 0) { | ||||
if (res.data.list.length === 2) { | |||||
this.gridLeft = false | |||||
} else { | |||||
this.gridLeft = true | |||||
} | |||||
// console.log(res.data.list.slice(res.data.list.length - 2, res.data.list.length)); | // console.log(res.data.list.slice(res.data.list.length - 2, res.data.list.length)); | ||||
// res.data.list.forEach((ele) => { | // res.data.list.forEach((ele) => { | ||||
res.data.list.slice(0, res.data.list.length - 2).forEach((ele, index) => { | res.data.list.slice(0, res.data.list.length - 2).forEach((ele, index) => { | ||||
@@ -174,12 +174,12 @@ export default { | |||||
type: "value", | type: "value", | ||||
name: "单位/片", | name: "单位/片", | ||||
splitNumber: 4, | splitNumber: 4, | ||||
min: function (value) {//取最小值向下取整为最小刻度 | |||||
return Math.floor(value.min) | |||||
}, | |||||
max: function (value) {//取最大值向上取整为最大刻度 | |||||
return Math.ceil(value.max) | |||||
}, | |||||
// min: function (value) {//取最小值向下取整为最小刻度 | |||||
// return Math.floor(value.min) | |||||
// }, | |||||
// max: function (value) {//取最大值向上取整为最大刻度 | |||||
// return Math.ceil(value.max) | |||||
// }, | |||||
alignTicks: true, | alignTicks: true, | ||||
nameTextStyle: { | nameTextStyle: { | ||||
fontSize: 12, | fontSize: 12, | ||||
@@ -191,10 +191,10 @@ export default { | |||||
type: 'value', | type: 'value', | ||||
// inverse: true, | // inverse: true, | ||||
alignTicks: true, | alignTicks: true, | ||||
min: 0, | |||||
max: 100, | |||||
// min: 0, | |||||
// max: 100, | |||||
// scale: true, | // scale: true, | ||||
interval: 25,//间隔 | |||||
// interval: 25,//间隔 | |||||
splitNumber: 4, | splitNumber: 4, | ||||
name: "单位/%", | name: "单位/%", | ||||
nameTextStyle: { | nameTextStyle: { | ||||
@@ -246,15 +246,15 @@ export default { | |||||
{ | { | ||||
type: "value", | type: "value", | ||||
name: "单位/片", | name: "单位/片", | ||||
min: function (value) {//取最小值向下取整为最小刻度 | |||||
return Math.floor(value.min) | |||||
}, | |||||
max: function (value) {//取最大值向上取整为最大刻度 | |||||
return Math.ceil(value.max) | |||||
}, | |||||
// min: function (value) {//取最小值向下取整为最小刻度 | |||||
// return Math.floor(value.min) | |||||
// }, | |||||
// max: function (value) {//取最大值向上取整为最大刻度 | |||||
// return Math.ceil(value.max) | |||||
// }, | |||||
alignTicks:true, | alignTicks:true, | ||||
splitNumber: 4, | |||||
scale: true, | |||||
// splitNumber: 4, | |||||
// scale: true, | |||||
nameTextStyle: { | nameTextStyle: { | ||||
fontSize: 12, | fontSize: 12, | ||||
align: "right", | align: "right", | ||||
@@ -266,10 +266,10 @@ export default { | |||||
// inverse: true, | // inverse: true, | ||||
name: "单位/%", | name: "单位/%", | ||||
alignTicks: true, | alignTicks: true, | ||||
min: 0, | |||||
max:100, | |||||
// min: 0, | |||||
// max:100, | |||||
// scale: true, | // scale: true, | ||||
interval: 25,//间隔 | |||||
// interval: 25,//间隔 | |||||
splitNumber: 4, | splitNumber: 4, | ||||
nameTextStyle: { | nameTextStyle: { | ||||
fontSize: 12, | fontSize: 12, | ||||