弹框table样式修改

chenzeping

2021-04-09 4cfe2cc6b6d4e418c0d8665fa94a140756dcd537

 src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue

@@ -1,5 +1,5 @@
<template>
  <div style="width:100%;height:2rem;" ref="echarts"></div>
  <div style="width:100%;height:2rem;margin-top: 0.3rem" ref="echarts"></div>
</template>

<script>
@@ -13,25 +13,18 @@
  data () {
    return {
      myChart: [],
      dataDate: [],
      result: [],
      days: dayjs(new Date()).format('YYYYMMDDHHmmss'),
      value: '',
      seriesData: [],
      aseries: '',
      result: [],
      days: dayjs(new Date()).format('YYYYMMDDHHmmss')
      aseries: ''
    }
  },
  methods: {
    drawChart (result) {
      // const result = this.result
    drawChart () {
      this.myChart = this.$echarts.init(this.$refs.echarts)

      // setInterval(function () {
      // }, 3000)
      const option = {
        title: {
          text: '折线图堆叠'
        },
        tooltip: {
          trigger: 'axis'
        },
@@ -39,7 +32,7 @@
          data: ['邮件营销', '联盟广告', '视频广告', '直接访问', '搜索引擎']
        },
        grid: {
          containLabel: true
          containLabel: false
        },
        toolbox: {
          feature: {
@@ -51,17 +44,22 @@
        xAxis: {
          type: 'category',
          boundaryGap: false,
          // data: seriesData,
          splitLine: {
            show: false
          },
          // data: this.seriesData,
          data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
          axisLine: {
            lineStyle: {
              color: '#FFFFFF',
              width: 1
              // width: 1
              show: false
            }
          }
        },
        yAxis: {
          type: 'value',
          boundaryGap: [0, '100%'],
          axisLine: {
            lineStyle: {
              color: '#FFFFFF',
@@ -71,10 +69,11 @@
        },
        series: [
          {
            name: '邮件营销',
            name: '模拟数据',
            type: 'line',
            stack: '总量',
            data: [120, 132, 101, 134, 90, 230, 210]
            // showSymbol: false,
            // hoverAnimation: false,
            data: this.seriesData
          },
          {
            name: '联盟广告',
@@ -114,6 +113,23 @@
      }
      const result = await mapApi.DataItems(data)
      this.result = result.data
      for (let i = 0; i < result.length; i++) {
        //   // console.log(result[i])

        // const seriesData = []
        const aseries = []
        // let nameData = ''

        this.seriesData.push(result[i].ReadTime)
        aseries.push(result[i].TagValue)
        // nameData = result[i].UnionTagCode
        this.aseries = result[i].UnionTagCode
      }
      this.myChart.setOption({
        series: [{
          data: this.seriesData
        }]
      })
    },
    // 数据的请求
    requestEcharts () {
@@ -130,18 +146,18 @@
        for (let i = 0; i < result.length; i++) {
          //   // console.log(result[i])

          const seriesData = []
          // const seriesData = []
          const aseries = []
          // let nameData = ''

          seriesData.push(result[i].ReadTime)
          this.seriesData.push(result[i].ReadTime)
          aseries.push(result[i].TagValue)
          // nameData = result[i].UnionTagCode
          this.aseries = result[i].UnionTagCode
        }
        this.myChart.setOption({
          series: [{
            data: data
            data: this.seriesData
          }]
        })
      }, 3000)
@@ -151,6 +167,7 @@
    this.$nextTick(() => {
      this.requestEcharts()
      this.drawChart()
      this.echartsData()
    })
  }
}