可视化仓房部分滚动

src/layout/header-aside/layout.vue

@@ -24,9 +24,9 @@
           <d2-icon name="bars"/>
         </div> -->
         <d2-menu-header flex-box="1" />
-        <!-- <el-button type="primary" size="small" @click="ksh">可视化
+        <el-button type="primary" size="small" @click="ksh" style="font-size:15px">可视化
 
-        </el-button> -->
+        </el-button>
         <!-- 顶栏右侧 -->
         <div class="d2-header-right" flex-box="0">
           <!-- 如果你只想在开发环境显示这个按钮请添加 v-if="$env === 'development'" -->
@@ -160,11 +160,11 @@ export default {
     },
   },
   methods: {
-    // ksh(){
-    //   this.$router.push({
-    //     path:"/visualized"
-    //   })
-    // },
+    ksh(){
+      this.$router.push({
+        path:"/visualized"
+      })
+    },
     ...mapActions('d2admin/menu', [
       'asideCollapseToggle'
     ]),

src/router/routes.js

@@ -8,14 +8,14 @@ const _import = require('@/libs/util.import.' + process.env.NODE_ENV)
  * 在主框架内显示
  */
 const frameIn = [
-  // {  // 大屏首页
-  //   path: '/visualized',
-  //   name: 'visualized',
-  //   meta: {
-  //     auth: true
-  //   },
-  //   component: _import('system/visualized')
-  // },
+  {  // 大屏首页
+    path: '/visualized',
+    name: 'visualized',
+    meta: {
+      auth: true
+    },
+    component: _import('system/visualized')
+  },
 
   {
     path: '/',
@@ -316,14 +316,14 @@ const frameIn = [
  * 在主框架之外显示
  */
 const frameOut = [
-  {  // 大屏首页
-    path: '/visualized',
-    name: 'visualized',
-    // meta: {
-    //   auth: true
-    // },
-    component: _import('system/visualized')
-  },
+  // {  // 大屏首页
+  //   path: '/visualized',
+  //   name: 'visualized',
+  //   // meta: {
+  //   //   auth: true
+  //   // },
+  //   component: _import('system/visualized')
+  // },
   // 登录
   {
     path: '/login',

src/views/demo/alarmRecord/index.vue

@@ -1234,6 +1234,13 @@ export default {
   },
   mounted() {
     this.getSelect();
+ 
+    if(this.$route.query.proCode){
+      this.formInline.proCode=this.$route.query.proCode
+    }
+    if(this.$route.query.eqCode){
+      this.formInline.eqCode=this.$route.query.eqCode
+    }
     this.getList();
   },
 };

src/views/demo/equipmentManage/equipment/index.vue

@@ -127,8 +127,8 @@
                   align="center"
                 >
                 </el-table-column>
-                <el-table-column prop="phoneO" label="设备数量" align="center">
-                </el-table-column>
+                <!-- <el-table-column prop="phoneO" label="设备数量" align="center">
+                </el-table-column> -->
 
                 <el-table-column
                   prop="orgName"
@@ -168,12 +168,12 @@
                   align="center"
                 >
                 </el-table-column>
-                <el-table-column
+                <!-- <el-table-column
                   prop="lastOnlineTime"
                   label="最后上线时间"
                   align="center"
                 >
-                </el-table-column>
+                </el-table-column> -->
 
                 <el-table-column label="操作" width="160" align="center">
                   <template slot-scope="scope">
@@ -352,7 +352,7 @@ export default {
     },
     //查看
     goDetail(row) {
-      this.$router.push({ path: "equipmentInfo",query:{id:row.id} });
+      this.$router.push({ path: "equipmentInfo",query:{id:row.id,eqCode:row.eqCode} });
     },
     //跳转产品分类
     goTag() {

src/views/demo/equipmentManage/equipmentInfo/index.vue

@@ -84,15 +84,15 @@
                 <div class="nowData">
                   <div>
                     <div>温度</div>
-                    <div>28.4℃</div>
+                    <div>{{rightTempValue}}℃</div>
                   </div>
                   <div>
                     <div>湿度</div>
-                    <div>38.4%</div>
+                    <div>{{rightWetValue}}%</div>
                   </div>
                   <div>
                     <div>露点温度</div>
-                    <div>28.4℃</div>
+                    <div>{{rightDewValue}}℃</div>
                   </div>
                 </div>
                 <h5 style="margin: 20px 0">历史定时任务数据</h5>
@@ -260,7 +260,7 @@
               size="mini"
               type="primary"
               icon="el-icon-search"
-              @click="search"
+              @click="search()"
               >查询</el-button
             >
           </el-form-item>
@@ -270,7 +270,7 @@
               type="primary"
               size="mini"
               icon="el-icon-refresh-left"
-              @click="reset"
+              @click="reset()"
               >重置</el-button
             >
           </el-form-item>
@@ -476,6 +476,10 @@ export default {
   components: { detailTable, addDialog },
   data() {
     return {
+   rightDewValue : 0,
+    rightTempValue : 0,
+    rightWetValue : 0,
+      alarmRecord:[],
       pintsPageList:[],
       rwList:[],
       client: {},
@@ -604,18 +608,34 @@ export default {
   methods: {
     connect() {
       let options = {
+        //本地
         username: "admin",
         password: "public",
+        //测试
+        //    username: "admin",
+        // password: "admin@123",
+        //生产
+        // username: "admin",
+        // password: "admin@2Ld&DDrsk",
         cleanSession : true,
         keepAlive:60,
         clientId: 'mqttjs_'+ Math.random().toString(16).substr(2, 8),
         connectTimeout: 4000
       }
-      this.client = mqtt.connect('ws://192.168.50.169:1883/mqtt',options);
+      //本地开发环境
+      this.client = mqtt.connect('ws://192.168.50.169:8083/mqtt',options);
+      //测试环境
+        //  this.client = mqtt.connect('ws://172.16.0.5:8083/mqtt',options);
+        //正式环境
+         // this.client = mqtt.connect('ws://10.105.101.61:8083/mqtt',options);
       this.client.on("connect", (e)=>{
         console.log("成功连接服务器:",e);
         //订阅三个名叫'top/#', 'three/#'和'#'的主题
-        this.client.subscribe(['topic/X1XXXQ2206090069/DPUT/upload'], { qos: 1 }, (err)=> {
+        this.client.subscribe([
+            // "/PUSH/c89512024085/DPUT/upload",
+            // "/PUSH/X1XXXQ2206090069/DPUT/upload",
+            "/PUSH/8951DQ2207200018/DPUT/upload",
+          ], { qos: 1 }, (err)=> {
           if (!err) {
             console.log("订阅成功");
             //向主题叫“pubtop”发布一则内容为'hello,this is a nice day!'的消息
@@ -652,6 +672,7 @@ export default {
           const res = JSON.parse(message.toString())
           this.runData=res.data
           console.log(res, 'res',this.runData,'runData')
+          this.calcAve(this.runData)
           // switch(topic) {
           //    case 'top/lll' :
           //      this.msg = res.msg
@@ -695,6 +716,41 @@ export default {
           console.log('正在重连:', error)
       });
     },
+    //公共方法计算平均值
+    calcAve(arr) {
+      //计算平均值
+
+      let avgNum = 0;
+      this.rightDewValue = 0;
+      this.rightTempValue = 0;
+      this.rightWetValue = 0;
+
+        arr.forEach((item) => {
+          avgNum++;
+          console.log(item, "item");
+          item.dewValue = parseInt(item.dewValue);
+          item.tempValue = parseInt(item.tempValue);
+          item.wetValue = parseInt(item.wetValue);
+          //露点均温
+          this.rightDewValue += item.dewValue;
+          //温度均温
+          this.rightTempValue += item.tempValue;
+          //湿度均温
+          this.rightWetValue += item.wetValue;
+          console.log(
+            this.rightDewValue,
+            this.rightTempValue,
+            this.rightWetValue
+          );
+ 
+      });
+      //取整
+      console.log(this.rightDewValue, avgNum, "wwwwww");
+      this.rightDewValue = parseInt(this.rightDewValue / avgNum);
+      this.rightTempValue = parseInt(this.rightTempValue / avgNum);
+      this.rightWetValue = parseInt(this.rightWetValue / avgNum);
+      console.log(this.rightDewValue, "//////");
+    },
     //获取列表数据
     getList() {
       var condition = {};
@@ -730,7 +786,7 @@ export default {
           this.basicInfo = [
             {
               name: "设备ID",
-              val: [this.info.id],
+              val: [this.info.eqCode],
               name1: "设备名称",
               val1: [this.info.eqName],
             },
@@ -802,7 +858,7 @@ export default {
     },
     tabsClick(v) {
       if (v.name == "fourth") {
-        this.$router.push({ path: "alarmRecord" });
+        this.$router.push({ path: "alarmRecord",query:{eqCode:this.$route.query.eqCode}});
       }else if(v.name=="second"){
         this.getRwList()
       } else if (v.name == "third") {
@@ -824,6 +880,7 @@ export default {
               this.pintsPageList = res.data.records;
               this.pagination2.pageSize = res.data.size;
               this.pagination2.total = res.data.total;
+              this.calcAve( this.pintsPageList)
             }
           })
           .catch((err) => {
@@ -852,6 +909,16 @@ export default {
           console.log(err);
         });
     },
+    //查询
+    search(){
+      
+    },
+    //重置
+    reset(){
+      this.formInline={}
+    },
+    //确定
+    sure(){},
     //表格序号
     indexMethod(index) {
       return (

src/views/demo/parameManagement/alarmParame/index.vue

@@ -602,9 +602,12 @@ export default {
       this.title1 = "报警配置信息查看";
       this.dialogAlarm = true;
       this.getBjlxArr();
+
       api.alarmParamsDetail(row.id).then((res) => {
         if (res.code == 200) {
+          console.log(res.data,"查看列表")
           this.addForm = res.data;
+           this.yxTableData=res.data.devInfoList
         } else {
           this.$message.error(res.msg);
         }
@@ -614,9 +617,11 @@ export default {
       this.title1 = "编辑报警配置信息";
       this.dialogAlarm = true;
       this.getBjlxArr();
+   
       api.alarmParamsDetail(row.id).then((res) => {
         if (res.code == 200) {
           this.addForm = res.data;
+          this.yxTableData=res.data.devInfoList
         } else {
           this.$message.error(res.msg);
         }
@@ -779,6 +784,7 @@ export default {
         .equipmentList(data)
         .then((res) => {
           if (res.code == 200) {
+            console.log(this.sbTableData,"this.sbTableData")
             this.sbTableData = res.data.records;
             this.pagination1.pageSize = res.data.size;
             this.pagination1.total = res.data.total;

src/views/demo/productManage/product/index.vue

@@ -216,7 +216,7 @@ export default {
     },
     //查看
     goDetail(row) {
-      this.$router.push({ path: "productInfo",query:{id:row.id} });
+      this.$router.push({ path: "productInfo",query:{id:row.id,proCode:row.proCode} });
     },
     //跳转产品分类
     goClassify() {

src/views/demo/productManage/productInfo/index.vue

@@ -897,7 +897,7 @@ export default {
     },
     tabsClick(v) {
       if(v.name=='fourth'){
-        this.$router.push({ path: "alarmRecord" })
+        this.$router.push({ path: "alarmRecord" ,query:{proCode:this.$route.query.proCode} })
       }else if(v.name=='second'){
         this.getRun()
       }else if(v.name=='third'){

src/views/demo/system/operationLog/index.vue

@@ -23,7 +23,7 @@
 
                
                       <el-form-item label="账户名称">
-                  <el-input size="mini" placeholder="请输入" v-model="formInline.userId"></el-input>
+                  <el-input size="mini" placeholder="请输入" v-model="formInline.userName"></el-input>
                   </el-form-item>
                   <el-form-item>
                     <el-button
@@ -227,7 +227,7 @@ export default {
 
       //查询条件
       formInline: {
-      userId:"",
+        userName:"",
       },
    roleLists:[],
     
@@ -256,7 +256,7 @@ export default {
     getList() {
       console.log("....");
       var condition = {
-       userId:this.formInline.userId
+        userName:this.formInline.userName
       };
       condition = JSON.stringify(condition);
       var data = {

src/views/demo/system/organization/index.vue

@@ -390,10 +390,12 @@ export default {
     },
     // 编辑
     handleCheck(type, index, row) {
-      // console.log(type, index, row, "row");
+      console.log(type, index, row, "row");
       this.indexData = row;
+
       this.dialogFormVisible1 = true;
       this.editOrgForm.orgName = row.orgName;
+      this.editOrgForm.orgCode=row.orgCode
       /*  if (this.editOrgForm.parentId == 0) {
          // 无上级机构
          this.editOrgForm.parentId = '无'

src/views/demo/system/roleManagement/index.vue

@@ -290,6 +290,7 @@ export default {
     },
     // 编辑数据展示
     handleEdit (type, index, row) {
+      console.log(row,"编辑")
       this.editRoleForm = row
       this.dialogFormVisible1 = true
 

src/views/system/index/page.vue

@@ -62,7 +62,7 @@
               :header-cell-style="{ background: '#E9F4F3', color: '#445D5A' }"
               style="width: 100%">
               <el-table-column
-                prop="alarmTypeName"
+                prop="alarmRemark"
                 align="center"
                 label="报警类型"
                 >

src/views/system/visualized/index last copy.vue

@@ -17,12 +17,13 @@
                       v-model="form.cfValue"
                       placeholder="请选择"
                       size="mini"
+                      @change="cfChange"
                     >
                       <el-option
-                        v-for="item in cfLists"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value"
+                        v-for="item in deviceLists"
+                        :key="item.labelCode"
+                        :label="item.labelName"
+                        :value="item.labelCode"
                       >
                       </el-option>
                     </el-select>
@@ -50,9 +51,7 @@
                       normalTemp1: wetTempStatus == 0,
                     }"
                   >
-                    <div class="temp-title">
-                      {{ parseInt($scrollIndex) + 1 }}号点位温湿度
-                    </div>
+                    <div class="temp-title">{{parseInt(scrollIndex)+1}}号点位温湿度</div>
                     <div class="temp-list">
                       <div class="list-left" v-if="wetTempStatus == 1">
                         <div class="hxBig">
@@ -276,6 +275,9 @@
   </div>
 </template>
 <script>
+//扇形图片路径
+import greenImg from "../../../assets/images/bigScreen/shanxing.png"
+import redImg from"../../../assets/images/bigScreen/fault.png"
 import api from "@/api";
 import vueSeamlessScroll from "vue-seamless-scroll";
 import * as echarts from "echarts";
@@ -295,6 +297,18 @@ export default {
   },
   data() {
     return {
+      //温度数字颜色判断条件
+      tempNumStyle: null,
+
+      //湿度数字颜色判断条件
+      wetNumStyle: null,
+      //初始化列表的长度
+
+      tableDataLength: null,
+      //下拉选选中的code
+      cfCode: "",
+      //仓房列表
+      deviceLists: [],
       //设备在线
       devOnlineSum: null,
       //设备在线率
@@ -325,11 +339,11 @@ export default {
         },
       ],
       //右侧露点温度
-      rightDewValue: 0,
+      rightDewValue: null,
       //右侧仓内温度
-      rightTempValue: 0,
+      rightTempValue: null,
       //右侧仓内湿度
-      rightWetValue: 0,
+      rightWetValue: null,
       //温度最大最小值
       tempParams: {},
       //湿度最大最小值
@@ -394,6 +408,13 @@ export default {
     },
   },
   methods: {
+    //仓房下拉选改变时
+
+    cfChange(val) {
+      console.log(val, "val..");
+      this.cfCode = val;
+      this.getPointList();
+    },
     connect() {
       let options = {
         username: "admin",
@@ -409,8 +430,9 @@ export default {
         //订阅三个名叫'top/#', 'three/#'和'#'的主题
         this.client.subscribe(
           [
-            "/PUSH/c89512024085/DPUT/upload",
-            "/PUSH/X1XXXQ2206090069/DPUT/upload",
+            // "/PUSH/c89512024085/DPUT/upload",
+            // "/PUSH/X1XXXQ2206090069/DPUT/upload",
+            "/PUSH/8951DQ2207200018/DPUT/upload",
           ],
           { qos: 1 },
           (err) => {
@@ -447,16 +469,23 @@ export default {
     getMessage() {
       this.client.on("message", (topic, message) => {
         if (message) {
-          let str = "X1XXXQ2206090069";
+          let str = "8951DQ2207200018";
           if (topic.indexOf(str) != -1) {
             console.log("收到来着", topic, "的信息", message.toString());
             var res = JSON.parse(message.toString());
             console.log(res, "resssssss......");
-            res.data.forEach((ele) => {
-              ele.time = res.time;
-              this.tableData[index].unshift(ele);
-              this.tableData[index].pop();
-            });
+            if (res.data.length == this.tableDataLength) {
+              res.data.forEach((ele, index) => {
+                ele.time = res.time;
+                this.tableData[index].unshift(ele);
+                this.tableData[index].pop();
+              });
+            } else {
+              this.$message({
+                message: "设备配置信息与实际点位不符",
+                type: "warning",
+              });
+            }
           }
 
           this.wetTempPublic(this.tableData);
@@ -854,7 +883,7 @@ export default {
     //点位列表
     getPointList() {
       let params = {
-        labelCode: "307038864601222",
+        labelCode: this.cfCode,
         orgCode: localStorage.getItem("orgCode"),
         pageSize: 5,
       };
@@ -862,23 +891,31 @@ export default {
         console.log(res, "点位列表");
 
         this.tableData = Object.values(res.data);
+        this.tableDataLength = this.tableData.length;
+        console.log(this.tableData, "初始化");
         //如果温湿度大于或小于正常值则添加字段status,0位不正常，1为正常
-        this.wetTempPublic(this.tableData);
+        this.getWsdAlarmParams();
         this.calcAve(this.tableData);
       });
     },
     // 温湿度最高最低参数
     getWsdAlarmParams() {
       let params = {
-        labelCode: "307038864601222",
+        labelCode: this.cfCode,
         orgCode: localStorage.getItem("orgCode"),
       };
       api.wsdAlarmParams(params).then((res) => {
         console.log(res, "参数。。");
         //温度参数
-        this.tempParams = res.data[110001][0];
-        this.wetParams = res.data[110002][0];
+        if (res.data[110001]) {
+          this.tempParams = res.data[110001][0];
+        }
+        if (res.data[110002]) {
+          this.wetParams = res.data[110002][0];
+        }
+
         console.log(this.tempParams, "tempParams");
+        console.log(this.wetParams, "wetParams");
         if (this.tableData) {
           this.wetTempPublic(this.tableData);
         }
@@ -905,9 +942,9 @@ export default {
 
     //公共方法(判断温湿度参数是否正常并添加属性)
     wetTempPublic(arr) {
-      if (this.tempParams && this.wetParams) {
-        arr.forEach((ele) => {
-          ele.forEach((item) => {
+      arr.forEach((ele) => {
+        ele.forEach((item) => {
+          if (this.tempParams) {
             if (
               item.tempValue < this.tempParams.alarmValueMin ||
               item.tempValue > this.tempParams.alarmValueMax
@@ -920,6 +957,9 @@ export default {
               item.status = 1;
               this.wetTempStatus = 1;
             }
+          }
+
+          if (this.wetParams) {
             if (
               item.wetValue < this.wetParams.alarmValueMin ||
               item.wetValue > this.wetParams.alarmValueMax
@@ -932,13 +972,13 @@ export default {
               item.status = 1;
               this.wetTempStatus = 1;
             }
-          });
+          }
         });
+      });
 
-        // //取整
-        // this.rightDewValue=parseInt(this.rightDewValue/arr.length)
-        // console.log(this.rightDewValue,"//////")
-      }
+      // //取整
+      // this.rightDewValue=parseInt(this.rightDewValue/arr.length)
+      console.log(this.tableData, "添加状态");
     },
 
     //公共方法计算平均值
@@ -946,20 +986,32 @@ export default {
       //计算平均值
 
       let avgNum = 0;
+      this.rightDewValue = 0;
+      this.rightTempValue = 0;
+      this.rightWetValue = 0;
       arr.forEach((ele) => {
         ele.forEach((item) => {
           avgNum++;
-          console.log(item, "wwwwww");
+
+          item.dewValue = Number(item.dewValue);
+          item.tempValue = Number(item.tempValue);
+          item.wetValue = Number(item.wetValue);
+          console.log(item.dewValue, item.tempValue, item.wetValue, "item");
           //露点均温
-          this.rightDewValue += parseInt(item.dewValue);
+          this.rightDewValue += item.dewValue;
           //温度均温
-          this.rightTempValue += parseInt(item.tempValue);
+          this.rightTempValue += item.tempValue;
           //湿度均温
-          this.rightWetValue += parseInt(item.wetValue);
+          this.rightWetValue += item.wetValue;
+          console.log(
+            this.rightDewValue,
+            this.rightTempValue,
+            this.rightWetValue
+          );
         });
       });
       //取整
-
+      console.log(this.rightDewValue, avgNum, "wwwwww");
       this.rightDewValue = parseInt(this.rightDewValue / avgNum);
       this.rightTempValue = parseInt(this.rightTempValue / avgNum);
       this.rightWetValue = parseInt(this.rightWetValue / avgNum);
@@ -979,15 +1031,15 @@ export default {
         var url = ele.url === undefined ? "-1" : ele.url;
         var path = ele.path === undefined ? "-1" : ele.path;
         var params = ele.params === undefined ? "-1" : ele.params;
-        var kqcfName = ele.kqcfName;
+
         var areaIndex = ele.index;
 
-        htmlStr += `<div w=${w} h=${h} x=${x}  y=${y} url=${url} path=${path}  params=${params} kqcfName=${kqcfName} areaIndex=${areaIndex} class="area" style=left:${
+        htmlStr += `<div w=${w} h=${h} x=${x}  y=${y} url=${url} path=${path}  params=${params}  areaIndex=${areaIndex} class="area" style=left:${
           x - w / 2
         }px;top:${y - h / 2}px;width:${ele.w}px;height:${ele.h}px></div>
          `;
       }
-      htmlStr += ` <div class="cfBig" id="pDiv"></div>`;
+      htmlStr += `<div id="pDiv"></div>`;
 
       $("#map").append(htmlStr);
 
@@ -997,17 +1049,75 @@ export default {
         var url = e.target.getAttribute("url");
         var path = e.target.getAttribute("path");
         var params = e.target.getAttribute("params");
+
+        console.log(url, path);
+        if (url !== "-1") {
+          console.log(",,,,");
+          this.type = 1;
+          // this.iframSrc = url
+          window.location.href = url;
+          // window.open(url);
+        }
+
+        if (path !== "-1") {
+          // this.type = 3;
+          console.log(params, "params....");
+          this.$router.push({
+            path: path,
+            query: {
+              houseId: routerCfbh,
+            },
+          });
+        }
       });
 
       //鼠标移上去的样式
+      //鼠标移上去的样式
       $(".area").mouseover((e) => {
         console.log(e, "e....");
-        this.isHover = true;
-        console.log("鼠标yishangqule.....s");
+        //背景框的样式
+        var bigKuang = this.wetTempStatus == 1 ? "normalTemp" : "normalTemp1";
+        //列表前小圆点的样式
+        var listStyle = this.wetTempStatus == 1 ? "listSucess" : "listError";
+        //温度数字样式
+        var tempNum = this.tempNumStyle == 1 ? "tempNumSucess" : "tempNumError";
+             //湿度数字样式
+        var wetNum = this.wetNumStyle == 1 ? "wetNumSucess" : "wetNumError";
+        // var isHuanxing=this.wetTempStatus == 1 ? "hxBig" : "";
+        // var isSx=this.wetTempStatus == 1 ? "sxxz" : "";
+
+        // var imgUrl=this.wetTempStatus == 1 ? "greenImg" : "redImg";
         this.scrollIndex = $(e.target).attr("areaIndex");
         console.log(this.scrollIndex, "  this.scrollIndex");
+         //判断是否是绿色环状还是红色环状
+         let huan=''
+        //  this.wetTempStatus = 1
+         if(this.wetTempStatus == 1){
+          huan=`<div class="list-left">
+                        <div class="hxBig">
+                          <img
+                            class="sxxz"
+                            src=${greenImg}
+                            alt=""
+                          />
+                        </div>
+                      </div>`
+         }else{
+          huan=`<div class="list-left">
+                        <img
+                          src=${redImg}
+                          alt=""
+                          style="width: 100%; height: 100%"
+                        />
+                      </div>`
+         }
         let listShow = "";
+        console.log(this.tableData[this.scrollIndex],"this.tableData[this.scrollIndex]")
+
+       
         this.tableData[this.scrollIndex].forEach((ele) => {
+          this.tempNumStyle = ele.tempStatus;
+          this.wetNumStyle = ele.wetStatus;
           listShow += `
         <ul
                             class="DataList_top inUl"
@@ -1016,23 +1126,15 @@ export default {
                           <li class="DataList_left">
                               <span
                               
-                                style="
-                                  width: 5px;
-                                  height: 5px;
-                                  border-radius: 50%;
-                                  background: rgb(38, 222, 197);
-                                  display: inline-block;
-
-                                  margin-right: 5px;
-                                "
+                               class=${listStyle}
                               ></span>
                              
                               
-                              <span> ${ele.tempValue}</span>
+                              <span class=${tempNum}> ${ele.tempValue}</span>
                             </li>
                             <li class="DataList_left">
                              
-                              <span> ${ele.wetValue}% </span>
+                              <span class=${wetNum}> ${ele.wetValue}% </span>
                             </li>
                             <li class="DataList_left">
                               ${ele.time}
@@ -1046,21 +1148,13 @@ export default {
         $("#pDiv").html(`
 
                   <div
-                    class="normalTemp"
+                    class=${bigKuang}
                   >
                     <div class="temp-title">
                       ${parseInt(this.scrollIndex) + 1}号点位温湿度
                     </div>
                     <div class="temp-list">
-                      <div class="list-left">
-                        <div class="hxBig">
-                          <img
-                            class="sxxz"
-                            src="../../../assets/images/bigScreen/shanxing.png"
-                            alt=""
-                          />
-                        </div>
-                      </div>
+                     ${huan}
                     
                       <div class="list-right">
                         <ul class="outUl">
@@ -1079,40 +1173,7 @@ export default {
 
 
         `);
-        // const kqcfName = $(e.target).attr("kqcfName");
-        // console.log(kqcfName, "kqcfName");
-        // var kqcfObj = this.kqData.find((item) => {
-        //   return item.orgName === kqcfName;
-        //   // return item.orgName.indexOf(kqcfName);
-        // });
-        // console.log(kqcfObj, "kqcfObj");
-
-        //  var isNormal = true;
-        //  var className = isNormal?"normal":"error";
-
-        // if (!kqcfObj) {
-        //   $("#pDiv").html(` <div class=${className}>暂无数据</div>`);
-        // } else {
-        //   $("#pDiv").html(`
-        //  <div>
-        //      <span>仓房名称:</span>
-        //      <span>${kqcfObj.orgName}</span>
-        //  </div>
-        //   <div>
-        //      <span>粮食品种:</span>
-        //      <span>${kqcfObj.pzName}</span>
-        //   </div>
-        //   <div>
-        //       <span>粮食数量:</span>
-        //       <span>${kqcfObj.lsNumber}吨</span>
-        //    </div>
-        //    <div>
-        //        <span>设备状态:</span>
-        //         <span>在线</span>
-
-        //   </div>
-        // `);
-        //}
+
         const offset = 30;
         const top = $(e.target).position().top + offset;
         const left = $(e.target).position().left + offset;
@@ -1186,6 +1247,17 @@ export default {
     //   //用setInterval做动画感觉有问题
     //   this.drawSdtj();
     // }, 6000);
+    api
+      .equipmentTagList({ curPage: 1, pageSize: 99999 })
+      .then((res) => {
+        if (res.code == 200) {
+          console.log(res.data, "设备列表");
+          this.deviceLists = res.data.records;
+        }
+      })
+      .catch((err) => {
+        console.log(err);
+      });
   },
   destroyed() {
     this.unconnect();
@@ -1193,7 +1265,7 @@ export default {
   mounted() {
     //点位列表初始化
     this.getPointList();
-    this.getWsdAlarmParams();
+    // this.getWsdAlarmParams();
     this.getTempWetStatus();
     this.addArea();
     this.scale();
@@ -1479,7 +1551,6 @@ export default {
   font-size: 14px;
   padding: 8px;
   display: none;
-;
 }
 .normalTemp,
 .normalTemp1 {
@@ -1511,48 +1582,41 @@ export default {
   padding: 10px;
 }
 .outUl {
-    display: flex;
-
-    justify-content: space-around;
-   
-    color: #ccc;
-    font-weight: bolder;
+  display: flex;
 
-    
-  
-   
-  }
-  .outUl li {
-      display: flex;
+  justify-content: space-around;
 
-      justify-content: space-around;
-      text-align: center;
-      width: 27%;
-      font-size: 14px;
-    }
-    .outUl li:nth-child(3) {
-      width: 46%;
-    }
+  color: #ccc;
+  font-weight: bolder;
+}
+.outUl li {
+  display: flex;
 
-  .inUl {
-    display: flex;
+  justify-content: space-around;
+  text-align: center;
+  width: 27%;
+  font-size: 14px;
+}
+.outUl li:nth-child(3) {
+  width: 46%;
+}
 
-    justify-content: space-around;
+.inUl {
+  display: flex;
 
-   
-  }
-  .inUl li{
-      line-height: 29px;
-      text-align: center;
-      width: 27%;
-      font-size: 12px;
-      color: rgb(204, 236, 232);
-  
-    }
+  justify-content: space-around;
+}
+.inUl li {
+  line-height: 29px;
+  text-align: center;
+  width: 27%;
+  font-size: 12px;
+  color: rgb(204, 236, 232);
+}
 
-    .inUl li:nth-child(3) {
-      width: 46%;
-    }
+.inUl li:nth-child(3) {
+  width: 46%;
+}
 .list-left {
   width: 100px;
   height: 100px;
@@ -1567,12 +1631,14 @@ export default {
   background: url("../../../assets/images/bigScreen/huanxing.png") no-repeat;
   background-size: 100% 100%;
 
-  @keyframes fadeenum {
+  
+  
+}
+@keyframes fadeenum {
     100% {
       transform: rotate(360deg);
     }
   }
-}
 .sxxz {
   position: absolute;
   scale: 0.8;
@@ -1583,7 +1649,30 @@ export default {
   animation-timing-function: linear;
 }
 
-/* #pDiv div {
-  line-height: 20px;
-} */
+.listSucess {
+  width: 5px;
+  height: 5px;
+  border-radius: 50%;
+  background: rgb(38, 222, 197);
+  display: inline-block;
+
+  margin-right: 5px;
+}
+.listError {
+  width: 5px;
+  height: 5px;
+  border-radius: 50%;
+  background: red;
+  display: inline-block;
+
+  margin-right: 5px;
+}
+.tempNumSucess,
+.wetNumSucess {
+  color: rgb(38, 222, 197);
+}
+.tempNumError,
+.wetNumError {
+  color: red;
+}
 </style>

src/views/system/visualized/index.vue

@@ -33,25 +33,34 @@
             </div>
 
             <div class="bottom">
-              <div id="map">
-                <img
-                  src="../../../assets/images/bigScreen/cangfang.png"
-                  border="0"
-                  usemap="#planetmap"
-                  alt="Planets"
-                  class="imgStyle"
-                  style="width: 100%; height: 100%"
-                />
-              </div>
-              <!-- <div class="cfBig" v-if="isHover == true">
-                <div class="bot-top">
+            
+              <div class="cfBig">
+                <vue-seamless-scroll
+        :data="tableData"
+        :class-option="seamlessScrollOption"
+        style="
+         
+          height: 460px;
+          overflow: hidden;
+          width: 100%;
+
+  
+    
+        "
+      >
+                <div class="cf-left">
+                            
                   <div
+                  v-for="(e, index) in tableData"
+                            :key="index"
                     :class="{
                       normalTemp: wetTempStatus == 1,
                       normalTemp1: wetTempStatus == 0,
                     }"
                   >
-                    <div class="temp-title">{{parseInt(scrollIndex)+1}}号点位温湿度</div>
+                    <div class="temp-title">
+                      {{ index + 1 }}号点位温湿度
+                    </div>
                     <div class="temp-list">
                       <div class="list-left" v-if="wetTempStatus == 1">
                         <div class="hxBig">
@@ -76,14 +85,15 @@
                           <li>监测时间</li>
                         </ul>
                         <vue-seamless-scroll
-                          :data="tableData[scrollIndex]"
+                          :data="e"
                           :class-option="classOption"
                           class="scroll"
                         >
                           <ul
                             class="DataList_top inUl"
-                            v-for="(item, index) in tableData[scrollIndex]"
+                            v-for="(item, index) in e"
                             :key="index"
+                            
                           >
                             <li class="DataList_left">
                               <span
@@ -135,8 +145,11 @@
                       </div>
                     </div>
                   </div>
+                 
                 </div>
-              </div> -->
+              </vue-seamless-scroll>
+            
+              </div>
             </div>
           </div>
           <div class="screen-right">
@@ -248,14 +261,24 @@
                     <div style="flex: 1; text-align: center">正常</div>
                     <div class="top-right">
                       <div class="normal">{{ devOnlineSum }}</div>
-                      <div class="numberStyle">{{ devOnlineRate }}%</div>
+                      <div
+                        class="numberStyle"
+                        style="width: 50px; text-align: center"
+                      >
+                        {{ devOnlineRate }}%
+                      </div>
                     </div>
                   </div>
                   <div class="bottom">
                     <div style="flex: 1; text-align: center">故障</div>
                     <div class="bot-right">
                       <div class="hitch">{{ devOfflineSum }}</div>
-                      <div class="numberStyle">{{ devOfflineRate }}%</div>
+                      <div
+                        class="numberStyle"
+                        style="width: 50px; text-align: center"
+                      >
+                        {{ devOfflineRate }}%
+                      </div>
                     </div>
                   </div>
                 </div>
@@ -294,11 +317,8 @@ export default {
   },
   data() {
     return {
-      //温度数字颜色判断条件
-      tempNumStyle: null,
-
-      //湿度数字颜色判断条件
-      wetNumStyle: null,
+      top: 32,
+      left: 25,
       //初始化列表的长度
 
       tableDataLength: null,
@@ -317,30 +337,17 @@ export default {
       //滚动列表Index
       scrollIndex: 0,
       //鼠标是否移上去
-      isHover: false,
+      // isHover: false,
       form: {
         cfValue: "",
       },
-      cfLists: [
-        {
-          value: "选项1",
-          label: "黄金糕",
-        },
-        {
-          value: "选项2",
-          label: "双皮奶",
-        },
-        {
-          value: "选项3",
-          label: "蚵仔煎",
-        },
-      ],
+
       //右侧露点温度
-      rightDewValue: null,
+      rightDewValue: 0,
       //右侧仓内温度
-      rightTempValue: null,
+      rightTempValue: 0,
       //右侧仓内湿度
-      rightWetValue: null,
+      rightWetValue: 0,
       //温度最大最小值
       tempParams: {},
       //湿度最大最小值
@@ -403,6 +410,18 @@ export default {
         waitTime: 0, // 单步运动停止的时间(默认值1000ms)
       };
     },
+    seamlessScrollOption(){
+      return {
+        step: 0.8, // 数值越大速度滚动越快
+        limitMoveNum:6, // 开始无缝滚动的数据量 this.dataList.length
+        hoverStop: true, // 是否开启鼠标悬停stop
+        direction: 1, // 0向下 1向上 2向左 3向右
+        openWatch: true, // 开启数据实时监控刷新dom
+        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
+        waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
+      };
+    }
   },
   methods: {
     //仓房下拉选改变时
@@ -414,14 +433,26 @@ export default {
     },
     connect() {
       let options = {
+        //本地
         username: "admin",
         password: "public",
+        //测试
+        // username: "admin",
+        // password: "admin@123",
+        //生产
+        // username: "admin",
+        // password: "admin@2Ld&DDrsk",
         cleanSession: true,
         keepAlive: 60,
         clientId: "mqttjs_" + Math.random().toString(16).substr(2, 8),
         connectTimeout: 4000,
       };
+      //本地开发环境
       this.client = mqtt.connect("ws://192.168.50.169:8083/mqtt", options);
+      //测试环境
+      // this.client = mqtt.connect('ws://172.16.0.5:8083/mqtt',options);
+      //正式环境
+      // this.client = mqtt.connect('ws://10.105.101.61:8083/mqtt',options);
       this.client.on("connect", (e) => {
         console.log("成功连接服务器2222222:", e);
         //订阅三个名叫'top/#', 'three/#'和'#'的主题
@@ -430,6 +461,7 @@ export default {
             // "/PUSH/c89512024085/DPUT/upload",
             // "/PUSH/X1XXXQ2206090069/DPUT/upload",
             "/PUSH/8951DQ2207200018/DPUT/upload",
+            "/PUSH/8951DQ2207200019/DPUT/upload",
           ],
           { qos: 1 },
           (err) => {
@@ -466,7 +498,7 @@ export default {
     getMessage() {
       this.client.on("message", (topic, message) => {
         if (message) {
-          let str = "8951DQ2207200018";
+          let str = "8951DQ2207200019";
           if (topic.indexOf(str) != -1) {
             console.log("收到来着", topic, "的信息", message.toString());
             var res = JSON.parse(message.toString());
@@ -477,6 +509,20 @@ export default {
                 this.tableData[index].unshift(ele);
                 this.tableData[index].pop();
               });
+
+              this.wetTempPublic(this.tableData);
+         
+              this.calcAve(this.tableData);
+            } else if (this.tableDataLength < 1) {
+              this.tableData=[]
+              res.data.forEach((ele, index) => {
+                ele.time = res.time;
+                this.tableData.push([ele]);
+              });
+              console.log(this.tableData, "mqtt ---表格");
+
+              this.wetTempPublic(this.tableData);
+              this.calcAve(this.tableData);
             } else {
               this.$message({
                 message: "设备配置信息与实际点位不符",
@@ -485,9 +531,6 @@ export default {
             }
           }
 
-          this.wetTempPublic(this.tableData);
-          this.calcAve(this.tableData);
-
           // 露点
 
           // 温度
@@ -888,11 +931,18 @@ export default {
         console.log(res, "点位列表");
 
         this.tableData = Object.values(res.data);
+
         this.tableDataLength = this.tableData.length;
         console.log(this.tableData, "初始化");
+        if (this.tableDataLength < 1) {
+          this.rightDewValue = 0;
+          this.rightTempValue = 0;
+          this.rightWetValue = 0;
+        }
+          this.getWsdAlarmParams();
+          this.calcAve(this.tableData);
+      
         //如果温湿度大于或小于正常值则添加字段status,0位不正常，1为正常
-        this.getWsdAlarmParams();
-        this.calcAve(this.tableData);
       });
     },
     // 温湿度最高最低参数
@@ -989,11 +1039,10 @@ export default {
       arr.forEach((ele) => {
         ele.forEach((item) => {
           avgNum++;
-
-          item.dewValue = Number(item.dewValue);
-          item.tempValue = Number(item.tempValue);
-          item.wetValue = Number(item.wetValue);
-          console.log(item.dewValue, item.tempValue, item.wetValue, "item");
+          console.log(item, "item");
+          item.dewValue = parseInt(item.dewValue);
+          item.tempValue = parseInt(item.tempValue);
+          item.wetValue = parseInt(item.wetValue);
           //露点均温
           this.rightDewValue += item.dewValue;
           //温度均温
@@ -1028,15 +1077,15 @@ export default {
         var url = ele.url === undefined ? "-1" : ele.url;
         var path = ele.path === undefined ? "-1" : ele.path;
         var params = ele.params === undefined ? "-1" : ele.params;
-
+        var kqcfName = ele.kqcfName;
         var areaIndex = ele.index;
 
-        htmlStr += `<div w=${w} h=${h} x=${x}  y=${y} url=${url} path=${path}  params=${params}  areaIndex=${areaIndex} class="area" style=left:${
+        htmlStr += `<div w=${w} h=${h} x=${x}  y=${y} url=${url} path=${path}  params=${params} kqcfName=${kqcfName} areaIndex=${areaIndex} class="area" style=left:${
           x - w / 2
         }px;top:${y - h / 2}px;width:${ele.w}px;height:${ele.h}px></div>
          `;
       }
-      htmlStr += `<div id="pDiv"></div>`;
+      // htmlStr += `<div id="pDiv"></div>`;
 
       $("#map").append(htmlStr);
 
@@ -1069,97 +1118,32 @@ export default {
       });
 
       //鼠标移上去的样式
-      //鼠标移上去的样式
       $(".area").mouseover((e) => {
+        this.isHover = true;
+        const top = $(e.target).position().top + 180;
+        const left = $(e.target).position().left + 100;
+        $("#imgPoint").css({
+          top: top,
+          left: left,
+        });
         console.log(e, "e....");
-        //背景框的样式
-        var bigKuang = this.wetTempStatus == 1 ? "normalTemp" : "normalTemp1";
-        //列表前小圆点的样式
-        var listStyle = this.wetTempStatus == 1 ? "listSucess" : "listError";
-        //温度数字样式
-        var tempNum = this.tempNumStyle == 1 ? "tempNumSucess" : "tempNumError";
-        var wetNum = this.wetNumStyle == 1 ? "wetNumSucess" : "wetNumError";
+
+        console.log("鼠标yishangqule.....s");
         this.scrollIndex = $(e.target).attr("areaIndex");
         console.log(this.scrollIndex, "  this.scrollIndex");
-        let listShow = "";
-        this.tableData[this.scrollIndex].forEach((ele) => {
-          this.tempNumStyle = ele.tempStatus;
-          this.wetNumStyle = ele.wetStatus;
-          listShow += `
-        <ul
-                            class="DataList_top inUl"
-                          
-                          >
-                          <li class="DataList_left">
-                              <span
-                              
-                               class=${listStyle}
-                              ></span>
-                             
-                              
-                              <span class=${tempNum}> ${ele.tempValue}</span>
-                            </li>
-                            <li class="DataList_left">
-                             
-                              <span class=${wetNum}> ${ele.wetValue}% </span>
-                            </li>
-                            <li class="DataList_left">
-                              ${ele.time}
-                            </li>
-                          </ul>
-       
-        
-        `;
-        });
 
-        $("#pDiv").html(`
+   
 
-                  <div
-                    class=${bigKuang}
-                  >
-                    <div class="temp-title">
-                      ${parseInt(this.scrollIndex) + 1}号点位温湿度
-                    </div>
-                    <div class="temp-list">
-                      <div class="list-left">
-                        <div class="hxBig">
-                          <img
-                            class="sxxz"
-                            src="../../../assets/images/bigScreen/shanxing.png"
-                            alt=""
-                          />
-                        </div>
-                      </div>
-                    
-                      <div class="list-right">
-                        <ul class="outUl">
-                          <li>温度</li>
-                          <li>湿度</li>
-                          <li>监测时间</li>
-                        </ul>
-  
-                        ${listShow}
-                         
-                      
-                      </div>
-                    </div>
-                  </div>
-        
-
-
-        `);
-
-        const offset = 30;
-        const top = $(e.target).position().top + offset;
-        const left = $(e.target).position().left + offset;
-        $("#pDiv").show();
-        $("#pDiv").css({
-          top: top,
-          left: left,
-        });
+     
+       
       });
       $(".area").mouseleave((e) => {
-        $("#pDiv").hide();
+        this.isHover = false;
+        // $("#imgPoint").css({
+        //   top: top,
+        //   left: left,
+        // })
+        // $("#scrollDiv").hide();
       });
     },
     scale() {
@@ -1215,6 +1199,10 @@ export default {
         //$(".a").css({position: "absolute",'top': ,'left':offsetleft+50});
       });
     },
+    //点击每组点位
+    // point(num) {
+    //   this.scrollIndex = num;
+    // },
   },
   created() {
     this.connect();
@@ -1226,8 +1214,11 @@ export default {
       .equipmentTagList({ curPage: 1, pageSize: 99999 })
       .then((res) => {
         if (res.code == 200) {
-          console.log(res.data, "设备列表");
-          this.deviceLists = res.data.records;
+          console.log(res.data, "仓房列表");
+          if (res.data.records.length > 1) {
+            this.deviceLists = res.data.records;
+            this.form.cfValue = res.data.records[0].labelCode;
+          }
         }
       })
       .catch((err) => {
@@ -1303,6 +1294,88 @@ export default {
           padding: 20px 40px;
           height: calc(100% - 130px);
           box-sizing: border-box;
+
+          .cfBig {
+            // flex-direction: column;
+            // /* width: 100%; */
+    
+            height: 100%;
+            // background: url("../../../assets/images/bigScreen/cangfang.png")
+            //   no-repeat;
+            // background-size: contain;
+            // background-position-x: center;
+            .cf-left
+             {
+              width: 100%;
+          
+             
+             
+              .normalTemp,
+              .normalTemp1 {
+                display: inline-block;
+           
+                width: 31%;
+                height: 200px;
+                margin:20px 12px;
+           
+               
+                background: url("../../../assets/images/bigScreen/normal-temp.png")
+                  no-repeat;
+                background-size: 100% 100%;
+                .temp-title {
+                  margin-left: 24px;
+                  margin-top: 6px;
+                  color: rgb(38, 222, 197);
+                  font-weight: bolder;
+                }
+                .temp-list {
+                  flex: 1;
+                  display: flex;
+                  justify-content: space-between;
+                  align-items: center;
+                  padding: 10px;
+                  .list-left {
+                    width: 100px;
+                    height: 100px;
+                    .hxBig {
+                      width: 102px;
+                      height: 102px;
+                      position: relative;
+                      background: url("../../../assets/images/bigScreen/huanxing.png")
+                        no-repeat;
+                      background-size: 100% 100%;
+                      .sxxz {
+                        position: absolute;
+                        scale: 0.8;
+                        top: 46px;
+                        left: 19px;
+                        animation: fadeenum 5s infinite;
+                        transform-origin: 69% 8%;
+                        animation-timing-function: linear;
+                      }
+                      @keyframes fadeenum {
+                        100% {
+                          transform: rotate(360deg);
+                        }
+                      }
+                    }
+                  }
+                  .list-right {
+                    width: calc(100% - 100px);
+                  }
+                }
+              }
+              .normalTemp1 {
+                background: url("../../../assets/images/bigScreen/noNormal.png")
+                  no-repeat;
+                background-size: 100% 100%;
+              }
+            }
+
+           
+          }
+          
+        
         }
       }
       .screen-right {
@@ -1390,7 +1463,7 @@ export default {
               }
               .top .top-right {
                 flex-direction: row;
-                flex: 1;
+                flex: 3;
                 .normal {
                   font-size: 12px;
                   margin-right: 5px;
@@ -1403,7 +1476,7 @@ export default {
                 }
               }
               .bottom .bot-right {
-                flex: 1;
+                flex: 3;
                 display: flex;
                 flex-direction: row;
                 justify-content: center;
@@ -1464,11 +1537,11 @@ export default {
 
       justify-content: space-around;
       text-align: center;
-      width: 27%;
+      width: 22%;
       font-size: 14px;
     }
     li:nth-child(3) {
-      width: 46%;
+      width: 56%;
     }
     //   // li:nth-child(1) {
     //   //   width: 24%;
@@ -1482,14 +1555,14 @@ export default {
     li {
       line-height: 29px;
       text-align: center;
-      width: 27%;
+      width: 22%;
       font-size: 12px;
       color: rgb(204, 236, 232);
       // color:rgb(29, 221, 196);
     }
 
     li:nth-child(3) {
-      width: 46%;
+      width: 56%;
     }
   }
   .numberStyle {
@@ -1506,7 +1579,7 @@ export default {
 .area {
   position: absolute;
 
-  background: rgba(222, 222, 58, 0.514);
+  /* background: rgba(222, 222, 58, 0.514); */
 
   border-radius: 60%;
   cursor: pointer;
@@ -1517,134 +1590,4 @@ export default {
   position: relative;
   /* soverflow: hidden; */
 }
-
-#pDiv {
-  position: absolute;
-  top: 10%;
-  left: 50%;
-  z-index: 99;
-  font-size: 14px;
-  padding: 8px;
-  display: none;
-}
-.normalTemp,
-.normalTemp1 {
-  /* position: absolute;
-  top: 32%;
-  left: 25%; */
-  width: 400px;
-  height: 200px;
-  display: flex;
-  flex-direction: column;
-  background: url("../../../assets/images/bigScreen/normal-temp.png") no-repeat;
-  background-size: 100% 100%;
-}
-.normalTemp1 {
-  background: url("../../../assets/images/bigScreen/noNormal.png") no-repeat;
-  background-size: 100% 100%;
-}
-.temp-title {
-  margin-left: 24px;
-  margin-top: 8px;
-  color: rgb(38, 222, 197);
-  font-weight: bolder;
-}
-.temp-list {
-  flex: 1;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 10px;
-}
-.outUl {
-  display: flex;
-
-  justify-content: space-around;
-
-  color: #ccc;
-  font-weight: bolder;
-}
-.outUl li {
-  display: flex;
-
-  justify-content: space-around;
-  text-align: center;
-  width: 27%;
-  font-size: 14px;
-}
-.outUl li:nth-child(3) {
-  width: 46%;
-}
-
-.inUl {
-  display: flex;
-
-  justify-content: space-around;
-}
-.inUl li {
-  line-height: 29px;
-  text-align: center;
-  width: 27%;
-  font-size: 12px;
-  color: rgb(204, 236, 232);
-}
-
-.inUl li:nth-child(3) {
-  width: 46%;
-}
-.list-left {
-  width: 100px;
-  height: 100px;
-}
-.list-right {
-  width: calc(100% - 100px);
-}
-.hxBig {
-  width: 102px;
-  height: 102px;
-  position: relative;
-  background: url("../../../assets/images/bigScreen/huanxing.png") no-repeat;
-  background-size: 100% 100%;
-
-  @keyframes fadeenum {
-    100% {
-      transform: rotate(360deg);
-    }
-  }
-}
-.sxxz {
-  position: absolute;
-  scale: 0.8;
-  top: 46px;
-  left: 19px;
-  animation: fadeenum 5s infinite;
-  transform-origin: 69% 8%;
-  animation-timing-function: linear;
-}
-.listSucess {
-  width: 5px;
-  height: 5px;
-  border-radius: 50%;
-  background: rgb(38, 222, 197);
-  display: inline-block;
-
-  margin-right: 5px;
-}
-.listError {
-  width: 5px;
-  height: 5px;
-  border-radius: 50%;
-  background: red;
-  display: inline-block;
-
-  margin-right: 5px;
-}
-.tempNumSucess,
-.wetNumSucess {
-  color: rgb(38, 222, 197);
-}
-.tempNumError,
-.wetNumError {
-  color: red;
-}
 </style>