648540858
2023-09-11 a6fb1cdb74ca11c9dba798e64bf3d61bbfbdf05b
web_src/src/components/console.vue
old mode 100644 new mode 100755
@@ -2,6 +2,10 @@
  <div id="app" style="width: 100%">
    <div class="page-header">
      <div class="page-title">控制台</div>
      <div class="page-header-btn">
        <el-button icon="el-icon-info" size="mini" style="margin-right: 1rem;" type="primary" @click="showInfo">平台信息
        </el-button>
      </div>
    </div>
    <el-row style="width: 100%">
      <el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
@@ -14,7 +18,7 @@
      <el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
        <div class="control-cell" id="WorkThreadsLoad" >
          <div style="width:100%; height:100%; ">
            <consoleMem ref="consoleMem"></consoleMem>
            <consoleResource ref="consoleResource"></consoleResource>
          </div>
        </div>
      </el-col>
@@ -28,27 +32,27 @@
      <el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
        <div class="control-cell" id="WorkThreadsLoad" >
          <div style="width:100%; height:100%; ">
            <consoleCPU></consoleCPU>
            <consoleMem ref="consoleMem"></consoleMem>
          </div>
        </div>
      </el-col>
      <el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
        <div class="control-cell" id="WorkThreadsLoad" >
          <div style="width:100%; height:100%; ">
            <consoleCPU></consoleCPU>
            <consoleNodeLoad ref="consoleNodeLoad"></consoleNodeLoad>
          </div>
        </div>
      </el-col>
      <el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
        <div class="control-cell" id="WorkThreadsLoad" >
          <div style="width:100%; height:100%; ">
            <consoleCPU></consoleCPU>
            <consoleDisk ref="consoleDisk"></consoleDisk>
          </div>
        </div>
      </el-col>
    </el-row>
    <configInfo ref="configInfo"></configInfo>
  </div>
</template>
@@ -57,6 +61,10 @@
import consoleCPU from './console/ConsoleCPU.vue'
import consoleMem from './console/ConsoleMEM.vue'
import consoleNet from './console/ConsoleNet.vue'
import consoleNodeLoad from './console/ConsoleNodeLoad.vue'
import consoleDisk from './console/ConsoleDisk.vue'
import consoleResource from './console/ConsoleResource.vue'
import configInfo from './dialog/configInfo.vue'
import echarts from 'echarts';
@@ -67,16 +75,23 @@
    uiHeader,
    consoleCPU,
    consoleMem,
    consoleNet
    consoleNet,
    consoleNodeLoad,
    consoleDisk,
    consoleResource,
    configInfo,
  },
  data() {
    return {
      timer: null
      timer: null,
    };
  },
  created() {
    this.getSystemInfo();
    this.getLoad();
    this.getResourceInfo();
    this.loopForSystemInfo();
  },
  destroyed() {
  },
@@ -86,9 +101,14 @@
        window.clearTimeout(this.timer);
      }
      this.timer = setTimeout(()=>{
        this.getSystemInfo();
        this.timer = null;
        this.loopForSystemInfo()
        if (this.$route.path === "/console") {
          this.getSystemInfo();
          this.getLoad();
          this.timer = null;
          this.loopForSystemInfo()
          this.getResourceInfo()
        }
      }, 2000)
    },
    getSystemInfo: function (){
@@ -99,11 +119,50 @@
        if (res.data.code === 0) {
          this.$refs.consoleCPU.setData(res.data.data.cpu)
          this.$refs.consoleMem.setData(res.data.data.mem)
          this.$refs.consoleNet.setData(res.data.data.net)
          this.$refs.consoleNet.setData(res.data.data.net, res.data.data.netTotal)
          this.$refs.consoleDisk.setData(res.data.data.disk)
        }
      }).catch( (error)=> {
      });
    },
    getLoad: function (){
      this.$axios({
        method: 'get',
        url: `/api/server/media_server/load`,
      }).then( (res)=> {
        if (res.data.code === 0) {
          this.$refs.consoleNodeLoad.setData(res.data.data)
        }
      }).catch( (error)=> {
      });
    },
    getResourceInfo: function (){
      this.$axios({
        method: 'get',
        url: `/api/server/resource/info`,
      }).then( (res)=> {
        if (res.data.code === 0) {
          this.$refs.consoleResource.setData(res.data.data)
        }
      }).catch( (error)=> {
      });
    },
    showInfo: function (){
      this.$axios({
        method: 'get',
        url: `/api/server/system/configInfo`,
      }).then( (res)=> {
        console.log(res)
        if (res.data.code === 0) {
          console.log(2222)
          console.log(this.$refs.configInfo)
          this.$refs.configInfo.openDialog(res.data.data)
        }
      }).catch( (error)=> {
      });
    }
  }
};
</script>