修改bug

2024-05-14 08:46:58 +08:00
parent 097bab8241
commit 6f0c8503c6
5 changed files with 47 additions and 33 deletions
--- a/src/views/copilot/components/LineChartBase.vue
+++ b/src/views/copilot/components/LineChartBase.vue
@@ -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);
    },
  },
--- a/src/views/copilot/components/LineChartWater.vue
+++ b/src/views/copilot/components/LineChartWater.vue
@@ -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);
    },
  },
--- a/src/views/copilot/components/gasBarChartBase.vue
+++ b/src/views/copilot/components/gasBarChartBase.vue
@@ -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);
    },
  },
--- a/src/views/copilot/efficiency/components/sub/bar/BarChartChipOEE.vue
+++ b/src/views/copilot/efficiency/components/sub/bar/BarChartChipOEE.vue
@@ -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: {
--- a/src/views/copilot/energy/components/ElecCost.vue
+++ b/src/views/copilot/energy/components/ElecCost.vue
@@ -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: {