派生自 wuyushui/SewerAndRainNetwork

wangqi
2021-04-08 122f21029a70e93ad2c1ee4fe5df5de2932ad1b8
src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue
@@ -50,7 +50,7 @@
<!--                    </div>-->
<!--                </el-dialog>-->
<!--            </div>-->
            <div style="width:750px;height:260px;" id="echarts" ref="main">
            <div style="width:100%;height:1rem;margin-top:-0.1rem;position:absolute;" id="echarts" ref="main">
            </div>
        </div>
    </div>
@@ -58,6 +58,7 @@
<script>
// import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'
export default {
  name: 'ECharts',
  components: {
@@ -231,72 +232,68 @@
    drawChart: function () {
      const myChart = this.$echarts.init(this.$refs.main)
      myChart.setOption(this.options)
      window.onresize = function () {
        var h1 = document.documentElement.clientHeight// 获取屏幕的高度
        if (h1 > 700) {
          myChart.getDom().style.height = 3 + 'rem'
          myChart.getDom().style.width = 6 + 'rem'
        } else {
          myChart.getDom().style.height = 3 + 'rem'
          myChart.getDom().style.width = 6 + 'rem'
        }
        myChart.resize()
      }
    }
  },
  mounted () {
    this.drawChart()
    const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getWasteWaterMonitoring))
    console.log(dataWatch)
    for (var i = 0; i < dataWatch.length; i++) {
      this.dataDate.push(dataWatch[i].MonTimeStr.substring(10, 17))
    }
    console.log(this.dataDate)
    this.$nextTick(() => {
      this.drawChart()
      const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getWasteWaterMonitoring))
      // console.log(dataWatch)
      for (var i = 0; i < dataWatch.length; i++) {
        this.dataDate.push(dataWatch[i].MonTimeStr.substring(10, 17))
      }
      // console.log(this.dataDate)
    })
  }
}
</script>
<style scoped lang="less">
    .infomation {
        margin-left: 10px;
    }
.Infomation {
  margin-left: 10px;
  height: 0.2rem;
}
    .el-tag {
        height: 25px;
        line-height: 25px;
        margin-right: 10px;
        font-size: 10px;
        background-color: rgba(0, 255, 246, 0.14);
        color: #00d0f9;
        border: none;
        padding: 0 15px;
    }
.el-tag {
  height: 25px;
    width: 140px;
  line-height: 25px;
  margin-right: 10px;
  font-size: 10px;
  background-color: rgba(0, 255, 246, 0.14);
  color: #00d0f9;
  border: none;
  padding: 0 15px;
}
    .form-echrts {
        width: 100%;
        height: 100%;
        border: 1px solid #396d83;
        //margin: 10px 10px 10px 10px;
        .el-dialog-div {
            //height: 50vh!important;
            overflow: auto;
            //overflow: hidden;
        }
        .block{
            .date{
                width: 300px;
                height: 30px;
            }
        }
        .text-size{
            display: flex;
            justify-content: space-around;
        }
        .from-search{
            display: flex;
            justify-content: space-around;
            .demo-form-inline{
                display: flex;
                justify-content: space-around;
            }
            .el-button--mini, .el-button--mini.is-round{
                height: 30px;
            }
        }
        #echarts {
            margin: 0;
            padding: 0;
            //border: 1px solid #396d83;
            //margin: 10px 10px 10px 10px;
        }
    }
.form-echrts {
  width: 100%;
  height: 1rem;
  border-top: 1px solid #396d83;
  //margin: 10px 10px 10px 10px;
  .el-dialog-div {
    //height: 50vh!important;
    overflow: auto;
    //overflow: hidden;
  }
  #echarts {
    margin: 0;
    padding: 0;
    //height: 3rem;
    //border: 1px solid #396d83;
    //margin: 10px 10px 10px 10px;
  }
}
</style>