表格

src/views/core/analysis/balanceChart.vue

@@ -0,0 +1,102 @@
+<!--
+ * @Author: zhp
+ * @Date: 2023-09-13 09:02:25
+ * @LastEditTime: 2023-09-20 09:29:40
+ * @LastEditors: DY
+ * @Description:
+-->
+<template>
+  <div>
+    <div style="margin: 20px">
+      <el-button v-for="(item, index) in dataArray" :key="index" @click="changeChart(index)">{{ item.name }}</el-button>
+    </div>
+    <div ref="chartDiv" :class="className" :style="{height:height,width:width}" />
+  </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+// import resize from './mixins/resize'
+
+export default {
+  // mixins: [resize],
+  props: {
+    className: {
+      type: String,
+      default: 'chart'
+    },
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '350px'
+    },
+    // autoResize: {
+    //   type: Boolean,
+    //   default: true
+    // }
+  },
+  data() {
+    return {
+      chart: null,
+      dataArray: [],
+      xDatas: []
+    }
+  },
+  mounted() {
+  },
+  methods: {
+    changeChart(index) {
+      this.setOptions(this.xDatas, this.dataArray[index])
+    },
+    initChart(xData, yData, lineName) {
+      this.dataArray = yData
+      this.xDatas = xData
+      console.log(xData,yData);
+      console.log('zale', yData[0].eqData)
+      this.chart = echarts.init(this.$refs.chartDiv, 'macarons')
+      this.setOptions(xData, yData[0], lineName)
+    },
+    setOptions(xData, dataList, lineName) {
+      // let seriesData = []
+        // lineName.forEach((item,index) => {
+        //   seriesData.push({
+        //     name: item,
+        //     data: yData[index],
+        //     type: 'line',
+        //   })
+        // })
+      this.chart.setOption({
+        xAxis: {
+          type: 'category',
+          data: xData
+        },
+        tooltip: {
+          trigger: 'axis'
+        },
+        legend: {
+          data:lineName
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [
+          {
+            name: '设备CT',
+            data: dataList.eqData,
+            type: 'line',
+          },
+          {
+            name: '产线CT',
+            data: dataList.plData,
+            type: 'line',
+          }
+        ]
+      })
+    }
+  }
+}
+</script>