修改bug
Dieser Commit ist enthalten in:
‘937886381’
Ursprung
097bab8241
Commit
6f0c8503c6
@ -11,7 +11,7 @@
|
||||
<span v-for="item in legend" :key="item.label" class="legend-item"
|
||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
||||
</div>
|
||||
<div ref="chart" :style="{ height: '100%',width: width}"></div>
|
||||
<div ref="elsChart" :style="{ height: '100%',width: width}"></div>
|
||||
</chart-container>
|
||||
</template>
|
||||
|
||||
@ -51,7 +51,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
width:'100%',
|
||||
width: '100%',
|
||||
isFullscreen: false,
|
||||
actualOptions: null,
|
||||
options: {
|
||||
@ -367,8 +367,9 @@ export default {
|
||||
watch: {
|
||||
isOpen(val) {
|
||||
if (val === true) {
|
||||
this.width = '100%-128px'
|
||||
this.width = '99%'
|
||||
this.canvasReset()
|
||||
console.log(this.width)
|
||||
} else {
|
||||
this.watch = 100 + '%'
|
||||
this.canvasReset()
|
||||
@ -427,7 +428,7 @@ export default {
|
||||
if (this.chart) {
|
||||
this.chart.dispose();
|
||||
}
|
||||
this.chart = echarts.init(this.$refs.chart);
|
||||
this.chart = echarts.init(this.$refs.elsChart);
|
||||
this.chart.setOption(this.actualOptions);
|
||||
},
|
||||
},
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
<span v-for="item in legend" :key="item.label" class="legend-item"
|
||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
||||
</div>
|
||||
<div ref="chart" :style="{ height: '100%',width: width}"></div>
|
||||
<div ref="waterChart" :style="{ height: '100%',width: width}"></div>
|
||||
</chart-container>
|
||||
</template>
|
||||
|
||||
@ -51,12 +51,12 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
width: '100%',
|
||||
width:'',
|
||||
isFullscreen: false,
|
||||
actualOptions: null,
|
||||
options: {
|
||||
grid: {
|
||||
left: "5%",
|
||||
left: "1%",
|
||||
right: "4%",
|
||||
bottom: "3%",
|
||||
top: "15%",
|
||||
@ -361,9 +361,12 @@ export default {
|
||||
},
|
||||
watch: {
|
||||
isOpen(val) {
|
||||
// console.log(val)
|
||||
if (val === true) {
|
||||
this.width = '100%-128px'
|
||||
console.log('ztl')
|
||||
this.width = '99%'
|
||||
this.canvasReset()
|
||||
console.log(this.width)
|
||||
} else {
|
||||
this.watch = 100 + '%'
|
||||
this.canvasReset()
|
||||
@ -371,6 +374,9 @@ export default {
|
||||
},
|
||||
/** 全屏状态切换时，对柱子粗细和字体大小进行相应调整 */
|
||||
isFullscreen(val) {
|
||||
if (val === true && this.isOpen === true) {
|
||||
this.width = '99%'
|
||||
}
|
||||
this.actualOptions.series.map((item) => {
|
||||
item.barWidth = val ? 18 : 12;
|
||||
});
|
||||
@ -399,11 +405,11 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// if (screenfull.isEnabled) {
|
||||
// screenfull.on("change", () => {
|
||||
// this.isFullscreen = screenfull.isFullscreen;
|
||||
// });
|
||||
// }
|
||||
if (screenfull.isEnabled) {
|
||||
screenfull.on("change", () => {
|
||||
this.isFullscreen = screenfull.isFullscreen;
|
||||
});
|
||||
}
|
||||
this.actualOptions = this.options
|
||||
this.canvasReset();
|
||||
window.addEventListener("resize", this.canvasReset);
|
||||
@ -426,7 +432,7 @@ export default {
|
||||
if (this.chart) {
|
||||
this.chart.dispose();
|
||||
}
|
||||
this.chart = echarts.init(this.$refs.chart);
|
||||
this.chart = echarts.init(this.$refs.waterChart);
|
||||
this.chart.setOption(this.actualOptions);
|
||||
},
|
||||
},
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-13 14:08:51
|
||||
* @LastEditTime: 2024-05-13 16:19:44
|
||||
* @LastEditTime: 2024-05-14 08:46:07
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
@ -9,10 +9,10 @@
|
||||
<template>
|
||||
<chart-container class="bar-chart-base">
|
||||
<div class="legend">
|
||||
<span v-for="item in legend" :key="item.label" class="legend-item"
|
||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
||||
<!-- <span v-for="item in legend" :key="item.label" class="legend-item"
|
||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span> -->
|
||||
</div>
|
||||
<div id="chart" ref="chart" :style="{ height: '100%',width: width}"></div>
|
||||
<div ref="gasChart" :style="{ height: '100%',width: width}"></div>
|
||||
</chart-container>
|
||||
</template>
|
||||
|
||||
@ -52,12 +52,13 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
width: '100%',
|
||||
isFullscreen: false,
|
||||
actualOptions: null,
|
||||
options: {
|
||||
grid: {
|
||||
left: "5%",
|
||||
right: "1%",
|
||||
left: "1%",
|
||||
right: "4%",
|
||||
bottom: "3%",
|
||||
top: "15%",
|
||||
containLabel: true,
|
||||
@ -182,9 +183,12 @@ export default {
|
||||
},
|
||||
watch: {
|
||||
isOpen(val) {
|
||||
// console.log(val)
|
||||
if (val === true) {
|
||||
this.width = '100%-128px'
|
||||
console.log('ryf')
|
||||
this.width = '99%'
|
||||
this.canvasReset()
|
||||
console.log(this.width)
|
||||
} else {
|
||||
this.watch = 100 + '%'
|
||||
this.canvasReset()
|
||||
@ -192,6 +196,9 @@ export default {
|
||||
},
|
||||
/** 全屏状态切换时，对柱子粗细和字体大小进行相应调整 */
|
||||
isFullscreen(val) {
|
||||
if (val === true && this.isOpen === true) {
|
||||
this.width = '99%'
|
||||
}
|
||||
this.actualOptions.series.map((item) => {
|
||||
item.barWidth = val ? 18 : 12;
|
||||
});
|
||||
@ -216,11 +223,11 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// if (screenfull.isEnabled) {
|
||||
// screenfull.on("change", () => {
|
||||
// this.isFullscreen = screenfull.isFullscreen;
|
||||
// });
|
||||
// }
|
||||
if (screenfull.isEnabled) {
|
||||
screenfull.on("change", () => {
|
||||
this.isFullscreen = screenfull.isFullscreen;
|
||||
});
|
||||
}
|
||||
this.actualOptions = this.options
|
||||
this.canvasReset();
|
||||
window.addEventListener("resize", this.canvasReset);
|
||||
@ -243,7 +250,7 @@ export default {
|
||||
if (this.chart) {
|
||||
this.chart.dispose();
|
||||
}
|
||||
this.chart = echarts.init(this.$refs.chart);
|
||||
this.chart = echarts.init(this.$refs.gasChart);
|
||||
this.chart.setOption(this.actualOptions);
|
||||
},
|
||||
},
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-07 13:22:43
|
||||
* @LastEditTime: 2024-05-13 16:19:17
|
||||
* @LastEditTime: 2024-05-14 08:32:44
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
@ -51,6 +51,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
width: '100%',
|
||||
isFullscreen: false,
|
||||
actualOptions: null,
|
||||
options: {
|
||||
|
||||
@ -7,31 +7,30 @@
|
||||
|
||||
<template>
|
||||
<LineChartBase
|
||||
v-if="1"
|
||||
:legend="legend"
|
||||
:series="series"
|
||||
:xAxis="xAxis"
|
||||
in="elecCost"
|
||||
class="elec-cost"
|
||||
/>
|
||||
<BarChartBase
|
||||
<!-- <BarChartBase
|
||||
v-else
|
||||
:legend="legend"
|
||||
:series="series"
|
||||
:xAxis="xAxis"
|
||||
in="elecCost"
|
||||
class="elec-cost"
|
||||
/>
|
||||
/> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import BarChartBaseVue from "@/views/copilot/components/BarChartBase.vue";
|
||||
// import BarChartBaseVue from "@/views/copilot/components/BarChartBase.vue";
|
||||
import LineChartBaseVue from "@/views/copilot/components/LineChartBase.vue";
|
||||
|
||||
export default {
|
||||
name: "ElecCost",
|
||||
components: {
|
||||
BarChartBase: BarChartBaseVue,
|
||||
// BarChartBase: BarChartBaseVue,
|
||||
LineChartBase: LineChartBaseVue,
|
||||
},
|
||||
props: {
|
||||
|
||||
Laden…
In neuem Issue referenzieren
Einen Benutzer sperren