更新

package.json

@@ -9,6 +9,7 @@
   "dependencies": {
     "axios": "^1.6.7",
     "core-js": "^3.8.3",
+    "crypto-js": "^4.2.0",
     "element-ui": "^2.15.14",
     "vue": "^2.6.14",
     "vue-router": "^3.5.1"

src/components/direct.vue

 <template>
     <div class="wrapper">
         <div class="top">
-            <div class="top_item"><span class="top_item_title">设备SN</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备状态</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备温度</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备总功率</span><span class="top_item_con">1111</span></div>
+            <div class="top_item"><span class="top_item_title">设备SN</span><span class="top_item_con">GG2301AZ93</span></div>
+            <div class="top_item"><span class="top_item_title">设备状态</span><span class="top_item_con">在线</span></div>
+            <div class="top_item"><span class="top_item_title">设备温度</span><span class="top_item_con">{{currentDevice.temperature}}</span></div>
+            <div class="top_item"><span class="top_item_title">设备总功率</span><span class="top_item_con">{{currentDevice.power}}</span></div>
         </div>
-        <el-button @click="getList">123</el-button>
         <div class="center">
             <div v-for="item in list" :key="item.id">
                 <div class="center_item">
                     <el-button type="primary">通道{{item.id +1}}</el-button>
                     <div class="item_table_w">
                         <div class="item_table">
-                            <div class="item_text"><span style="margin-right: 37px;">电流</span> <span>14A</span>
+                            <div class="item_text"><span style="margin-right: 37px;">电流</span> <span>{{item.electric}}A</span>
 
                             </div>
-                            <div class="item_text2"><span style="margin-right: 37px;">电压</span><span>14A</span> </div>
+                            <div class="item_text2"><span style="margin-right: 37px;">电压</span><span>{{item.voltage}}V</span> </div>
                         </div>
                         <img src="@/assets/img/box.png" alt="" class="item_img">
                     </div>
@@ -31,34 +30,36 @@
 
         data() {
             return {
-                list: [],
-
+                list:[],
+currentDevice:{power:'',temperature:''}
             };
         },
 
 
         created() {
-            // this.getList()
+            this.getList()
         },
 
 
 
         methods: {
             getList() {
-                console.log(localStorage.getItem('token'))
 
                 // return
-                http.post("/sys/dev/sn/model/list", {
-                    // currentPage: 1,
-                    // deviceName: '6D8X05-X5NAGR',
-                    // identifier: 'gfTemperatureHumidity',
-                    // productKey: '1TOMLS7WC58409644',
-                    // type: 'event'
+                http.post("/sys/dev/device/runtime/list", {
+                    currentPage: 1,
+                    deviceName: '6D8X05-X5NAGR',
+                    identifier: 'gfConfluenceMachine',
+                    productKey: '1TOMLS7WC58409644',
+                    type: 'event'
                 }).then((res) => {
                     if (res.code == 200) {
+                        this.currentDevice={power:res.data.list[0].value.totalPower,
+                        temperature:res.data.list[0].value.temperature}
                         let arr = res.data.list[0].value.allPathElect
                         let arr2 = res.data.list[0].value.allPathPower
                         arr.map((item, index) => {
+                            if(index<16)
                             this.list.push({ id: index, voltage: arr2[index], electric: item })
                         })
 
@@ -78,7 +79,7 @@
 <style scoped>
     .wrapper {
         background: #F4F7FC;
-        height: 100vh;
+        min-height: 100vh;
         padding: 40px;
     }
 
@@ -113,6 +114,7 @@
         background: #FFFFFF;
         display: flex;
         margin-top: 40px;
+        flex-wrap: wrap;
     }
 
     .center_item {

src/components/exchange.vue

 <template>
     <div class="wrapper">
         <div class="top">
-            <div class="top_item"><span class="top_item_title">设备SN</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备状态</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备温度</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备总功率</span><span class="top_item_con">1111</span></div>
+            <div class="top_item"><span class="top_item_title">设备SN</span><span class="top_item_con">GG23017NLX</span></div>
+            <div class="top_item"><span class="top_item_title">设备状态</span><span class="top_item_con">在线</span></div>
+            <div class="top_item"><span class="top_item_title">设备温度</span><span class="top_item_con">{{currentDevice.temperature}}</span></div>
+            <div class="top_item"><span class="top_item_title">设备总功率</span><span class="top_item_con">{{currentDevice.power}}</span></div>
           </div>
         <div class="center">
             <img src="@/assets/img/clock.png" alt="" class="item_img">
 
+{{allPathElect.electA}}A
+{{allPathElect.electB}}A
+{{allPathElect.electC}}A
         </div>
     </div>
 </template>
@@ -18,36 +21,49 @@
 
         data() {
             return {
-                list: [],
              
+currentDevice:{power:'',temperature:''},
+allPathElect:{},
             };
         },
 
 
         created() {
-            // this.getList()
+            this.getDevice()
+            this.getList()
         },
 
 
 
         methods: {
-            getList() {
-                console.log(localStorage.getItem('token'))
+                     getDevice() {
 
                 // return
                 http.post("/sys/dev/device/runtime/list", {
                     currentPage: 1,
-                    deviceName: '6D8X05-X5NAGR',
+                    deviceName: '4NRVXE-STZ6RO',
                     identifier: 'gfConfluenceMachine',
                     productKey: '1TOMLS7WC58409644',
                     type: 'event'
                 }).then((res) => {
                     if (res.code == 200) {
-                        let arr = res.data.list[0].value.allPathElect
-                        let arr2 = res.data.list[0].value.allPathPower
-                        arr.map((item, index) => {
-                            this.list.push({ id: index, voltage: arr2[index], electric: item })
-                        })
+                        this.currentDevice={power:res.data.list[0].value.totalPower,
+                        temperature:res.data.list[0].value.temperature}
+                      
+
+                    }
+                });
+            },
+            getList() {
+                http.post("/sys/dev/device/runtime/list", {
+                    currentPage: 1,
+                    deviceName: '4NRVXE-STZ6RO',
+                    identifier: 'gfDigitalMachine',
+                    productKey: '1TOMLS7WC58409644',
+                    type: 'event'
+                }).then((res) => {
+                    if (res.code == 200) {
+                         this.allPathElect=res.data.list[0].value
 
                     }
                 });

src/components/grid.vue

 <template>
     <div class="wrapper">
              <div class="top">
-            <div class="top_item"><span class="top_item_title">设备SN</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备状态</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备温度</span><span class="top_item_con">1111</span></div>
-            <div class="top_item"><span class="top_item_title">设备总功率</span><span class="top_item_con">1111</span></div>
+            <div class="top_item"><span class="top_item_title">设备SN</span><span class="top_item_con">GG23015K0C</span></div>
+            <div class="top_item"><span class="top_item_title">设备状态</span><span class="top_item_con">在线</span></div>
+            <div class="top_item"><span class="top_item_title">设备温度</span><span class="top_item_con">{{currentDevice.temperature}}</span></div>
+            <div class="top_item"><span class="top_item_title">设备总功率</span><span class="top_item_con">{{currentDevice.power}}</span></div>
           </div>
         <!-- <div class="center">
             <img src="@/assets/img/clock.png" alt="" class="item_img">
@@ -18,37 +18,31 @@
 
         data() {
             return {
-                list: [],
-
+currentDevice:{power:'',temperature:''}
             };
         },
 
 
         created() {
-            // this.getList()
+            this.getList()
         },
 
 
 
         methods: {
             getList() {
-                console.log(localStorage.getItem('token'))
     
-                // return
                 http.post("/sys/dev/device/runtime/list", {
                     currentPage: 1,
-                    deviceName: '6D8X05-X5NAGR',
+                    deviceName: 'ONMTC3-54UE0J',
                     identifier: 'gfConfluenceMachine',
                     productKey: '1TOMLS7WC58409644',
                     type: 'event'
                 }).then((res) => {
                     if (res.code == 200) {
-                        let arr = res.data.list[0].value.allPathElect
-                        let arr2 = res.data.list[0].value.allPathPower
-                        arr.map((item, index) => {
-                            this.list.push({ id: index, voltage: arr2[index], electric: item })
-                        })
                  
+    this.currentDevice={power:res.data.list[0].value.totalPower,
+                        temperature:res.data.list[0].value.temperature}
                     }
                 });
             },

src/utils/http.js

@@ -14,15 +14,16 @@ const http = {
   get(url, params) {
     const config = {
       method: "get",
-      url: baseURL + url,
+      url:  url,
     };
-    if (params) config.params = params;
+    if (params) config.data = params;
     return request(config);
   },
   post(url, params) {
     const config = {
-      method: "post",
+      method: "Post",
       url: url,
+      
     };
     if (params) config.data = params;
     return request(config);

src/utils/request.js

@@ -5,6 +5,7 @@ import http from "./http";
 import router from "../router";
 // 使用element-ui Message做消息提醒
 import { Message } from "element-ui";
+import CryptoJS from 'crypto-js';
 //1. 创建新的axios实例，
 const service = axios.create({
   // 公共接口
@@ -12,31 +13,37 @@ const service = axios.create({
   // 超时时间 单位是ms，这里设置了3s的超时时间
   timeout: 10 * 1000,
 });
+
 // 2.请求拦截器
 service.interceptors.request.use(
 
   (config) => {
-    console.log(1111111);
+    
     //发请求前做的一些处理，数据转化，配置请求头，设置token,设置loading等，根据需求去添加
     config.data = JSON.stringify(config.data); //数据转化,也可以使用qs转换
     config.headers = {
       "Content-Type": "application/json", //配置请求头
     };
     // 这里可以用本地储存去拿token
-    const token = localStorage.getItem("token"); //localStorage
-    // const session = sessionStorage.getItem('token')  //sessionStorage
-    console.log(33333333)
+    const token = localStorage.getItem("token")?localStorage.getItem("token"):''; //localStorage
    
 
     let TimeStamp = new Date().getTime();
-    // console.log(token);
+    let src = `token=${token}&&timeStamp=${TimeStamp}`;
+    let HmacSHA1 = CryptoJS.HmacSHA1(src, '90d2fca50ea8ed5472c5776c9fc53638').toString();
+   
 
     if (token) {
+      config.headers={
+        "Content-Type": "application/json",
+        Authorization: "Bearer " + token,
+        Sign: HmacSHA1,
+        TimeStamp,
    
-      let src = `token=${token}&&timeStamp=${TimeStamp}`;
+    };
+      return config
     }
-    let HmacSHA1 = CryptoJS.HmacSHA1(src, '90d2fca50ea8ed5472c5776c9fc53638').toString();
-
+    // else
     return config;
   },
   (error) => {
@@ -73,7 +80,6 @@ service.interceptors.response.use(
     return response.data;
   },
   (error) => {
-    console.log(error)
     /***** 接收到异常响应的处理开始 *****/
     if (error && error.response) {
       // 1.公共错误处理
@@ -120,7 +126,6 @@ service.interceptors.response.use(
           error.message = `连接错误${error.response.status}`;
       }
     } else {
-      // console.log(error)
       // 超时处理
       if (JSON.stringify(error).includes("timeout")) {
         Message.error("服务器响应超时，请刷新当前页");