This commit is contained in:
朱菊兰 2024-05-21 08:34:03 +08:00
parent f84355b673
commit 3228987c40
2 changed files with 16 additions and 44 deletions

View File

@ -1,31 +1,22 @@
<template> <template>
<div> <div class="left-chart-base">
<div class="left-chart-base"> <div class="legend">
<NotMsg v-show="notMsg" /> <span
<div class="legend" v-show="!notMsg"> v-for="item in legend"
<span :key="item.label"
v-for="item in legend" class="legend-item"
:key="item.label" :style="{ fontSize: isFullscreen ? '0.85vw' : '0.73vw' }"
class="legend-item" >{{ item.label }}</span
:style="{ fontSize: isFullscreen ? '0.85vw' : '0.73vw' }" >
>{{ item.label }}</span
>
</div>
<div
id="factoryEnergyChart"
style="width: 100%; height: 100%"
v-show="!notMsg"
></div>
</div> </div>
<div id="factoryEnergyChart" style="width: 100%; height: 100%"></div>
</div> </div>
</template> </template>
<script> <script>
import { debounce } from "@/utils/debounce"; import { debounce } from "@/utils/debounce";
import * as echarts from "echarts"; import * as echarts from "echarts";
import NotMsg from "./../../components/NotMsg";
export default { export default {
name: "Energy", name: "Energy",
components: { NotMsg },
props: { props: {
legend: { legend: {
type: Array, type: Array,
@ -40,16 +31,14 @@ export default {
return { return {
isFullscreen: false, isFullscreen: false,
actualOptions: null, actualOptions: null,
notMsg: false,
chart: "", chart: "",
options: { options: {
color: ["#FFD160", "#2760FF", "#12FFF5"], color: ["#FFD160", "#2760FF", "#12FFF5"],
grid: { grid: {
left: "3%", left: "7%",
right: "4%", right: "7%",
bottom: "0", bottom: "8%",
top: "15%", top: "15%",
containLabel: true,
}, },
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -274,7 +263,6 @@ export default {
}, },
]; ];
if (this.energyCockpits.length > 0) { if (this.energyCockpits.length > 0) {
this.notMsg = false;
let dataArr = this.energyCockpits.map((item) => { let dataArr = this.energyCockpits.map((item) => {
return item.groupName; return item.groupName;
}); });
@ -296,8 +284,6 @@ export default {
} }
} }
} }
} else {
this.notMsg = true;
} }
if (this.chart) { if (this.chart) {
this.chart.dispose(); this.chart.dispose();

View File

@ -1,20 +1,11 @@
<template> <template>
<div> <div id="factoryStoreChart" style="width: 100%; height: 100%"></div>
<NotMsg v-show="notMsg" />
<div
id="factoryStoreChart"
style="width: 100%; height: 100%"
v-show="!notMsg"
></div>
</div>
</template> </template>
<script> <script>
import { debounce } from "@/utils/debounce"; import { debounce } from "@/utils/debounce";
import * as echarts from "echarts"; import * as echarts from "echarts";
import NotMsg from "./../../components/NotMsg";
export default { export default {
name: "Store", name: "Store",
components: { NotMsg },
props: { props: {
stock: { stock: {
type: Object, type: Object,
@ -30,15 +21,13 @@ export default {
return { return {
isFullscreen: false, isFullscreen: false,
actualOptions: null, actualOptions: null,
notMsg: false,
chart: "", chart: "",
options: { options: {
grid: { grid: {
left: "3%", left: "8%",
right: "1%", right: "1%",
bottom: "0", bottom: "8%",
top: "15%", top: "15%",
containLabel: true,
}, },
tooltip: {}, tooltip: {},
xAxis: { xAxis: {
@ -157,12 +146,9 @@ export default {
let xAxis = Object.keys(this.stock) || []; let xAxis = Object.keys(this.stock) || [];
let data = []; let data = [];
if (xAxis.length > 0) { if (xAxis.length > 0) {
this.notMsg = false;
data = xAxis.map((item) => { data = xAxis.map((item) => {
return this.stock[item].total; return this.stock[item].total;
}); });
} else {
this.notMsg = true;
} }
if (this.chart) { if (this.chart) {
this.chart.dispose(); this.chart.dispose();