微工厂缝纫设备看板 接口调试

src/http/device/index.ts

@@ -0,0 +1,18 @@
+/*
+ * @Author: hzz hzz
+ * @Date: 2023-05-12 16:37:42
+ * @LastEditors: hzz hzz
+ * @LastEditTime: 2023-05-18 09:08:30
+ * @FilePath: \screenFront\src\http\electronicControl\index.ts
+ * @Description: 
+ * 
+ * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved. 
+ */
+import {get,post} from "@/utils/http"
+
+//获取微工厂缝纫设备数据
+export function getSewingBoard(){
+    return get('/device/getSewingBoard')
+}
+
+

src/views/MicrofactoryDevOnline/components/RingChart.vue

@@ -8,7 +8,10 @@
                     <div class="name">当日总针数</div>
                 </div>
                 <div class="chart" ref="chart"></div>
-                <div class="bottom">{{ prop.data.name }}({{ prop.data.label }})</div>
+                <div class="bottom">
+                    <text>{{ prop.data.name }}</text>
+                    <small>{{ prop.data.label }}</small>
+                </div>
             </div>
         </dv-border-box-6>
 
@@ -125,16 +128,24 @@ onMounted(() => {
 
 .bottom {
     width: 100%;
-    height: 24px;
+    height: 50px;
     color: #fff;
-    line-height: 24px;
-    font-size: 20px;
     font-weight: bold;
     position: absolute;
     bottom: 8px;
     left: 0;
     text-align: center;
     overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+    align-items: center;
+}
+.bottom text {
+    font-size: 18px;
+}
+.bottom small {
+    font-size: 14px;
 }
 
 .chart {
@@ -142,7 +153,7 @@ onMounted(() => {
     width: 100%;
     height: 70%;
     left: 0;
-    bottom: 32px;
+    bottom: 50px;
 }
 
 .online {

src/views/MicrofactoryDevOnline/index.vue

@@ -20,6 +20,7 @@
 import header2 from "@/components/headerBox/header2.vue";
 import RingChart from "./components/RingChart.vue";
 import { ref,onMounted,onUnmounted } from 'vue'
+import {getSewingBoard} from '@/http/device'
 import { useI18n } from 'vue-i18n'
 let { t } = useI18n();
 
@@ -35,31 +36,45 @@ let titleTip = [
   },
 ];
 let timer = null;
-let arr = [];
-for (let index = 0; index < 21; index++) {
-  let random = +(Math.random() * 24).toFixed(1);
-  arr.push({
-    id: '',
-    status: '在线',
-    name: '五线包缝机',
-    label: 'RP2011158',
-    count: 0,
-    series: [
-      { value: random, name: '工作时间' },
-      { value: (24-random).toFixed(1), name: '空闲时间' }
-    ]
-  })
+let arr = ref([]);
 
+function reqSewingBoard() {
+  getSewingBoard().then((res:any) => {
+    if (res.code == 200) {
+      arr.value = res.data.map(item=>{
+        return {
+          id: '',
+          status: item.status == 'true'? '在线':'离线',
+          name: item.name,
+          label: item.label,
+          count: item.pins,
+          series: item.series
+        }
+      });
+    }
+  })
 }
+// for (let index = 0; index < 21; index++) {
+//   let random = +(Math.random() * 24).toFixed(1);
+//   arr.push({
+//     id: '',
+//     status: '在线',
+//     name: '五线包缝机',
+//     label: 'RP2011158',
+//     count: 0,
+//     series: [
+//       { value: random, name: '工作时间' },
+//       { value: (24-random).toFixed(1), name: '空闲时间' }
+//     ]
+//   })
+
+// }
 
 onMounted(()=>{
+  reqSewingBoard()
   timer = setInterval(() => {
-    arr.forEach(item => {
-      let random = +(Math.random() * 24).toFixed(1);
-      item.series[0].value = random;
-      item.series[1].value = (24-random).toFixed(1);
-    })
-  }, 5000);
+    reqSewingBoard()
+  }, 60000);
 })
 onUnmounted(()=>{
   clearInterval(timer);

src/views/generalEnvironmentMechanical/index.vue

@@ -100,6 +100,7 @@ const verticalType = {
     'FIRE': { icon: 'icon-weibiaoti1', title: t('messages.flameDetection'), unit: null },
     'noise': { icon: 'icon-shengyin', title: t('messages.noiseDetection'), unit: 'dB' },
 }
+let noiseData = []
 /**用电量 */
 let powerData = ref({ value: { name: [] }, seriesVal: [], title: t('messages.Powerto2023') })
 
@@ -144,10 +145,11 @@ async function getSensorData() {
         getnoiseData({ deptIds }),
         getSafeWarningData({ deptIds }),
     ])
-    let noiseData = {
+    let noiseDataList = {
         limit: res[0].data.top.value,
         type: 'noise',
         value: res[0].data.listData.map((item: any) => {
+            noiseData.push(item.devId)
             return {
                 devId: item.devId,
                 name: item.name + '噪音监测',
@@ -157,7 +159,7 @@ async function getSensorData() {
             }
         })
     }
-    list.push(noiseData);
+    list.push(noiseDataList);
     list.push(...res[1].data)
 
     let datetime = new Date().getTime();
@@ -219,7 +221,7 @@ watch(() => store.humiture, (newVal, oldVal) => {
  */
 //获取粉尘数据
 let pmindex = ref(0);
-let noiseData = []
+
 async function getPmData() {
     let resulttwo: any = await getPmtwoData({ deptIds: '6,7,9,10,11' })
     let resultten: any = await getPmtenData({ deptIds: '6,7,9,10,11' })
@@ -232,7 +234,7 @@ async function getPmData() {
                 pm25: ele.value,
                 pm10: null
             }
-            noiseData.push(ele.devId)
+            
         })
     }
 
@@ -340,9 +342,12 @@ function getWebsocket(val) {
         let data = JSON.parse(val);
 
         if (data.type == "noise") {
+            
             data.msg.listData.forEach(ele => {                
                 if (noiseData.indexOf(ele.devId) > -1) {
                     let verticalData = { name: ele.name, val: ele.value, devId: ele.devId, status: ele.status }
+                    
+                    
                     store.changeNewVerticalNum({ type: 'noise', data: verticalData })
                 }
             })

src/views/index.vue

@@ -286,6 +286,12 @@ let routerList = [
     title: '南门水房物联大屏',
     url: require("../assets/indexImg/waterhouse.png"),
   },
+  {
+    id: 31,
+    path: "/MicrofactoryDevOnline",
+    title: '南门水房物联大屏',
+    url: require("../assets/indexImg/MicrofactoryDevOnline.png"),
+  },
 ];
 let lang=ref(getStoredLanguage()||'简体中文')
 function changelang(val){