1.优化动态路由

loulijun2021

2022-06-26 0d86c19b122011dc528c624597b0952660d69aba

 src/views/xtsy/index.vue

@@ -1,6 +1,6 @@
<template>
  <!--  <div>-->
  <div class="body">
  <div class="body" style="  padding: 30px 10px 0 20px;background-color: #eee;" :style="{height:mainHeight+'px'}">
    <div style="">
      <div class="title"><i class="el-icon-s-fold" style="margin-right: 5px" />实时数据</div>
      <div class="top">
@@ -108,6 +108,8 @@
  name: 'Index',
  data() {
    return {
      mainHeight: 0,
      tableHeight: 0,
      barTopColor01: ['42,197,137', '187,236,218'],
      barTopColor02: ['248,216,76', '255,250,238'],
      barTopColor03: ['42,197,137', '187,236,218'],
@@ -118,9 +120,19 @@
  created() {
  },
  mounted() {
    window.addEventListener('resize', this.getHeight)
    this.getHeight()
    this.handleEcharts()
  },
  methods: {
    // 获取页面高度
    getHeight() {
      this.$nextTick(() => {
        this.mainHeight = window.innerHeight - 120
        // this.mainHeight = window.innerHeight - 200
        // this.tableHeight = this.mainHeight - 100
      })
    },
    handleEcharts() {
      this.getTopData()
      this.getBar01()
@@ -203,23 +215,23 @@
      .images {
        width: 69px;
        height: 69px;
        margin: 30px;
        margin: 30px calc((10% - 20px));
      }

      .images1 {
        background: url("../../assets/images/dlyy.png") no-repeat;
        background: url("../../assets/images/msg_app.png") no-repeat;
      }

      .images2 {
        background: url("../../assets/images/hyyyy.png") no-repeat;
        background: url("../../assets/images/msg_huoyue.png") no-repeat;
      }

      .images3 {
        background: url("../../assets/images/webhy.png") no-repeat;
        background: url("../../assets/images/msg_web.png") no-repeat;
      }

      .images4 {
        background: url("../../assets/images/apphy.png") no-repeat;
        background: url("../../assets/images/msg_zhuceyonghu.png") no-repeat;
      }

      .content {