yf_zd 4 年之前
父節點
當前提交
fa644d4774
共有 33 個文件被更改,包括 5595 次插入149 次删除
  1. 21 3
      package-lock.json
  2. 1 0
      package.json
  3. 26 1
      src/assets/css/global.css
  4. 4 4
      src/components/highStand/equipList.vue
  5. 163 9
      src/components/highStand/sidebar.vue
  6. 133 0
      src/components/highStand/timeSearch.vue
  7. 1 1
      src/components/index.vue
  8. 4 0
      src/main.js
  9. 55 0
      src/pages/plantGuard/animate.vue
  10. 73 0
      src/pages/plantGuard/cbdPhoto/cbdPhoto.vue
  11. 125 0
      src/pages/plantGuard/dialog.vue
  12. 126 0
      src/pages/plantGuard/dialogHollow.vue
  13. 305 0
      src/pages/plantGuard/equipCtrls/bzyctrl.vue
  14. 301 0
      src/pages/plantGuard/equipCtrls/cbdctrl.vue
  15. 162 0
      src/pages/plantGuard/equipCtrls/qxzctrl.vue
  16. 227 0
      src/pages/plantGuard/equipCtrls/scdctrl.vue
  17. 228 0
      src/pages/plantGuard/equipCtrls/simCode.vue
  18. 229 0
      src/pages/plantGuard/equipCtrls/xycbctrl.vue
  19. 538 0
      src/pages/plantGuard/equipHistoryDate.vue
  20. 307 0
      src/pages/plantGuard/equipHistoryDateQxz.vue
  21. 275 0
      src/pages/plantGuard/equipInfo.vue
  22. 152 0
      src/pages/plantGuard/equipState.vue
  23. 172 0
      src/pages/plantGuard/equipStateQxz.vue
  24. 426 0
      src/pages/plantGuard/equipState_dict.json
  25. 645 14
      src/pages/plantGuard/page1.vue
  26. 35 112
      src/pages/plantGuard/page2.vue
  27. 26 4
      src/pages/plantGuard/page3.vue
  28. 1 1
      src/pages/plantGuard/page7.vue
  29. 66 0
      src/pages/plantGuard/qxz_dict.json
  30. 93 0
      src/pages/plantGuard/twentyFourHistoryDate.vue
  31. 494 0
      src/pages/plantGuard/warn/cbdMsgWarn.vue
  32. 180 0
      src/pages/plantGuard/warn/qxzMsgWarn.vue
  33. 1 0
      项目说明.txt

+ 21 - 3
package-lock.json

@@ -8714,7 +8714,8 @@
     "picomatch": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz",
-      "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg=="
+      "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==",
+      "optional": true
     },
     "pify": {
       "version": "3.0.0",
@@ -13009,6 +13010,14 @@
       "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg=",
       "dev": true
     },
+    "uppercamelcase": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npm.taobao.org/uppercamelcase/download/uppercamelcase-1.1.0.tgz",
+      "integrity": "sha1-Mk2YprOvx+iolT4QZBUJsOTiP5c=",
+      "requires": {
+        "camelcase": "^1.2.1"
+      }
+    },
     "uri-js": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.0.tgz",
@@ -13428,6 +13437,14 @@
       "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.12.tgz",
       "integrity": "sha512-uhmLFETqPPNyuLLbsKz6ioJ4q7AZHzD8ZVFNATNyICSZouqP2Sz0rotWQC8UNBF6VGSCs5abnKJoStA6JbCbfg=="
     },
+    "vue-amap": {
+      "version": "0.5.10",
+      "resolved": "https://registry.npm.taobao.org/vue-amap/download/vue-amap-0.5.10.tgz",
+      "integrity": "sha1-RkUWIDrwwIXUBL2Kyr8kAeSjb/Y=",
+      "requires": {
+        "uppercamelcase": "^1.1.0"
+      }
+    },
     "vue-baidu-map": {
       "version": "0.21.22",
       "resolved": "https://registry.npmjs.org/vue-baidu-map/-/vue-baidu-map-0.21.22.tgz",
@@ -13516,8 +13533,7 @@
     "vue-lazyload": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/vue-lazyload/-/vue-lazyload-1.3.3.tgz",
-      "integrity": "sha512-uHnq0FTEeNmqnbBC2aRKlmtd9LofMZ6Q3mWvgfLa+i9vhxU8fDK+nGs9c1iVT85axSua/AUnMttIq3xPaU9G3A==",
-      "dev": true
+      "integrity": "sha512-uHnq0FTEeNmqnbBC2aRKlmtd9LofMZ6Q3mWvgfLa+i9vhxU8fDK+nGs9c1iVT85axSua/AUnMttIq3xPaU9G3A=="
     },
     "vue-loader": {
       "version": "13.7.3",
@@ -13715,6 +13731,7 @@
           "version": "2.0.1",
           "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
           "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "optional": true,
           "requires": {
             "is-extendable": "^0.1.0"
           }
@@ -13771,6 +13788,7 @@
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
           "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
+          "optional": true,
           "requires": {
             "kind-of": "^3.0.2"
           }

+ 1 - 0
package.json

@@ -38,6 +38,7 @@
     "vue-router": "^3.0.1"
   },
   "devDependencies": {
+    "animate.css": "^4.1.1",
     "autoprefixer": "^7.1.2",
     "babel-core": "^6.22.1",
     "babel-eslint": "^8.2.1",

+ 26 - 1
src/assets/css/global.css

@@ -154,6 +154,31 @@ p{margin:0}
     border: 1px solid #e63a3a;
     background-color: #e63a3a;
 }
+/* 红色 */
+.el-button.el-button--orangeInfo{
+    background:#ff9a02;
+    border-color: #ff9a02;
+    color: #fff;
+}
+.el-button.el-button--orangeInfo:hover,
+.el-button.el-button--orangeInfo:focus,
+.el-button.el-button--orangeInfo:active{
+    background: #e88c01;
+    color: #fff;
+    border-color: #e88c01;
+}
+.el-button.el-button--orangeInfo.is-plain{
+    border: 1px solid #ff9a02;
+    background:#fff;
+    color: #ff9a02;
+}
+.el-button.el-button--orangeInfo.is-plain:hover,
+.el-button.el-button--orangeInfo.is-plain:focus,
+.el-button.el-button--orangeInfo.is-plain:active{
+    color: #fff;
+    border: 1px solid #ff9a02;
+    background-color: #ff9a02;
+}
 /* 灰色 */
 .el-button.el-button--grayInfo{
     background:#eee;
@@ -176,6 +201,6 @@ p{margin:0}
 .el-button.el-button--grayInfo.is-plain:focus,
 .el-button.el-button--grayInfo.is-plain:active{
     color: #606266;
-    border: 1px solid #dcdfe6;
+    border: 1px solid #dcdfe6; 
     background-color: #eee;
 }

+ 4 - 4
src/components/highStand/equipList.vue

@@ -29,12 +29,12 @@ export default {
 
 .legend {
   position: absolute;
-  top: 10px;
+  top: 80px;
   bottom: 10px;
   left: 30px;
   display: flex;
   align-items: flex-start;
-  z-index: 999;
+  z-index: 151;
   .legend-menu {
     background: #242424;
     color: #fff;
@@ -46,7 +46,7 @@ export default {
     line-height: 20px;
     text-align: center;
     cursor: pointer;
-    margin-top: calc(100vh - 210px);
+    margin-top: calc(100vh - 277px);
     padding: 6px;
     i {
       transition: 0.5s;
@@ -78,7 +78,7 @@ export default {
     border-radius: 4px;
   }
   .legend-detail {
-    width: 440px;
+    width: 380px;
   }
 }
 </style>

+ 163 - 9
src/components/highStand/sidebar.vue

@@ -1,28 +1,113 @@
 <template>
-  <div :class="['legend', open ? 'open' : '']">
-    <div class="legend-menu" @click="toggleMenu">
-      {{open?"隐藏":"显示"}}
+  <div :class="['legend', sidebarState ? 'open' : '']">
+    <div class="legend-menu" @click="toggleMenu" v-show="sidebarState">
+      {{sidebarState?"隐藏":"显示"}}
     </div>
     <div class="legend-detail">
       <div class="content">
-        <slot></slot>
+        <el-tabs tab-position="left" v-model="slidactiveName" @tab-click="tabshandleClick">
+          <el-tab-pane
+            v-for="(pages, index) in menu[equipType]"
+            v-bind:key="index"
+            :label="pages.label"
+            :name="pages.name"
+          > 
+            <!-- <keep-alive> -->
+              <components :is="pages.name" :equipId="equipId" :d_id="d_id" :equipType='equipType' v-if="pages.name == nowPage" :model="model"></components>
+            <!-- </keep-alive> -->
+          </el-tab-pane>
+        </el-tabs>
       </div>
     </div>
   </div>
 </template>
 
 <script>
+import scdCtrl from '@/pages/plantGuard/equipCtrls/scdctrl' //杀虫灯控制
+import cbdCtrl from '@/pages/plantGuard/equipCtrls/cbdctrl' //测报灯控制
+import cbdMsgWarn from '@/pages/plantGuard/warn/cbdMsgWarn' //短信预警
+import xycbCtrl from '@/pages/plantGuard/equipCtrls/xycbctrl' //性诱测报控制
+import bzyCtrl from '@/pages/plantGuard/equipCtrls/bzyctrl' //孢子仪控制
+import qxzCtrl from '@/pages/plantGuard/equipCtrls/qxzctrl' //气象站控制
+import qxzMsgWarn from '@/pages/plantGuard/warn/qxzMsgWarn' //短信预警
+import simCode from '@/pages/plantGuard/equipCtrls/simCode' //SIM卡流量
 export default {
+  props: ["equipId", "equipType","d_id","model"],
+  components: {
+      scdCtrl,
+      cbdCtrl,
+      cbdMsgWarn,
+      xycbCtrl,
+      bzyCtrl,
+      qxzCtrl,
+      qxzMsgWarn,
+      simCode,
+  },
   data: function () {
     return {
-      open: false,
+      sidebarState: true,
+      // 各类型菜单
+      nowPage:"",
+      slidactiveName:"",
+      menu:{
+        "2":[{
+          name:"scdCtrl",
+          label:"设备控制",
+        },{
+          name:"simCode",
+          label:"SIM卡详情",
+        }],
+        "3":[{
+          name:"cbdCtrl",
+          label:"设备控制",
+        },
+        {
+          name:"cbdMsgWarn",
+          label:"短信预警",
+        },
+        {
+          name:"simCode",
+          label:"SIM卡详情",
+        }],
+        "4":[{
+          name:"xycbCtrl",
+          label:"设备控制",
+        },{
+          name:"simCode",
+          label:"SIM卡详情",
+        }],
+        "5":[{
+          name:"qxzCtrl",
+          label:"设备控制",
+        },{
+          name:"qxzMsgWarn",
+          label:"短信预警",
+        }],
+        "7":[{
+          name:"bzyCtrl",
+          label:"设备控制",
+        },{
+          name:"simCode",
+          label:"SIM卡详情",
+        }],
+      }
     };
   },
   methods: {
     toggleMenu() {
-      this.open = !this.open;
+      this.sidebarState = !this.sidebarState;
+      setTimeout(()=>{
+        this.$emit('sidebarClear','')
+      },1000)
+    },
+    tabshandleClick(tab){
+      this.nowPage = tab.name;
     },
   },
+  mounted(){
+    this.nowPage = this.menu[this.equipType][0].name
+    this.slidactiveName = this.menu[this.equipType][0].name
+  }
 };
 </script>
 <style lang='less' scoped>
@@ -34,7 +119,7 @@ export default {
   right: 0px;
   display: flex;
   align-items: flex-start;
-  z-index: 999;
+  z-index: 9;
   .legend-menu {
     background: #242424;
     color: #fff;
@@ -70,7 +155,6 @@ export default {
       padding: 20px;
       box-sizing: border-box;
       height: 100%;
-      width: 440px;
     }
   }
 }
@@ -80,7 +164,77 @@ export default {
     border-radius: 4px;
   }
   .legend-detail {
-    width: 440px;
+    width: 540px;
   }
 }
+/deep/.el-tabs__item{
+  white-space: break-spaces;
+  height: inherit;
+  width: 42px;
+  line-height: 24px;
+  padding: 10px;
+  background: #dfdfdf;
+  color: #868686;
+  border-radius: 5px;
+  margin-bottom: 10px;
+}
+/deep/.el-tabs__nav-wrap::after,
+/deep/.el-tabs__active-bar{
+  background-color: #fff;
+}
+/deep/.el-tabs__item.is-active{
+  background: #0295ff;
+  color: #fff;
+}
+/deep/.el-tabs__content{
+  height: 100%;
+  overflow: auto;
+}
+/deep/.el-tabs--left .el-tabs__item.is-left{
+  text-align: center;
+}
+/deep/.el-tabs--left .el-tabs__active-bar.is-left{
+  right: -2px;
+}
+.el-tabs{
+  height: 100%;
+}
+/deep/.el-tabs__content{
+  padding-left: 15px;
+}
+// form调整
+/deep/.el-form--label-top .el-form-item__label{
+  padding: 0 0 0 13px;
+  position: relative;
+}
+/deep/.el-form-item {
+  margin-bottom: 5px;
+}
+/deep/.el-form-item__label::before{
+  position: absolute;
+  content: '';
+  width: 6px;
+  height: 6px;
+  background: #0295ff;
+  left: 0;
+  top: 17px;
+}
+// 滑块颜色
+/deep/.el-slider__bar{
+  background-color: #0295ff;
+}
+/deep/.el-slider__button{
+  border: solid 2px #0295ff;
+}
+/deep/.el-input-number__increase:hover, /deep/.el-input-number__decrease:hover{
+ color: #0295ff; 
+}
+/deep/.el-input-number__increase:hover:not(.is-disabled) ~ .el-input .el-input__inner:not(.is-disabled),
+/deep/.el-input-number__decrease:hover:not(.is-disabled) ~ .el-input .el-input__inner:not(.is-disabled) {
+    border-color: #0295ff;
+}
+
+.el-select{
+  width: 88%;
+}
 </style>

+ 133 - 0
src/components/highStand/timeSearch.vue

@@ -0,0 +1,133 @@
+<template>
+	<div class="searchBox">
+		<div class="timeSearchBtn">
+			<el-button
+				:type="btnSelected == '1' ? 'blueInfo' : 'grayInfo'"
+				size="mini"
+				plain
+				@click="timeBtnClick(1)"
+				>24小时</el-button
+			>
+			<el-button
+				:type="btnSelected == '2' ? 'blueInfo' : 'grayInfo'"
+				size="mini"
+				plain
+				@click="timeBtnClick(2)"
+				>近一月</el-button
+			>
+			<el-button
+				:type="btnSelected == '3' ? 'blueInfo' : 'grayInfo'"
+				size="mini"
+				plain
+				@click="timeBtnClick(3)"
+				>近半年</el-button
+			>
+			<el-button
+				:type="btnSelected == '4' ? 'blueInfo' : 'grayInfo'"
+				size="mini"
+				plain
+				@click="timeBtnClick(4)"
+				>近一年</el-button
+			>
+			<el-date-picker
+				style="cursor: pointer"
+				size="mini"
+				v-model="timeRange"
+				type="daterange"
+				range-separator="至"
+				start-placeholder="开始日期"
+				end-placeholder="结束日期"
+				@change="DateChange"
+			></el-date-picker>
+		</div>	
+		<div>
+			<el-button
+				v-if="!switcState"
+				type="orangeInfo"
+				size="mini"
+				@click="switcStateClick()"
+				>图表数据</el-button
+			>
+			<el-button
+				v-if="switcState"
+				type="orangeInfo"
+				size="mini"
+				@click="switcStateClick()"
+				>详细数据</el-button
+			>
+		</div>
+	</div>
+	
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			btnSelected: '2',
+			queryInfo: {
+				begin: '',
+				end: ''
+			},
+			timeRange: '',
+			switcState:true
+		}
+	},
+	mounted() {
+		this.timeBtnClick(2)
+	},
+	methods: {
+		//筛选时间
+		timeBtnClick(i) {
+			this.btnSelected = i
+			this.timeRange = ''
+			if (i == 1) {
+				this.queryInfo.begin = parseInt((Date.now() - 24 * 3600000) / 1000)
+				this.queryInfo.end = parseInt((Date.now() + 24 * 3600000) / 1000)
+			} else if (i == 2) {
+				this.queryInfo.begin = parseInt((Date.now() - 24 * 3600000 * 30) / 1000)
+				this.queryInfo.end = parseInt((Date.now() + 24 * 3600000) / 1000)
+			} else if (i == 3) {
+				this.queryInfo.begin = parseInt(
+					(Date.now() - 24 * 3600000 * 30 * 6) / 1000
+				)
+				this.queryInfo.end = parseInt((Date.now() + 24 * 3600000) / 1000)
+			} else if (i == 4) {
+				this.queryInfo.begin = parseInt(
+					(Date.now() - 24 * 3600000 * 30 * 12) / 1000
+				)
+				this.queryInfo.end = parseInt((Date.now() + 24 * 3600000) / 1000)
+            }
+			this.$emit('dateChange',this.queryInfo)
+		},
+		DateChange() {
+			this.btnSelected = null
+			if (this.timeRange) {
+				this.queryInfo.begin = parseInt(
+					new Date(this.timeRange[0]).getTime() / 1000
+				)
+				this.queryInfo.end = parseInt(
+					new Date(this.timeRange[1]).getTime() / 1000
+				)
+			} else {
+				this.btnSelected = 2
+				this.queryInfo.begin = parseInt((Date.now() - 24 * 3600000 * 30) / 1000)
+				this.queryInfo.end = parseInt((Date.now() + 24 * 3600000) / 1000)
+            }
+            this.$emit('dateChange',this.queryInfo)
+		},
+		switcStateClick(){
+			this.switcState=!this.switcState
+            this.$emit('toggleSwitcState',this.switcState)
+		},
+	}
+}
+</script>
+
+<style lang='less' scoped>
+.searchBox{
+	display: flex;
+	justify-content: space-between;
+	align-content: center;
+}
+</style>

+ 1 - 1
src/components/index.vue

@@ -6,7 +6,7 @@
         <!-- logo -->
         <div class="logoinfo">
           <img :src="$imghost + logoIcon" width="40" alt />
-          <span>高标准农田管理系统1</span>
+          <span>河南省高标准农田管理系统</span>
         </div>
         <!-- 菜单 -->
         <ul class="topMenu">

+ 4 - 0
src/main.js

@@ -105,6 +105,10 @@ Vue.use(preview)
 import VueCropper from 'vue-cropper'
 Vue.use(VueCropper)
 
+import animated from 'animate.css' // npm install animate.css --save-dev安装,再引入
+Vue.use(animated)
+
+
 //格式化时间戳
 import './util/formatTime'
 //设备类型

+ 55 - 0
src/pages/plantGuard/animate.vue

@@ -0,0 +1,55 @@
+
+<template>
+  <div>
+    <p>vue 同时使用transition 和 animate.css</p>
+    <button @click="change"> 触发动画</button>
+    <!-- 自定义name 以及使用animated.css,添加apper实现页面刷新第一次触发动画
+    type="transition" 定义以transition时长为准 animated默认时长1s
+    -->
+    <transition
+    name='fade'
+    :duration="{enter:5000,leave:10000}"
+    appear
+    enter-active-class="animate__animated animate__zoomIn" 
+    leave-active-class="animate__animated animate__zoomOut"
+    apper-active-class = "animate__animated animate__zoomIn"
+    >
+    
+      <div class="div" v-if="show">
+        hello 
+      </div>
+    </transition>
+  </div>
+</template>
+ 
+<script type="text/ecmascript-6">
+export default {
+  data() {
+    return {
+      show: true,
+    }
+  },
+  methods: {
+    change() {
+      this.show = !this.show
+    }
+  },
+  components: {
+  }
+}
+</script>
+ 
+<style lang="less">
+ 
+.div {
+  width: 200px;
+  height: 200px;
+  background-color: pink;
+  &.fade-enter ,.fade-leave-to{
+    opacity: 0;
+  }
+  &.fade-enter-active,.fade-leave-active{
+    transition: opacity 10s;
+  }
+}
+</style>

+ 73 - 0
src/pages/plantGuard/cbdPhoto/cbdPhoto.vue

@@ -0,0 +1,73 @@
+<!-- 测报灯图片 -->
+<template>
+  <div class>
+      <div class="ctrlsBtn">
+          <div>
+            <el-button type="blueInfo" size="small" @click="equipSetSubm()" >拍照</el-button>
+            <el-button type="blueInfo" size="small" @click="equipSetSubm()" >刷新</el-button>
+          </div>
+          <div>
+            <el-button type="orangeInfo" size="small" @click="equipSetSubm()" >查看全部图片</el-button>
+          </div>
+      </div>
+      <div class="photos">
+          <div v-for="i in 6">
+              <img src="http://182.92.193.64:8003/Basics/cbd/867435052201324/2021/3/11/20210311161847620251.jpg" alt="">
+              <div>2020-2-16 12:11:26</div>
+          </div>
+      </div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  components: {},
+  data() {
+    //这里存放数据
+    return {};
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {},
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style scoped lang="less">
+.ctrlsBtn{
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 15px;
+}
+.photos{
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    >div{
+        flex: 1;
+        width: 33.3333%;
+        max-width: 33.3333%;
+        min-width: 33.3333%;
+        text-align: center;
+        img{
+            width: 90%;
+        }
+    }
+}
+</style>

+ 125 - 0
src/pages/plantGuard/dialog.vue

@@ -0,0 +1,125 @@
+<!-- 弹出框公共组件 -->
+<template>
+  <div class='DialogVisible'>
+    <!-- <div class="mask">
+      <slot name="mask"></slot>
+    </div> -->
+    <div class="dialog__wrapper" :style="{width:width}">
+      <div class="dialog-header">
+        <slot name="header">
+          <span class="dialog-title">数据详情</span>
+          <button type="button" class="dialog-headerbtn">
+            <i class="el-icon el-icon-close"></i>
+          </button>
+        </slot>
+      </div>
+      <div class="dialog-body">
+        <slot name="inner"></slot>
+      </div>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+//import引入的组件需要注入到对象中才能使用
+components: {},
+props:['width'],
+data() {
+//这里存放数据
+return {
+};
+},
+//监听属性 类似于data概念
+computed: {},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.DialogVisible{
+  position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    overflow: auto;
+    margin: 0;
+    z-index: 555;
+  .mask{
+    position: fixed;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    opacity: 0.5;
+    background: #000000;
+  }
+  .dialog__wrapper{
+    border-radius: 5px;
+    margin: 0 auto 50px;
+    margin-top: 23vh;
+    // width: 500px;
+    position: relative;
+    background: #FFFFFF;
+    border-radius: 2px;
+    -webkit-box-shadow: 0 1px 3px rgb(0 0 0 / 30%);
+    box-shadow: 0 1px 3px rgb(0 0 0 / 30%);
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    background: #fff;
+    .dialog-header{
+        padding: 20px;
+        padding-bottom: 10px;
+        background: #F2F2F2;
+      .dialog-title{
+        line-height: 24px;
+        font-size: 18px;
+        color: #303133;
+      }
+      .dialog-headerbtn{
+        position: absolute;
+        top: 20px;
+        right: 20px;
+        padding: 0;
+        background: transparent;
+        border: none;
+        outline: none;
+        cursor: pointer;
+        font-size: 16px;
+      }
+    }
+  }
+  .dialog-body{
+    padding: 30px 20px;
+    color: #606266;
+    font-size: 14px;
+  }
+}
+.animate__zoomOut.DialogVisible{
+  display: none;
+}
+</style>

+ 126 - 0
src/pages/plantGuard/dialogHollow.vue

@@ -0,0 +1,126 @@
+<!-- 地图镂空弹出框公共组件 -->
+<template>
+  <div class='DialogVisible' :style="{marginLeft:-width/2+'px'}">
+    <!-- <div class="mask">
+      <slot name="mask"></slot>
+    </div> -->
+    <div class="dialog__wrapper" :style="{width:width+'px'}">
+      <div class="dialog-header">
+        <slot name="header">
+          <span class="dialog-title">数据详情</span>
+          <button type="button" class="dialog-headerbtn">
+            <i class="el-icon el-icon-close"></i>
+          </button>
+        </slot>
+      </div>
+      <div class="dialog-body">
+        <slot name="inner"></slot>
+      </div>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+//import引入的组件需要注入到对象中才能使用
+components: {},
+props:['width'],
+data() {
+//这里存放数据
+return {
+};
+},
+//监听属性 类似于data概念
+computed: {},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.DialogVisible{
+  position: fixed;
+  top: 215px;
+  left: 50%;
+  overflow: auto;
+  margin: 0;
+  z-index: 555;
+  .mask{
+    position: fixed;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    opacity: 0.5;
+    background: #000000;
+  }
+  .dialog__wrapper{
+    border-radius: 5px;
+    // margin: 0 auto 50px;
+    // margin-top: 23vh;
+    // width: 500px;
+    position: relative;
+    background: #FFFFFF;
+    border-radius: 2px;
+    -webkit-box-shadow: 0 1px 3px rgb(0 0 0 / 30%);
+    box-shadow: 0 1px 3px rgb(0 0 0 / 30%);
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    background: #fff;
+    .dialog-header{
+        padding: 20px;
+        padding-bottom: 10px;
+        background: #F2F2F2;
+      .dialog-title{
+        line-height: 24px;
+        font-size: 18px;
+        color: #303133;
+      }
+      .dialog-headerbtn{
+        position: absolute;
+        top: 20px;
+        right: 20px;
+        padding: 0;
+        background: transparent;
+        border: none;
+        outline: none;
+        cursor: pointer;
+        font-size: 16px;
+      }
+    }
+  }
+  .dialog-body{
+    padding: 30px 20px;
+    color: #606266;
+    font-size: 14px;
+    max-height: 55vh;
+    overflow-y: auto;
+    overflow-x: hidden;
+  }
+}
+.animate__zoomOut.DialogVisible{
+  display: none;
+}
+</style>

+ 305 - 0
src/pages/plantGuard/equipCtrls/bzyctrl.vue

@@ -0,0 +1,305 @@
+<!-- 性诱测报控制 -->
+<template>
+  <div class=''>
+    <div class="equipId">设备ID:{{equipId}}</div>
+    <el-form ref="equipContrlRef" label-position="top" :model="setFrom" label-width="180px">
+        <el-form-item label="载玻片滴液时间(s): " prop="drop_time">
+          <el-select v-model="setFrom.drop_time">
+            <el-option
+              v-for="item in 30"
+              :key="item"
+              :label="item"
+              :value="item"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="孢子培养时间(h): " prop="cul_time">
+          <div class="sliderParent">
+            <div class="block">
+              <el-slider
+                v-model="setFrom.cul_time"
+                show-input
+                :min="1"
+                :max="24"
+              ></el-slider>
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="保温仓设定温度(℃): " prop="set_temp">
+          <div class="sliderParent">
+            <div class="block">
+              <el-slider
+                v-model="setFrom.set_temp"
+                show-input
+                :min="10"
+                :max="40"
+              ></el-slider>
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="数据上传时间间隔(min): " prop="datt">
+          <div class="sliderParent">
+            <div class="block">
+              <el-slider
+                v-model="setFrom.datt"
+                show-input
+                :min="10"
+                :max="60"
+              ></el-slider>
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="采集开启和关闭时间: ">
+          <div class="timeSet">
+            <el-time-select
+              placeholder="起始时间"
+              v-model="coll_time.time01"
+              :picker-options="{
+                start: '01:00',
+                step: '1:00',
+                end: '24:00',
+              }"
+            ></el-time-select>
+            <span>至</span>
+            <el-time-select
+              placeholder="结束时间"
+              v-model="coll_time.time02"
+              :picker-options="{
+                start: '01:00',
+                step: '1:00',
+                end: '24:00',
+                minTime: coll_time.time01,
+              }"
+            ></el-time-select>
+          </div>
+          <div class="timeSet">
+            <el-time-select
+              placeholder="起始时间"
+              v-model="coll_time.time03"
+              :picker-options="{
+                start: '01:00',
+                step: '1:00',
+                end: '24:00',
+                minTime: coll_time.time02,
+              }"
+            ></el-time-select>
+            <span>至</span>
+            <el-time-select
+              placeholder="结束时间"
+              v-model="coll_time.time04"
+              :picker-options="{
+                start: '01:00',
+                step: '1:00',
+                end: '24:00',
+                minTime: coll_time.time03,
+              }"
+            ></el-time-select>
+          </div>
+          <div class="timeSet">
+            <el-time-select
+              placeholder="起始时间"
+              v-model="coll_time.time05"
+              :picker-options="{
+                start: '01:00',
+                step: '1:00',
+                end: '24:00',
+                minTime: coll_time.time04,
+              }"
+            ></el-time-select>
+            <span>至</span>
+            <el-time-select
+              placeholder="结束时间"
+              v-model="coll_time.time06"
+              :picker-options="{
+                start: '01:00',
+                step: '1:00',
+                end: '24:00',
+                minTime: coll_time.time05,
+              }"
+            ></el-time-select>
+          </div>
+        </el-form-item>
+        <el-form-item class="handAddFormBtn">
+            <el-button
+              type="blueInfo"
+              size="small"
+              @click="equipSetSubm()"
+              >确定</el-button
+            >
+            <el-button type="grayInfo" size="small" @click="resetForm()"
+              >取消</el-button
+            >
+          </el-form-item>
+      </el-form>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+props: ["equipId", "equipType","d_id","model"],
+//import引入的组件需要注入到对象中才能使用
+components: {},
+data() {
+//这里存放数据
+return {
+  setFrom: {
+    drop_time: "1", //载玻片滴液时间
+    imgres: "0", //图片上传分辨率
+    cul_time: 0, //孢子培养时间
+    set_temp: 0, //保温仓设定温度
+    datt: 0, //数据上传时间间隔(h)-m
+    coll_time: [], //采集开启和关闭时间
+  },
+  coll_time: {
+    time01: "",
+    time02: "",
+    time03: "",
+    time04: "",
+    time05: "",
+    time06: "",
+  },
+  equipContrlForm2: "{}",
+};
+},
+//监听属性 类似于data概念
+computed: {},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+  //设备控制
+  equipSet() {
+    this.$axios({
+      method: "POST",
+      url:"/api/api_gateway?method=forecast.send_control.device_control_info",
+      data: this.qs.stringify({ d_id:this.d_id, cmd: "paramconf" }),
+    }).then((res) => {
+      if (res.data.data && Object.keys(res.data.data).length > 0) {
+        let data = res.data.data;
+        this.setFrom = data;
+        this.equipContrlForm2 = JSON.stringify(data)
+        let { coll_time } = this.setFrom;
+        for (let i in coll_time) {
+          if (i == 0) {
+            let arr = coll_time[i].split("-");
+            this.coll_time.time01 =
+              Number(arr[0]) < 10 ? "0" + arr[0] + ":00" : arr[0] + ":00";
+            this.coll_time.time02 =
+              Number(arr[1]) < 10 ? "0" + arr[1] + ":00" : arr[1] + ":00";
+          } else if (i == 1) {
+            let arr = coll_time[i].split("-");
+            this.coll_time.time03 =
+              Number(arr[0]) < 10 ? "0" + arr[0] + ":00" : arr[0] + ":00";
+            this.coll_time.time04 =
+              Number(arr[1]) < 10 ? "0" + arr[1] + ":00" : arr[1] + ":00";
+          } else if (i == 2) {
+            let arr = coll_time[i].split("-");
+            this.coll_time.time05 =
+              Number(arr[0]) < 10 ? "0" + arr[0] + ":00" : arr[0] + ":00";
+            this.coll_time.time06 =
+              Number(arr[1]) < 10 ? "0" + arr[1] + ":00" : arr[1] + ":00";
+          }
+        }
+        console.log(this.coll_time);
+      }
+    });
+  },
+  equipSetSubm() {
+    this.setFrom.coll_time = [];
+    if (this.coll_time.time01 && this.coll_time.time02) {
+      let t1 =
+        this.coll_time.time01.slice(0, 2).charAt(0) != "0"
+          ? this.coll_time.time01.slice(0, 2)
+          : this.coll_time.time01.slice(1, 2);
+      let t2 =
+        this.coll_time.time02.slice(0, 2).charAt(0) != "0"
+          ? this.coll_time.time02.slice(0, 2)
+          : this.coll_time.time02.slice(1, 2);
+      this.setFrom.coll_time.push(`${t1}-${t2}`);
+    }
+    if (this.coll_time.time03 && this.coll_time.time04) {
+      let t1 =
+        this.coll_time.time03.slice(0, 2).charAt(0) != "0"
+          ? this.coll_time.time03.slice(0, 2)
+          : this.coll_time.time03.slice(1, 2);
+      let t2 =
+        this.coll_time.time04.slice(0, 2).charAt(0) != "0"
+          ? this.coll_time.time04.slice(0, 2)
+          : this.coll_time.time04.slice(1, 2);
+      this.setFrom.coll_time.push(`${t1}-${t2}`);
+    }
+    if (this.coll_time.time05 && this.coll_time.time06) {
+      let t1 =
+        this.coll_time.time05.slice(0, 2).charAt(0) != "0"
+          ? this.coll_time.time05.slice(0, 2)
+          : this.coll_time.time05.slice(1, 2);
+      let t2 =
+        this.coll_time.time06.slice(0, 2).charAt(0) != "0"
+          ? this.coll_time.time06.slice(0, 2)
+          : this.coll_time.time06.slice(1, 2);
+      this.setFrom.coll_time.push(`${t1}-${t2}`);
+    }
+    this.$axios({
+      method: "POST",
+      url: "/api/api_gateway?method=forecast.send_control.device_control",
+      data: this.qs.stringify({
+        device_type_id: 7,
+        d_id: this.d_id,
+        config: JSON.stringify(this.setFrom),
+      }),
+    }).then((res) => {
+      if (res.data.message == "") {
+        this.$message.success("设备控制修改成功");
+      } else {
+        this.$message.err("设备控制修改失败");
+      }
+      this.setDialogVisible = false;
+    });
+  },
+  resetForm() {
+    if(this.equipContrlForm2){
+     this.setFrom = JSON.parse(this.equipContrlForm2)
+    }else{
+      this.setFrom = {}
+    }
+  }
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+  this.equipSet()
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.equipId{
+  line-height: 33px;
+  text-align: center;
+  background: #eee;
+}
+.handAddFormBtn{
+  margin-top: 20px;
+  text-align: right;
+}
+// 时间input框
+/deep/.el-date-editor.el-input, 
+/deep/.el-date-editor.el-input__inner{
+  width: 177px;
+}
+.timeSet{
+  margin-bottom: 13px;
+}
+</style>

+ 301 - 0
src/pages/plantGuard/equipCtrls/cbdctrl.vue

@@ -0,0 +1,301 @@
+<!-- 测报灯控制 -->
+<template>
+  <div class=''>
+    <div class="equipId">设备ID:{{equipId}}</div>
+<el-form
+					ref="equipContrlRef"
+					:model="equipContrlForm"
+					label-position="top"
+					label-width="150px"
+				>
+					<el-form-item label="设备开关:" prop="ds">
+						<el-select v-model="equipContrlForm.ds">
+							<el-option label="开机" :value="1"></el-option>
+							<el-option label="关机" :value="0"></el-option>
+						</el-select>
+					</el-form-item>
+					<!-- <el-form-item label="工作状态:" prop="ws">
+						<el-select
+							v-model="ws"
+							placeholder="请选择工作状态"
+							@change="wsChange()"
+						>
+							<el-option label="待机" :value="0"></el-option>
+							<el-option label="工作" :value="1"></el-option>
+						</el-select>
+					</el-form-item> -->
+					<el-form-item label="定时模式:" prop="ts">
+						<el-select
+							v-model="equipContrlForm.ts"
+							placeholder="请选择定时模式"
+						>
+							<el-option label="光控" :value="0"></el-option>
+							<el-option label="时控" :value="1"></el-option>
+						</el-select>
+					</el-form-item>
+					<el-form-item v-if="equipContrlForm.ts == 1" label="开始结束时间:">
+						<el-col :span="11">
+							<el-time-select
+								placeholder="起始时间"
+								v-model="equipContrlForm.st"
+								:picker-options="{
+									start: '00:00',
+									step: '01:00',
+									end: '24:00'
+								}"
+							></el-time-select>
+						</el-col>
+						<el-col class="line" :span="2">-</el-col>
+						<el-col :span="11">
+							<el-time-select
+								placeholder="结束时间"
+								v-model="equipContrlForm.et"
+								:picker-options="{
+									start: '00:00',
+									step: '01:00',
+									end: '24:00'
+								}"
+							></el-time-select>
+						</el-col>
+					</el-form-item>
+					<el-form-item
+						v-if="equipContrlForm.ts != 1"
+						label="定时时长(h):"
+						prop="tt"
+					>
+						<div class="sliderParent">
+							<div class="block">
+								<el-slider
+									v-model="equipContrlForm.tt"
+									show-input
+									:min="1"
+									:max="10"
+								></el-slider>
+							</div>
+						</div>
+					</el-form-item>
+					<el-form-item label="落虫时间(min):" prop="collt">
+						<div class="sliderParent">
+							<div class="block">
+								<el-slider
+									v-model="equipContrlForm.collt"
+									show-input
+									:min="1"
+									:max="20"
+								></el-slider>
+							</div>
+						</div>
+					</el-form-item>
+					<el-form-item label="加热时间(min):" prop="htim">
+						<div class="sliderParent">
+							<div class="block">
+								<el-slider
+									v-model="equipContrlForm.htim"
+									show-input
+									:min="1"
+									:max="20"
+								></el-slider>
+							</div>
+						</div>
+					</el-form-item>
+					<el-form-item label="加热温度(℃):" prop="hst">
+						<div class="sliderParent">
+							<div class="block">
+								<el-slider
+									v-model="equipContrlForm.hst"
+									show-input
+									:min="75"
+									:max="120"
+								></el-slider>
+							</div>
+						</div>
+					</el-form-item>
+					<el-form-item label="高温保护阈值(℃):" prop="tph">
+						<div class="sliderParent">
+							<div class="block">
+								<el-slider
+									v-model="equipContrlForm.tph"
+									show-input
+									:min="50"
+									:max="70"
+								></el-slider>
+							</div>
+						</div>
+					</el-form-item>
+					<el-form-item label="低温保护阈值(℃):" prop="tpl">
+						<div class="sliderParent">
+							<div class="block">
+								<el-slider
+									v-model="equipContrlForm.tpl"
+									show-input
+									:min="1"
+									:max="10"
+								></el-slider>
+							</div>
+						</div>
+					</el-form-item>
+					<el-form-item label="数据上传间隔(min):" prop="datt">
+						<div class="sliderParent">
+							<div class="block">
+								<el-slider
+									v-model="equipContrlForm.datt"
+									:step="10"
+									show-input
+									:min="10"
+									:max="60"
+								></el-slider>
+							</div>
+						</div>
+					</el-form-item>
+					<!-- <el-form-item label="图片分辨率:" prop="imgres">
+						<el-select
+							v-model="equipContrlForm.imgres"
+							placeholder="请选择图片分辨率"
+						>
+							<el-option label="高" :value="0"></el-option>
+							<el-option label="中" :value="1"></el-option>
+							<el-option label="低" :value="2"></el-option>
+						</el-select>
+					</el-form-item> -->
+					<el-form-item class="handAddFormBtn">
+						<el-button type="blueInfo" size="small" @click="equipControlSubm()"
+							>确定</el-button
+						>
+						<el-button type="grayInfo" size="small" @click="resetForm()" >取消</el-button
+						>
+					</el-form-item>
+				</el-form>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+props: ["equipId", "equipType","d_id"],
+//import引入的组件需要注入到对象中才能使用
+components: {},
+data() {
+//这里存放数据
+return {
+  equipContrlForm: {
+    st: '',
+    et: '',
+    ts: 0,
+    tt: null,
+    collt: null,
+    htim: null,
+    hst: null,
+    tph: null,
+    tpl: null,
+    datt: null,
+    // imgres: 0,
+    ds: 1
+  },
+  equipContrlForm2: "{}",
+};
+},
+//监听属性 类似于data概念
+computed: {},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+  //设备控制
+  EquipControl() {
+    this.$axios({
+      method: "POST",
+      url:
+        "/api/api_gateway?method=forecast.send_control.device_control_info",
+      data: this.qs.stringify({ d_id:this.d_id, cmd: "paramconf" }),
+    }).then((res) => {
+      if (res.data.data && Object.keys(res.data.data).length > 0) {
+        let data = res.data.data;
+        data.st =
+          data.st && data.st < 10 ? "0" + data.st + ":00" : data.st + ":00";
+        data.et =
+          data.et && data.et < 10 ? "0" + data.et + ":00" : data.et + ":00";
+        data.clt = Number(data.clt);
+        this.equipContrlForm = data;
+        this.equipContrlForm2 = JSON.stringify(data);
+      }
+    });
+  },
+  equipControlSubm() {
+    let obj = this.equipContrlForm;
+    obj.st =
+      obj.st && obj.st.slice(0, 2).charAt(0) != "0"
+        ? obj.st.slice(0, 2)
+        : obj.st.slice(1, 2);
+    obj.et =
+      obj.et && obj.et.slice(0, 2).charAt(0) != "0"
+        ? obj.et.slice(0, 2)
+        : obj.et.slice(1, 2);
+    this.$axios({
+      method: "POST",
+      url: "/api/api_gateway?method=forecast.send_control.device_control",
+      data: this.qs.stringify({
+        device_type_id: 2,
+        d_id: this.d_id,
+        config: JSON.stringify(obj),
+      }),
+    }).then((res) => {
+      if (res.data.message == "") {
+        this.$message.success("设备控制修改成功");
+      } else {
+        his.$message.error("设备控制修改失败");
+      }
+      this.equipControlDialogVisible = false;
+    });
+  },
+  resetForm() {
+    if(this.equipContrlForm2){
+      this.equipContrlForm = JSON.parse(this.equipContrlForm2);
+    }else{
+      this.equipContrlForm={
+        st: "",
+        et: "",
+        ds: "",
+        ts: "",
+        tt: "",
+        dattim: 10,
+        clt: 10,
+        timctrl: "",
+      }
+    }
+  }
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+  this.EquipControl()
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.equipId{
+  line-height: 33px;
+  text-align: center;
+  background: #eee;
+}
+.handAddFormBtn{
+  margin-top: 20px;
+  text-align: right;
+}
+// 时间input框
+/deep/.el-date-editor.el-input, 
+/deep/.el-date-editor.el-input__inner{
+  width: 177px;
+}
+</style>

+ 162 - 0
src/pages/plantGuard/equipCtrls/qxzctrl.vue

@@ -0,0 +1,162 @@
+<!-- 性诱测报控制 -->
+<template>
+  <div class=''>
+    <div class="equipId">设备ID:{{equipId}}</div>
+	  <el-form
+          ref="equipContrlRef1"
+          :model="setFrom"
+          label-position="top"
+          label-width="130px"
+        >
+          <el-form-item label="操作:" >
+            <el-button class="ctrlbtns" type="blueInfo" size="mini" @click="equipControl('reboot')">重启</el-button>
+            <el-button class="ctrlbtns" type="blueInfo" size="mini" @click="searchInterval('data')">刷新</el-button>
+          </el-form-item>
+          <el-form-item label="显示屏设置:" >
+            <el-input style="margin-bottom: 20px" v-model="setFrom.content" placeholder="标题文字设置"></el-input>
+            <el-input
+              type="number"
+              min="0"
+              placeholder="显示时间设置(min)"
+              v-model="setFrom.timeout"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="上传时间间隔:">
+            <el-slider
+              v-model="setFrom.interval"
+              show-input
+              :min="1"
+              :max="360"
+            ></el-slider>
+          </el-form-item>
+          <el-form-item >
+            <el-button class="updatetime" type="blueInfo" size="mini" @click="searchInterval('interval')">查询上传时间间隔</el-button>
+          </el-form-item>
+          <el-form-item class="handAddFormBtn">
+            <el-button
+              type="blueInfo"
+              size="small"
+              @click="equipSetSubm()"
+              >确定</el-button>
+            <!-- <el-button type="grayInfo" size="small" @click="resetForm()"
+              >取消</el-button> -->
+          </el-form-item>
+        </el-form>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+props: ["equipId", "equipType","d_id","model"],
+//import引入的组件需要注入到对象中才能使用
+components: {},
+data() {
+//这里存放数据
+return {
+  setFrom: {
+    //设备控制
+    content: "",
+    timeout: null,
+    interval: 0,
+  },
+};
+},
+//监听属性 类似于data概念
+computed: {},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+    equipControl(cmd) {
+      this.$axios({
+        method: "POST",
+        url:
+          "/api/api_gateway?method=forecast.send_control.admin_device_control",
+        data: this.qs.stringify({
+          device_type_id: 5,
+          d_id: this.d_id,
+          cmd: cmd,
+        }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          this.$message.success("操作成功");
+        } else {
+          this.$message.err("操作失败");
+        }
+      });
+    },
+    searchInterval(cmd) {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=forecast.send_control.get_device_config",
+        data: this.qs.stringify({
+          device_type_id: 5,
+          d_id: this.d_id,
+          control_type: cmd,
+        }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          this.$message.success("操作成功");
+        } else {
+          this.$message.err("操作失败");
+        }
+      });
+    },
+    equipSetSubm() {
+      console.log(this.setFrom);
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=forecast.send_control.device_control",
+        data: this.qs.stringify({
+          device_type_id: 5,
+          d_id: this.d_id,
+          config: JSON.stringify(this.setFrom),
+        }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          this.$message.success("操作成功");
+        } else {
+          this.$message.err("操作失败");
+        }
+        this.setDialogVisible = false;
+      });
+    },
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.equipId{
+  line-height: 33px;
+  text-align: center;
+  background: #eee;
+}
+.handAddFormBtn{
+  margin-top: 20px;
+  text-align: right;
+}
+.ctrlbtns{
+  padding: 10px 30px;
+}
+.updatetime{
+  margin-top: 10px;
+  width: 100%;
+  line-height: 22px;
+}
+</style>

+ 227 - 0
src/pages/plantGuard/equipCtrls/scdctrl.vue

@@ -0,0 +1,227 @@
+<!-- 杀虫灯控制 -->
+<template>
+  <div class=''>
+    <div class="equipId">设备ID:{{equipId}}</div>
+    <el-form
+          ref="equipContrlRef"
+          :model="equipContrlForm"
+          label-position="top"
+          label-width="150px"
+        >
+          <el-form-item label="设备开关:" prop="ds">
+            <el-select v-model="equipContrlForm.ds">
+              <el-option label="开机" :value="1"></el-option>
+              <el-option label="关机" :value="0"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="定时模式:" prop="timctrl">
+            <el-select v-model="equipContrlForm.timctrl" placeholder="定时模式">
+              <el-option label="光控" :value="0"></el-option>
+              <el-option label="时控" :value="1"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            v-if="equipContrlForm.timctrl == 1"
+            label="开始结束时间:"
+          >
+            <el-time-select
+              placeholder="起始时间"
+              v-model="equipContrlForm.st"
+              default-value="00:00"
+              :picker-options="{
+                start: '00:00',
+                step: '01:00',
+                end: '24:00',
+              }"
+            ></el-time-select>
+            -
+            <el-time-select
+              placeholder="结束时间"
+              v-model="equipContrlForm.et"
+              default-value="00:00"
+              :picker-options="{
+                start: '00:00',
+                step: '01:00',
+                end: '24:00',
+              }"
+            ></el-time-select>
+          </el-form-item>
+          <el-form-item
+            v-if="equipContrlForm.timctrl != 1"
+            label="定时时长(h):"
+            prop="tt"
+          >
+            <el-select v-model="equipContrlForm.tt" placeholder="定时时长">
+              <el-option label="常亮" :value="0"></el-option>
+              <el-option :label="1" :value="1"></el-option>
+              <el-option :label="2" :value="2"></el-option>
+              <el-option :label="3" :value="3"></el-option>
+              <el-option :label="4" :value="4"></el-option>
+              <el-option :label="5" :value="5"></el-option>
+              <el-option :label="6" :value="6"></el-option>
+              <el-option :label="7" :value="7"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="上传时间间隔(min):" prop="dattim">
+            <div class="sliderParent">
+              <div class="block">
+                <el-slider
+                  :min="10"
+                  :step="10"
+                  :max="120"
+                  v-model="equipContrlForm.dattim"
+                  show-input
+                ></el-slider>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="自清虫定时(min):" prop="clt">
+            <div class="sliderParent">
+              <div class="block">
+                <el-slider
+                  :min="10"
+                  :max="120"
+                  v-model="equipContrlForm.clt"
+                  show-input
+                ></el-slider>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item class="handAddFormBtn">
+            <el-button type="blueInfo" size="small" @click="equipControlSubm"
+              >确定</el-button
+            >
+            <el-button type="grayInfo" size="small" @click="resetForm()">取消</el-button
+            >
+          </el-form-item>
+        </el-form>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+props: ["equipId", "equipType","d_id"],
+//import引入的组件需要注入到对象中才能使用
+components: {},
+data() {
+//这里存放数据
+return {
+  equipContrlForm: {
+    st: "",
+    et: "",
+    ds: "",
+    ts: "",
+    tt: "",
+    dattim: 10,
+    clt: 10,
+    timctrl: "",
+  },
+  equipContrlForm2: "{}",
+};
+},
+//监听属性 类似于data概念
+computed: {},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+  //设备控制
+  EquipControl() {
+    this.$axios({
+      method: "POST",
+      url:
+        "/api/api_gateway?method=forecast.send_control.device_control_info",
+      data: this.qs.stringify({ d_id:this.d_id, cmd: "paramconf" }),
+    }).then((res) => {
+      if (res.data.data && Object.keys(res.data.data).length > 0) {
+        let data = res.data.data;
+        data.st =
+          data.st && data.st < 10 ? "0" + data.st + ":00" : data.st + ":00";
+        data.et =
+          data.et && data.et < 10 ? "0" + data.et + ":00" : data.et + ":00";
+        data.clt = Number(data.clt);
+        this.equipContrlForm = data;
+        this.equipContrlForm2 = JSON.stringify(data);
+      }
+    });
+  },
+  equipControlSubm() {
+    let obj = this.equipContrlForm;
+    obj.st =
+      obj.st && obj.st.slice(0, 2).charAt(0) != "0"
+        ? obj.st.slice(0, 2)
+        : obj.st.slice(1, 2);
+    obj.et =
+      obj.et && obj.et.slice(0, 2).charAt(0) != "0"
+        ? obj.et.slice(0, 2)
+        : obj.et.slice(1, 2);
+    this.$axios({
+      method: "POST",
+      url: "/api/api_gateway?method=forecast.send_control.device_control",
+      data: this.qs.stringify({
+        device_type_id: 2,
+        d_id: this.d_id,
+        config: JSON.stringify(obj),
+      }),
+    }).then((res) => {
+      if (res.data.message == "") {
+        this.$message.success("设备控制修改成功");
+      } else {
+        his.$message.error("设备控制修改失败");
+      }
+      this.equipControlDialogVisible = false;
+    });
+  },
+  resetForm() {
+    if(this.equipContrlForm2){
+      this.equipContrlForm = JSON.parse(this.equipContrlForm2);
+    }else{
+      this.equipContrlForm={
+        st: "",
+        et: "",
+        ds: "",
+        ts: "",
+        tt: "",
+        dattim: 10,
+        clt: 10,
+        timctrl: "",
+      }
+    }
+  }
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+  this.EquipControl()
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.equipId{
+  line-height: 33px;
+  text-align: center;
+  background: #eee;
+}
+.handAddFormBtn{
+  margin-top: 20px;
+  text-align: right;
+}
+// 时间input框
+/deep/.el-date-editor.el-input, 
+/deep/.el-date-editor.el-input__inner{
+  width: 177px;
+}
+</style>

+ 228 - 0
src/pages/plantGuard/equipCtrls/simCode.vue

@@ -0,0 +1,228 @@
+<!-- 测报灯控制 -->
+<template>
+  <div class>
+    <div class="equipId">设备ID:{{equipId}}</div>
+    <div class="subTitle">sim卡流量</div>
+    <div class="simCodeBox">
+      <div class="simCodeTitle">ICCID:{{ sim.iccid }}</div>
+      <div class="simCodeTitle">状态:{{ sim.account_status | simStatus }}</div>
+      <div class="simCodeTitle">套餐:{{ sim.data_plan }}MB</div>
+      <div class="simCodeTitle">已用流量:{{ sim.data_usage }}MB</div>
+      <div class="simCodeTitle">剩余流量:{{ sim.data_balance }}MB</div>
+      <div class="simCodeTitle">到期时间:{{ (sim.expiry_date * 1000) | formatTime }}</div>
+    </div>
+    <div>
+      <highcharts :options="options2" v-if="Object.keys(options2).length > 0"></highcharts>
+    </div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+import HighCharts from "highcharts";
+export default {
+  props: ["equipId", "equipType", "d_id"],
+  //import引入的组件需要注入到对象中才能使用
+  components: {},
+  data() {
+    //这里存放数据
+    return {
+      // sim卡
+      sim: {
+        iccid: "",
+        account_status: 0, //卡状态 0-7 未知 测试期 沉默期 使用中 停机 停机保号 预销号 销号
+        data_plan: 0, //套餐大小
+        data_usage: 0, //当月用量
+        data_balance: 0, //剩余流量
+        expiry_date: 0 //到期日期
+      },
+      options2: {}
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+     // 设置hightcharts配置
+    refreshData() {
+      HighCharts.setOptions({
+        // 所有语言文字相关配置都设置在 lang 里
+        lang: {
+          resetZoom: "刷新",
+          resetZoomTitle: "重置缩放比例",
+        },
+      });
+    },
+    simSet() {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=forecast.send_control.device_sim",
+        data: this.qs.stringify({
+          d_id: this.d_id,
+          type: "sim"
+        })
+      }).then(res => {
+        if (res.data.message == "") {
+          this.sim.iccid = res.data.data[0].iccid;
+          this.$axios({
+            method: "POST",
+            url: "/api/api_gateway?method=forecast.send_control.sim_query",
+            data: this.qs.stringify({
+              iccid: this.sim.iccid
+            })
+          }).then(res => {
+            if (res.data.message == "") {
+              let data = eval("(" + res.data.data.data + ")");
+              // let cardInfo = data.data.card_list[0]
+              let cardInfo = data.data;
+              this.sim = cardInfo;
+              this.chartPieInit([{name:"已用",y:this.sim.data_usage},{name:"剩余",y:this.sim.data_balance}])
+            }
+          });
+        } else {
+          this.$message.error(res.data.message);
+        }
+      });
+    },
+    //饼状图初始化
+    chartPieInit(arr) {
+      var _this = this;
+      (this.options2 = {
+        chart: {
+          type: "pie",
+          options3d: {
+            enabled: true,
+            alpha: 60,
+            beta: 0
+          }
+        },
+        credits: {
+          enabled: false
+        },
+        title: {
+          text: "",
+          align: "left"
+        },
+        tooltip: {
+          headerFormat: "{series.name}<br>",
+          pointFormat: "{point.name}: <b>{point.y}MB</b>"
+        },
+        colors: ["#00e29d", "#6cbbff", "#ff3f3f"],
+        plotOptions: {
+          pie: {
+            allowPointSelect: true,
+            cursor: "pointer",
+            dataLabels: {
+              enabled: true,
+              format: "<b>{point.name}</b>: {point.percentage:.1f} %"
+            },
+            point: {
+              events: {
+                mouseOver: function(e) {
+                  // 鼠标滑过时动态更新标题
+                  // console.log(e)
+                  // console.log(this.setTitle())
+                  // 标题更新函数,API 地址:https://api.hcharts.cn/highcharts#Chart.setTitle
+                  // VueHighcharts.setTitle({
+                  //    text: e.target.name+ '\t'+ e.target.y + ' %'
+                  // });
+                },
+                click(e) {
+                  // 同样的可以在点击事件里处理
+                }
+              }
+            }
+          }
+        },
+        series: [
+          {
+            type: "pie",
+            innerSize: "80%",
+            name: "流量比例",
+            data: arr
+          }
+        ]
+      }),
+        function(c) {
+          // 图表初始化完毕后的会掉函数
+          // 环形图圆心
+          var centerY = c.series[0].center[1],
+            titleHeight = parseInt(c.title.styles.fontSize);
+          // 动态设置标题位置
+          c.setTitle({
+            y: centerY + titleHeight / 2
+          });
+        };
+    }
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {
+    this.simSet();
+    this.refreshData();
+  },
+  filters: {
+    simStatus(val) {
+      switch (val) {
+        case 0:
+          return "未知";
+        case 1:
+          return "测试期";
+        case 2:
+          return "沉默期";
+        case 3:
+          return "使用中";
+        case 4:
+          return "停机";
+        case 5:
+          return "停机保号";
+        case 6:
+          return "预销号";
+        case 7:
+          return "销号";
+      }
+    }
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style scoped lang="less">
+.equipId {
+  line-height: 33px;
+  text-align: center;
+  background: #eee;
+}
+.subTitle {
+  margin: 15px 0;
+  line-height: 22px;
+  font-size: 14px;
+  border-left: 4px solid #0295ff;
+  padding-left: 10px;
+}
+.simCodeTitle {
+  line-height: 40px;
+  font-size: 14px;
+  margin-left: 11px;
+  position: relative;
+  padding-left: 16px;
+}
+.simCodeTitle::before {
+  position: absolute;
+  content: "";
+  width: 7px;
+  height: 7px;
+  background: #0295ff;
+  left: 0;
+  top: 16px;
+}
+</style>

+ 229 - 0
src/pages/plantGuard/equipCtrls/xycbctrl.vue

@@ -0,0 +1,229 @@
+<!-- 性诱测报控制 -->
+<template>
+  <div class=''>
+    <div class="equipId">设备ID:{{equipId}}</div>
+	<el-form
+          ref="equipContrlRef1"
+          :model="equipContrlForm1"
+          label-position="top"
+          label-width="130px"
+        >
+          <el-form-item label="设备开关:" prop="ds">
+            <el-select v-model="equipContrlForm1.ds">
+              <el-option label="开机" :value="1"></el-option>
+              <el-option label="关机" :value="0"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="时控开关:" prop="timctrl">
+            <el-select v-model="equipContrlForm1.timctrl">
+              <el-option label="开" :value="1"></el-option>
+              <el-option label="关" :value="0"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="时控时长:">
+            <div class="timeSet">
+              <el-time-select
+                placeholder="起始时间"
+                v-model="equipContrlForm1.st"
+                value="05:00"
+                :picker-options="{
+                  start: '0:00',
+                  step: '1:00',
+                  end: '23:00',
+                }"
+              ></el-time-select>
+              <span style="margin: 0 10px">至</span>
+              <el-time-select
+                placeholder="结束时间"
+                v-model="equipContrlForm1.et"
+                :value="equipContrlForm1.et"
+                :picker-options="{
+                  start: '0:00',
+                  step: '1:00',
+                  end: '23:00',
+                }"
+              ></el-time-select>
+            </div>
+          </el-form-item>
+          <el-form-item label="数据频率(min):" prop="dat_f">
+            <div class="sliderParent">
+              <div class="block">
+                <el-slider
+                  :min="10"
+                  :max="60"
+                  v-model="equipContrlForm1.dat_f"
+                  show-input
+                ></el-slider>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item class="handAddFormBtn">
+            <el-button
+              type="blueInfo"
+              size="small"
+              @click="equipControlSubm(equipContrlForm1)"
+              >确定</el-button
+            >
+            <el-button type="grayInfo" size="small" @click="resetForm()"
+              >取消</el-button
+            >
+          </el-form-item>
+        </el-form>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+props: ["equipId", "equipType","d_id","model"],
+//import引入的组件需要注入到对象中才能使用
+components: {},
+data() {
+//这里存放数据
+return {
+  //设备控制I 型
+  equipContrlForm1: {
+    // st: '', //时控开始时间
+    // et: '', //时控结束时间
+    // dat_f: null ,//数据上传时间间隔
+    // ds:''//开关,1开机,0关机
+  },
+  //设备控制II 型
+  equipContrlForm2: {
+    pic_t: "", //定时拍照时刻
+    pic_f: "", //定时拍照时间间隔
+    dat_t: null, //数据上传时间间隔
+    turn_t: null, //定时转动沾虫板
+    ds: "", //开关,1开机,0关机
+  },
+  equipContrlForm22: "{}",
+};
+},
+//监听属性 类似于data概念
+computed: {},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+  //设备控制
+  EquipControl() {
+      this.$axios({
+        method: "POST",
+        url:"/api/api_gateway?method=forecast.send_control.device_control_info",
+        data: this.qs.stringify({ d_id:this.d_id, cmd: "paramconf" }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          if (res.data.data && Object.keys(res.data.data).length > 0) {
+            let data = res.data.data;
+            let obj = {
+              st: data.work_tim.st,
+              et: data.work_tim.et,
+              timctrl: data.work_tim.timctrl,
+              ds: data.power.ds,
+              dat_f: data.data_tim.dat_f,
+            };
+            obj.st =
+              obj.st && obj.st < 10 ? "0" + obj.st + ":00" : obj.st + ":00";
+            obj.et =
+              obj.et && obj.et < 10 ? "0" + obj.et + ":00" : obj.et + ":00";
+            if (this.model == 1) {
+              this.equipContrlForm1 = obj;
+              this.equipContrlForm22 = JSON.stringify(obj)
+            } else {
+              this.equipContrlForm2 = data;
+              this.equipContrlForm22 = JSON.stringify(data)
+            }
+          }
+        }
+      });
+    },
+  equipControlSubm(form) {
+      let newForm = Object.assign({}, form); //深拷贝
+      if(newForm.st){
+        newForm.st=newForm.st.slice(0, 2).charAt(0) != "0"
+          ? newForm.st.slice(0, 2)
+          : newForm.st.slice(1, 2);
+      }
+      if( newForm.st){
+       newForm.st =newForm.st.slice(0, 2).charAt(0) != "0"
+          ? newForm.st.slice(0, 2)
+          : newForm.st.slice(1, 2);
+      }
+      let obj = {
+        work_tim: { timctrl: newForm.timctrl, st: newForm.st, et: newForm.et },
+        data_tim: { dat_f: newForm.dat_f },
+        power: { ds: newForm.ds },
+      };
+      console.log(obj);
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=forecast.send_control.device_control",
+        data: this.qs.stringify({
+          device_type_id: 4,
+          d_id: this.d_id,
+          config: JSON.stringify(obj),
+        }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          this.$message.success("设备控制修改成功");
+        } else {
+          this.$message.error("设备控制修改失败");
+        }
+      });
+    },
+  resetForm() {
+    if(this.equipContrlForm22){
+      this.equipContrlForm1 = JSON.parse(this.equipContrlForm22);
+      this.equipContrlForm2 = JSON.parse(this.equipContrlForm22);
+    }else{
+      this.equipContrlForm1={
+        st: '', //时控开始时间
+        et: '', //时控结束时间
+        dat_f: null ,//数据上传时间间隔
+        ds:''//开关,1开机,0关机
+      }
+      this.equipContrlForm2={
+        pic_t: "", //定时拍照时刻
+        pic_f: "", //定时拍照时间间隔
+        dat_t: null, //数据上传时间间隔
+        turn_t: null, //定时转动沾虫板
+        ds: "", //开关,1开机,0关机
+      }
+    }
+  }
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+  this.EquipControl()
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.equipId{
+  line-height: 33px;
+  text-align: center;
+  background: #eee;
+}
+.handAddFormBtn{
+  margin-top: 20px;
+  text-align: right;
+}
+// 时间input框
+/deep/.el-date-editor.el-input, 
+/deep/.el-date-editor.el-input__inner{
+  width: 177px;
+}
+</style>

+ 538 - 0
src/pages/plantGuard/equipHistoryDate.vue

@@ -0,0 +1,538 @@
+<!-- 设备历史数据 -->
+<template>
+  <div class="equipInfo">
+    <DateSearch @dateChange="dateChange" @toggleSwitcState="toggleSwitcState"></DateSearch>
+    <div v-if="switcState">
+      <highcharts
+        :options="options"
+        v-if="Object.keys(options).length > 0"
+      ></highcharts>
+      <div class="noDataClass" v-else>暂无数据</div>
+    </div>
+    <div v-if="!switcState">
+      <el-table :data="tableData" stripe style="width: 100%">
+        <el-table-column
+          v-for="(item, index) in tableHeadTxt[equipType]"
+          :key="index"
+          :prop="item"
+          :label="equipState_dict[item].name+equipState_dict[item].unit"
+          :width="item=='addtime'?'170px':''"
+        >
+          <template slot-scope="scope">
+            <template v-if="equipState_dict[scope.column.property].value">
+              {{ equipState_dict[scope.column.property].value[scope.row.d_h_t[scope.column.property]] }}
+            </template>
+            <template v-else>
+              <template v-if="scope.column.property=='addtime'">
+                  {{ scope.row.d_h_t[scope.column.property]*1000|formatTime }}
+              </template>
+              <template v-else>
+                {{ scope.row.d_h_t[scope.column.property] }}
+              </template>
+            </template>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :total="total"
+        :current-page="queryInfo.page"
+        @current-change="changePage"
+      ></el-pagination>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+import HighCharts from "highcharts";
+import DateSearch from "@/components/highStand/timeSearch";
+import equipState_dict from './equipState_dict.json'
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  components: {
+    DateSearch
+  },
+  props: ["equipId", "equipType","d_id"],
+  data() {
+    //这里存放数据
+    return {
+      equipState_dict,
+      queryInfo:{
+        begin:"",
+        end:"",
+        page:1,
+      },
+      switcState:true,
+      options:{},
+      ChartData:[],
+      // 表格数据
+      total:0,
+      tableData:[],
+      // 动态表头
+      tableHeadTxt: {
+        "2":["ds", "ws", "tbs", "rps", "tps", "dps", "tt", "ct", "at", "ah", "cv", "bv","addtime"],
+        "3":["at","ah","hrt","rps","tps","lps","lamp","csq","current","vbat","addtime"],
+        "4":["proj","ds","ws","at","ah","cv","bv","cs","bs","infr_ct","csq","dver","addtime"],
+        "7":["ds","ws", "at", "ah", "set_temp", "pre_temp", "batStatus", "rps", "usb_sta", "csq", "dver", "addtime"],
+        // "7":["on_off", "at", "ah", "set_temp", "pre_temp", "batStatus", "rps", "usb_sta", "v_bat", "alti", "csq", "dver", "addtime"],
+      }
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+    // 设置hightcharts配置
+    refreshData() {
+      HighCharts.setOptions({
+        // 所有语言文字相关配置都设置在 lang 里
+        lang: {
+          resetZoom: "刷新",
+          resetZoomTitle: "重置缩放比例",
+        },
+      });
+    },
+    dateChange(data) {
+      this.queryInfo.begin = data.begin;
+      this.queryInfo.end = data.end;
+      this.queryInfo.page = 1;
+      this.getChartLine('chart','table');
+    },
+    toggleSwitcState(data){
+      this.switcState = data
+    },
+    optionFn(ChartData) {
+      return {
+        chart: {
+          zoomType: "x",
+        },
+        title: {
+          text: "",
+          align: "left",
+        },
+        lang: {
+          noData: "暂无数据",
+        },
+        noData: {
+          style: {
+            fontWeight: "bold",
+            fontSize: "15px",
+            color: "#303030",
+          },
+        },
+        xAxis: {
+          crosshair: true, //十字基准线
+          type: "datetime",
+          dateTimeLabelFormats: {
+            //根据时间间距X轴自动显示哪种格式
+            millisecond: "%H:%M:%S.%L",
+            second: "%H:%M:%S",
+            minute: "%H:%M",
+            hour: "%H:%M",
+            day: "%m-%d",
+            week: "%m-%d",
+            month: "%Y-%m",
+            year: "%Y",
+          },
+        },
+        yAxis: {
+          title: {
+            text: "",
+          },
+        },
+        legend: {
+          // layout: 'vertical',
+          align: "right",
+          verticalAlign: "top",
+        },
+        plotOptions: {
+          series: {
+            label: {
+              connectorAllowed: false,
+            },
+            pointStart: 2010,
+          },
+        },
+        series: ChartData,
+        // series: [
+        //   {
+        //     name: ChartData[0].name,
+        //     data: ChartData[0].dat,
+        //   },
+        //   {
+        //     name: ChartData[1].name,
+        //     data: ChartData[1].dat,
+        //   },
+        //   {
+        //     name: ChartData[2].name,
+        //     data: ChartData[2].dat,
+        //   },
+        // ],
+        colors: ["#00e29d", "#6cbbff", "#ff3f3f"],
+        credits: {
+          //去掉默认的highcharts.com
+          enabled: false,
+        },
+        tooltip: {
+          // crosshairs: true,
+          shared: true, //折线共享
+          headerFormat: "<b>{point.x:%Y-%m-%e %H:%M:%S}</b><br>",
+        },
+        responsive: {
+          rules: [
+            {
+              condition: {
+                maxWidth: 500,
+              },
+              chartOptions: {
+                legend: {
+                  layout: "horizontal",
+                  align: "center",
+                  verticalAlign: "bottom",
+                },
+              },
+            },
+          ],
+        },
+        previous:0
+      };
+    },
+    getChartLine(chart,table){
+      switch(this.equipType){
+        case 2:
+          console.log(123213123);
+          
+          if(chart){
+            this.ChartData = [
+              {
+                name: "温度(°C)",
+                data: [],
+              },
+              {
+                name: "湿度(%)",
+                data: [],
+              },
+              {
+                name: "击虫次数",
+                data: [],
+              },
+              {
+                name: "充电电压",
+                data: [],
+              },
+              {
+                name: "电池电压",
+                data: [],
+              },
+            ]
+            this.$axios({
+              method: "POST",
+              url: "/api/api_gateway?method=forecast.worm_lamp.device_polyline_data",
+              data: this.qs.stringify({
+                device_type_id: 2,
+                d_id: this.d_id,
+                start_time: this.queryInfo.begin,
+                end_time: this.queryInfo.end,
+              }),
+            }).then((res) => {
+              if (res.data.message == "" && res.data.data.length !== 0) {
+                var data = res.data.data;
+                for (let item of data) {
+                  this.ChartData[0].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.temperature),
+                  ]);
+                  this.ChartData[1].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.humidity),
+                  ]);
+                  this.ChartData[2].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.others.ct),
+                  ]);
+                  this.ChartData[3].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.others.cv/1000),
+                  ]);
+                    this.ChartData[4].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.others.bv/1000),
+                  ]);
+                }
+                this.$nextTick(()=>{
+                  console.log(this.ChartData)
+                  this.options = this.optionFn(this.ChartData);
+
+                })
+              }
+            });
+          }
+          if(table){
+            this.$axios({
+              method: "POST",
+              url: "/api/api_gateway?method=forecast.worm_lamp.device_history_data",
+              data: this.qs.stringify({
+                device_type_id: 2,
+                device_id: this.equipId,
+                start_time: this.queryInfo.begin,
+                end_time: this.queryInfo.end,
+                page: this.queryInfo.page,
+              }),
+            }).then((res) => {
+              if (res.data.message == "") {
+                this.total = res.data.data.counts;
+                var data = res.data.data.data;
+                this.tableData = [];
+                this.tableData = data
+              }
+            });
+          }
+          break;
+        case 3:
+          if(chart){
+            this.ChartData = [
+              {
+                name: "温度(°C)",
+                data: [],
+              },
+              {
+                name: "湿度(%)",
+                data: [],
+              },
+              {
+                name: "加热仓温度(°C)",
+                data: [],
+              },
+            ]
+            this.$axios({
+              method: "POST",
+              url: "/api/api_gateway?method=forecast.worm_lamp.device_polyline_data",
+              data: this.qs.stringify({
+                device_type_id: 3,
+                d_id: this.d_id,
+                start_time: this.queryInfo.begin,
+                end_time: this.queryInfo.end,
+              }),
+            }).then((res) => {
+              if (res.data.message == "" && res.data.data.length) {
+                var data = res.data.data;
+                for (let item of data) {
+                  this.ChartData[0].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.temperature),
+                  ]);
+                  this.ChartData[1].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.humidity),
+                  ]);
+                  this.ChartData[2].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.others),
+                  ]);
+                }
+                this.options = this.optionFn(this.ChartData);
+                // this.loadingInstance.close();
+              }else{
+                this.options = {}
+              }
+            });
+          }
+          if(table){
+            this.$axios({
+              method: "POST",
+              url: "/api/api_gateway?method=forecast.worm_lamp.device_history_data",
+              data: this.qs.stringify({
+                device_type_id: 3,
+                device_id: this.equipId,
+                start_time: this.queryInfo.begin,
+                end_time: this.queryInfo.end,
+                page: this.queryInfo.page,
+              }),
+            }).then((res) => {
+              if (res.data.message == "") {
+                this.total = res.data.data.counts;
+                var data = res.data.data.data;
+                this.tableData = [];
+                this.tableData = data
+              }
+            });
+          }
+          break;
+        case 4:
+          if(chart){
+            this.ChartData = [
+              {
+                name: "温度(°C)",
+                data: [],
+              },
+              {
+                name: "湿度(%)",
+                data: [],
+              },
+              // {
+              //   name: "红外计数值",
+              //   data: [],
+              // },
+              // {
+              //   name: "高压计数值",
+              //   data: [],
+              // },
+              // {
+              //   name: "cpu温度(°C)",
+              //   data: [],
+              // },
+            ]
+            this.$axios({
+              method: "POST",
+              url: "/api/api_gateway?method=forecast.worm_lamp.device_polyline_data",
+              data: this.qs.stringify({
+                device_type_id: 4,
+                d_id: this.d_id,
+                start_time: this.queryInfo.begin,
+                end_time: this.queryInfo.end,
+              }),
+            }).then((res) => {
+              if (res.data.message == "" && res.data.data.length > 0) {
+                var data = res.data.data;
+                for (let item of data) {
+                  this.ChartData[0].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.temperature),
+                  ]);
+                  this.ChartData[1].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.humidity),
+                  ]);
+                }
+                this.options = this.optionFn(this.ChartData);
+              }
+            });
+          }
+          if(table){
+            this.$axios({
+              method: "POST",
+              url: "/api/api_gateway?method=forecast.worm_lamp.device_history_data",
+              data: this.qs.stringify({
+                device_type_id: 4,
+                device_id: this.equipId,
+                start_time: this.queryInfo.begin,
+                end_time: this.queryInfo.end,
+                page: this.queryInfo.page,
+              }),
+            }).then((res) => {
+              if (res.data.message == "") {
+                this.total = res.data.data.counts;
+                var data = res.data.data.data;
+                this.tableData = [];
+                this.tableData = data
+              }
+            });
+          }
+          break;
+        case 7:
+          if(chart){
+            this.ChartData = [
+              {
+                name: "温度(°C)",
+                data: [],
+              },
+              {
+                name: "湿度(RH)",
+                data: [],
+              },
+              {
+                name: "保温仓温度(°C)",
+                data: [],
+              },
+            ]
+            this.$axios({
+              method: "POST",
+              url: "/api/api_gateway?method=forecast.worm_lamp.device_polyline_data",
+              data: this.qs.stringify({
+                device_type_id: 7,
+                d_id: this.d_id,
+                start_time: this.queryInfo.begin,
+                end_time: this.queryInfo.end,
+              }),
+            }).then((res) => {
+              if (res.data.message == "" && res.data.data.length !== 0) {
+                var data = res.data.data;
+                for (let item of data) {
+                  this.ChartData[0].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.temperature),
+                  ]);
+                  this.ChartData[1].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.humidity),
+                  ]);
+                  this.ChartData[2].data.unshift([
+                    item.addtime * 1000 + 8 * 3600000,
+                    Number(item.others),
+                  ]);
+                }
+                this.options = this.optionFn(this.ChartData);
+              }
+            });
+          }
+          if(table){
+            this.$axios({
+              method: "POST",
+              url: "/api/api_gateway?method=forecast.worm_lamp.device_history_data",
+              data: this.qs.stringify({
+                device_type_id: 7,
+                device_id: this.equipId,
+                start_time: this.queryInfo.begin,
+                end_time: this.queryInfo.end,
+                page: this.queryInfo.page,
+              }),
+            }).then((res) => {
+              if (res.data.message == "") {
+                this.total = res.data.data.counts;
+                var data = res.data.data.data;
+                this.tableData = [];
+                this.tableData = data
+              }
+            });
+          }
+          break;
+        default:
+          break;
+      }
+    },
+    //改变page
+    changePage(val) {
+      this.queryInfo.page = val;
+      this.getChartLine('','table');
+    },
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {
+    this.refreshData(); //设置hightcharts配置
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style scoped lang="less">
+// 暂无数据
+.noDataClass {
+  text-align: center;
+  font-size: 20px;
+  line-height: 250px;
+  color: rgb(122, 115, 115);
+}
+</style>

+ 307 - 0
src/pages/plantGuard/equipHistoryDateQxz.vue

@@ -0,0 +1,307 @@
+<!-- 气象站设备历史数据 -->
+<template>
+  <div class="equipInfo">
+    <DateSearch @dateChange="dateChange" @toggleSwitcState="toggleSwitcState"></DateSearch>
+    <div v-if="switcState">
+      <highcharts
+        :options="options"
+      ></highcharts>
+      <!-- <div class="noDataClass" v-else>暂无数据</div> -->
+    </div>
+    <div v-if="!switcState">
+      <el-table :data="hisData" stripe style="width: 100%">
+				<el-table-column
+					v-for="(item, index) in tableHead"
+					:key="index"
+					:width="item.property == 'date' ? '160px' : ''"
+					:label="item.label"
+					:prop="item.property"
+				>
+					<template slot-scope="scope">{{
+						scope.row[scope.column.property]
+					}}</template>
+				</el-table-column>
+			</el-table>
+			<el-pagination
+				background
+				layout="prev, pager, next"
+				:total="total"
+				:current-page="queryInfo.page"
+				@current-change="changePage"
+			></el-pagination>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+import HighCharts from "highcharts";
+import DateSearch from "@/components/highStand/timeSearch";
+import qxz_dict from './qxz_dict.json'
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  components: {
+    DateSearch
+  },
+  props: ["equipId", "equipType","d_id"],
+  data() {
+    //这里存放数据
+    return {
+      qxz_dict,
+      queryInfo:{
+        begin:"",
+        end:"",
+        page:1,
+      },
+      switcState:true,
+      options:{},
+      ChartData:[],
+      // 表格数据
+      total:0,
+      // 动态表头
+			tableHead: [],
+      hisData:[],
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+    // 设置hightcharts配置
+    refreshData() {
+      HighCharts.setOptions({
+        // 所有语言文字相关配置都设置在 lang 里
+        lang: {
+          resetZoom: "刷新",
+          resetZoomTitle: "重置缩放比例",
+        },
+      });
+    },
+    dateChange(data) {
+      this.queryInfo.begin = data.begin;
+      this.queryInfo.end = data.end;
+      this.queryInfo.page = 1;
+      this.getEchartsHisDataList();
+      this.getHisDataList();
+    },
+    optionFn(ChartData) {
+      return {
+        chart: {
+          zoomType: "x",
+        },
+        title: {
+          text: "",
+          align: "left",
+        },
+        lang: {
+          noData: "暂无数据",
+        },
+        noData: {
+          style: {
+            fontWeight: "bold",
+            fontSize: "15px",
+            color: "#303030",
+          },
+        },
+        xAxis: {
+          crosshair: true, //十字基准线
+          type: "datetime",
+          dateTimeLabelFormats: {
+            //根据时间间距X轴自动显示哪种格式
+            millisecond: "%H:%M:%S.%L",
+            second: "%H:%M:%S",
+            minute: "%H:%M",
+            hour: "%H:%M",
+            day: "%m-%d",
+            week: "%m-%d",
+            month: "%Y-%m",
+            year: "%Y",
+          },
+        },
+        yAxis: {
+          title: {
+            text: "",
+          },
+        },
+        legend: {
+          // layout: 'vertical',
+          align: "right",
+          verticalAlign: "top",
+        },
+        plotOptions: {
+          series: {
+            label: {
+              connectorAllowed: false,
+            },
+            pointStart: 2010,
+          },
+        },
+        series: ChartData,
+        credits: {
+          //去掉默认的highcharts.com
+          enabled: false,
+        },
+        tooltip: {
+          // crosshairs: true,
+          shared: true, //折线共享
+          headerFormat: "<b>{point.x:%Y-%m-%e %H:%M:%S}</b><br>",
+        },
+        responsive: {
+          rules: [
+            {
+              condition: {
+                maxWidth: 500,
+              },
+              chartOptions: {
+                legend: {
+                  layout: "horizontal",
+                  align: "center",
+                  verticalAlign: "bottom",
+                },
+              },
+            },
+          ],
+        },
+        previous:0
+      };
+    },
+    //获取图表历史数据
+		getEchartsHisDataList() {
+			this.$axios({
+				method: 'POST',
+				url: '/api/api_gateway?method=weather.weather.qxz_data_chart',
+				data: this.qs.stringify({
+					begin: this.queryInfo.begin,
+					end: this.queryInfo.end,
+					device_id: this.equipId
+				})
+			})
+				.then((res) => {
+					this.echartsFn(res.data.data)
+				})
+				.catch((err) => {
+					console.log(err)
+				})
+		},
+		echartsFn(data) {
+			let conf = data.conf
+			let eData = data.data
+      this.ChartData = []
+			if (conf && eData && eData.length > 0) {
+				for (let i in conf) {
+					if (conf[i]) {
+						//判断是否有值
+						this.ChartData.push({
+							key: i,
+							name: conf[i].split('#')[0],
+							unit: conf[i].split('#')[1],
+							data: []
+						})
+					}
+				}
+				for (let m of eData) {
+					//m是对象
+					for (let n in m.dat) {
+						//dat是对象 n是key
+						for (let j of this.ChartData) {
+							//j是对象
+							if (j.key == n && m.dat[n].split('#')[0] != '-99.99') {
+								j.data.push([
+									m.time * 1000 + 8 * 3600000,
+									Number(m.dat[n].split('#')[0])
+								])
+							}
+						}
+					}
+				}
+			} else {
+				this.ChartData = []
+      }
+      this.$nextTick(()=>{
+        this.options = this.optionFn(this.ChartData);
+      })
+
+		},
+    getHisDataList() {
+			this.$axios({
+				method: 'POST',
+				url: '/api/api_gateway?method=weather.weather.qxz_detail',
+				data: this.qs.stringify({
+					start_time: this.queryInfo.begin,
+					end_time: this.queryInfo.end,
+					page: this.queryInfo.page,
+					device_id: this.equipId
+				})
+			}).then((res) => {
+				this.total = Number(res.data.data.nums)
+				if (res.data.data.nums > 0) {
+					let arr1 = [{ label: '日期', property: 'date' }]
+					let arr2 = []
+					let conf = res.data.data.conf
+					let data = res.data.data.data
+					for (let i in conf) {
+						let obj = {}
+						if (conf[i]) {
+							let arr = conf[i].split('#')
+							obj.label = `${arr[0]}(${arr[1]})`
+							obj.property = i
+							arr1.push(obj)
+						}
+					}
+					this.tableHead = arr1
+					for (let item of data) {
+						let obj = {}
+						obj.date = this.formatTime(item.time * 1000)
+						for (let i1 in item.dat) {
+							if (item.dat[i1]) {
+								obj[i1] =
+									item.dat[i1].split('#')[0] == '-99.99'
+										? 'N/A'
+										: item.dat[i1].split('#')[0]
+							}
+						}
+						arr2.push(obj)
+					}
+					this.hisData = arr2
+				} else {
+					this.hisData = []
+				}
+			})
+    },
+    toggleSwitcState(data){
+      this.switcState = data
+    },
+    //改变page
+    changePage(val) {
+      this.queryInfo.page = val;
+      this.getHisDataList();
+    },
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {
+    this.refreshData(); //设置hightcharts配置
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style scoped lang="less">
+// 暂无数据
+.noDataClass {
+  text-align: center;
+  font-size: 20px;
+  line-height: 250px;
+  color: rgb(122, 115, 115);
+}
+</style>

+ 275 - 0
src/pages/plantGuard/equipInfo.vue

@@ -0,0 +1,275 @@
+<!-- 设备状态 -->
+<template>
+  <div class="equipInfo">
+    <div class="equipImg">
+      <img src="@/assets/images/newImg/12.jpg" alt="">
+      <p>设别类型:{{equipType|equipType}}</p>
+    </div>
+    <div class="equipMsg">
+      <div class="title">
+        <span></span>
+        <span>基础信息</span>
+      </div>
+      <div>设备ID:{{equipId}}</div>
+      <div>设备名称:{{info.device_name || '--'}}</div>
+      <div>在线状态:<span :class="[info.device_status?'online':'offline']">{{info.device_status?'在线':'离线'}}</span></div>
+      <template v-if="equipType==2">
+        <div>设备版本:{{info.dver_num || '--'}}</div>
+      </template>
+      <template v-if="equipType==3">
+        <div>设备版本:{{info.dver_num || '--'}}</div>
+      </template>
+      <template v-if="equipType==4">
+        <div>添加诱芯:
+          <span v-if="!lureShow">{{lure}}</span>
+          <span ref="upDateLure" v-if="lureShow">
+            <input type="text" v-model="editlure" placeholder="请输入监测害虫名称">
+            <i class="el-icon-edit controlIcon" @click="submitYx()"></i>
+            <i class="el-icon-edit controlIcon" @click="lureShow=false;editlure=lure"></i>
+          </span>
+          <i v-else class="el-icon-edit controlIcon" @click="changeLure()"></i>
+        </div>
+      </template>
+      <template v-if="equipType==5">
+        <div>电压:{{info.device_status || '--'}}V 信号强度:{{info.device_status || '--'}}</div>
+      </template>
+      <template v-if="equipType==7">
+        <div>载玻片、培养液更换:
+          <span v-if="!lureShow">{{lure}}</span>
+          <span ref="upDateLure" v-if="lureShow">
+            <input type="text" v-model="editlure" placeholder="请输入监测害虫名称">
+            <i class="el-icon-edit controlIcon" @click="submitYx()"></i>
+            <i class="el-icon-edit controlIcon" @click="lureShow=false;editlure=lure"></i>
+          </span>
+          <i v-else class="el-icon-edit controlIcon" @click="setTime()"></i>
+        </div>
+      </template>
+      <div>最新上报时间:{{info.status_time*1000|formatTime}} <span><i class="el-icon-refresh controlIcon" v-if="info.d_id"></i></span></div>
+      <div>设备定位:{{info.address || '--'}}</div>
+    </div>
+    <div class="equipState">
+      <slot name="equipStateInner"></slot>
+    </div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  components: {},
+  props: ["equipId", "equipType"],
+  data() {
+    //这里存放数据
+    return {
+      info:{},
+      editlure:"",
+      lure:"",
+      lureShow:false,
+      cultivate:"",
+      glass:""
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+    // 设备状态弹框
+    getEquipInfo(id, device_status) {
+      if(this.equipType==5){
+        this.$axios({
+          method: "POST",
+          url: "/api/api_gateway?method=weather.weather.qxz_page",
+          data: this.qs.stringify({
+            device_type_id: this.equipType,
+            device_id: id,
+            page: 1
+          })
+        }).then(res => {
+          if (res.data.message == "") {
+            if(res.data.data.counts == 0){
+              this.equipDataState=false;
+              this.equipData = {}
+            }else{
+              this.equipDataState = true;
+              this.equipData = res.data.data.ids[0]
+            }
+          }
+        });
+      }else{
+        this.$axios({
+          method: "POST",
+          url: "/api/api_gateway?method=forecast.worm_lamp.lamp_list",
+          data: this.qs.stringify({
+            device_type_id: this.equipType,
+            page_size: 1,
+            device_id: id,
+            page: 1
+          })
+        }).then(res => {
+          if (res.data.message == "") {
+            if(res.data.data.counts>0){
+              this.info = res.data.data.data[0]
+            }else{
+              this.info = {
+                address: "",
+                dver_num: "--",
+                device_status:0,
+                status_time: 0
+              }
+            }
+          }
+        });
+      }
+    },
+    // 添加诱芯
+    changeLure(){
+      this.addYx()
+      this.lureShow = !this.lureShow;
+    },
+    addYx() {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=device.device_manage.get_spore_time",
+        data: this.qs.stringify({
+          device_type_id: 4,
+          d_id:this.info.d_id,
+        }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          let data = res.data.data;
+          this.lure = data.decoy;
+        }
+      });
+    },
+    submitYx() {
+      if (!this.editlure) {
+        this.$message.warning("请填写诱芯名称");
+        return false
+      }
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=device.device_manage.updata_spore_time",
+        data: this.qs.stringify({
+          device_type_id: 4,
+          d_id: this.info.d_id,
+          decoy: this.editlure,
+        }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          this.$message.success("添加成功!");
+        } else {
+          this.$message.error(res.data.message);
+        }
+         this.changeLure();
+      });
+    },
+    // 载玻片、培养液
+    setTime(){
+      this.getSporeTime()
+    },
+    getSporeTime() {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=device.device_manage.get_spore_time",
+        data: this.qs.stringify({
+          device_type_id: this.equipType,
+          d_id:this.info.d_id,
+        }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          let data = res.data.data;
+          this.glass = data.glass_slide_time;
+          this.cultivate = data.cultivate_time;
+          var dat = {
+            glass:this.glass,
+            cultivate:this.cultivate,
+            d_id:this.info.d_id,
+          }
+          this.$emit('child-event',dat)
+        }
+      });
+    },
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {
+    this.getEquipInfo(this.equipId,this.equipType)
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style scoped lang="less">
+// 设备信息样式
+.equipInfo{
+  display: flex;
+  justify-content: space-around;
+  align-content: center;
+  .equipImg{
+    position: relative;
+    flex: 1;
+    img{
+      width: 100%;
+      height: 100%;
+      border: 1px solid #9c9c9c;
+      border-radius: 5px;
+    }
+    p{
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      line-height: 33px;
+      background: rgba(0,0,0,.5);
+      color: #eee;
+      text-align: center;
+      font-size: 12px;
+    }
+  }
+  .equipMsg{
+    width: 300px;
+    padding-left: 25px;
+    line-height: 24px;
+    color: #999;
+    font-size: 13px;
+    .title{
+      font-size: 14px;
+      color: #000;
+      span:nth-child(1){
+        vertical-align: middle;
+        display: inline-block;
+        border: 4px solid #0295ff;
+        margin-right: 2px;
+      }
+    }
+    >div{
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
+  .equipState{
+    flex: 1;
+  }
+}
+.online{
+  color: #0195ff;
+}
+.offline{
+  color: #ff0000;
+}
+.controlIcon{
+  color: #0195ff;
+  cursor: pointer;
+}
+</style>

+ 152 - 0
src/pages/plantGuard/equipState.vue

@@ -0,0 +1,152 @@
+<!-- 设备状态 -->
+<template>
+  <div class="tab-pane">
+    <!-- {{equipId}}-
+    {{equipType}} -->
+    <div class="list" v-if="equipDataState">
+      <div class="elementItem" v-for="(item,index) in showState[equipType]" :key="index">
+        <!-- {{equipState_dict[item]}} -->
+        <div>{{equipState_dict[item].name}}</div>
+        <template v-if="item=='tt'">
+          <template v-if="equipData.ts == 1">
+            <div class="elementValue" >{{equipData['st']}}-{{equipData['et']}}{{equipState_dict['et'].unit}}</div>
+          </template>
+          <template v-else>
+            <div class="elementValue" v-if="equipState_dict[item].value">{{equipState_dict[item].value[equipData[item]]}}</div>
+            <div class="elementValue" v-else >{{equipData[item]}}{{equipState_dict[item].unit}}</div>
+          </template>
+        </template>
+        <template v-else>
+          <template v-if="item=='addtime'">
+            <div class="elementValue" >{{equipData[item]*1000|formatTime}}</div>
+          </template>
+          <template v-else>
+            <div class="elementValue" v-if="equipState_dict[item].value">{{equipState_dict[item].value[equipData[item]]}}</div>
+            <div class="elementValue" v-else >{{equipData[item]}}{{equipState_dict[item].unit}}</div>
+          </template>
+          
+        </template>
+          
+      </div>
+    </div>
+    <div v-else class="empty">
+        <div>暂无数据</div>
+    </div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+import equipState_dict from './equipState_dict.json'
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  components: {},
+  props: ["equipId", "equipType"],
+  data() {
+    //这里存放数据
+    return {
+        equipState_dict,
+        showState: {
+            "2": ["ds","ws","tbs","rps","tps","dps","tt","ct","at","ah","cv","bv","csq","dver","addtime"],
+            "3": ["ds","ws","tt","hs","at","ah","upds","dnds","vbat","rps","tps","lps","lamp","csq","dver","addtime"],
+            "4": ["ds","ws","tt","hs","at","ah","upds","dnds","vbat","rps","tps","lps","lamp","csq","dver","addtime"],
+            "7": ["ds","at","ah","set_temp","pre_temp","bs","rps","usb_sta","vbat","csq","dver","addtime"],
+        },
+        equipData:{},
+        equipDataState:false
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+    // 设备状态弹框
+    equipStateSet(id, device_status) {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=forecast.worm_lamp.device_history_data",
+        data: this.qs.stringify({
+          device_type_id: this.equipType,
+          page_size: 1,
+          device_id: id,
+          page: 1
+        })
+      }).then(res => {
+        if (res.data.message == "") {
+          if(res.data.data.counts == 0){
+            this.equipDataState=false;
+            this.equipData = {}
+          }else{
+            this.equipDataState = true;
+            this.equipData = res.data.data.data[0].d_h_t
+            console.log(this.equipData);
+            console.log('this.equipData');
+            
+          }
+        }
+      });
+    }
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {
+    this.equipStateSet(this.equipId, this.equipType);
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style scoped lang="less">
+.tab-pane{
+    background: #f1faff;
+}
+.list {
+    display: flex;
+    justify-content: space-between;
+    flex-direction: row;
+    flex-wrap: wrap;
+    padding: 10px 7px 5px 7px;
+    .elementItem{
+        width: 33.3333%;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: space-between;
+        line-height: 36px;
+        border-left: 5px solid #f1faff;
+        border-right: 5px solid #f1faff;
+        margin-bottom: 10px;
+        padding: 0 9px;
+        font-size: 13px;
+        .elementValue{
+            color: #0195ff;
+        }
+    }
+    
+    .elementItem:nth-child(6n+1),
+    .elementItem:nth-child(6n+2),
+    .elementItem:nth-child(6n+3){
+        background: #f3f3f3;
+    }
+
+    .elementItem:nth-child(6n+4),
+    .elementItem:nth-child(6n+5),
+    .elementItem:nth-child(6n+6){
+        background: #e7f0f7;
+    }
+}
+.empty{
+  line-height: 100px;
+  text-align: center;
+  font-size: 14px;
+  color: #0195ff;
+}
+</style>

+ 172 - 0
src/pages/plantGuard/equipStateQxz.vue

@@ -0,0 +1,172 @@
+<!-- 气象站设备状态 -->
+<template>
+  <div class="tab-pane">
+    <div class="list">
+      <div class="elementItem" v-for="(item,index) in reaTimeStatusList" :key="index">
+        <div>{{item.e}}{{item.name}}</div>
+        <!-- <div>{{item.e}}{{item.name}}<i class="el-icon-refresh edit" @click="editName(item,index)"></i></div> -->
+        <div class="elementValue">{{item.num}}{{item.unit}}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  components: {},
+  props: ["equipId", "equipType"],
+  data() {
+    //这里存放数据
+    return {
+        reaTimeStatusList:[],
+        equipDataState:false
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+    // 设备状态弹框
+    equipStateSet(id, device_status) {
+      this.currImei = id;
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=weather.weather.qxz_status",
+        data: this.qs.stringify({
+          device_type_id: this.equipType,
+          page_size: 1,
+          device_id: id,
+          page: 1
+        })
+      }).then(res => {
+        if (res.data.message == "") {
+          console.log(res.data.data.counts)
+            let arr = new Array();
+            let conf = res.data.data.conf;
+            let dat = res.data.data.dat;
+            for (let i1 in conf) {
+              if (conf[i1]) {
+                let arr2 = conf[i1].split("#");
+                let obj = {};
+                obj.e = "e" + i1.slice(1);
+                obj.name = arr2[0];
+                obj.unit = arr2[1];
+                for (let i2 in dat) {
+                  if (i1 == i2) {
+                    let arr3 = dat[i2].split("#");
+                    obj.num = arr3[0] == "-99.99" ? "N/A" : arr3[0];
+                    obj.icon = arr3[1];
+                    arr.push(obj);
+                  }
+                }
+              }
+            }
+            arr = arr.sort((a, b) => {
+              return a.e.slice(2) - b.e.slice(2);
+            });
+            this.reaTimeStatusList = arr;
+
+          //   let data = res.data.data.data[0].d_h_t;
+          //   this.equipStateList[5].val = device_status == 0 ? "离线" : "在线";
+          //   for (let item in data) {
+          //     if (item == "ds") {
+          //       this.equipStateList[0].val = data[item] == 0 ? "关机" : "开机";
+          //     } else if (item == "ws") {
+          //       switch (data[item]) {
+          //         case 0:
+          //           this.equipStateList[1].val = "待机";
+          //           break;
+          //         case 1:
+          //           this.equipStateList[1].val = "工作";
+          //           break;
+          //         case 2:
+          //           this.equipStateList[1].val = "充电";
+          //           break;
+          //       }
+          //     } else if (item == "tt") {
+          //       this.equipStateList[2].val =
+          //         data[item] == 0 ? "常亮" : data[item];
+          //     } else if (item == "clt") {
+          //       this.equipStateList[3].val = data[item] / 60;
+          //     } else if (item == "tbs") {
+          //       this.equipStateList[4].val = data[item] == 0 ? "正常" : "保护";
+          //     } else if (item == "rps") {
+          //       this.equipStateList[6].val = data[item] == 0 ? "正常" : "保护";
+          //     }
+          //   }
+        }
+      });
+      // this.equipStateDialogVisible = true;
+    },
+    editName(item,index){
+      console.log(item)
+    }
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {
+    this.equipStateSet(this.equipId, this.equipType);
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style scoped lang="less">
+.tab-pane{
+    background: #f1faff;
+}
+.list {
+    display: flex;
+    justify-content: space-between;
+    flex-direction: row;
+    flex-wrap: wrap;
+    padding: 10px 7px 5px 7px;
+    .elementItem{
+        width: 33.3333%;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: space-between;
+        line-height: 36px;
+        border-left: 5px solid #f1faff;
+        border-right: 5px solid #f1faff;
+        margin-bottom: 10px;
+        padding: 0 9px;
+        font-size: 13px;
+        .elementValue{
+            color: #0195ff;
+        }
+        .edit{
+          cursor: pointer;
+        }
+    }
+    
+    .elementItem:nth-child(6n+1),
+    .elementItem:nth-child(6n+2),
+    .elementItem:nth-child(6n+3){
+        background: #f3f3f3;
+    }
+
+    .elementItem:nth-child(6n+4),
+    .elementItem:nth-child(6n+5),
+    .elementItem:nth-child(6n+6){
+        background: #e7f0f7;
+    }
+}
+.empty{
+  line-height: 100px;
+  text-align: center;
+  font-size: 14px;
+  color: #0195ff;
+}
+</style>

+ 426 - 0
src/pages/plantGuard/equipState_dict.json

@@ -0,0 +1,426 @@
+
+{   
+    "imei":{
+        "name":"设备ID",
+        "unit":"",
+        "desc":"通讯板唯一ID"
+    },
+    "iccid":{
+        "name":"物联网卡",
+        "unit":"",
+        "desc":"用于查询物联网卡的套餐、流量信息等"
+    },
+    "csq":{
+        "name":"信号强度",
+        "unit":"",
+        "desc":""
+    },
+    "lat":{
+        "name":"纬度",
+        "unit":"",
+        "desc":""
+    },
+    "lng":{
+        "name":"经度",
+        "unit":"",
+        "desc":""
+    },
+    "dtype":{
+        "name":"设备类型",
+        "unit":"",
+        "desc":""
+    },
+    "ws":{
+        "name":"工作状态",
+        "unit":"",
+        "value":{
+            "0":"待机",
+            "1":"工作",
+            "2":"工作"
+        },
+        "desc":"工作状态、0 待机, 1 工作"
+    },
+    "dver":{
+        "name":"设备版本",
+        "unit":"",
+        "desc":"设备固件版本"
+    },
+    "vbat":{
+        "name":"电压",
+        "unit":"V",
+        "desc":""
+    },
+    "st":{
+        "name":"开始时间",
+        "unit":"h",
+        "desc":"时控开始时间:0-23"
+    },
+    "et":{
+        "name":"结束时间",
+        "unit":"h",
+        "desc":"时控结束时间:0-23"
+    },
+    "tps":{
+        "name":"温控状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"保护"
+        },
+        "desc":"0-正常,1-保护"
+    },
+    "lps":{
+        "name":"光控状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"保护"
+        },
+        "desc":"0-正常,1-保护"
+    },
+    "rps":{
+        "name":"雨控状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"保护"
+        },
+        "desc":"0-正常,1-保护"
+    },
+    "dps":{
+        "name":"倾倒状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"保护"
+        },
+        "desc":"0-正常,1-保护"
+    },
+    "collt":{
+        "name":"收集时间",
+        "unit":"",
+        "desc":"收集时间:1-30"
+    },
+    "current":{
+        "name":"功率",
+        "unit":"mA",
+        "desc":"功率:单位mA"
+    },
+    "hrt":{
+        "name":"加热仓温度",
+        "unit":"°C",
+        "desc":"加热仓实时温度"
+    },
+    "hst":{
+        "name":"加热仓设定温度",
+        "unit":"°C",
+        "desc":"加热仓设定温度:70-130"
+    },
+    "at":{
+        "name":"环境温度",
+        "unit":"°C",
+        "desc":""
+    },
+    "ah":{
+        "name":"环境湿度",
+        "unit":"%RH",
+        "desc":""
+    },
+    "stamp":{
+        "name":"时间",
+        "unit":"",
+        "desc":""
+    },
+    "dat_f":{
+        "name":"数据上传间隔",
+        "unit":"",
+        "desc":"数据上传时间间隔"
+    },
+    "rcnt":{
+        "name":"开机次数",
+        "unit":"",
+        "desc":"每次重启加1"
+    },
+    "htim":{
+        "name":"加热时间",
+        "unit":"min",
+        "desc":"加热时间:1-30分钟"
+    },
+    "batStatus":{
+        "name":"电压状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"欠压"
+        },
+        "desc":"0-正常 1-欠压"
+    },
+    "tt":{
+        "name":"定时时长",
+        "unit":"h",
+        "desc":"定时时间1~10"
+    },
+    "shake":{
+        "name":"震动开关",
+        "unit":"",
+        "value":{
+            "0":"关闭",
+            "1":"开启"
+        },
+        "desc":"0-关,1-开"
+    },
+    "shake_sec":{
+        "name":"震动时间",
+        "unit":"ms",
+        "desc":"1~20(步长:100ms)"
+    },
+    "ts":{
+        "name":"定时模式",
+        "unit":"",
+        "value":{
+            "0":"光控",
+            "1":"时控"
+        },
+        "desc":"0-光控,1-时控"
+    },
+    "upds":{
+        "name":"上仓门状态",
+        "unit":"",
+        "value":{
+            "0":"关闭",
+            "1":"开启"
+        },
+        "desc":"1 打开,0 关闭"
+    },
+    "dnds":{
+        "name":"下仓门状态",
+        "unit":"",
+        "value":{
+            "0":"关闭",
+            "1":"开启"
+        },
+        "desc":"1 打开,0 关闭"
+    },
+    "lamp":{
+        "name":"灯管状态",
+        "unit":"",
+        "value":{
+            "0":"工作",
+            "1":"未工作"
+        },
+        "desc":"灯管/工作状态 0 工作 1未工"
+    },
+    "fuse_voltage":{
+        "name":"保险丝电压",
+        "unit":"V",
+        "desc":""
+    },
+    "ds":{
+        "name":"设备开关",
+        "unit":"",
+        "value":{
+            "0":"关机",
+            "1":"开机"
+        },
+        "desc":"0 关机  1 开机"
+    },
+    "bt":{
+        "name":"主板温度",
+        "unit":"°C",
+        "desc":""
+    },
+    "tcs":{
+        "name":"时控开关",
+        "unit":"",
+        "value":{
+            "0":"关机",
+            "1":"开机"
+        },
+        "desc":"0 关闭 1 开启"
+    },
+    "clt_t":{
+        "name":"清虫间隔",
+        "unit":"min",
+        "desc":"清虫时间间隔"
+    },
+    "gps":{
+        "name":"定位方式",
+        "unit":"",
+        "value":{
+            "0":"手动定位",
+            "1":"GPS 定位",
+            "2":"LBS 定位"
+        },
+        "desc":"0 手动定位 1 GPS 定位 2 LBS 定位"
+    },
+    "cv":{
+        "name":"充电电压",
+        "unit":"V",
+        "desc":"充电电压"
+    },
+    "bv":{
+        "name":"电池电压",
+        "unit":"V",
+        "desc":"电池电压"
+    },
+    "ct":{
+        "name":"电击次数",
+        "unit":"",
+        "desc":"电击次数 (最大255)"
+    },
+    "info":{
+        "name":"重启信息",
+        "unit":"",
+        "desc":"1正常 2 socket重连 3 MQTT重连"
+    },
+    "proj":{
+        "name":"设备型号",
+        "unit":"",
+        "desc":"性诱一型或者二型"
+    },
+    "btype":{
+        "name":"电池类型",
+        "unit":"",
+        "value":{
+            "0":"蓄电池",
+            "1":"锂电池"
+        },
+        "desc":"0 蓄电池,1锂电池"
+    },
+    "cs":{
+        "name":"充电状态",
+        "unit":"",
+        "value":{
+            "0":"充电中",
+            "1":"未充电"
+        },
+        "desc":"0非充电,1充电"
+    },
+    "bs":{
+        "name":"电池状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"欠压",
+            "2":"过压"
+        },
+        "desc":"0 正常,1欠压, 2过压"
+    },
+    "infr_ct":{
+        "name":"红外计数值",
+        "unit":"",
+        "desc":"性诱红外计数值"
+    },
+    "volt_ct":{
+        "name":"高压计数值",
+        "unit":"",
+        "desc":"性诱高压计数值"
+    },
+    "wind_drec":{
+        "name":"风向",
+        "unit":"",
+        "desc":"性诱风向"
+    },
+    "wind_sped":{
+        "name":"风速",
+        "unit":"",
+        "desc":"性诱风向"
+    },
+    "cold_sw":{
+        "name":"制冷开关",
+        "unit":"",
+        "value":{
+            "0":"关闭",
+            "1":"开启"
+        },
+        "desc":"制冷机开关 0 关闭, 1 开启"
+    },
+    "wind_sw":{
+        "name":"风机开关",
+        "unit":"",
+        "value":{
+            "0":"关闭",
+            "1":"开启"
+        },
+        "desc":"风机开关 0 关闭, 1 开启"
+    },
+    "pre_temp":{
+        "name":"保温仓温度",
+        "unit":"℃",
+        "desc":"保温仓当前温度-℃"
+    },
+    "set_temp":{
+        "name":"保温仓设定温度",
+        "unit":"℃",
+        "desc":"保温仓设定温度-℃"
+    },
+    "usb_sta":{
+        "name":"摄像头状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"异常"
+        },
+        "desc":"摄像头状态 0 正常, 1 异常"
+    },
+    "imgres":{
+        "name":"图片分辨率",
+        "unit":"",
+        "desc":"图片分辨率默认为7(最高)"
+    },
+    "staytime":{
+        "name":"已培养时间",
+        "unit":"h",
+        "desc":"已培养时间-小时"
+    },
+    "cul_time":{
+        "name":"孢子培养时间",
+        "unit":"h",
+        "desc":"孢子培养时间-小时"
+    },
+    "coll_time":{
+        "name":"收集时间",
+        "unit":"h",
+        "desc":"收集时间[8-10,14-16]"
+    },
+    "addtime":{
+        "name":"上报时间",
+        "unit":"",
+        "desc":"数据上报时间"
+    },
+    "hs":{
+        "name":"加热状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"加热"
+        },
+        "desc":"测报灯状态0 正常, 1 加热"
+    },
+
+    "clt":{
+        "name":"清虫间隔",
+        "unit":"min",
+        "desc":"清虫时间间隔"
+    },
+    "dattim":{
+        "name":"数据上传间隔",
+        "unit":"",
+        "desc":"数据上传时间间隔"
+    },
+    "datt":{
+        "name":"数据上传间隔",
+        "unit":"",
+        "desc":"数据上传时间间隔"
+    },
+    "tbs":{
+        "name":"灯管状态",
+        "unit":"",
+        "value":{
+            "0":"正常",
+            "1":"异常"
+        },
+        "desc":"数据上传时间间隔"
+    }
+    
+}

+ 645 - 14
src/pages/plantGuard/page1.vue

@@ -20,8 +20,230 @@
         <el-radio :label="1">卫星图</el-radio>
       </el-radio-group>
     </div>
-    <sidebar></sidebar>
-    <equip-list></equip-list>
+    <!-- tabs设备类型 -->
+    <div class="equipTypebox">
+      <div class="equipTypeBody">
+        <div class="equipTypeList">
+          <div v-for="(item,index) in equipType" @click="changeEquip(index,item)" @mouseover='mouseOve(index,item)' @mouseleave='mouseOut(index,item)' :key="item.type"  :class="[currSelectType==item.type?'active':'']" >{{item.name}}</div>
+        </div>
+        <div :style="'left:'+equipStyleLeft+'px'" class="equipHighLight"></div>
+      </div>
+    </div>
+    <!-- 控制 -->
+    <!-- <sidebar></sidebar> -->
+    <components :is="sidebarComponents" @sidebarClear="sidebarClear()" :equipId="queryInfo.equip_id" :d_id="queryInfo.d_id" :equipType='queryInfo.type' :model="queryInfo.model"></components>
+    <!-- 设备列表 -->
+    <equip-list>
+      <p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p>
+      <button @click="detailsShow == 3">ceshi</button>
+    </equip-list>
+    <!-- 杀虫灯数据框 -->
+    <transition
+        enter-active-class="animate__animated animate__zoomIn" 
+        leave-active-class="animate__animated animate__rotateOut"
+    >
+      <dialog-box v-if="detailsShow==2" width='800'>
+          <template v-slot:header>
+            <span class="dialog-title">杀虫灯数据框</span>
+            <button type="button" @click="detailsShow=''" class="dialog-headerbtn">
+              <i class="el-icon el-icon-close"></i>
+            </button>
+          </template>
+          <template v-slot:inner>
+            <equip-info :equipId="queryInfo.equip_id" :equipType='detailsShow'>
+              <template v-solt:equipStateInner></template>
+            </equip-info>
+            <div class="equipData">
+              <div class="more" @click="lookmore()">查看更多</div>
+              <template>
+                <el-tabs v-model="activeName" @tab-click="tabshandleClick">
+                  <el-tab-pane
+                    v-for="(pages, index) in pages['2']"
+                    v-bind:key="index"
+                    :label="pages.label"
+                    :name="pages.name"
+                  > 
+                    <!-- <keep-alive> -->
+                      <components :is="pages.name" :equipId="queryInfo.equip_id" :d_id="queryInfo.d_id" :equipType='detailsShow' v-if="pages.name == nowPage"></components>
+                    <!-- </keep-alive> -->
+                  </el-tab-pane>
+                </el-tabs>
+              </template>
+            </div>
+          </template>
+      </dialog-box>
+    </transition>
+    <!-- 测报灯数据框 -->
+    <transition
+        enter-active-class="animate__animated animate__zoomIn" 
+        leave-active-class="animate__animated animate__rotateOut"
+    >
+      <dialog-box v-if="detailsShow==3" width='800'>
+          <template v-slot:header>
+            <span class="dialog-title">测报灯数据框</span>
+            <button type="button" @click="detailsShow=''" class="dialog-headerbtn">
+              <i class="el-icon el-icon-close"></i>
+            </button>
+          </template>
+          <template v-slot:inner>
+            <equip-info :equipId="queryInfo.equip_id" :equipType='detailsShow'>
+              <template v-solt:equipStateInner></template>
+            </equip-info>
+            <div class="equipData">
+              <div class="more" @click="lookmore()">查看更多</div>
+              <template>
+                <el-tabs v-model="activeName" @tab-click="tabshandleClick">
+                  <el-tab-pane
+                    v-for="(pages, index) in pages['3']"
+                    v-bind:key="index"
+                    :label="pages.label"
+                    :name="pages.name"
+                  > 
+                    <keep-alive>
+                      <components :is="pages.name" :equipId="queryInfo.equip_id" :d_id="queryInfo.d_id" :equipType='detailsShow' v-if="pages.name == nowPage"></components>
+                    </keep-alive>
+                  </el-tab-pane>
+                </el-tabs>
+              </template>
+            </div>
+          </template>
+      </dialog-box>
+    </transition>
+    <!-- 性诱设备数据框 -->
+    <transition
+        enter-active-class="animate__animated animate__zoomIn" 
+        leave-active-class="animate__animated animate__rotateOut"
+    >
+      <dialog-box v-if="detailsShow==4" width='800'>
+          <template v-slot:header>
+            <span class="dialog-title">性诱设备数据框</span>
+            <button type="button" @click="detailsShow=''" class="dialog-headerbtn">
+              <i class="el-icon el-icon-close"></i>
+            </button>
+          </template>
+          <template v-slot:inner>
+            <equip-info :equipId="queryInfo.equip_id" :equipType='detailsShow'>
+              <template v-solt:equipStateInner></template>
+            </equip-info>
+            <div class="equipData">
+              <div class="more" @click="lookmore()">查看更多</div>
+              <template>
+                <el-tabs v-model="activeName" @tab-click="tabshandleClick">
+                  <el-tab-pane
+                    v-for="(pages, index) in pages['4']"
+                    v-bind:key="index"
+                    :label="pages.label"
+                    :name="pages.name"
+                  > 
+                    <keep-alive>
+                      <components :is="pages.name" :equipId="queryInfo.equip_id" :d_id="queryInfo.d_id" :equipType='detailsShow' v-if="pages.name == nowPage"></components>
+                    </keep-alive>
+                  </el-tab-pane>
+                </el-tabs>
+              </template>
+            </div>
+          </template>
+      </dialog-box>
+    </transition>
+    <!-- 气象站数据框 -->
+    <transition
+        enter-active-class="animate__animated animate__zoomIn" 
+        leave-active-class="animate__animated animate__rotateOut"
+    >
+      <dialog-box v-if="detailsShow==5" width='800'>
+          <template v-slot:header>
+            <span class="dialog-title">气象站数据框</span>
+            <button type="button" @click="detailsShow=''" class="dialog-headerbtn">
+              <i class="el-icon el-icon-close"></i>
+            </button>
+          </template>
+          <template v-slot:inner>
+            <equip-info :equipId='queryInfo.equip_id' :equipType='detailsShow'>
+              <template v-solt:equipStateInner></template>
+            </equip-info>
+            <div class="equipData">
+              <div class="more" @click="lookmore()">查看更多</div>
+              <template>
+                <el-tabs v-model="activeName" @tab-click="tabshandleClick">
+                  <el-tab-pane
+                    v-for="(pages, index) in pages['5']"
+                    v-bind:key="index"
+                    :label="pages.label"
+                    :name="pages.name"
+                  > 
+                    <keep-alive>
+                      <components :is="pages.name" :equipId="queryInfo.equip_id" :d_id="queryInfo.d_id" :equipType='detailsShow' v-if="pages.name == nowPage"></components>
+                    </keep-alive>
+                  </el-tab-pane>
+                </el-tabs>
+              </template>
+            </div>
+          </template>
+      </dialog-box>
+    </transition>
+    <!-- 孢子仪数据框 -->
+    <transition
+        enter-active-class="animate__animated animate__zoomIn" 
+        leave-active-class="animate__animated animate__rotateOut"
+    >
+      <dialog-box v-if="detailsShow==7" width='800'>
+          <template v-slot:header>
+            <span class="dialog-title">孢子仪数据框</span>
+            <button type="button" @click="detailsShow=''" class="dialog-headerbtn">
+              <i class="el-icon el-icon-close"></i>
+            </button>
+          </template>
+          <template v-slot:inner>
+            <equip-info @child-event="setTimeDialogShow" :equipId='queryInfo.equip_id' :equipType='detailsShow'>
+              <template v-solt:equipStateInner></template>
+            </equip-info>
+            <div class="equipData">
+              <div class="more" @click="lookmore()">查看更多</div>
+              <template>
+                <el-tabs v-model="activeName" @tab-click="tabshandleClick">
+                  <el-tab-pane
+                    v-for="(pages, index) in pages['7']"
+                    v-bind:key="index"
+                    :label="pages.label"
+                    :name="pages.name"
+                  > 
+                    <keep-alive>
+                      <components :is="pages.name" :equipId="queryInfo.equip_id" :d_id="queryInfo.d_id" :equipType='detailsShow' v-if="pages.name == nowPage"></components>
+                    </keep-alive>
+                  </el-tab-pane>
+                </el-tabs>
+              </template>
+            </div>
+          </template>
+      </dialog-box>
+    </transition>
+    <!-- 设置孢子仪载玻片、培养液更换时间配置弹框 -->
+    <el-dialog
+      title="配置(请及时填写)"
+      :visible.sync="setTimeDialogVisible"
+      width="420px"
+    >
+      <el-form ref="form" :model="time" label-width="130px">
+        <el-form-item label="载玻片更换时间: ">
+          <el-date-picker
+            v-model="time.time01"
+            type="date"
+            placeholder="选择日期"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="培养液更换时间: ">
+          <el-date-picker
+            v-model="time.time02"
+            type="date"
+            placeholder="选择日期"
+          ></el-date-picker>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="grayInfo" @click="setTimeDialogVisible = false">取 消</el-button>
+        <el-button type="blueInfo" @click="setTimeSubm()">确 定</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -32,28 +254,46 @@ import VueAMap from "vue-amap";
 let amapManager = new VueAMap.AMapManager();
 import sidebar from "@/components/highStand/sidebar"
 import equipList from "@/components/highStand/equipList"
+import { bd09togcj02,gcj02tobd09,wgs84togcj02,gcj02towgs84 } from "@/components/home/coordtransform_utils.js";  //纠偏方法
+import dialogBox from './dialogHollow' //地图镂空弹框 
+import equipState from './equipState' //设备状态
+import qxzEquipState from './equipStateQxz' //气象站设备状态
+import equipInfo from './equipInfo' //设备基础信息
+import equipHistoryDate from './equipHistoryDate' //设备历史数据
+import qxzEquipHistoryDate from './equipHistoryDateQxz' //气象站设备历史数据
+import twentyFourHistoryDate from './twentyFourHistoryDate' //气象站24小时数据
+import cbdPhoto from './cbdPhoto/cbdPhoto' //测报灯图片
 export default {
   //import引入的组件需要注入到对象中才能使用
   components: {
       sidebar,
-      equipList
+      equipList,
+      dialogBox,
+      equipState,
+      qxzEquipState,
+      equipInfo,
+      equipHistoryDate,
+      qxzEquipHistoryDate,
+      twentyFourHistoryDate,
+      cbdPhoto,
   },
   data() {
     //这里存放数据
     return {
+      sidebarComponents:'',
       amapManager,
       center: [120.298433, 31.680335],
       zoom: 6,
       mapType: 1,
       plugin: [
-        {
-          pName: "ToolBar",
-          events: {
-            init(instance) {
-              console.log(instance);
-            }
-          }
-        },
+        // {
+        //   pName: "ToolBar",
+        //   events: {
+        //     init(instance) {
+        //       console.log(instance);
+        //     }
+        //   }
+        // },
         {
           pName: "Scale",
           events: {
@@ -95,7 +335,168 @@ export default {
           o.add(this.xyzTileLayer);
           o.add(this.xyzTileLayer2);
         }
-      }
+      },
+      // tabs导航
+      equipType:[
+        {
+          type:'',
+          name:"全部",
+        },
+        {
+          type:7,
+          name:"孢子仪",
+        },
+        {
+          type:6,
+          name:"监控",
+        },
+        {
+          type:5,
+          name:"环境监测",
+        },
+        {
+          type:4,
+          name:"性诱设备",
+        },
+        {
+          type:3,
+          name:"虫情测报",
+        },
+        {
+          type:2,
+          name:"杀虫灯"
+        },
+      ],
+      currSelectType:0,
+      currSelectSite:0,
+      equipStyleLeft:0,
+      // 海量点样式表
+      equipPoints:[],
+      massMarks:null,
+      geocoder:null,
+      equipStyleObject:[
+        {
+          url: require("@/assets/images/home/mapView/scd.png"), // 设别类型0
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/scd.png"), // 设别类型1
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/scd.png"), // 设别类型2
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/cbd.png"), // 设别类型3
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/xyq.png"), // 设别类型4
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/qxz.png"), // 设别类型5
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/jk.png"), // 设别类型6
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/bzy.png"), // 设别类型7
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/bzy.png"), // 设别类型8
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+        {
+          url: require("@/assets/images/home/mapView/tccb.png"), // 设别类型9
+          size: new AMap.Size(25, 15), // 图标大小
+          anchor: new AMap.Pixel(5, 5) // 图标显示位置偏移量,基准点为图标左上角
+        },
+      ],
+      queryInfo:{
+        equip_id:"",
+        d_id:"",
+        type:"",
+        model:""
+      },
+      // 信息弹框
+      detailsShow:false,
+      // 孢子仪弹框
+      setTimeDialogVisible:false,
+      time:{
+        time01:"",
+        time02:"",
+      },
+      // 孢子仪配置载玻片时间did
+      currbzyGlass:"",
+      // 设备tabs标签
+      activeName: "equipState",
+      nowPage: "equipState",
+      pages:{
+        "2":[{
+          name:"equipState",
+          label:"实时状态",
+        },{
+          name:"equipHistoryDate",
+          label:"历史数据",
+        }],
+        "3":[{
+          name:"equipState",
+          label:"实时状态",
+        },
+        {
+          name:"cbdPhoto",
+          label:"查看图片",
+        },
+        {
+          name:"equipHistoryDate",
+          label:"历史数据",
+        },
+        // {
+        //   name:"equipState",
+        //   label:"害虫统计",
+        // }
+        ],
+        "4":[{
+          name:"equipState",
+          label:"实时状态",
+        },{
+          name:"equipHistoryDate",
+          label:"历史数据",
+        }],
+        "5":[{
+          name:"qxzEquipState",
+          label:"实时状态",
+        },{
+          name:"twentyFourHistoryDate",
+          label:"24小时数据",
+        },{
+          name:"qxzEquipHistoryDate",
+          label:"历史数据",
+        }],
+        "7":[{
+          name:"equipState",
+          label:"实时状态",
+        },{
+          name:"equipHistoryDate",
+          label:"历史数据",
+        }],
+      },
+      // 右侧控制
+      sidebarState:false,
     };
   },
   //监听属性 类似于data概念
@@ -104,7 +505,7 @@ export default {
   watch: {},
   //方法集合
   methods: {
-      changeMapType(val){
+    changeMapType(val){
       let o = amapManager.getMap();
       if(val==0){
         this.xyzTileLayer.hide()
@@ -114,11 +515,173 @@ export default {
         this.xyzTileLayer2.show()
       }
     },
+    changeEquip(index,item){
+      this.currSelectType = item.type;
+      this.currSelectSite = index;
+      this.detailsShow = ''
+      this.getEquipList(item.type)
+      console.log(item.type);
+      
+      this.activeName = this.pages[item.type][0].name
+      this.nowPage = this.pages[item.type][0].name
+    },
+    mouseOve(index,item){
+      this.equipStyleLeft = 80*index
+    },
+    mouseOut(index,item){
+      if(item.type!=this.currSelectType){
+        this.equipStyleLeft = 80*this.currSelectSite
+      }
+    },
+    iconFormat(equip_ip, item) {
+      switch (equip_ip + "") {
+        case "2":
+          item.icon = require("@/assets/images/home/mapView/scd.png");
+          break;
+        case "3":
+          item.icon = require("@/assets/images/home/mapView/cbd.png");
+          break;
+        case "4":
+          item.icon = require("@/assets/images/home/mapView/xyq.png");
+          break;
+        case "5":
+          item.icon = require("@/assets/images/home/mapView/qxz.png");
+          break;
+        case "6":
+          item.icon = require("@/assets/images/home/mapView/jk.png");
+          break;
+        case "7":
+          item.icon = require("@/assets/images/home/mapView/bzy.png");
+          break;
+        case "9":
+          item.icon = require("@/assets/images/home/mapView/tccb.png");
+          break;
+      }
+    },
+    getEquipList(type) {
+      this.componentMarker.position = []
+      if(this.infoWindow){
+        this.infoWindow.close()
+      }
+      let o = amapManager.getMap();
+      o.setZoom(4);
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=home.homes.equip_map_location",
+        data: this.qs.stringify({
+          equip_type: type,
+        })
+      }).then(res => {
+        if (res.data.message == "") {
+          let data = res.data.data;
+          this.equipShow = false;
+          this.equips = data.map(item => {
+            this.iconFormat(item.device_type_id, item);
+            item.style = item.device_type_id
+            if(item.gps_type == 1){ //GPS
+              console.log(wgs84togcj02)
+              item.lnglat = wgs84togcj02(item.lng,item.lat)
+            }else{
+              // this.lnglatFormat(item);
+            }
+            return item;
+          });
+          if(this.massMarks){
+            this.massMarks.clear()
+          }
+          console.log(this.equips)
+          this.massMarks = new AMap.MassMarks(this.equips, {
+            zIndex: 199, // 海量点图层叠加的顺序
+            zooms: [3, 19], // 在指定地图缩放级别范围内展示海量点图层
+            style: this.equipStyleObject // 设置样式对象
+          });
+          this.massMarks.setMap(o)
+          var _this = this
+          this.massMarks.on('click',e =>{
+            this.equipMarkerClick(e.data)
+            // this.openInfo(e.data)
+            console.log(e.data)
+          })
+
+          // this.equipPoints = []
+          // this.equips.forEach((item) =>{
+          //   this.equipPoints.push(new AMap.Marker({
+          //     position: item.lnglat
+          //   }))
+          // }) 
+          // this.$nextTick(()=>{
+          //   o.setFitView(this.equipPoints)
+          // })
+        } else {
+          this.$message.error(res.data.message);
+        }
+      });
+    },
+    equipMarkerClick(item) {
+      this.equipShow = true; //图标上设备信息框
+      this.equipsVisible = true; //右侧设备弹框
+      this.detailsShow = item.device_type_id; //右侧弹框根据不同设备类型,显示设备信息
+      this.currEquip = item;
+      this.queryInfo.equip_id = item.device_id
+      this.queryInfo.d_id = item.d_id
+      this.queryInfo.type = item.device_type_id
+      this.queryInfo.model = item.device_model
+      this.sidebarComponents = "" //siderbar为空
+    },
+     //载玻片、培养液更换时间展示
+    setTimeDialogShow(data){
+      this.setTimeDialogVisible = true;
+      this.time.time01 = data.glass
+      this.time.time02 = data.cultivate
+      this.currbzyGlass = data.d_id
+    },
+    //载玻片、培养液更换时间配置提交
+    setTimeSubm() {
+      let glass_slide_time = parseInt(
+        new Date(this.time.time01).getTime() / 1000
+      );
+      let cultivate_time = parseInt(
+        new Date(this.time.time02).getTime() / 1000
+      );
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=device.device_manage.updata_spore_time",
+        data: this.qs.stringify({
+          device_type_id: 7,
+          d_id: this.currbzyGlass,
+          glass_slide_time,
+          cultivate_time,
+        }),
+      }).then((res) => {
+        if (res.data.message == "") {
+          this.$message.success("修改成功!");
+        } else {
+          this.$message.error(res.data.message);
+        }
+        this.setTimeDialogVisible = false;
+      });
+    },
+    //tabs每次切换只渲染一个界面
+    tabshandleClick(tab) {
+      this.nowPage = tab.name;
+     
+    },
+    // 查看更多控制
+    lookmore(){
+      this.sidebarComponents = 'sidebar'
+      this.detailsShow=""
+    },
+    // 注销控制组件
+    sidebarClear(val){
+      this.sidebarComponents = ''
+    },
   },
   //生命周期 - 创建完成(可以访问当前this实例)
   created() {},
   //生命周期 - 挂载完成(可以访问DOM元素)
-  mounted() {},
+  mounted() {
+    // this.getEquipList('')
+  },
   beforeCreate() {}, //生命周期 - 创建之前
   beforeMount() {}, //生命周期 - 挂载之前
   beforeUpdate() {}, //生命周期 - 更新之前
@@ -144,4 +707,72 @@ export default {
         border-radius: 5px;
     }
 }
+// tabs设备类型
+.equipTypebox{
+  position: absolute;
+  left: 20px;
+  top:30px;
+  // background: #fff;
+  line-height: 32px;
+  border-radius: 20px;
+  .equipTypeBody{
+    position: relative;
+    z-index: 10;
+    background: #262a31;
+    border-radius: 43px;
+    color: #fff;
+    .equipTypeList{
+      position: relative;
+      z-index: 1;
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      >div{
+        width: 80px;
+        text-align: center;
+        border-radius: 20px;
+        cursor: pointer;
+      }
+      >div.active{
+        // background: #0195ff;
+        // color:#eee;
+      }
+      >div:hover{
+        // color: #eee;
+      }
+    }
+    .equipHighLight{
+      position: absolute;
+      top: 0;
+      height: 32px;
+      width: 80px;
+      border-radius: 20px;
+      background: #0195ff;
+      z-index: 0;
+      transition: all 1s;
+    }
+  }
+  
+}
+
+// 设备数据样式
+.equipData{
+  padding-top: 10px;
+  position: relative;
+  .more{
+    position: absolute;
+    right: 5px;
+    top: 20px;
+    z-index: 9999;
+    cursor: pointer;
+  }
+  .more:hover{
+    color: #0195ff;
+  }
+}
+// 弹框tabs样式覆盖
+/deep/.el-tabs__active-bar{
+  background-color: #0295ff;
+}
+
 </style>

File diff suppressed because it is too large
+ 35 - 112
src/pages/plantGuard/page2.vue


File diff suppressed because it is too large
+ 26 - 4
src/pages/plantGuard/page3.vue


+ 1 - 1
src/pages/plantGuard/page7.vue

@@ -190,7 +190,7 @@
             >
                <el-form ref="form" :model="adduserGroupForm" label-width="100px">
                   <el-form-item label="主题名称">
-                     <el-input v-model="adduserGroupForm.userGroupName"></el-input>
+                     <el-input required v-model="adduserGroupForm.userGroupName"></el-input>
                   </el-form-item>
                </el-form>
                <span slot="footer" class="dialog-footer">

+ 66 - 0
src/pages/plantGuard/qxz_dict.json

@@ -0,0 +1,66 @@
+{
+"100":["未定义"],
+"101":["101","大气温度","℃"],
+"102":["102","大气湿度","%RH"],
+"103":["103","模拟气压","hpa"],
+"104":["104","雨量","mm"],
+"105":["105","简易总辐射","w/㎡"],
+"106":["106","土壤温度","℃"],
+"107":["107","土壤湿度","%RH"],
+"108":["108","风速","m/s"],
+"109":["109","风向","°"],
+"110":["110","蒸发","mm"],
+"111":["111","雪量","mm"],
+"112":["112","照度","LUX"],
+"113":["113","日照时数","h"],
+"114":["114","光合","w/㎡"],
+"115":["115","雨量累计","mm"],
+"116":["116","辐射累计","MJ/㎡"],
+"117":["117","有无雨雪",""],
+"118":["118","噪声","分贝"],
+"119":["119","水位","cm"],
+"120":["120","二氧化碳","PPM"],
+"121":["121","曝辐量","cal/cm2"],
+"122":["122","液位","mm"],
+"123":["123","光合有效辐射","W/m2"],
+"124":["124","电压","V"],
+"125":["125","紫外线","w/㎡"],
+"126":["126","粉尘","ug/m3"],
+"127":["127","数字气压","hpa"],
+"128":["128","PH值",""],
+"129":["129","最大风速","m/s"],
+"130":["130","平均风速","m/s"],
+"131":["131","经度","°"],
+"132":["132","纬度","°"],
+"133":["133","海拔高度","m"],
+"134":["134","TBQ总辐射","W/m2"],
+"135":["135","直接辐射","W/m2"],
+"136":["136","散射辐射","W/m2"],
+"138":["138","紫外辐射","W/m2"],
+"139":["139","贴片温度","℃"],
+"140":["140","露点温度","℃"],
+"141":["141","一氧化碳","PPM"],
+"142":["142","电流","mA"],
+"143":["143","超声波风速","m/s"],
+"144":["144","水温","℃"],
+"145":["145","PM2.5","ug/m3"],
+"146":["146","PM10","ug/m3"],
+"147":["147","PH"," "],
+"148":["148","溶解氧","mg/l"],
+"149":["149","氨氮","mg/l"],
+"150":["150","电导率","mS/cm"],
+"151":["151","浊度","NTU"],
+"152":["152","能见度"," m"],
+"153":["153","氨气","ppm"],
+"154":["154","盐分","mg/L"],
+"155":["155","氮 N","mg/kg"],
+"156":["156","磷 P","mg/kg"],
+"157":["157","钾 K","mg/kg"],
+"158":["158","热通量","W/m2"],
+"159":["159","叶面温度","℃"],
+"160":["160","叶面湿度","%RH"],
+"161":["161","茎秆","cm"],
+"162":["162","负氧离子","个/cm3"],
+"208":["208","照度","Lux"],
+"211":["211","电导率","mS/cm"]
+}

+ 93 - 0
src/pages/plantGuard/twentyFourHistoryDate.vue

@@ -0,0 +1,93 @@
+<!-- 气象站24小时数据 -->
+<template>
+  <div class="equipInfo">
+    <div>
+		{{equipId}}
+      <el-table :data="data24" stripe style="width: 100%" :header-cell-style="{background:'#52b6ff',color:'#fff'}" >
+				<el-table-column prop="e" label="传感器通道"></el-table-column>
+				<el-table-column prop="name" label="通道名称"></el-table-column>
+				<el-table-column prop="min" label="最小值"></el-table-column>
+				<el-table-column prop="mintime" label="最小时间" width="180px">
+					<template v-if="scope.row.mintime" slot-scope="scope">{{
+						(scope.row.mintime * 1000) | formatTime
+					}}</template>
+				</el-table-column>
+				<el-table-column prop="max" label="最大值"></el-table-column>
+				<el-table-column prop="maxtime" label="最大时间" width="180px">
+					<template v-if="scope.row.maxtime" slot-scope="scope">{{
+						(scope.row.maxtime * 1000) | formatTime
+					}}</template>
+				</el-table-column>
+			</el-table>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+import equipState_dict from './equipState_dict.json'
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  components: {
+  },
+  props: ["equipId", "equipType","d_id"],
+  data() {
+    //这里存放数据
+    return {
+      data24: [],
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+    // 24小时数据
+		get24List(id) {
+			this.$axios({
+				method: 'POST',
+				url: '/api/api_gateway?method=weather.weather.qxz_day_data',
+				data: this.qs.stringify({ device_id: id })
+			}).then((res) => {
+				let arr = new Array()
+				let data = res.data.data.data
+				if (data && data.length > 0) {
+					for (let item of data) {
+						arr.push({
+							e: item.ekey,
+							name: item.enum[1],
+							min: item.min == '-99.99' ? 'N/A' : item.min,
+							mintime: item.mintime,
+							max: item.max == '-99.99' ? 'N/A' : item.max,
+							maxtime: item.maxtime
+						})
+					}
+					this.data24 = arr
+				}
+			})
+		}
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {
+    this.get24List(this.equipId)
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style scoped lang="less">
+// 暂无数据
+/deep/.el-table tr {
+ background-color: #ecf7ff;
+}
+</style>

+ 494 - 0
src/pages/plantGuard/warn/cbdMsgWarn.vue

@@ -0,0 +1,494 @@
+<!-- 测报灯短信预警 -->
+<template>
+  <div class=''>
+    <div class="equipId">设备ID:{{equipId}}</div>
+	<div class="innerBox">
+		<!-- 1 -->
+		<div class="category">
+			<div class="wormItem">
+				<div class="title">
+					<h2>害虫种类数预警</h2>
+					<el-switch
+						v-model="switch1"
+						active-color="#13ce66"
+						inactive-color="#dcdfe6"
+						@change="switch1Fun"
+					></el-switch>
+				</div>
+				<div class="hint">
+					每天害虫
+					<span>种类数量</span>达到此值时,短信预警
+				</div>
+				<div class="limitValBox">
+					<div>
+						<el-input
+							v-model="input1"
+							type="number"
+							ref="input"
+							placeholder="请填写害虫数量"
+							clearable
+							@change="input1ChangeFun"
+						></el-input>
+					</div>
+					
+				</div>
+			</div>
+		</div>
+		<!-- 2 -->
+		<div class="category second">
+			<div class="title">
+				<h2>指定害虫数量预警</h2>
+				<el-switch
+					v-model="switch2"
+					active-color="#13ce66"
+					inactive-color="#dcdfe6"
+					@change="switch2Fun"
+				></el-switch>
+			</div>
+			<div class="hint">
+				<div>
+					每天<span>指定害虫数</span>达到此数量时,短信预警
+				</div>
+				<div class="addworm">
+					<i class="el-icon-circle-plus-outline" @click="addWormKind"></i>
+				</div>
+			</div>
+			<div class="wormItem">
+				<div class="limitValBox">
+					<div class="limitWormItem">
+						<div class="limitWormItemBox" v-for="(item,index) in planKind" :key="index">
+							<el-select v-model="item.value" placeholder="请选择害虫种类">
+								<el-option v-for="num in cbdPestNum" :key="num" :label="cbdPest[num]" :value="num"></el-option>
+							</el-select>
+							<el-input
+								v-model="item.nums"
+								type="number"
+								placeholder="请填写害虫数量"
+								clearable
+								@change="wormNumFun2"
+							></el-input>
+							<i v-if="index!=0" class="el-icon-delete" @click="delWormKind(index)"></i>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		<!-- 3 -->
+		<div class="category">
+			<div class="title">
+				<h2>害虫数量总和预警</h2>
+				<el-switch
+					v-model="switch3"
+					active-color="#13ce66"
+					inactive-color="#dcdfe6"
+					@change="switch3Fun"
+				></el-switch>
+			</div>
+			<div class="hint">
+				每天害虫
+				<span>种类数量</span>达到此值时,短信预警
+			</div>
+			<div class="wormItem">
+				<div class="limitValBox">
+					<div>
+						<el-input
+							v-model="input3"
+							type="number"
+							ref="input3"
+							placeholder="请填写害虫数量"
+							clearable
+							@change="input3ChangeFun"
+						></el-input>
+					</div>
+				</div>
+			</div>
+		</div>
+		<!-- 4 -->
+		<div class="category">
+			<div class="title">
+				<h2>综合预警</h2>
+				<el-switch v-model="switch4" active-color="#13ce66" inactive-color="#dcdfe6"></el-switch>
+			</div>
+			<div class="hint">监测每天出现的害虫种类及数量,短信预警</div>
+			<div class="wormItem">
+			</div>
+		</div>
+		<!-- 5 -->
+		<div class="category">
+			<div class="title">
+				<h2>信息接收</h2>
+			</div>
+			<div class="wormItem">
+				<div class="limitValBox">
+					<div class="receptionPhone">
+						<el-input
+							v-model="input5"
+							ref="tel"
+							type="tel"
+							placeholder="请填写信息接收手机号"
+							clearable
+							@change="telRegular"
+						></el-input>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div class="subBtn">
+			<el-button type="blueInfo" @click="submitData()">提交</el-button>
+			<el-button type="grayInfo">重置</el-button>
+		</div>
+	</div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+import dict from '../../../../static/js/cbd_pest_library.js'
+
+export default {
+props: ["equipId", "equipType","d_id"],
+//import引入的组件需要注入到对象中才能使用
+components: {},
+data() {
+//这里存放数据
+return {
+  	switch1: false,
+	input1: '',
+	// 2
+	switch2: false,
+	input2: false,
+	cbdPest: dict,
+	cbdPestNum: 332,
+	planKind: [
+		{
+			label: '',
+			value: '',
+			nums: 0
+		},
+
+	],
+	// 3
+	switch3: false,
+	input3: '',
+	// 4
+	switch4: false,
+	// 5
+	input5: '',
+
+	value: true,
+	input: '',
+};
+},
+//监听属性 类似于data概念
+computed: {
+	// 计算属性的 getter
+	reversedMessage: function () {
+		// `this` 指向 vm 实例
+		var planKind = this.planKind
+		var len = this.planKind.length
+		for (var i = 0; i < len; i++) {
+			if (!(planKind[i].value && planKind[i].nums != 0)) {
+				return false
+			}
+			if (i == len - 1) {
+				return true
+			}
+		}
+	}
+},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+	// 提交数据
+	submitData() {
+		let that = this
+		var pestCategory = that.switch1 == true ? 'on' : 'off' //目标种类预警  pestCategory
+		var appointPest = that.switch2 == true ? 'on' : 'off' //指定害虫数量预警 appointPest
+		var pestTotal = that.switch3 == true ? 'on' : 'off' //害虫数量总和预警 pestTotal
+		var pestWarn = that.switch4 == true ? 'on' : 'off' //综合预警 pestWarn
+		console.log(that.planKind)
+		var plantName = []
+		var plantNums = []
+		var plantObj = {}
+		for (var i = 0; i < that.planKind.length; i++) {
+			plantName.push(that.planKind[i].value)
+			plantNums.push(that.planKind[i].nums)
+			plantObj['appointPestNum' + (i + 1)] = that.planKind[i].nums
+			plantObj['appointPestName' + (i + 1)] = that.planKind[i].value
+		}
+		plantObj['pestCategoryNum'] = that.input1 //目标种类预警
+		plantObj['pestTotalNum'] = that.input3 //害虫数量总和预警
+		plantObj['phone'] = that.input5 //信息接收
+		plantObj['appointPestName'] = plantName.join('#') //指定害虫数量预警
+		plantObj['appointPestNum'] = plantNums.join('#') //指定害虫数量预警
+		plantObj['pestCategory'] = pestCategory
+		plantObj['appointPest'] = appointPest
+		plantObj['pestTotal'] = pestTotal
+		plantObj['pestWarn'] = pestWarn
+
+		let postData = that.qs.stringify({
+			device_id: that.equipId,
+			conf: JSON.stringify(plantObj)
+		})
+
+		that
+			.$axios({
+				method: 'post',
+				url: '/api/api_gateway?method=forecast.forecast_system.cbd_msg_conf',
+				data: postData
+			})
+			.then((res) => {
+				if (res.data.data == true && res.data.message == '') {
+					that.$message({
+						showClose: true,
+						message: '设置成功',
+						type: 'success',
+						duration: 1500
+					})
+				} else {
+					that.$message({
+						showClose: true,
+						message: '设置失败',
+						type: 'error',
+						duration: 1500
+					})
+				}
+			})
+			.catch((err) => {
+				console.log(err)
+			})
+	},
+
+	// 请求数据返显
+	warningData() {
+		let that = this
+		let postData = that.qs.stringify({
+			device_id: that.$route.params.id,
+			conf: ''
+		})
+		that
+			.$axios({
+				method: 'post',
+				url: '/api/api_gateway?method=forecast.forecast_system.cbd_msg_conf',
+				data: postData
+			})
+			.then((res) => {
+				if (res.data.data !== null || res.data.data !== '') {
+					var redata = JSON.parse(res.data.data)
+					that.input1 = redata.pestCategoryNum //目标种类预警
+					that.input2 = redata.appointPestNum1 //指定害虫数量预警
+					that.input3 = redata.pestTotalNum //害虫数量总和预警
+					that.input5 = redata.phone //信息接收
+
+					that.planKind[0].nums = redata.appointPestNum1 //数量预警害虫数量
+					that.planKind[0].value = redata.appointPestName1 //数量预警害虫
+
+					that.switch1 = redata.pestCategory == 'on' ? true : false //目标种类预警
+					that.switch2 = redata.appointPest == 'on' ? true : false //指定害虫数量预警
+					that.switch3 = redata.pestTotal == 'on' ? true : false //害虫数量总和预警
+					that.switch4 = redata.pestWarn == 'on' ? true : false //综合预警
+
+					var val = redata.appointPestName
+					var nums = redata.appointPestNum
+					var arr = val.split('#')
+					var arrA = nums.split('#')
+					that.planKind = []
+					for (let i = 0; i < arr.length; i++) {
+						var obj = {}
+						obj['value'] = parseInt(arr[i])
+						obj['nums'] = arrA[i]
+						obj['label'] = ''
+						that.planKind.push(obj)
+					}
+				}
+			})
+			.catch((err) => {
+				console.log(err)
+			})
+	},
+
+	switch1Fun() {
+		console.log(this.switch1)
+		if (this.switch1 && !this.input1) {
+			this.$message({
+				message: '请将数据填写完整,再进行操作',
+				type: 'warning'
+			})
+			this.$refs.input.focus()
+			this.switch1 = false
+		}
+	},
+	input1ChangeFun() {
+		if (!this.input1) {
+			this.switch1 = false
+		}
+	},
+	// 2
+	addWormKind() {
+		var planKind = this.planKind
+		var len = this.planKind.length
+		for (var i = 0; i < len; i++) {
+			if (!(planKind[i].value && planKind[i].nums != 0)) {
+				this.$message({
+					message: '请将数据填写完整,再进行添加',
+					type: 'warning'
+				})
+				return false
+			}
+			if (i == len - 1) {
+				planKind.push({
+					label: '',
+					value: '',
+					nums: 0
+				})
+			}
+		}
+	},
+	delWormKind(index) {
+		var planKind = this.planKind
+		planKind.splice(index, 1)
+	},
+	switch2Fun() {
+		if (!this.reversedMessage) {
+			this.$message({
+				message: '请将数据填写完整,再进行操作',
+				type: 'warning'
+			})
+			this.switch2 = false
+		}
+	},
+	wormNumFun2() {
+		if (!this.reversedMessage) {
+			this.switch2 = false
+		}
+	},
+	// 3
+	switch3Fun() {
+		console.log(this.switch1)
+		if (this.switch3 && !this.input3) {
+			this.$message({
+				message: '请将数据填写完整,再进行操作',
+				type: 'warning'
+			})
+			this.$refs.input3.focus()
+			this.switch3 = false
+		}
+	},
+	input3ChangeFun() {
+		if (!this.input3) {
+			this.switch3 = false
+		}
+	},
+	// 5
+	telRegular() {
+		if (this.input5) {
+			if (!/^1[3456789]\d{9}$/.test(this.input5)) {
+				this.$message({
+					message: '手机号码有误,请重填',
+					type: 'warning'
+				})
+				this.$refs.tel.focus()
+				return false
+			}
+		}
+	},
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+	this.warningData()
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.equipId{
+  line-height: 33px;
+  text-align: center;
+  background: #eee;
+}
+.handAddFormBtn{
+  margin-top: 20px;
+  text-align: right;
+}
+// 时间input框
+/deep/.el-date-editor.el-input, 
+/deep/.el-date-editor.el-input__inner{
+  width: 177px;
+}
+// 预警样式
+.title{
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	h2{
+		padding-left: 10px;
+		border-left: 5px solid #0295ff;
+	}
+}
+
+.hint {
+	margin-left: 5px;
+	padding-left: 12px;
+	line-height: 40px;
+	font-size: 14px;
+	position: relative;
+	color: #606060;
+	span {
+		color: #000;
+		font-weight: bold;
+	}
+}
+.hint::before{
+	position: absolute;
+    content: "";
+    width: 7px;
+    height: 7px;
+    background: #0295ff;
+    left: 0;
+    top: 17px;
+}
+.second {
+	.hint{
+		display: flex;
+		justify-content: space-between;;
+	}
+}
+.second .el-select,/deep/.second .el-select .el-input{
+	width: 100%;
+}
+/deep/.second .el-input{
+	width: 90%;
+	margin-bottom: 10px;
+}
+.addworm{
+	i{
+		line-height: 40px;
+		font-size: 21px;
+		cursor: pointer;
+		color: #0295ff;
+	}
+}
+.el-icon-delete{
+	line-height: 40px;
+    font-size: 21px;
+    cursor: pointer;
+	color: #0295ff;
+	margin-left: 5px;
+}
+.subBtn{
+	text-align: right;
+	margin-top: 20px;
+}
+</style>

+ 180 - 0
src/pages/plantGuard/warn/qxzMsgWarn.vue

@@ -0,0 +1,180 @@
+<!-- 气象站短信预警 -->
+<template>
+  <div class=''>
+    <div class="equipId">设备ID:{{equipId}}</div>
+	<div>
+		<div>
+			<div class="title">预警手机号</div>
+			<div>
+				<el-input
+					v-model="tel"
+					type="number"
+					ref="input"
+					placeholder="请填写手机号"
+					clearable
+				></el-input>
+			</div>
+		</div>
+		<div v-for="item in data" :key="item[5]">
+			<div class="hint">
+				<span>{{item[0]}}</span>
+				{{item[1]}} ( {{item[4]}} )
+			</div>
+			<div>
+				<el-select v-model="item[2]" placeholder="请选择类型">
+					<el-option label="小于" value="0"></el-option>
+					<el-option label="大于" value="1"></el-option>
+				</el-select>
+				<el-input
+					v-model="item[3]"
+					type="number"
+					ref="input"
+					placeholder="请填写阈值"
+					clearable
+				></el-input>
+			</div>
+		</div>
+		<div class="subBtn">
+			<el-button type="blueInfo" @click="submitData()">提交</el-button>
+			<el-button type="grayInfo">重置</el-button>
+		</div>
+	</div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+//例如:import 《组件名称》 from '《组件路径》';
+
+export default {
+props: ["equipId", "equipType","d_id"],
+//import引入的组件需要注入到对象中才能使用
+components: {},
+data() {
+//这里存放数据
+return {
+	  data:[],
+	  tel:''
+};
+},
+//监听属性 类似于data概念
+computed: {
+
+},
+//监控data中的数据变化
+watch: {},
+//方法集合
+methods: {
+	getQxzAlarm(){
+		this.$axios({
+			method: "POST",
+			url: "/api/api_gateway?method=weather.weather.qxz_status",
+			data: this.qs.stringify({
+				device_id: this.equipId,
+			}),
+		}).then((res) => {
+			if (res.data.message == "") {
+				this.data = []
+				var alarm = {
+					dat:{
+						"e1":"1#2",
+						"e2":"0#20",
+						"e3":"1#2",
+						"e4":"1#2",
+						"e5":"0#2",
+						"e6":"1#2",
+						"e7":"1#2",
+						"e8":"1#2",
+						"e9":"1#2",
+					}
+				}
+				var conf = res.data.data.conf;
+				for(var key in conf){
+					if(conf[key]){
+						var ekey = parseInt(key.substring(1));
+						var txt = conf[key].split('#')[0];
+						var unit = conf[key].split('#')[1];
+						var way = alarm.dat[key].split('#')[0];
+						var val = alarm.dat[key].split('#')[1];
+						this.data.push([key,txt,way,val,unit,ekey])
+					}
+				}
+				this.data.sort((a,b)=>{
+					return a[5] - b[5];
+				})
+				console.log(this.data);
+				
+			} else {
+				this.$message.err("操作失败");
+			}
+		});
+	}
+},
+//生命周期 - 创建完成(可以访问当前this实例)
+created() {
+
+},
+//生命周期 - 挂载完成(可以访问DOM元素)
+mounted() {
+	this.getQxzAlarm()
+},
+beforeCreate() {}, //生命周期 - 创建之前
+beforeMount() {}, //生命周期 - 挂载之前
+beforeUpdate() {}, //生命周期 - 更新之前
+updated() {}, //生命周期 - 更新之后
+beforeDestroy() {}, //生命周期 - 销毁之前
+destroyed() {}, //生命周期 - 销毁完成
+activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+}
+</script>
+<style scoped lang="less">
+.equipId{
+  line-height: 33px;
+  text-align: center;
+  background: #eee;
+}
+.handAddFormBtn{
+  margin-top: 20px;
+  text-align: right;
+}
+.el-select{
+	width: 100%;
+	margin: 10px 0;
+}
+.hint {
+	line-height: 26px;
+	font-size: 14px;
+	position: relative;
+	color: #606060;
+	margin-top: 20px;
+	span {
+		color: #000;
+		font-weight: bold;
+		background: #0295ff;
+		// display: inline-block;
+		color: #fff;
+		border-radius: 50%;
+    	padding: 3px 4px;
+	}
+}
+.title{
+	position: relative;
+	margin-left: 5px;
+	padding-left: 12px;
+	font-size: 14px;
+	line-height: 41px;
+}
+.title::before{
+	position: absolute;
+    content: "";
+    width: 7px;
+    height: 7px;
+    background: #0295ff;
+    left: 0;
+    top: 17px;
+}
+.subBtn{
+	margin-top: 20px;
+	text-align: right;
+}
+</style>

+ 1 - 0
项目说明.txt

@@ -0,0 +1 @@
+高标准项目2.0