2 éve · 33b6ffbe4d
--- a/package-lock.json
+++ b/package-lock.json
@@ -17,6 +17,7 @@
 
				         "vue": "^2.6.11",
			
 
				         "vue-awesome-swiper": "^3.1.3",
			
 
				         "vue-router": "^3.2.0",
			
 
				+        "vue-seamless-scroll": "^1.1.23",
			
 
				         "vuex": "^3.4.0"
			
 
				       },
			
 
				       "devDependencies": {
			
@@ -4715,6 +4716,11 @@
 
				       "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
			
 
				       "dev": true
			
 
				     },
			
 
				+    "node_modules/comutils": {
			
 
				+      "version": "1.1.19",
			
 
				+      "resolved": "https://registry.npmmirror.com/comutils/-/comutils-1.1.19.tgz",
			
 
				+      "integrity": "sha512-JxXB67juILiwhdLwOsYyjUqwWEhHdObI0EClOPk+JDtEuTbac59s0pxGpfCBnNNQ5JommifmcMGneW/4Cg7YWw=="
			
 
				+    },
			
 
				     "node_modules/concat-map": {
			
 
				       "version": "0.0.1",
			
 
				       "resolved": "https://registry.npm.taobao.org/concat-map/download/concat-map-0.0.1.tgz",
			
@@ -14892,6 +14898,14 @@
 
				       "resolved": "https://registry.npmmirror.com/vue-router/download/vue-router-3.5.2.tgz?cache=0&sync_timestamp=1634663514839&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fvue-router%2Fdownload%2Fvue-router-3.5.2.tgz",
			
 
				       "integrity": "sha1-X1Xj8lGXDjbD6NiKfNLWejUK3lw="
			
 
				     },
			
 
				+    "node_modules/vue-seamless-scroll": {
			
 
				+      "version": "1.1.23",
			
 
				+      "resolved": "https://registry.npmmirror.com/vue-seamless-scroll/-/vue-seamless-scroll-1.1.23.tgz",
			
 
				+      "integrity": "sha512-HBjUub8WwsKJzbFCrwKPDrZn4e+SSbkKgwWtjKtfLwesiFGwSsVxP44/Z6d3kpXy94qIFOiflJH6l0/9pj7SGA==",
			
 
				+      "dependencies": {
			
 
				+        "comutils": "^1.1.9"
			
 
				+      }
			
 
				+    },
			
 
				     "node_modules/vue-style-loader": {
			
 
				       "version": "4.1.3",
			
 
				       "resolved": "https://registry.nlark.com/vue-style-loader/download/vue-style-loader-4.1.3.tgz",
			
@@ -19686,6 +19700,11 @@
 
				         }
			
 
				       }
			
 
				     },
			
 
				+    "comutils": {
			
 
				+      "version": "1.1.19",
			
 
				+      "resolved": "https://registry.npmmirror.com/comutils/-/comutils-1.1.19.tgz",
			
 
				+      "integrity": "sha512-JxXB67juILiwhdLwOsYyjUqwWEhHdObI0EClOPk+JDtEuTbac59s0pxGpfCBnNNQ5JommifmcMGneW/4Cg7YWw=="
			
 
				+    },
			
 
				     "concat-map": {
			
 
				       "version": "0.0.1",
			
 
				       "resolved": "https://registry.npm.taobao.org/concat-map/download/concat-map-0.0.1.tgz",
			
@@ -27904,6 +27923,14 @@
 
				       "resolved": "https://registry.npmmirror.com/vue-router/download/vue-router-3.5.2.tgz?cache=0&sync_timestamp=1634663514839&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fvue-router%2Fdownload%2Fvue-router-3.5.2.tgz",
			
 
				       "integrity": "sha1-X1Xj8lGXDjbD6NiKfNLWejUK3lw="
			
 
				     },
			
 
				+    "vue-seamless-scroll": {
			
 
				+      "version": "1.1.23",
			
 
				+      "resolved": "https://registry.npmmirror.com/vue-seamless-scroll/-/vue-seamless-scroll-1.1.23.tgz",
			
 
				+      "integrity": "sha512-HBjUub8WwsKJzbFCrwKPDrZn4e+SSbkKgwWtjKtfLwesiFGwSsVxP44/Z6d3kpXy94qIFOiflJH6l0/9pj7SGA==",
			
 
				+      "requires": {
			
 
				+        "comutils": "^1.1.9"
			
 
				+      }
			
 
				+    },
			
 
				     "vue-style-loader": {
			
 
				       "version": "4.1.3",
			
 
				       "resolved": "https://registry.nlark.com/vue-style-loader/download/vue-style-loader-4.1.3.tgz",
			
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
 
				     "vue": "^2.6.11",
			
 
				     "vue-awesome-swiper": "^3.1.3",
			
 
				     "vue-router": "^3.2.0",
			
 
				+    "vue-seamless-scroll": "^1.1.23",
			
 
				     "vuex": "^3.4.0"
			
 
				   },
			
 
				   "devDependencies": {
			
--- a/public/static/dahua/index.html
+++ b/public/static/dahua/index.html
@@ -1,35 +1,44 @@
 
				+<!--
			
 
				+ * @Author: your name
			
 
				+ * @Date: 2021-12-07 09:45:10
			
 
				+ * @LastEditTime: 2021-12-23 08:51:21
			
 
				+ * @LastEditors: your name
			
 
				+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
			
 
				+ * @FilePath: \hyyfClient\public\static\dahua\index.html
			
 
				+-->
			
 
				 <!DOCTYPE html>
			
 
				 <html lang="en">
			
 
				-<head>
			
 
				-    <meta charset="UTF-8">
			
 
				-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
			
 
				-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
			
 
				+  <head>
			
 
				+    <meta charset="UTF-8" />
			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
			
 
				+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
			
 
				     <title>Document</title>
			
 
				-    <link rel="stylesheet" href="./static/WSPlayer/player.css">
			
 
				+    <link rel="stylesheet" href="./static/WSPlayer/player.css" />
			
 
				     <script src="./static/jquery-3.6.0.min.js"></script>
			
 
				     <script src="./static/WSPlayer/PlayerControl.js"></script>
			
 
				-</head>
			
 
				-<body style="margin: 0; width: 100%; height: 100%">
			
 
				+  </head>
			
 
				+  <body style="margin: 0; width: 100%; height: 100%">
			
 
				     <div id="ws-record-player" style="width: 100%; height: 600px;"></div>
			
 
				-</body>
			
 
				-<script type="module">
			
 
				-  import WSPlayer from "./src/WSPlayer/WSPlayer.js";
			
 
				-  let recordPlayer = new WSPlayer({
			
 
				-    el: 'ws-record-player', // 必传
			
 
				-    type: 'record', // real | record
			
 
				-    serverIp: '36.26.62.70',
			
 
				-    num: 1,
			
 
				-    showControl: true,
			
 
				-  })
			
 
				-  let url = location.href;
			
 
				-  let rtsps = url.split('?')[1];
			
 
				-  let token = url.split('?')[2];
			
 
				-  let rtsp = rtsps + '?' + token;
			
 
				-  console.log(rtsp)
			
 
				-  recordPlayer.playRecord({
			
 
				-    rtspURL: rtsp, // String | Array[String] 可以传入多个rtsp地址，将会按照顺序在播放器中播放，最多播放四个
			
 
				-    decodeMode: 'canvas', // 解码方式， video|canvas 可以不传，自动识别，h264使用video播放，265使用canvas播放
			
 
				-    // wsURL: '' // 选择传递，默认播放器是连接服务器对应的websocket，但是也可以指定连接websocket地址
			
 
				-  })
			
 
				-</script>
			
 
				+  </body>
			
 
				+  <script type="module">
			
 
				+    import WSPlayer from "./src/WSPlayer/WSPlayer.js";
			
 
				+    let recordPlayer = new WSPlayer({
			
 
				+      el: "ws-record-player", // 必传
			
 
				+      type: "record", // real | record
			
 
				+      serverIp: "36.26.62.70",
			
 
				+      num: 1,
			
 
				+      showControl: true,
			
 
				+    });
			
 
				+    let url = location.href;
			
 
				+    let rtsps = url.split("?")[1];
			
 
				+    let token = url.split("?")[2];
			
 
				+    let rtsp = rtsps + "?" + token;
			
 
				+    setTimeout(() => {
			
 
				+      recordPlayer.playRecord({
			
 
				+        rtspURL: rtsp, // String | Array[String] 可以传入多个rtsp地址，将会按照顺序在播放器中播放，最多播放四个
			
 
				+        decodeMode: "canvas", // 解码方式， video|canvas 可以不传，自动识别，h264使用video播放，265使用canvas播放
			
 
				+        // wsURL: '' // 选择传递，默认播放器是连接服务器对应的websocket，但是也可以指定连接websocket地址
			
 
				+      });
			
 
				+    }, 2000)
			
 
				+  </script>
			
 
				 </html>
			
--- a/public/static/jinm/image/siagn.png
+++ b/public/static/jinm/image/siagn.png
--- a/public/static/jinm/index.html
+++ b/public/static/jinm/index.html
@@ -4,79 +4,78 @@
 
				     <meta charset="UTF-8">
			
 
				     <title>player</title>
			
 
				     <style>
			
 
				-      .sk-chase {
			
 
				-        width: 40px;
			
 
				-        height: 40px;
			
 
				-        position: absolute;
			
 
				-        top: 50%;
			
 
				-        left: 50%;
			
 
				-        transform: translate(-50%, -50%);
			
 
				-        display: block;
			
 
				-        animation: sk-chase 2.5s infinite linear both;
			
 
				-      }
			
 
				+        .sk-chase {
			
 
				+            width: 40px;
			
 
				+            height: 40px;
			
 
				+            position: absolute;
			
 
				+            top: 50%;
			
 
				+            left: 50%;
			
 
				+            transform: translate(-50%, -50%);
			
 
				+            display: block;
			
 
				+            animation: sk-chase 2.5s infinite linear both;
			
 
				+        }
			
 
				 
			
 
				-      .sk-chase-dot {
			
 
				-        width: 100%;
			
 
				-        height: 100%;
			
 
				-        position: absolute;
			
 
				-        left: 0;
			
 
				-        top: 0;
			
 
				-        animation: sk-chase-dot 2.0s infinite ease-in-out both;
			
 
				-      }
			
 
				+        .sk-chase-dot {
			
 
				+            width: 100%;
			
 
				+            height: 100%;
			
 
				+            position: absolute;
			
 
				+            left: 0;
			
 
				+            top: 0;
			
 
				+            animation: sk-chase-dot 2.0s infinite ease-in-out both;
			
 
				+        }
			
 
				 
			
 
				-      .sk-chase-dot:before {
			
 
				-        content: '';
			
 
				-        display: block;
			
 
				-        width: 25%;
			
 
				-        height: 25%;
			
 
				-        background-color: #8cc5ff;
			
 
				-        border-radius: 100%;
			
 
				-        animation: sk-chase-dot-before 2.0s infinite ease-in-out both;
			
 
				-      }
			
 
				+        .sk-chase-dot:before {
			
 
				+            content: '';
			
 
				+            display: block;
			
 
				+            width: 25%;
			
 
				+            height: 25%;
			
 
				+            background-color: #8cc5ff;
			
 
				+            border-radius: 100%;
			
 
				+            animation: sk-chase-dot-before 2.0s infinite ease-in-out both;
			
 
				+        }
			
 
				 
			
 
				-      .sk-chase-dot:nth-child(1) { animation-delay: -1.1s; }
			
 
				-      .sk-chase-dot:nth-child(2) { animation-delay: -1.0s; }
			
 
				-      .sk-chase-dot:nth-child(3) { animation-delay: -0.9s; }
			
 
				-      .sk-chase-dot:nth-child(4) { animation-delay: -0.8s; }
			
 
				-      .sk-chase-dot:nth-child(5) { animation-delay: -0.7s; }
			
 
				-      .sk-chase-dot:nth-child(6) { animation-delay: -0.6s; }
			
 
				-      .sk-chase-dot:nth-child(1):before { animation-delay: -1.1s; }
			
 
				-      .sk-chase-dot:nth-child(2):before { animation-delay: -1.0s; }
			
 
				-      .sk-chase-dot:nth-child(3):before { animation-delay: -0.9s; }
			
 
				-      .sk-chase-dot:nth-child(4):before { animation-delay: -0.8s; }
			
 
				-      .sk-chase-dot:nth-child(5):before { animation-delay: -0.7s; }
			
 
				-      .sk-chase-dot:nth-child(6):before { animation-delay: -0.6s; }
			
 
				+        .sk-chase-dot:nth-child(1) { animation-delay: -1.1s; }
			
 
				+        .sk-chase-dot:nth-child(2) { animation-delay: -1.0s; }
			
 
				+        .sk-chase-dot:nth-child(3) { animation-delay: -0.9s; }
			
 
				+        .sk-chase-dot:nth-child(4) { animation-delay: -0.8s; }
			
 
				+        .sk-chase-dot:nth-child(5) { animation-delay: -0.7s; }
			
 
				+        .sk-chase-dot:nth-child(6) { animation-delay: -0.6s; }
			
 
				+        .sk-chase-dot:nth-child(1):before { animation-delay: -1.1s; }
			
 
				+        .sk-chase-dot:nth-child(2):before { animation-delay: -1.0s; }
			
 
				+        .sk-chase-dot:nth-child(3):before { animation-delay: -0.9s; }
			
 
				+        .sk-chase-dot:nth-child(4):before { animation-delay: -0.8s; }
			
 
				+        .sk-chase-dot:nth-child(5):before { animation-delay: -0.7s; }
			
 
				+        .sk-chase-dot:nth-child(6):before { animation-delay: -0.6s; }
			
 
				 
			
 
				-      @keyframes sk-chase {
			
 
				-        100% { transform: rotate(360deg); }
			
 
				-      }
			
 
				+        @keyframes sk-chase {
			
 
				+            100% { transform: rotate(360deg); }
			
 
				+        }
			
 
				 
			
 
				-      @keyframes sk-chase-dot {
			
 
				-        80%, 100% { transform: rotate(360deg); }
			
 
				-      }
			
 
				+        @keyframes sk-chase-dot {
			
 
				+            80%, 100% { transform: rotate(360deg); }
			
 
				+        }
			
 
				 
			
 
				-      @keyframes sk-chase-dot-before {
			
 
				-        50% {
			
 
				-          transform: scale(0.4);
			
 
				-        } 100%, 0% {
			
 
				-            transform: scale(1.0);
			
 
				-          }
			
 
				-      }
			
 
				-      #error_text {
			
 
				-        width: 100%;
			
 
				-        height: 100%;
			
 
				-        text-align: center;
			
 
				-        display: none;
			
 
				-        position: absolute;
			
 
				-        top: 0;
			
 
				-        left: 0;
			
 
				-        font-size: 20px;
			
 
				-        font-weight: 600;
			
 
				-        background-color: #8cc5ff;
			
 
				-      }
			
 
				-      body::-webkit-scrollbar {
			
 
				-          display: none;
			
 
				-      }
			
 
				+        @keyframes sk-chase-dot-before {
			
 
				+            50% {
			
 
				+                transform: scale(0.4);
			
 
				+            } 100%, 0% {
			
 
				+                  transform: scale(1.0);
			
 
				+              }
			
 
				+        }
			
 
				+        #error_text {
			
 
				+            width: 170px;
			
 
				+            height: 170px;
			
 
				+            background: url("./image/siagn.png") no-repeat;
			
 
				+            background-size: 100%;
			
 
				+            position: absolute;
			
 
				+            top: 50%;
			
 
				+            left: 50%;
			
 
				+            transform: translate(-50%, -50%);
			
 
				+            display: none;
			
 
				+        }
			
 
				+        body::-webkit-scrollbar {
			
 
				+            display: none;
			
 
				+        }
			
 
				     </style>
			
 
				 </head>
			
 
				 <body style="margin: 0; width: 100%; text-align: center; z-index:999; background-color: transparent; overflow: hidden" >
			
@@ -91,7 +90,7 @@
 
				       <div class="sk-chase-dot"></div>
			
 
				       <div class="sk-chase-dot"></div>
			
 
				     </div>
			
 
				-    <div id="error_text" >服务器连接失败,请联系管理员</div>
			
 
				+    <div id="error_text" ></div>
			
 
				 </body>
			
 
				 <script type="module">
			
 
				     import Player from "./src/player.js";
			
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,15 +1,34 @@
 
				 <template>
			
 
				   <div id="app">
			
 
				-    <router-view/>
			
 
				+    <scale-box>
			
 
				+      <router-view/>
			
 
				+    </scale-box>
			
 
				   </div>
			
 
				 </template>
			
 
				+<script>
			
 
				+import ScaleBox from "@/components/ScaleBox";
			
 
				+export default {
			
 
				+  components: {
			
 
				+    ScaleBox
			
 
				+  }
			
 
				+}
			
 
				+</script>
			
 
				 
			
 
				 <style>
			
 
				+body {
			
 
				+  width: 100vw;
			
 
				+  height: 100vh;
			
 
				+}
			
 
				 #app {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  background: #11152B;
			
 
				   font-family: 'Xsh HeiTi', Avenir, Helvetica, Arial, sans-serif;
			
 
				   -webkit-font-smoothing: antialiased;
			
 
				   -moz-osx-font-smoothing: grayscale;
			
 
				   text-align: center;
			
 
				+  overflow: hidden;
			
 
				   /*color: #2c3e50;*/
			
 
				 }
			
 
				 
			
--- a/src/assets/104.png
+++ b/src/assets/104.png
--- a/src/assets/108.png
+++ b/src/assets/108.png
--- a/src/assets/111.png
+++ b/src/assets/111.png
--- a/src/assets/16433_Pig0001_iSpt.png
+++ b/src/assets/16433_Pig0001_iSpt.png
--- a/src/assets/222.png
+++ b/src/assets/222.png
--- a/src/assets/333.png
+++ b/src/assets/333.png
--- a/src/assets/444.png
+++ b/src/assets/444.png
--- a/src/assets/bottomBanner.png
+++ b/src/assets/bottomBanner.png
--- a/src/assets/fourActive.png
+++ b/src/assets/fourActive.png
--- a/src/assets/fourActiveNo.png
+++ b/src/assets/fourActiveNo.png
--- a/src/assets/full.png
+++ b/src/assets/full.png
--- a/src/assets/left-bg.e8acb7f0.png
+++ b/src/assets/left-bg.e8acb7f0.png
--- a/src/assets/noActive.png
+++ b/src/assets/noActive.png
--- a/src/assets/non.png
+++ b/src/assets/non.png
--- a/src/assets/on.png
+++ b/src/assets/on.png
--- a/src/assets/on1.png
+++ b/src/assets/on1.png
--- a/src/assets/oneActive.png
+++ b/src/assets/oneActive.png
--- a/src/assets/oneActiveNo.png
+++ b/src/assets/oneActiveNo.png
--- a/src/assets/shitu.png
+++ b/src/assets/shitu.png
--- a/src/assets/top_title.png
+++ b/src/assets/top_title.png
--- a/src/assets/u1.png
+++ b/src/assets/u1.png
--- a/src/assets/video.png
+++ b/src/assets/video.png
--- a/src/assets/xuan.png
+++ b/src/assets/xuan.png
--- a/src/components/ScaleBox.vue
+++ b/src/components/ScaleBox.vue
@@ -0,0 +1,40 @@
 
				+<template>
			
 
				+  <div class="scale-box" :style="{ transform: `scale(${scale}) translate(-50%, -50%)`}"><slot></slot></div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: "ScaleBox",
			
 
				+  data() {
			
 
				+    return {
			
 
				+      scale: '',
			
 
				+      width: 1920,
			
 
				+      height: 1080
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    init() {
			
 
				+      let ww = window.innerWidth / this.width;
			
 
				+      let wh = window.innerHeight / this.height;
			
 
				+      this.scale = ww < wh ? ww : wh
			
 
				+    }
			
 
				+  },
			
 
				+  mounted() {
			
 
				+    this.init();
			
 
				+    window.addEventListener('resize', this.init)
			
 
				+  }
			
 
				+}
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.scale-box {
			
 
				+  width: 1920px;
			
 
				+  height: 1080px;
			
 
				+  transform-origin: 0 0;
			
 
				+  position: absolute;
			
 
				+  left: 50%;
			
 
				+  top: 50%;
			
 
				+  transition: 0.3s;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+</style>
			
--- a/src/components/TimeButton.vue
+++ b/src/components/TimeButton.vue
@@ -0,0 +1,68 @@
 
				+<template>
			
 
				+  <div @click="jump" class="a-button" :style="{ height: height+ 'px' , lineHeight: height+ 'px'}">
			
 
				+    {{title}}
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: "TimeButton",
			
 
				+  props: {
			
 
				+    title: {
			
 
				+      type: String,
			
 
				+      default: () => '确认'
			
 
				+    },
			
 
				+    height: {
			
 
				+      type: Number,
			
 
				+      default: () => 40
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    jump() {
			
 
				+      this.$emit('onClick');
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+.a-button {
			
 
				+  position: relative;
			
 
				+  text-align: center;
			
 
				+  text-decoration: none;
			
 
				+  text-transform: uppercase;
			
 
				+  font-size: 14px;
			
 
				+  background: linear-gradient(to right, #03a9f4, #f441a5, #ffeb3b, #09a8f4);
			
 
				+  background-size: 400%;
			
 
				+  border-radius: 50px;
			
 
				+  z-index: 1;
			
 
				+  cursor: pointer;
			
 
				+  color: white;
			
 
				+}
			
 
				+.a-button::before {
			
 
				+  content: "";
			
 
				+  position: absolute;
			
 
				+  top: -5px;
			
 
				+  left: -5px;
			
 
				+  right: -5px;
			
 
				+  bottom: -5px;
			
 
				+  background: linear-gradient(to right, #03a9f4, #f441a5, #ffeb3b, #09a8f4);
			
 
				+  background-size: 400%;
			
 
				+  border-radius: 50px;
			
 
				+  z-index: -1;
			
 
				+  /* 设置模糊值 显示发光效果 */
			
 
				+  filter: blur(20px);
			
 
				+}
			
 
				+.a-button:hover{
			
 
				+  animation: streamer 8s infinite;
			
 
				+}
			
 
				+.a-button:hover::before{
			
 
				+  animation: streamer 8s infinite;
			
 
				+}
			
 
				+@keyframes streamer {
			
 
				+  100% {
			
 
				+  /*  背景位置 */
			
 
				+    background-position: -400% 0;
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/src/main.js
+++ b/src/main.js
@@ -10,13 +10,15 @@ import Vue from 'vue'
 
				 import App from './App.vue'
			
 
				 import router from './router'
			
 
				 import store from './store'
			
 
				-import 'lib-flexible/flexible'
			
 
				+// import 'lib-flexible/flexible'
			
 
				 import './assets/ttf/font.css';
			
 
				 import echart from 'echarts';
			
 
				 import { DatePicker, Row, Col, Select, Option, Icon, Input, Button, Message, Cascader, Loading, Avatar, Pagination, Table, TableColumn, Dialog, Switch, Empty, Tag } from 'element-ui';
			
 
				+import http from './utils/http'
			
 
				 
			
 
				 Vue.config.productionTip = false
			
 
				 Vue.prototype.$echarts = echart
			
 
				+Vue.prototype.$http = http
			
 
				 Vue.use(DatePicker)
			
 
				 Vue.use(Row)
			
 
				 Vue.use(Col)
			
@@ -25,7 +27,6 @@ Vue.use(Option)
 
				 Vue.use(Icon)
			
 
				 Vue.use(Input)
			
 
				 Vue.use(Button)
			
 
				-Vue.use(Message)
			
 
				 Vue.use(Cascader)
			
 
				 Vue.use(Loading)
			
 
				 Vue.use(Avatar)
			
--- a/src/router/ChildrenRoutes.js
+++ b/src/router/ChildrenRoutes.js
@@ -71,6 +71,15 @@ const childrenRouters = [
 
				       permission: 'monit',
			
 
				     }
			
 
				   },
			
 
				+  {
			
 
				+    path: '/crew',
			
 
				+    name: 'Crew',
			
 
				+    component: () => import('../views/Crew/Crew.vue'),
			
 
				+    meta: {
			
 
				+      title: 'AI人脸识别',
			
 
				+      permission: 'crew'
			
 
				+    }
			
 
				+  },
			
 
				 ];
			
 
				 
			
 
				 export default childrenRouters
			
--- a/src/utils/api.js
+++ b/src/utils/api.js
@@ -425,3 +425,19 @@ export function getDeviceList(params) {
 
				   })
			
 
				 }
			
 
				 
			
 
				+// 根据farmid 拿到 ai人脸识别的 数据
			
 
				+export function getAiUrl(params) {
			
 
				+  return axios({
			
 
				+    url: '/video/baseFace/list',
			
 
				+    method: 'get',
			
 
				+    params: params
			
 
				+  })
			
 
				+}
			
 
				+
			
 
				+export function getVideoLsitAndCamera(data) {
			
 
				+  return axios({
			
 
				+    url: '/video/cameraFunction/lsitAndCamera',
			
 
				+    method: 'get',
			
 
				+    params: data
			
 
				+  })
			
 
				+}
			
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -19,6 +19,27 @@ export function timeDate(timestamp) {
 
				   return Y + M + D
			
 
				 }
			
 
				 
			
 
				+// 拿到月份加日期
			
 
				+export function MonthDate (timestamp) {
			
 
				+  var date = new Date(timestamp)
			
 
				+  var M = (date.getMonth() + 1) < 10 ? '0' + (date.getMonth() + 1) + '-' : (date.getMonth() + 1) + '-'
			
 
				+  var D = date.getDate() < 10 ? '0' + date.getDate() + ' ' : date.getDate()
			
 
				+  return  M + D
			
 
				+}
			
 
				+
			
 
				+// 使用es6的padStart()方法来补0
			
 
				+export function getYMDHMS (timestamp) {
			
 
				+  let time = new Date(timestamp)
			
 
				+  let year = time.getFullYear()
			
 
				+  const month = (time.getMonth() + 1).toString().padStart(2, '0')
			
 
				+  const date = (time.getDate()).toString().padStart(2, '0')
			
 
				+  const hours = (time.getHours()).toString().padStart(2, '0')
			
 
				+  const minute = (time.getMinutes()).toString().padStart(2, '0')
			
 
				+  const second = (time.getSeconds()).toString().padStart(2, '0')
			
 
				+
			
 
				+  return year + '-' + month + '-' + date + ' ' + hours + ':' + minute + ':' + second
			
 
				+}
			
 
				+
			
 
				 /**
			
 
				  * 函数防抖 (只执行最后一次点击)
			
 
				  */
			
--- a/src/views/Alarm/Alarm.vue
+++ b/src/views/Alarm/Alarm.vue
@@ -27,7 +27,8 @@
 
				             <div class="alarm-title-right"></div>
			
 
				           </div>
			
 
				           <div class="alarm-content">
			
 
				-            <alarm-bar :barData="list" @setOpen="setRank"></alarm-bar>
			
 
				+<!--            <alarm-bar :barData="list" @setOpen="setRank"></alarm-bar>-->
			
 
				+            <alarm-bar :barData="list"></alarm-bar>
			
 
				           </div>
			
 
				         </div>
			
 
				       </div>
			
@@ -38,42 +39,43 @@
 
				           <div class="alarm-title-right"></div>
			
 
				         </div>
			
 
				         <div class="alarm-content">
			
 
				+          <iframe :src="'static/jinm/index.html?'+'1'+','+ ballWs +','+ ballRtsp + ',' +'100%' + ',' + '0'" style="width: 100%; height: 100%;" frameborder="0"  allowfullscreen="true"></iframe>
			
 
				 <!--          <img src="../../assets/Alarm/111.png" width="100%" alt="">-->
			
 
				-          <canvas id="canvas" width="910" height="504"></canvas>
			
 
				-          <div class="bubble yufeishe" v-show="num === 1 && button1%2!==0" >
			
 
				-            <p>育肥舍</p>
			
 
				-            <p>育肥猪2457头</p>
			
 
				-            <p>在舍人数：7人</p>
			
 
				-            <p>温度：27.4℃</p>
			
 
				-          </div>
			
 
				-          <div class="bubble baoyushe" v-show="num === 1 && button1%2!==0">
			
 
				-            <p>保育舍</p>
			
 
				-            <p>保育猪2457头</p>
			
 
				-            <p>在舍人数：7人</p>
			
 
				-            <p>温度：27.4℃</p>
			
 
				-          </div>
			
 
				-          <div class="bubble gelishe" v-show="num === 1 && button1%2!==0">
			
 
				-            <p>隔离舍</p>
			
 
				-            <p>隔离猪2457头</p>
			
 
				-            <p>在舍人数：7人</p>
			
 
				-            <p>温度：27.4℃</p>
			
 
				-          </div>
			
 
				-          <div class="bubble shenghuo" v-show="num === 2 && button2%2!==0">
			
 
				-            <p>生活区</p>
			
 
				-            <p>在舍人数：7人</p>
			
 
				-            <p>温度：27.4℃</p>
			
 
				-          </div>
			
 
				-          <div class="bubble huanbao" v-show="num === 3 && button3%2!==0">
			
 
				-            <p>环保区</p>
			
 
				-            <p>氨氮：2.35mg/L</p>
			
 
				-            <p>流量：154T</p>
			
 
				-            <p>人员：1人</p>
			
 
				-          </div>
			
 
				-          <div class="bubble shui" v-show="num === 4 && button4%2!==0">
			
 
				-            <p>水泵房</p>
			
 
				-            <p>水压：1.2kpa</p>
			
 
				-            <p>用水量：154吨</p>
			
 
				-          </div>
			
 
				+<!--          <canvas id="canvas" width="910" height="504"></canvas>-->
			
 
				+<!--          <div class="bubble yufeishe" v-show="num === 1 && button1%2!==0" >-->
			
 
				+<!--            <p>育肥舍</p>-->
			
 
				+<!--            <p>育肥猪2457头</p>-->
			
 
				+<!--            <p>在舍人数：7人</p>-->
			
 
				+<!--            <p>温度：27.4℃</p>-->
			
 
				+<!--          </div>-->
			
 
				+<!--          <div class="bubble baoyushe" v-show="num === 1 && button1%2!==0">-->
			
 
				+<!--            <p>保育舍</p>-->
			
 
				+<!--            <p>保育猪2457头</p>-->
			
 
				+<!--            <p>在舍人数：7人</p>-->
			
 
				+<!--            <p>温度：27.4℃</p>-->
			
 
				+<!--          </div>-->
			
 
				+<!--          <div class="bubble gelishe" v-show="num === 1 && button1%2!==0">-->
			
 
				+<!--            <p>隔离舍</p>-->
			
 
				+<!--            <p>隔离猪2457头</p>-->
			
 
				+<!--            <p>在舍人数：7人</p>-->
			
 
				+<!--            <p>温度：27.4℃</p>-->
			
 
				+<!--          </div>-->
			
 
				+<!--          <div class="bubble shenghuo" v-show="num === 2 && button2%2!==0">-->
			
 
				+<!--            <p>生活区</p>-->
			
 
				+<!--            <p>在舍人数：7人</p>-->
			
 
				+<!--            <p>温度：27.4℃</p>-->
			
 
				+<!--          </div>-->
			
 
				+<!--          <div class="bubble huanbao" v-show="num === 3 && button3%2!==0">-->
			
 
				+<!--            <p>环保区</p>-->
			
 
				+<!--            <p>氨氮：2.35mg/L</p>-->
			
 
				+<!--            <p>流量：154T</p>-->
			
 
				+<!--            <p>人员：1人</p>-->
			
 
				+<!--          </div>-->
			
 
				+<!--          <div class="bubble shui" v-show="num === 4 && button4%2!==0">-->
			
 
				+<!--            <p>水泵房</p>-->
			
 
				+<!--            <p>水压：1.2kpa</p>-->
			
 
				+<!--            <p>用水量：154吨</p>-->
			
 
				+<!--          </div>-->
			
 
				         </div>
			
 
				       </div>
			
 
				       <div class="alarm-top-left">
			
@@ -87,7 +89,8 @@
 
				             <div class="alarm-title-right"></div>
			
 
				           </div>
			
 
				           <div class="alarm-content">
			
 
				-            <alarm-pie v-if="pieData.length > 0" :id="'1'" :text="'近7日事件总量'" :pieData="pieData" @setOpen="openEvent"></alarm-pie>
			
 
				+<!--            <alarm-pie v-if="pieData.length > 0" :id="'1'" :text="'近7日事件总量'" :pieData="pieData" @setOpen="openEvent"></alarm-pie>-->
			
 
				+            <alarm-pie v-if="pieData.length > 0" :id="'1'" :text="'近7日事件总量'" :pieData="pieData"></alarm-pie>
			
 
				 <!--            <chart-pie v-if="pieData.length > 0" :text="'近7日事件总量'" :id="'1'" :data="pieData"></chart-pie>-->
			
 
				             <div v-else style="line-height: 250px; text-align: center; width: 100%; font-size: 18px; color: white;">暂无数据</div>
			
 
				           </div>
			
@@ -102,7 +105,8 @@
 
				             <div class="alarm-title-right"></div>
			
 
				           </div>
			
 
				           <div class="alarm-content">
			
 
				-            <alarm-bar v-if="barData.salvProValue.length > 0" :bar-data="barData" @setOpen="openEvent"></alarm-bar>
			
 
				+<!--            <alarm-bar v-if="barData.salvProValue.length > 0" :bar-data="barData" @setOpen="openEvent"></alarm-bar>-->
			
 
				+            <alarm-bar v-if="barData.salvProValue.length > 0" :bar-data="barData"></alarm-bar>
			
 
				             <div v-else style="line-height: 250px; text-align: center; width: 100%; font-size: 18px; color: white;">暂无数据</div>
			
 
				           </div>
			
 
				         </div>
			
@@ -234,7 +238,7 @@
 
				               <new-table  :title="'报警列表'" :list-data="listItem" :height="650" :table-items="tableItem">
			
 
				               </new-table>
			
 
				               <div @click.stop>
			
 
				-                <table-footer :totals="total" :size="pageSize" @sizeChange="sizeChange" @pageChange="pageChange"></table-footer>
			
 
				+<!--                <table-footer :totals="total" :size="pageSize" @sizeChange="sizeChange" @pageChange="pageChange"></table-footer>-->
			
 
				               </div>
			
 
				             </template>
			
 
				             <template v-else>
			
@@ -388,7 +392,7 @@ import AlarmBar from "@/views/Alarm/chart/AlarmBar";
 
				 import AlarmPie from "@/views/Alarm/chart/AlarmPie";
			
 
				 import { swiper, swiperSlide } from 'vue-awesome-swiper'
			
 
				 import 'swiper/css/swiper.css'
			
 
				-import {getAlarmList, getWeekInfo, getPersonList, getAlarmRate, getCountByDay, getDevice, getCarWashVideo, getDeviceList } from "@/utils/api";
			
 
				+import {getAlarmList, getWeekInfo, getPersonList, getAlarmRate, getCountByDay, getDevice, getCarWashVideo, getDeviceList, getBaseVideo } from "@/utils/api";
			
 
				 import {gateSeven, getCallDetail, getCarDrying, getCarDryingTemp } from "@/utils/chenApi";
			
 
				 import img from '@/assets/Alarm/111.png';
			
 
				 import {timeDate} from "@/utils";
			
@@ -672,7 +676,9 @@ export default {
 
				           minWidth: 120,
			
 
				           slotName: "record",
			
 
				         },
			
 
				-      ]
			
 
				+      ],
			
 
				+      ballRtsp: '',
			
 
				+      ballWs: ''
			
 
				     }
			
 
				   },
			
 
				   computed: {
			
@@ -713,119 +719,6 @@ export default {
 
				     },
			
 
				     alarmClick(num) {
			
 
				       this.num = num;
			
 
				-      if(num === 1) {
			
 
				-        this.button1++;
			
 
				-        this.button2 = 0;
			
 
				-        this.button3 = 0;
			
 
				-        this.button4 = 0;
			
 
				-        if(this.button1 %2 === 0 ) {
			
 
				-          this.ctx.clearRect(0, 0, 910, 504);
			
 
				-          this.initCanvas()
			
 
				-        } else {
			
 
				-          this.ctx.lineWidth = 4;
			
 
				-          this.ctx.strokeStyle = '#F59A23';
			
 
				-          this.ctx.fillStyle = 'rgba(224, 218, 188, .6)';
			
 
				-          this.ctx.beginPath();
			
 
				-          this.ctx.moveTo(165, 85);
			
 
				-          this.ctx.lineTo(750, 85);
			
 
				-          this.ctx.lineTo(810, 265);
			
 
				-          this.ctx.lineTo(590, 265);
			
 
				-          this.ctx.lineTo(580, 195);
			
 
				-          this.ctx.lineTo(330, 195);
			
 
				-          this.ctx.lineTo(320, 270);
			
 
				-          this.ctx.lineTo(100, 270);
			
 
				-          this.ctx.closePath();
			
 
				-
			
 
				-          this.ctx.moveTo(135,280);
			
 
				-          this.ctx.lineTo(310, 285);
			
 
				-          this.ctx.lineTo(300, 345);
			
 
				-          this.ctx.lineTo(120, 345);
			
 
				-          this.ctx.closePath();
			
 
				-          this.ctx.stroke();
			
 
				-          this.ctx.fill();
			
 
				-        }
			
 
				-      } else if(num === 2) {
			
 
				-        this.button2++;
			
 
				-        this.button1 = 0;
			
 
				-        this.button3 = 0;
			
 
				-        this.button4 = 0;
			
 
				-        if(this.button2 %2 === 0 ) {
			
 
				-          this.ctx.clearRect(0, 0, 910, 504);
			
 
				-          this.initCanvas()
			
 
				-        } else {
			
 
				-          this.ctx.lineWidth = 4;
			
 
				-          this.ctx.strokeStyle = '#1ADD4B';
			
 
				-          this.ctx.fillStyle = 'rgba(175, 179, 95, .6)';
			
 
				-          this.ctx.beginPath();
			
 
				-          this.ctx.moveTo(160, 360);
			
 
				-          this.ctx.lineTo(300, 360);
			
 
				-          this.ctx.lineTo(300, 375);
			
 
				-          this.ctx.lineTo(350, 375);
			
 
				-          this.ctx.lineTo(350, 360);
			
 
				-          this.ctx.lineTo(430, 360);
			
 
				-          this.ctx.lineTo(430, 345);
			
 
				-          this.ctx.lineTo(475, 345);
			
 
				-          this.ctx.lineTo(475, 360);
			
 
				-          this.ctx.lineTo(550, 360);
			
 
				-          this.ctx.lineTo(550, 410);
			
 
				-          this.ctx.lineTo(160, 410);
			
 
				-          // this.ctx.lineTo(590, 265);
			
 
				-          // this.ctx.lineTo(580, 195);
			
 
				-          // this.ctx.lineTo(330, 195);
			
 
				-          // this.ctx.lineTo(320, 270);
			
 
				-          // this.ctx.lineTo(100, 270);
			
 
				-          this.ctx.closePath();
			
 
				-
			
 
				-          this.ctx.stroke();
			
 
				-          this.ctx.fill();
			
 
				-        }
			
 
				-      } else if(num === 3) {
			
 
				-        this.button3++;
			
 
				-        this.button2 = 0;
			
 
				-        this.button1 = 0;
			
 
				-        this.button4 = 0;
			
 
				-        if(this.button3 %2 === 0 ) {
			
 
				-          this.ctx.clearRect(0, 0, 910, 504);
			
 
				-          this.initCanvas()
			
 
				-        } else {
			
 
				-          this.ctx.lineWidth = 4;
			
 
				-          this.ctx.strokeStyle = '#F54F23';
			
 
				-          this.ctx.fillStyle = 'rgba(183, 109, 105, .6)';
			
 
				-          this.ctx.beginPath();
			
 
				-          this.ctx.moveTo(620, 360);
			
 
				-          this.ctx.lineTo(870, 360);
			
 
				-          this.ctx.lineTo(900, 450);
			
 
				-          this.ctx.lineTo(630, 450);
			
 
				-          this.ctx.closePath();
			
 
				-
			
 
				-          this.ctx.stroke();
			
 
				-          this.ctx.fill();
			
 
				-        }
			
 
				-      } else if(num === 4) {
			
 
				-        this.button4++;
			
 
				-        this.button2 = 0;
			
 
				-        this.button1 = 0;
			
 
				-        this.button3 = 0;
			
 
				-        if(this.button4 %2 === 0 ) {
			
 
				-          this.ctx.clearRect(0, 0, 910, 504);
			
 
				-          this.initCanvas()
			
 
				-        } else {
			
 
				-          this.ctx.lineWidth = 4;
			
 
				-          this.ctx.strokeStyle = '#19AEE8';
			
 
				-          this.ctx.fillStyle = 'rgba(169, 213, 236, .6)';
			
 
				-          this.ctx.beginPath();
			
 
				-          this.ctx.moveTo(390,200);
			
 
				-          this.ctx.lineTo(440, 200);
			
 
				-          this.ctx.lineTo(440, 240);
			
 
				-          this.ctx.lineTo(390, 240);
			
 
				-          // this.ctx.lineTo(900, 450);
			
 
				-          // this.ctx.lineTo(630, 450);
			
 
				-          this.ctx.closePath();
			
 
				-
			
 
				-          this.ctx.stroke();
			
 
				-          this.ctx.fill();
			
 
				-        }
			
 
				-      }
			
 
				     },
			
 
				     initCanvas() {
			
 
				       var myCanvas = document.getElementById('canvas');
			
@@ -850,9 +743,12 @@ export default {
 
				       getWeekInfo({}).then(res => {
			
 
				         if(res.code === 10000) {
			
 
				           this.list.salvProValue = [res.data.one, res.data.two, res.data.three];
			
 
				+
			
 
				           this.listLoading = false;
			
 
				         }
			
 
				       })
			
 
				+      this.listLoading = false;
			
 
				+      this.list.salvProValue = [21, 15, 3]
			
 
				       let params = {
			
 
				         pageNum: 1,
			
 
				         pageSize: 20,
			
@@ -877,6 +773,20 @@ export default {
 
				       getAlarmRate({}).then(res => {
			
 
				         if(res.code === 10000) {
			
 
				           this.alarmPie = res.data;
			
 
				+          // this.alarmPie = [
			
 
				+          //   {
			
 
				+          //     name: '生态监测',
			
 
				+          //     value: 3
			
 
				+          //   },
			
 
				+          //   {
			
 
				+          //     name: '人员违规',
			
 
				+          //     value: 0
			
 
				+          //   },
			
 
				+          //   {
			
 
				+          //     name: '环境监测',
			
 
				+          //     value: 0
			
 
				+          //   },
			
 
				+          // ]
			
 
				           this.dayLoading = false;
			
 
				         } else {
			
 
				           this.dayLoading = false;
			
@@ -891,7 +801,16 @@ export default {
 
				               this.barData.salvProName.push(item.name);
			
 
				               this.barData.salvProValue.push(item.value);
			
 
				             })
			
 
				+
			
 
				             this.pieData = res.data;
			
 
				+            // this.barData.salvProName = ['车辆烘干', "死猪运输", "人员违规", "车辆洗消"]
			
 
				+            // this.barData.salvProValue = [7, 0, 3, 5]
			
 
				+            // this.pieData = [
			
 
				+            //   { name: '车辆烘干', value:  7},
			
 
				+            //   {name: "死猪运输", value: 0},
			
 
				+            //   {name: "人员违规", value: 3},
			
 
				+            //   {name: "车辆洗消", value: 5}
			
 
				+            // ]
			
 
				           }
			
 
				           this.pieLoading = false;
			
 
				         } else {
			
@@ -966,8 +885,9 @@ export default {
 
				       }
			
 
				       getCallDetail(params).then(res => {
			
 
				         if(res.code === 10000) {
			
 
				-          this.listItem = res.data.records;
			
 
				-          this.total = res.data.total;
			
 
				+          this.listItem = res.data;
			
 
				+          // this.listItem = res.data.records;
			
 
				+          // this.total = res.data.total;
			
 
				         }
			
 
				       })
			
 
				     },
			
@@ -1098,11 +1018,23 @@ export default {
 
				           this.deviceTotal = res.data.totalElements;
			
 
				         }
			
 
				       })
			
 
				+    },
			
 
				+    initVideo() {
			
 
				+      let params = {
			
 
				+        type: 3
			
 
				+      }
			
 
				+      getBaseVideo(params).then(res => {
			
 
				+        if(res.code === 10000) {
			
 
				+          this.ballWs = res.data[0].wsUrl;
			
 
				+          this.ballRtsp = res.data[0].rtspUrl;
			
 
				+        }
			
 
				+      })
			
 
				     }
			
 
				   },
			
 
				   mounted() {
			
 
				-    this.initCanvas()
			
 
				+    // this.initCanvas()
			
 
				     this.init();
			
 
				+    this.initVideo()
			
 
				   }
			
 
				 }
			
 
				 </script>
			
--- a/src/views/BioSafety/BioSafety.vue
+++ b/src/views/BioSafety/BioSafety.vue
@@ -4,27 +4,44 @@
 
				       <div class="bio-flex-left">
			
 
				         <div class="bio-title">
			
 
				           <div class="bio-title-left"></div>
			
 
				-          <div class="bio-title-center">门卫管控</div>
			
 
				+          <div class="bio-title-center" style="cursor: pointer;" @click="isView = true">{{isNum == 1 ? '门卫管控' : '全景球机'}}</div>
			
 
				           <div class="bio-title-right"></div>
			
 
				-        </div>
			
 
				-        <div class="bio-video">
			
 
				-          <div class="kuang">
			
 
				-            <iframe v-if="isVideo"  :src="'static/jinm/index.html?'+'1'+','+ cameraOne +','+ cameraTwo + ',' +'100%' + ',' + '0'" style="width: 95%; height: 100%;" frameborder="0"  allowfullscreen="true"></iframe>
			
 
				+          <div class="bio-select" v-show="isView">
			
 
				+            <div class="bio-select-text" @click="setNum(1)">门卫管控</div>
			
 
				+            <div class="bio-select-text" @click="setNum(2)">全景球机</div>
			
 
				           </div>
			
 
				         </div>
			
 
				-        <div class="bio-out">
			
 
				-          <div class="bio-out-center" @click="openGate(1)">
			
 
				-            <div class="out-img"></div>
			
 
				-            <div style="color: white; font-size: 16px">
			
 
				-              <p>今日抓取次数</p>
			
 
				-              <p style="font-size: 22px; font-weight: 600">{{pig.tadayGate}}</p>
			
 
				+        <div v-show="isNum === 1">
			
 
				+          <div class="bio-video">
			
 
				+            <div class="kuang">
			
 
				+              <iframe v-if="isVideo"  :src="'static/jinm/index.html?'+'1'+','+ cameraOne +','+ cameraTwo + ',' +'100%' + ',' + '0'" style="width: 95%; height: 100%;" frameborder="0"  allowfullscreen="true"></iframe>
			
 
				+            </div>
			
 
				+          </div>
			
 
				+          <div class="bio-out">
			
 
				+            <div class="bio-out-center">
			
 
				+              <!--      @click="openGate(1)"   -->
			
 
				+              <div class="out-img"></div>
			
 
				+              <div style="color: white; font-size: 16px">
			
 
				+                <p>今日抓取次数</p>
			
 
				+<!--                <p style="font-size: 22px; font-weight: 600">{{pig.tadayGate}}</p>-->
			
 
				+                <p style="font-size: 22px; font-weight: 600">57</p>
			
 
				+              </div>
			
 
				+            </div>
			
 
				+            <div class="bio-out-center">
			
 
				+              <!--    @click="openGate(2)"  -->
			
 
				+              <div class="out-img1"></div>
			
 
				+              <div style="color: white; font-size: 16px">
			
 
				+                <p>七日抓取次数</p>
			
 
				+<!--                <p style="font-size: 22px; font-weight: 600">{{pig.SevenDayGate}}</p>-->
			
 
				+                <p style="font-size: 22px; font-weight: 600">399</p>
			
 
				+              </div>
			
 
				             </div>
			
 
				           </div>
			
 
				-          <div class="bio-out-center" @click="openGate(2)">
			
 
				-            <div class="out-img1"></div>
			
 
				-            <div style="color: white; font-size: 16px">
			
 
				-              <p>七日抓取次数</p>
			
 
				-              <p style="font-size: 22px; font-weight: 600">{{pig.SevenDayGate}}</p>
			
 
				+        </div>
			
 
				+        <div v-show="isNum === 2">
			
 
				+          <div class="bio-video">
			
 
				+            <div class="kuang">
			
 
				+              <iframe v-if="isVideo"  :src="'static/jinm/index.html?'+'1'+','+ ballWs +','+ ballRtsp + ',' +'100%' + ',' + '0'" style="width: 95%; height: 100%;" frameborder="0"  allowfullscreen="true"></iframe>
			
 
				             </div>
			
 
				           </div>
			
 
				         </div>
			
@@ -275,7 +292,7 @@
 
				         </div>
			
 
				       </div>
			
 
				     </div>
			
 
				-    <div class="bio-dialog" v-show="dialog" @click="dialog = false">
			
 
				+    <div class="bio-dialog" v-if="dialog" @click="dialog = false">
			
 
				       <div class="dialog-content1" v-if="type === 1">
			
 
				         <div>
			
 
				 <!--          <img style="float: left" :src="selectImg" height="400px" alt="">-->
			
@@ -316,7 +333,7 @@
 
				       </div>
			
 
				     </div>
			
 
				     <!-- 车辆   -->
			
 
				-    <div class="bio-dialog" v-show="carDialog" @click="carDialog=false">
			
 
				+    <div class="bio-dialog" v-if="carDialog" @click="carDialog=false">
			
 
				       <div class="dialog-content1">
			
 
				         <div class="dialog-title">车辆管理</div>
			
 
				         <template>
			
@@ -380,7 +397,7 @@
 
				       </div>
			
 
				     </div>
			
 
				     <!-- 门卫   -->
			
 
				-    <div class="bio-dialog" v-show="personDialog" @click="personDialog=false">
			
 
				+    <div class="bio-dialog" v-if="personDialog" @click="personDialog=false">
			
 
				       <div class="dialog-content1">
			
 
				         <div class="dialog-title">门禁管理</div>
			
 
				         <template>
			
@@ -440,7 +457,7 @@
 
				       </div>
			
 
				     </div>
			
 
				     <!--  大门  -->
			
 
				-    <div class="bio-dialog" v-show="gateDialog" @click="gateDialog=false">
			
 
				+    <div class="bio-dialog" v-if="gateDialog" @click="gateDialog=false">
			
 
				       <div class="dialog-content1">
			
 
				         <div class="dialog-title">门卫管控</div>
			
 
				         <div class="base-banner3">
			
@@ -487,7 +504,7 @@
 
				       </div>
			
 
				     </div>
			
 
				     <!-- 烘干   -->
			
 
				-    <div class="bio-dialog" v-show="dryingShow" @click="dryingShow=false">
			
 
				+    <div class="bio-dialog" v-if="dryingShow" @click="dryingShow=false">
			
 
				       <div class="dialog-content3">
			
 
				         <div class="dialog-title">车辆烘干</div>
			
 
				         <div class="base-banner5">
			
@@ -525,19 +542,18 @@
 
				       </span>
			
 
				     </el-dialog>
			
 
				     <!--死猪    -->
			
 
				-    <div class="bio-dialog" v-show="siZhuShow" @click="siZhuShow = false">
			
 
				+    <div class="bio-dialog" v-if="siZhuShow" @click="siZhuShow = false">
			
 
				       <div class="dialog-content1">
			
 
				         <div class="dialog-title">死猪管控</div>
			
 
				         <div class="base-banner3">
			
 
				           <div class="base-left">
			
 
				-            <div v-if="videoNull">
			
 
				-              <iframe
			
 
				+            <iframe
			
 
				+                v-if="videoNull && siZhuShow"
			
 
				                 :src="'static/dahua/index.html?' + rtsp"
			
 
				                 frameborder="0"
			
 
				                 style="width: 680px; height: 600px"
			
 
				               >
			
 
				               </iframe>
			
 
				-            </div>
			
 
				             <div v-else>
			
 
				               <img :src="sizhuImg" width="100%" alt="">
			
 
				             </div>
			
@@ -748,6 +764,10 @@ export default {
 
				       sizhuListItem: [],
			
 
				       siZhuTotal: 0,
			
 
				       sizhuImg: '',
			
 
				+      isView: false,
			
 
				+      isNum: 1,
			
 
				+      ballRtsp: 'rtsp://admin:hmkj6688@172.16.3.253:554/cam/realmonitor?channel=2&subtype=0',
			
 
				+      ballWs: 'ws://36.26.62.70:9080/camera_relay?tcpaddr=admin%3Ahmkj6688%40172.16.3.253'
			
 
				     }
			
 
				   },
			
 
				   computed: {
			
@@ -769,6 +789,10 @@ export default {
 
				     }
			
 
				   },
			
 
				   methods: {
			
 
				+    setNum(i) {
			
 
				+      this.isNum = i;
			
 
				+      this.isView = false;
			
 
				+    },
			
 
				     carChange(val) {
			
 
				       this.pageSize = val;
			
 
				       this.initCar()
			
@@ -1033,6 +1057,7 @@ export default {
 
				       } else if(num === 2) {
			
 
				         this.selectImg = item.recordImage;
			
 
				       } else {
			
 
				+        this.rtsp = '';
			
 
				         // 拿到视频回放
			
 
				         getCarWashVideo({
			
 
				           happendTime: item.alarmDate,
			
@@ -1122,12 +1147,13 @@ export default {
 
				           this.gateList.forEach(item => {
			
 
				             item.imgUrl = `${this.ip}/video/picture/get?alarmPicture=${item.alarmPicture}`
			
 
				           })
			
 
				-          this.gateImg = this.gateList[0].imgUrl;
			
 
				+          // this.gateImg = this.gateList[0].imgUrl;
			
 
				         }
			
 
				       })
			
 
				     },
			
 
				     gateVideo(item) {
			
 
				       this.videoNull = true;
			
 
				+      this.rtsp = '';
			
 
				       getCarWashVideo({
			
 
				         happendTime: item.alarmDate,
			
 
				         channelName: item.alarmPosition,
			
@@ -1288,6 +1314,7 @@ export default {
 
				         if(res.code == 0) {
			
 
				           const result = JSON.parse(res.result);
			
 
				           this.sizhuListItem = result.data.pageData;
			
 
				+          console.log(this.sizhuListItem)
			
 
				           this.sizhuListItem.forEach((item) => {
			
 
				             item.imgUrl = `${this.ip}/video/picture/get?alarmPicture=${item.alarmPicture}`;
			
 
				           });
			
@@ -1343,6 +1370,7 @@ export default {
 
				     width: 100%;
			
 
				     height: 26px;
			
 
				     display: flex;
			
 
				+    position: relative;
			
 
				   }
			
 
				   .bio-video {
			
 
				     width: 100%;
			
@@ -1409,6 +1437,29 @@ export default {
 
				     color: white;
			
 
				     font-size: 16px;
			
 
				   }
			
 
				+  .bio-select {
			
 
				+    width: 120px;
			
 
				+    height: 60px;
			
 
				+    position: absolute;
			
 
				+    background-color: rgba(102, 255, 255, .6);
			
 
				+    top: 26px;
			
 
				+    left: 50%;
			
 
				+    transform: translate(-50%, 0);
			
 
				+  }
			
 
				+  .bio-select-text {
			
 
				+    line-height: 30px;
			
 
				+    font-size: 16px;
			
 
				+    color: white;
			
 
				+    cursor: pointer;
			
 
				+  }
			
 
				+  .bio-select-text:hover {
			
 
				+    background-color: #409eff;
			
 
				+    color: black;
			
 
				+  }
			
 
				+  .is_select {
			
 
				+    background-color: #409eff;
			
 
				+    color: black;
			
 
				+  }
			
 
				   .bio-title-right {
			
 
				     flex: 1;
			
 
				     height: 26px;
			
@@ -1633,6 +1684,7 @@ export default {
 
				   }
			
 
				   .case-right {
			
 
				     flex: 1;
			
 
				+    font-size: 14px;
			
 
				   }
			
 
				   .case-time {
			
 
				     width: 100%;
			
@@ -1684,15 +1736,17 @@ export default {
 
				     /*padding-left: 10px;*/
			
 
				     line-height: 30px;
			
 
				     color: white;
			
 
				+    font-size: 14px;
			
 
				   }
			
 
				   .bio-dialog {
			
 
				-    width: 100vw;
			
 
				-    height: 100vh;
			
 
				+    width: 100%;
			
 
				+    height: 100%;
			
 
				     position: absolute;
			
 
				     top: 0;
			
 
				     left: 0;
			
 
				     background-color: rgba(0,0,0, .9);
			
 
				     z-index: 999;
			
 
				+    font-size: 12px;
			
 
				   }
			
 
				   .dialog-content {
			
 
				     width: 50%;
			
--- a/src/views/BioSafety/chart/ChartBar.vue
+++ b/src/views/BioSafety/chart/ChartBar.vue
@@ -37,8 +37,8 @@ export default {
 
				   },
			
 
				   methods: {
			
 
				     init() {
			
 
				-      let max = Math.max(...this.data.data);
			
 
				-      let max1 = max * 1.2;
			
 
				+      // let max = Math.max(...this.data.data);
			
 
				+      // let max1 = max * 1.2;
			
 
				       // 获取当前数组的数量并push 成新数组
			
 
				       // let data1 = new Array(this.data.data.length).fill(max1);
			
 
				       let options = {
			
@@ -50,7 +50,7 @@ export default {
 
				         //   },
			
 
				         // },
			
 
				         grid: {
			
 
				-          top: "5%",
			
 
				+          top: "10%",
			
 
				           left: "5%",
			
 
				           right: "5%",
			
 
				           bottom: "2%",
			
@@ -81,7 +81,6 @@ export default {
 
				               width: "2", //坐标线的宽度
			
 
				             },
			
 
				           },
			
 
				-          max: max1,
			
 
				           axisLabel: {
			
 
				             formatter: `{value}${this.data.unit}`,
			
 
				             textStyle: {
			
@@ -138,7 +137,7 @@ export default {
 
				       let that = this;
			
 
				       this.myChart.on('click', function (params){
			
 
				         console.log(params)
			
 
				-        if(params.value !== max1) {
			
 
				+        if(params.value) {
			
 
				           that.$emit('setOpen', params.name)
			
 
				         }
			
 
				       })
			
--- a/src/views/Crew/Crew.vue
+++ b/src/views/Crew/Crew.vue
--- a/src/views/Crew/chart/ChartJczl.vue
+++ b/src/views/Crew/chart/ChartJczl.vue
@@ -0,0 +1,394 @@
 
				+<template>
			
 
				+  <div id="chart-jczl" style="width: 100%; height: 100%"></div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import echarts from "echarts";
			
 
				+export default {
			
 
				+  name: "ChartJczl",
			
 
				+  props: {
			
 
				+    jczlList: {
			
 
				+      type: Array,
			
 
				+    },
			
 
				+    jczlAxis: {
			
 
				+      type: Array,
			
 
				+    },
			
 
				+    echartsType: {
			
 
				+      type: Number
			
 
				+    }
			
 
				+  },
			
 
				+  watch: {
			
 
				+    jczlList: {
			
 
				+      handler(newVal) {
			
 
				+        if(newVal) {
			
 
				+          this.myChart.clear();
			
 
				+          this.init();
			
 
				+        }
			
 
				+      },
			
 
				+      deep: true,
			
 
				+    }
			
 
				+  },
			
 
				+  data() {
			
 
				+    return {
			
 
				+      myChart: null
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    init() {
			
 
				+      let that = this;
			
 
				+      let option;
			
 
				+      if(this.echartsType === 1) {
			
 
				+        option = {
			
 
				+          tooltip: {
			
 
				+            trigger: 'axis',
			
 
				+            axisPointer: {            // 坐标轴指示器，坐标轴触发有效
			
 
				+              type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
			
 
				+            },
			
 
				+            formatter:function(params){
			
 
				+              let str = `${params[0].axisValue}<br/>${params[0].seriesName}: &nbsp; ${params[0].value}`;
			
 
				+              // let tip = auth.formatterTip(params);/*调用auth.js中的formatterTip函数，传入触发点信息参数params*/
			
 
				+              return str ;
			
 
				+            },
			
 
				+          },
			
 
				+          grid: {
			
 
				+            top: "10%",
			
 
				+            bottom: '10%',//也可设置left和right设置距离来控制图表的大小
			
 
				+            right: 0,
			
 
				+          },
			
 
				+          xAxis: {
			
 
				+            data: [],
			
 
				+            axisLine: {
			
 
				+              show: true, //隐藏X轴轴线
			
 
				+              lineStyle: {
			
 
				+                color: '#2D455A'
			
 
				+              }
			
 
				+            },
			
 
				+            axisTick: {
			
 
				+              show: false //隐藏X轴刻度
			
 
				+            },
			
 
				+            axisLabel: {
			
 
				+              show: true,
			
 
				+              interval: 0,
			
 
				+              fontSize: 12,
			
 
				+              textStyle: {
			
 
				+                color: "#fff" //X轴文字颜色
			
 
				+              }
			
 
				+            },
			
 
				+
			
 
				+          },
			
 
				+          yAxis: [
			
 
				+            {
			
 
				+              type: "value",
			
 
				+              name: '次数',
			
 
				+              gridIndex: 0,
			
 
				+              // splitNumber: 4,
			
 
				+              splitLine: {
			
 
				+                show: true,
			
 
				+                lineStyle: {
			
 
				+                  type: 'dashed',
			
 
				+                  color: '#2B4359',
			
 
				+                  width: 2
			
 
				+                },
			
 
				+
			
 
				+              },
			
 
				+              axisTick: {
			
 
				+                show: false
			
 
				+              },
			
 
				+              axisLine: {
			
 
				+                show: true,
			
 
				+                lineStyle: {
			
 
				+                  color: '#fff'
			
 
				+                }
			
 
				+              },
			
 
				+              axisLabel: {
			
 
				+                show: true,
			
 
				+                margin: 14,
			
 
				+                fontSize: 14,
			
 
				+                textStyle: {
			
 
				+                  color: "#fff" //X轴文字颜色
			
 
				+                }
			
 
				+              },
			
 
				+            },
			
 
				+          ],
			
 
				+          series: [
			
 
				+            {
			
 
				+              name: "次数",
			
 
				+              type: "bar",
			
 
				+              barWidth: 24,
			
 
				+              itemStyle: {
			
 
				+                normal: {
			
 
				+                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
			
 
				+                    offset: 0,
			
 
				+                    color: "#00FFE3"
			
 
				+                  },
			
 
				+                    {
			
 
				+                      offset: 1,
			
 
				+                      color: "#4693EC"
			
 
				+                    }
			
 
				+                  ])
			
 
				+                }
			
 
				+              },
			
 
				+              data: [],
			
 
				+              label: {
			
 
				+                show: true,
			
 
				+                position: 'top',
			
 
				+                color: '#fff',
			
 
				+                fontSize: 16,
			
 
				+              },
			
 
				+              z: 10,
			
 
				+              zlevel: 0,
			
 
				+            },
			
 
				+            {
			
 
				+              // 分隔
			
 
				+              type: "pictorialBar",
			
 
				+              itemStyle: {
			
 
				+                normal:{
			
 
				+                  color:"#0F375F"
			
 
				+                }
			
 
				+              },
			
 
				+              symbolRepeat: "fixed",
			
 
				+              symbolMargin: 6,
			
 
				+              symbol: "rect",
			
 
				+              symbolClip: true,
			
 
				+              symbolSize: [18, 2],
			
 
				+              symbolPosition: "start",
			
 
				+              symbolOffset: [1, -1],
			
 
				+              // symbolBoundingData: this.total,
			
 
				+              data: [],
			
 
				+              width: 20,
			
 
				+              z: 0,
			
 
				+              zlevel: 1,
			
 
				+              label: {
			
 
				+                show: false,
			
 
				+                normal: {
			
 
				+                  show: false    //是否显示默认名称
			
 
				+
			
 
				+                },
			
 
				+
			
 
				+                emphasis: {
			
 
				+                  show: false    //鼠标悬浮是否显示默认地理名称
			
 
				+
			
 
				+                }
			
 
				+              }
			
 
				+            },
			
 
				+            {
			
 
				+              name: "",
			
 
				+              type: "bar",
			
 
				+              barGap: "-110%", // 设置外框粗细
			
 
				+              data: [],
			
 
				+              barWidth: 26,
			
 
				+              itemStyle: {
			
 
				+                normal: {
			
 
				+                  color: "transparent", // 填充色
			
 
				+                  barBorderColor: "#2D465C", // 边框色
			
 
				+                  barBorderWidth: 1, // 边框宽度
			
 
				+                  // barBorderRadius: 0, //圆角半径
			
 
				+                }
			
 
				+              },
			
 
				+              z: 0
			
 
				+            },
			
 
				+            {
			
 
				+              name: "",
			
 
				+              type: "line",
			
 
				+              smooth: true, //平滑曲线显示
			
 
				+              showAllSymbol: false, //显示所有图形。
			
 
				+              symbolSize: 0,
			
 
				+              lineStyle: {
			
 
				+                color: '#182733',
			
 
				+                width: 0,
			
 
				+              },
			
 
				+              areaStyle:{
			
 
				+                color: 'rgba(5,140,255, 0.2)'
			
 
				+              },
			
 
				+              data: [],
			
 
				+              z: 5,
			
 
				+            }
			
 
				+          ]
			
 
				+        }
			
 
				+      } else {
			
 
				+        option = {
			
 
				+          tooltip: {
			
 
				+            trigger: 'axis',
			
 
				+            axisPointer: {            // 坐标轴指示器，坐标轴触发有效
			
 
				+              type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
			
 
				+            },
			
 
				+            formatter:function(params){
			
 
				+              let str = `${params[0].axisValue}<br/>${params[0].seriesName}: &nbsp; ${params[0].value}`;
			
 
				+              // let tip = auth.formatterTip(params);/*调用auth.js中的formatterTip函数，传入触发点信息参数params*/
			
 
				+              return str ;
			
 
				+            },
			
 
				+          },
			
 
				+          grid: {
			
 
				+            top: "10%",
			
 
				+            bottom: '10%',//也可设置left和right设置距离来控制图表的大小
			
 
				+            right: 0,
			
 
				+          },
			
 
				+          xAxis: {
			
 
				+            data:  [],
			
 
				+            axisLine: {
			
 
				+              show: true, //隐藏X轴轴线
			
 
				+              lineStyle: {
			
 
				+                color: '#2D455A'
			
 
				+              }
			
 
				+            },
			
 
				+            axisTick: {
			
 
				+              show: false //隐藏X轴刻度
			
 
				+            },
			
 
				+            axisLabel: {
			
 
				+              show: true,
			
 
				+              interval: 0,
			
 
				+              fontSize: 12,
			
 
				+              textStyle: {
			
 
				+                color: "#A3C0DF" //X轴文字颜色
			
 
				+              }
			
 
				+            },
			
 
				+
			
 
				+          },
			
 
				+          yAxis: [
			
 
				+            {
			
 
				+              type: "value",
			
 
				+              name: '次数',
			
 
				+              gridIndex: 0,
			
 
				+              interval: 25,
			
 
				+              // splitNumber: 4,
			
 
				+              splitLine: {
			
 
				+                show: true,
			
 
				+                lineStyle: {
			
 
				+                  type: 'dashed',
			
 
				+                  color: '#2B4359',
			
 
				+                  width: 2
			
 
				+                },
			
 
				+
			
 
				+              },
			
 
				+              axisTick: {
			
 
				+                show: false
			
 
				+              },
			
 
				+              axisLine: {
			
 
				+                show: true,
			
 
				+                lineStyle: {
			
 
				+                  color: '#2D455A'
			
 
				+                }
			
 
				+              },
			
 
				+              axisLabel: {
			
 
				+                show: true,
			
 
				+                margin: 14,
			
 
				+                fontSize: 14,
			
 
				+                textStyle: {
			
 
				+                  color: "#A3C0DF" //X轴文字颜色
			
 
				+                }
			
 
				+              },
			
 
				+            },
			
 
				+          ],
			
 
				+          series: [
			
 
				+            {
			
 
				+              name: "次数",
			
 
				+              type: "bar",
			
 
				+              barWidth: 14,
			
 
				+              itemStyle: {
			
 
				+                normal: {
			
 
				+                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
			
 
				+                    offset: 0,
			
 
				+                    color: "#00FFE3"
			
 
				+                  },
			
 
				+                    {
			
 
				+                      offset: 1,
			
 
				+                      color: "#4693EC"
			
 
				+                    }
			
 
				+                  ])
			
 
				+                }
			
 
				+              },
			
 
				+              data: [],
			
 
				+              z: 10,
			
 
				+              zlevel: 0,
			
 
				+            },
			
 
				+            {
			
 
				+              // 分隔
			
 
				+              type: "pictorialBar",
			
 
				+              itemStyle: {
			
 
				+                normal:{
			
 
				+                  color:"#0F375F"
			
 
				+                }
			
 
				+              },
			
 
				+              symbolRepeat: "fixed",
			
 
				+              symbolMargin: 6,
			
 
				+              symbol: "rect",
			
 
				+              symbolClip: true,
			
 
				+              symbolSize: [18, 2],
			
 
				+              symbolPosition: "start",
			
 
				+              symbolOffset: [1, -1],
			
 
				+              // symbolBoundingData: this.total,
			
 
				+              data: that.jczlList[1],
			
 
				+              width: 20,
			
 
				+              z: 0,
			
 
				+              zlevel: 1,
			
 
				+            },
			
 
				+            {
			
 
				+              name: "",
			
 
				+              type: "bar",
			
 
				+              barGap: "-110%", // 设置外框粗细
			
 
				+              data: [100, 100, 100],
			
 
				+              barWidth: 18,
			
 
				+              itemStyle: {
			
 
				+                normal: {
			
 
				+                  color: "transparent", // 填充色
			
 
				+                  barBorderColor: "#2D465C", // 边框色
			
 
				+                  barBorderWidth: 1, // 边框宽度
			
 
				+                  // barBorderRadius: 0, //圆角半径
			
 
				+                  label: {
			
 
				+                    // 标签显示位置
			
 
				+                    show: false,
			
 
				+                    position: "top" // insideTop 或者横向的 insideLeft
			
 
				+                  }
			
 
				+                }
			
 
				+              },
			
 
				+              z: 0
			
 
				+            },
			
 
				+            {
			
 
				+              name: "",
			
 
				+              type: "line",
			
 
				+              smooth: true, //平滑曲线显示
			
 
				+              showAllSymbol: false, //显示所有图形。
			
 
				+              symbolSize: 0,
			
 
				+              lineStyle: {
			
 
				+                color: '#182733',
			
 
				+                width: 0,
			
 
				+              },
			
 
				+              areaStyle:{
			
 
				+                color: 'rgba(5,140,255, 0.2)'
			
 
				+              },
			
 
				+              data: [],
			
 
				+              z: 5,
			
 
				+            }
			
 
				+          ]
			
 
				+        }
			
 
				+      }
			
 
				+      option.xAxis.data = this.jczlAxis;
			
 
				+      option.series[0].data = this.jczlList;
			
 
				+      option.series[1].data = this.jczlList;
			
 
				+      option.series[3].data = this.jczlList;
			
 
				+      // 外框 必须增加
			
 
				+      let len = this.jczlList.length;
			
 
				+      let max = Math.max(...this.jczlList);
			
 
				+      let maxMax = max + 50;
			
 
				+      let arr = [];
			
 
				+      for(var i = 0; i<len; i++) {
			
 
				+        arr.push(maxMax);
			
 
				+      }
			
 
				+      option.series[2].data = arr;
			
 
				+
			
 
				+      this.myChart.setOption(option);
			
 
				+    }
			
 
				+  },
			
 
				+  mounted() {
			
 
				+    this.myChart = this.$echarts.init(document.getElementById('chart-jczl'));
			
 
				+    this.init();
			
 
				+    window.onresize = () => {
			
 
				+      this.myChart.resize();
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+
			
 
				+</style>
			
--- a/src/views/Crew/chart/ChartLsjc.vue
+++ b/src/views/Crew/chart/ChartLsjc.vue
@@ -0,0 +1,186 @@
 
				+<template>
			
 
				+  <div id="chart-lsjc" style="width: 100%; height: 100%"></div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import echarts from "echarts";
			
 
				+export default {
			
 
				+  name: "ChartLsjc",
			
 
				+  props: {
			
 
				+    lsjcList: {
			
 
				+      type: Array,
			
 
				+    },
			
 
				+    lsjcTime: {
			
 
				+      type: Array,
			
 
				+    }
			
 
				+  },
			
 
				+  watch: {
			
 
				+    lsjcList: {
			
 
				+      handler(newVal) {
			
 
				+        if (newVal) {
			
 
				+          this.myChart.clear();
			
 
				+          this.init();
			
 
				+        }
			
 
				+      },
			
 
				+      deep: true,
			
 
				+    },
			
 
				+  },
			
 
				+  data() {
			
 
				+    return {
			
 
				+      myChart: null,
			
 
				+    };
			
 
				+  },
			
 
				+  methods: {
			
 
				+    init() {
			
 
				+      let dayEacharts = {
			
 
				+        tooltip: { //提示框组件
			
 
				+          trigger: 'axis',
			
 
				+          formatter: `{b}<br />{a0}: {c0}`,
			
 
				+          axisPointer: {
			
 
				+            type: 'shadow',
			
 
				+            label: {
			
 
				+              backgroundColor: '#6a7985'
			
 
				+            }
			
 
				+          },
			
 
				+          textStyle: {
			
 
				+            color: '#fff',
			
 
				+            fontStyle: 'normal',
			
 
				+            fontFamily: '微软雅黑',
			
 
				+            fontSize: 12,
			
 
				+          }
			
 
				+        },
			
 
				+        grid: {
			
 
				+          left: '5%',
			
 
				+          right: '5%',
			
 
				+          bottom: '3%',
			
 
				+          top:'10%',
			
 
				+          //	padding:'0 0 10 0',
			
 
				+          containLabel: true,
			
 
				+        },
			
 
				+        legend: {//图例组件，颜色和名字
			
 
				+          right:'10%',
			
 
				+          top:'30%',
			
 
				+          itemGap: 16,
			
 
				+          itemWidth: 18,
			
 
				+          itemHeight: 10,
			
 
				+          data:[{
			
 
				+            name:'健康度',
			
 
				+            //icon:'image://../wwwroot/js/url2.png', //路径
			
 
				+          },
			
 
				+            {
			
 
				+              name:'可用度',
			
 
				+            }],
			
 
				+          textStyle: {
			
 
				+            color: '#a8aab0',
			
 
				+            fontStyle: 'normal',
			
 
				+            fontFamily: '微软雅黑',
			
 
				+            fontSize: 12,
			
 
				+          }
			
 
				+        },
			
 
				+        xAxis: [
			
 
				+          {
			
 
				+            type: 'category',
			
 
				+            //	boundaryGap: true,//坐标轴两边留白
			
 
				+            data: [],
			
 
				+            axisLabel: { //坐标轴刻度标签的相关设置。
			
 
				+              //		interval: 0,//设置为 1，表示『隔一个标签显示一个标签』
			
 
				+              //	margin:15,
			
 
				+              show: true,
			
 
				+              textStyle: {
			
 
				+                color: '#fff',
			
 
				+                fontStyle: 'normal',
			
 
				+                fontFamily: '微软雅黑',
			
 
				+                fontSize: 12,
			
 
				+              },
			
 
				+              rotate:50,
			
 
				+            },
			
 
				+            axisTick:{//坐标轴刻度相关设置。
			
 
				+              show: false,
			
 
				+            },
			
 
				+            axisLine:{//坐标轴轴线相关设置
			
 
				+              lineStyle:{
			
 
				+                color:'#fff',
			
 
				+                opacity:0.2
			
 
				+              }
			
 
				+            },
			
 
				+            splitLine: { //坐标轴在 grid 区域中的分隔线。
			
 
				+              show: false,
			
 
				+            }
			
 
				+          }
			
 
				+        ],
			
 
				+        yAxis: [
			
 
				+          {
			
 
				+            type: 'value',
			
 
				+            name: '次数',
			
 
				+            splitNumber: 5,
			
 
				+            axisLabel: {
			
 
				+              textStyle: {
			
 
				+                color: '#fff',
			
 
				+                fontStyle: 'normal',
			
 
				+                fontFamily: '微软雅黑',
			
 
				+                fontSize: 12,
			
 
				+              }
			
 
				+            },
			
 
				+            axisLine:{
			
 
				+              show: true,
			
 
				+              lineStyle: {
			
 
				+                type: 'solid',
			
 
				+                color: '#fff',//左边线的颜色
			
 
				+                width:'1'//坐标线的宽度
			
 
				+              }
			
 
				+            },
			
 
				+            axisTick:{
			
 
				+              show: false
			
 
				+            },
			
 
				+            splitLine: {
			
 
				+              show: true,
			
 
				+              lineStyle: {
			
 
				+                color: '#fff',
			
 
				+                opacity:0.06
			
 
				+              },
			
 
				+            }
			
 
				+
			
 
				+          }
			
 
				+        ],
			
 
				+        series : [
			
 
				+          {
			
 
				+            name:'次数',
			
 
				+            type:'bar',
			
 
				+            data:[8,5, 25, 30, 35, 55, 62, 78,65,55, 60, 45, 42, 15, 12, 5],
			
 
				+            barWidth: 10,
			
 
				+            barGap:0,//柱间距离
			
 
				+            itemStyle: {
			
 
				+              normal: {
			
 
				+                show: true,
			
 
				+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
			
 
				+                  offset: 0,
			
 
				+                  color: '#69CBF2'
			
 
				+                }, {
			
 
				+                  offset: 1,
			
 
				+                  color: '#69CBF2'
			
 
				+                }]),
			
 
				+                barBorderRadius: 50,
			
 
				+                borderWidth: 0,
			
 
				+              }
			
 
				+            },
			
 
				+          }
			
 
				+        ]
			
 
				+      }
			
 
				+      dayEacharts.xAxis[0].data = this.lsjcTime;
			
 
				+      dayEacharts.series[0].data = this.lsjcList;
			
 
				+      this.myChart.setOption(dayEacharts);
			
 
				+    }
			
 
				+  },
			
 
				+  mounted() {
			
 
				+    this.myChart = this.$echarts.init(document.getElementById("chart-lsjc"));
			
 
				+    this.init();
			
 
				+    window.onresize = () => {
			
 
				+      this.myChart.resize();
			
 
				+    }
			
 
				+  },
			
 
				+}
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+
			
 
				+</style>
			
--- a/src/views/Crew/chart/TimeLine.vue
+++ b/src/views/Crew/chart/TimeLine.vue
@@ -0,0 +1,66 @@
 
				+<template>
			
 
				+  <div style="cursor: pointer; font-size: 12px">
			
 
				+    <el-steps :active="6">
			
 
				+      <el-step v-for="(item, i) in stepList" :title="getTime(item.time)" icon="el-icon-time" :description="item.location" :key="i"></el-step>
			
 
				+    </el-steps>
			
 
				+    <div class="box">
			
 
				+      <div v-for="(item, i) in stepList" :key="i" class="box-item">
			
 
				+        <img :src="url + item.background_image" width="100%" alt="">
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+  import {getYMDHMS} from "../../../utils";
			
 
				+  export default {
			
 
				+    name: "TimeLine",
			
 
				+    data() {
			
 
				+      return {
			
 
				+      }
			
 
				+    },
			
 
				+    props: {
			
 
				+      stepList: {
			
 
				+        type: Array,
			
 
				+      },
			
 
				+      url: {
			
 
				+        type: String
			
 
				+      }
			
 
				+    },
			
 
				+    methods: {
			
 
				+      getTime(time) {
			
 
				+        return getYMDHMS(time);
			
 
				+      },
			
 
				+    },
			
 
				+  }
			
 
				+</script>
			
 
				+
			
 
				+<style scoped>
			
 
				+  /deep/.el-step__icon {
			
 
				+    background-color: #455585 !important;
			
 
				+  }
			
 
				+  /deep/ .el-step__head.is-finish {
			
 
				+    color: #06DFFF !important;
			
 
				+    border-color: #409EFF;
			
 
				+  }
			
 
				+  /deep/ .el-step__main {
			
 
				+    font-size: 12px;
			
 
				+  }
			
 
				+  /deep/ .el-step__title.is-finish, /deep/ .el-step__description.is-finish {
			
 
				+    color: #fff !important;
			
 
				+    font-size: 12px !important;
			
 
				+  }
			
 
				+  .box {
			
 
				+    width: 100%;
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+  }
			
 
				+  .box-item {
			
 
				+    width: 200px;
			
 
				+    background: url("../../../assets/104.png") no-repeat;
			
 
				+    background-size: 100% 100%;
			
 
				+    box-sizing: border-box;
			
 
				+    padding: 10px;
			
 
				+    color: white;
			
 
				+  }
			
 
				+</style>
			
--- a/src/views/Environment/Environment.vue
+++ b/src/views/Environment/Environment.vue
@@ -115,7 +115,7 @@ export default {
 
				       totalPData: {
			
 
				         data: 0,
			
 
				         splitNumber: 12,
			
 
				-        max: 1.2,
			
 
				+        max: 24,
			
 
				         unit: 'mg/L'
			
 
				       },
			
 
				       totalNData: {
			
@@ -151,8 +151,11 @@ export default {
 
				         if(res.code=== 10000) {
			
 
				           this.phData.data = res.data.phPj;
			
 
				           this.codData.data = res.data.hxxylPj;
			
 
				-          this.liuData.data = res.data.wsPj;
			
 
				+          // this.liuData.data = res.data.wsPj;
			
 
				           this.nhData.data = res.data.adPj;
			
 
				+          this.totalPData.data = 4.5;
			
 
				+          this.liuData.data = 7.694;
			
 
				+          this.totalNData.data = 11.5;
			
 
				         }
			
 
				         this.costLoading = false;
			
 
				       })
			
--- a/src/views/Home/Home.vue
+++ b/src/views/Home/Home.vue
@@ -250,6 +250,8 @@
 
				           </div>
			
 
				         </div>
			
 
				       </div>
			
 
				+      <div class="case" v-show="selectId === 5"></div>
			
 
				+      <div class="case" v-show="selectId === 6"></div>
			
 
				     </div>
			
 
				     <div class="home-footer">
			
 
				       <div class="home-footer-blue"></div>
			
@@ -315,6 +317,12 @@ export default {
 
				           url: '/monit',
			
 
				           permission: 'monit:look'
			
 
				         },
			
 
				+        {
			
 
				+          id: 7,
			
 
				+          title: 'AI人脸识别',
			
 
				+          url: '/crew',
			
 
				+          permission: 'crew:look'
			
 
				+        },
			
 
				       ],
			
 
				       num: 0,
			
 
				       leftNum: 0,
			
@@ -344,7 +352,8 @@ export default {
 
				         tadayXiXiao: "0",
			
 
				       },
			
 
				       alarm: {},
			
 
				-      permissionShow: false
			
 
				+      permissionShow: false,
			
 
				+      step: 0,
			
 
				     }
			
 
				   },
			
 
				   methods: {
			
@@ -385,20 +394,22 @@ export default {
 
				       })
			
 
				     },
			
 
				     prev() {
			
 
				+      let step = this.step / 5;
			
 
				       if(this.num > 0) {
			
 
				         this.num--;
			
 
				-        this.leftNum += 310;
			
 
				+        this.leftNum += step;
			
 
				       } else {
			
 
				         this.num = 0;
			
 
				         this.leftNum = 0;
			
 
				       }
			
 
				     },
			
 
				     next() {
			
 
				+      let step = this.step / 5;
			
 
				       if(this.num >= this.list.length - 5) {
			
 
				         return;
			
 
				       } else {
			
 
				         this.num++;
			
 
				-        this.leftNum -= 310;
			
 
				+        this.leftNum -= step;
			
 
				       }
			
 
				     },
			
 
				     initLine() {
			
@@ -415,8 +426,8 @@ export default {
 
				     },
			
 
				     onChange(i) {
			
 
				       clearInterval(this.timer2);
			
 
				-      if(i > 4) {
			
 
				-        this.selectId = 4;
			
 
				+      if(i > 6) {
			
 
				+        this.selectId = 6;
			
 
				       } else {
			
 
				         this.selectId = i;
			
 
				       }
			
@@ -425,7 +436,7 @@ export default {
 
				       let that = this;
			
 
				       this.timer2 = setInterval(() => {
			
 
				         setTimeout(() => {
			
 
				-          if(that.selectId >= 4) {
			
 
				+          if(that.selectId >= 6) {
			
 
				             that.selectId = 0;
			
 
				           } else {
			
 
				             that.selectId++;
			
@@ -445,7 +456,8 @@ export default {
 
				   },
			
 
				   mounted() {
			
 
				     this.init()
			
 
				-    this.width = this.list.length * (220 + 180) - 90;
			
 
				+    this.width = this.list.length * (220 + 180);
			
 
				+    this.step = document.getElementsByClassName('content-center')[0].clientWidth;
			
 
				     this.initLine()
			
 
				     this.initData();
			
 
				     // this.initFalsh();
			
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@@ -401,8 +401,8 @@ export default {
 
				     color: white !important;
			
 
				   }
			
 
				   .MainLayout {
			
 
				-    width: 100vw;
			
 
				-    height: 100vh;
			
 
				+    width: 100%;
			
 
				+    height: 100%;
			
 
				     background: url("../assets/u1.jpg") no-repeat;
			
 
				     background-size: 100% 100%;
			
 
				     box-sizing: border-box;
			
--- a/src/views/Monit/Monit.vue
+++ b/src/views/Monit/Monit.vue
@@ -1,9 +1,9 @@
 
				 <template>
			
 
				-  <div class="monit">
			
 
				-    <div class="monit-left">
			
 
				-      <div class="btn" @click="show=true">视频列表</div>
			
 
				-      <div class="btn btn-fixed" @click="showVideo = true">配置</div>
			
 
				-<!--      <div class="monit-title" @click="isShow = !isShow">-->
			
 
				+<!--  <div class="monit" @click="show = false">-->
			
 
				+<!--    <div class="monit-left">-->
			
 
				+<!--      <div class="btn" v-show="!show" @click.stop="show=true">视频列表</div>-->
			
 
				+<!--      <div class="btn btn-fixed" @click.stop="showVideo = true">配置</div>-->
			
 
				+<!--      <div class="monit-title" @click.stop="isShow = !isShow">-->
			
 
				 <!--        <span style="font-size: 16px">选择监控:</span>-->
			
 
				 <!--        &emsp;-->
			
 
				 <!--        <el-cascader-->
			
@@ -14,94 +14,168 @@
 
				 <!--          :props="{value: 'id', label: 'cameraName', children: 'cameraList', expandTrigger: 'hover', disabled: 'runStatus'}"-->
			
 
				 <!--          :show-all-levels="false"></el-cascader>-->
			
 
				 <!--      </div>-->
			
 
				-      <iframe v-if="isVideo" :src="'static/jinm/index.html?'+'1'+','+ cameraOne +','+ cameraTwo + ',' +'100%' + ',' + '0'" :style="{width: $store.state.screenVideo ? '100%': '80%', height: '100%', margin: '0 auto'}" frameborder="0"  allowfullscreen="true"></iframe>
			
 
				-    </div>
			
 
				-    <div class="monit-right" v-if="$store.state.screenVideo">
			
 
				-      <swiper style="height: 100%;  margin-top: auto; margin-bottom: auto;" ref="mySwiper" class="swiper" :options="swiperOption">
			
 
				-        <swiper-slide v-for="(item, i) in videoList" :key="i">
			
 
				-          <div class="case">
			
 
				-            <template v-if="num === 0 && (i === 0 || i === 1 || i === 2)">
			
 
				-              <iframe  :src="'static/jinm/index.html?'+'1'+','+ item.wsUrl +','+ item.rtspUrl + ',' +'100%' + ',' + '0'" style="width: 100%; height: 100%;" frameborder="0"  allowfullscreen="true"></iframe>
			
 
				-            </template>
			
 
				-            <template v-else-if="num === 3 && (i ===3 || i === 4 || i === 5)">
			
 
				-              <iframe  :src="'static/jinm/index.html?'+'1'+','+ item.wsUrl +','+ item.rtspUrl + ',' +'100%' + ',' + '0'" style="width: 100%; height: 100%;" frameborder="0"  allowfullscreen="true"></iframe>
			
 
				-            </template>
			
 
				+<!--      <iframe v-if="isVideo" :src="'static/jinm/index.html?'+'1'+','+ cameraOne +','+ cameraTwo + ',' +'100%' + ',' + '0'" :style="{width: $store.state.screenVideo ? '100%': '80%', height: '100%', margin: '0 auto'}" frameborder="0"  allowfullscreen="true"></iframe>-->
			
 
				+<!--    </div>-->
			
 
				+<!--    <div class="monit-right" v-if="$store.state.screenVideo">-->
			
 
				+<!--      <swiper style="height: 100%;  margin-top: auto; margin-bottom: auto;" ref="mySwiper" class="swiper" :options="swiperOption">-->
			
 
				+<!--        <swiper-slide v-for="(item, i) in videoList" :key="i">-->
			
 
				+<!--          <div class="case">-->
			
 
				+<!--            &lt;!&ndash;     v-if="num === 0 && (i === 0 || i === 1 || i === 2)"       &ndash;&gt;-->
			
 
				+<!--            <template>-->
			
 
				+<!--              <iframe  :src="'static/jinm/index.html?'+'1'+','+ item.wsUrl +','+ item.rtspUrl + ',' +'100%' + ',' + '0'" style="width: 100%; height: 100%;" frameborder="0"  allowfullscreen="true"></iframe>-->
			
 
				+<!--            </template>-->
			
 
				+<!--&lt;!&ndash;            <template v-else-if="num === 3 && (i ===3 || i === 4 || i === 5)">&ndash;&gt;-->
			
 
				+<!--&lt;!&ndash;              <iframe  :src="'static/jinm/index.html?'+'1'+','+ item.wsUrl +','+ item.rtspUrl + ',' +'100%' + ',' + '0'" style="width: 100%; height: 100%;" frameborder="0"  allowfullscreen="true"></iframe>&ndash;&gt;-->
			
 
				+<!--&lt;!&ndash;            </template>&ndash;&gt;-->
			
 
				+<!--          </div>-->
			
 
				+<!--        </swiper-slide>-->
			
 
				+<!--      </swiper>-->
			
 
				+<!--    </div>-->
			
 
				+<!--    <div class="monit_left" v-show="show">-->
			
 
				+<!--      <div class="monit_content">-->
			
 
				+<!--        <div class="boxTile" :class="[videoActive === i ? 'active' : '']" v-for="(item, i) in options" :key="i" @click.stop="setVideo(item, i)">-->
			
 
				+<!--          {{item.cameraName}}-->
			
 
				+<!--        </div>-->
			
 
				+<!--      </div>-->
			
 
				+<!--      <div class="monit-scroll monit_content" style="overflow: auto;">-->
			
 
				+<!--        <div class="boxTile" :class="[active === i ? 'active' : '']" v-for="(item, i) in videoItem" :key="i" @click.stop="getVideoItems(item, i)">-->
			
 
				+<!--          {{item.cameraName}}-->
			
 
				+<!--        </div>-->
			
 
				+<!--      </div>-->
			
 
				+<!--      <div class="cancel" @click.stop="show=false">关闭监控列表</div>-->
			
 
				+<!--    </div>-->
			
 
				+<!--    <div class="monit-dialog" v-show="showVideo" @click="showVideo = false">-->
			
 
				+<!--      <div class="monit-content1">-->
			
 
				+<!--        <div class="monit_box">-->
			
 
				+<!--          <h3>视 频 配 置</h3>-->
			
 
				+<!--          <div class="monit_flex">-->
			
 
				+<!--            <div class="monit_bise">-->
			
 
				+<!--              展 示 轮 巡-->
			
 
				+<!--            </div>-->
			
 
				+<!--            <div class="monit_bise" @click.stop>-->
			
 
				+<!--              <el-switch-->
			
 
				+<!--                active-color="#13ce66"-->
			
 
				+<!--                inactive-color="#ff4949"-->
			
 
				+<!--                v-model="$store.state.screenVideo"-->
			
 
				+<!--                @change="changeMode"></el-switch>-->
			
 
				+<!--            </div>-->
			
 
				+<!--          </div>-->
			
 
				+<!--        </div>-->
			
 
				+<!--      </div>-->
			
 
				+<!--    </div>-->
			
 
				+<!--  </div>-->
			
 
				+  <div class="monit">
			
 
				+    <div class="monit_left">
			
 
				+      <div class="monit_route">
			
 
				+        <div
			
 
				+          :class="['route_box', i === route_index ? 'route_active' : '']"
			
 
				+          v-for="(item, i) in bigMonitList"
			
 
				+          :key="item.id"
			
 
				+          @click="updateRoute(i, item)">{{item.cameraName}}</div>
			
 
				+      </div>
			
 
				+      <div class="video_back">
			
 
				+        <div class="video_left_bottom"></div>
			
 
				+        <div class="video_right_bottom"></div>
			
 
				+        <div class="video_left_top">
			
 
				+          <div class="video_shi" @click="setView">
			
 
				+            <div class="video_icon"></div>
			
 
				+            <div style="color: #fff;">视图</div>
			
 
				           </div>
			
 
				-        </swiper-slide>
			
 
				-      </swiper>
			
 
				-    </div>
			
 
				-    <div class="monit_left" v-show="show">
			
 
				-      <div style="flex: 1; background-color: #fff">
			
 
				-        <div class="boxTile" :class="[videoActive === i ? 'active' : '']" v-for="(item, i) in options" :key="i" @click="setVideo(item, i)">
			
 
				-          {{item.cameraName}}
			
 
				         </div>
			
 
				-      </div>
			
 
				-      <div class="monit-scroll" style="flex: 1; overflow: auto; background-color: #fff">
			
 
				-        <div class="boxTile" :class="[active === i ? 'active' : '']" v-for="(item, i) in videoItem" :key="i" @click="getVideoItems(item, i)">
			
 
				-          {{item.cameraName}}
			
 
				+        <div class="video_right_top">
			
 
				+          <div class="video_full" @click="onFull">
			
 
				+            <div class="video_full_icon"></div>
			
 
				+            <div style="color: #fff;">全屏</div>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+        <div class="video_iframe">
			
 
				+          <iframe v-if="num === 1 && isVideo" name="myIframe" :src="'static/jinm/index.html?'+'1'+','+ selectList[0].wsUrl +','+ selectList[0].rtspUrl + ',' +'100%' + ',' + '0'" style="width: 100%; height: 100%; margin: 0 auto;" frameborder="0"  allowfullscreen="true"></iframe>
			
 
				+          <template v-if="num === 4">
			
 
				+            <iframe
			
 
				+              v-for="(item, i) in selectList"
			
 
				+              :key="i"
			
 
				+              :src="'static/jinm/index.html?'+'1'+','+ item.wsUrl +','+ item.rtspUrl + ',' +'100%' + ',' + '0'"
			
 
				+              frameborder="0"
			
 
				+              allowfullscreen="true"
			
 
				+              class="iframe_list"
			
 
				+            ></iframe>
			
 
				+          </template>
			
 
				+        </div>
			
 
				+        <!-- 视图  -->
			
 
				+        <div v-show="show" class="view_num" @click="cut">
			
 
				+          {{num !== 1 ? '一分屏 ' : '四分屏'}}
			
 
				         </div>
			
 
				       </div>
			
 
				-      <div class="cancel" @click="show=false">关闭监控列表</div>
			
 
				     </div>
			
 
				-    <div class="monit-dialog" v-show="showVideo" @click="showVideo = false">
			
 
				-      <div class="monit-content1">
			
 
				-        <div class="monit_box">
			
 
				-          <h3>视 频 配 置</h3>
			
 
				-          <div class="monit_flex">
			
 
				-            <div class="monit_bise">
			
 
				-              展 示 轮 巡
			
 
				+    <div class="monit_right">
			
 
				+      <div class="monit_dis">
			
 
				+        <div :class="['dis_content', dis === 1 ? 'dis_active' : '']" @click="cutMonit(1)">位置划分</div>
			
 
				+        <div :class="['dis_content', dis === 2 ? 'dis_active' : '']"  @click="cutMonit(2)">功能划分</div>
			
 
				+      </div>
			
 
				+      <div class="monit_scroll">
			
 
				+        <template v-if="dis === 1 ">
			
 
				+          <template v-for="(item, i) in options">
			
 
				+            <div :key="i">
			
 
				+              <div class="monit_index" @click="clickParent(i)">
			
 
				+                <i class="el-icon-caret-right" v-show="!item.isShow"></i>
			
 
				+                <i class="el-icon-caret-bottom" v-show="item.isShow"></i>
			
 
				+                <span class="padding_left_text">{{item.cameraName}}</span>
			
 
				+              </div>
			
 
				+              <div
			
 
				+                v-show="item.isShow"
			
 
				+                :class="['monit_item', n.isShow ? 'monit_item_active': '']"
			
 
				+                v-for="(n) in item.cameraList"
			
 
				+                :key="n.id"
			
 
				+                @click="clickChild(n.id)">
			
 
				+                <span>{{n.cameraName}}</span>
			
 
				+                <div v-show="n.isShow" class="position_text">查看中</div>
			
 
				+              </div>
			
 
				             </div>
			
 
				-            <div class="monit_bise" @click.stop>
			
 
				-              <el-switch
			
 
				-                active-color="#13ce66"
			
 
				-                inactive-color="#ff4949"
			
 
				-                v-model="$store.state.screenVideo"
			
 
				-                @change="changeMode"></el-switch>
			
 
				+          </template>
			
 
				+        </template>
			
 
				+        <template v-else-if="dis === 2">
			
 
				+          <template v-for="(item, i) in monitList">
			
 
				+            <div :key="i">
			
 
				+              <div class="monit_index" @click="clickParent(i)">
			
 
				+                <i class="el-icon-caret-right" v-show="!item.isShow"></i>
			
 
				+                <i class="el-icon-caret-bottom" v-show="item.isShow"></i>
			
 
				+                <span class="padding_left_text">{{item.cameraName}}</span>
			
 
				+              </div>
			
 
				+              <!--     v-show="item.isShow"         -->
			
 
				+              <div
			
 
				+                v-show="item.isShow"
			
 
				+                :class="['monit_item', n.isShow ? 'monit_item_active': '']"
			
 
				+                v-for="(n) in item.cameraList"
			
 
				+                :key="n.id"
			
 
				+                @click="clickChild(n.id)">
			
 
				+                <span>{{n.cameraName}}</span>
			
 
				+                <div v-show="n.isShow" class="position_text">查看中</div>
			
 
				+              </div>
			
 
				             </div>
			
 
				-          </div>
			
 
				-        </div>
			
 
				+          </template>
			
 
				+        </template>
			
 
				       </div>
			
 
				     </div>
			
 
				   </div>
			
 
				 </template>
			
 
				 
			
 
				 <script>
			
 
				-import { swiper, swiperSlide } from 'vue-awesome-swiper'
			
 
				-import 'swiper/css/swiper.css'
			
 
				-import {getVideoAll, getVideo, saveVideo, lastVideo, romVideo, findOne, findUpdate} from "@/utils/api";
			
 
				-import axios from "axios";
			
 
				+// import { swiper, swiperSlide } from 'vue-awesome-swiper'
			
 
				+// import 'swiper/css/swiper.css'
			
 
				+import {getVideoAll, getVideo, saveVideo, lastVideo, romVideo, findOne, findUpdate, getVideoLsitAndCamera} from "@/utils/api";
			
 
				+// import axios from "axios";
			
 
				 import { mapActions } from "vuex";
			
 
				-const c_swiper = document.getElementsByClassName("swiper")
			
 
				+// const c_swiper = document.getElementsByClassName("swiper")
			
 
				 
			
 
				 export default {
			
 
				   name: "Monit",
			
 
				   components: {
			
 
				-    swiper,
			
 
				-    swiperSlide,
			
 
				+    // swiper,
			
 
				+    // swiperSlide,
			
 
				   },
			
 
				   data() {
			
 
				     // let self = this;
			
 
				     return {
			
 
				-      swiperOption: {
			
 
				-        direction: 'vertical',
			
 
				-        slidesPerView: 3,
			
 
				-        slidesPerColumn: 1,
			
 
				-        slidesPerGroup: 3,
			
 
				-        // spaceBetween: 30,
			
 
				-        autoplay: {
			
 
				-          delay: 10000,
			
 
				-          disableOnInteraction: false
			
 
				-        },
			
 
				-        on: {
			
 
				-          slideChange() {
			
 
				-            // console.log(c_swiper[0].swiper)
			
 
				-            // this.num = c_swiper[0].swiper.activeIndex
			
 
				-            self.returnNum(c_swiper[0].swiper.activeIndex)
			
 
				-            // console.log(this.num);
			
 
				-            // return this.num
			
 
				-          }
			
 
				-        }
			
 
				-      },
			
 
				       videoId: '',
			
 
				       isShow: false,
			
 
				       isVideo: false,
			
@@ -110,13 +184,24 @@ export default {
 
				       cameraTwo: '',
			
 
				       videoList: [],
			
 
				       timer: null,
			
 
				-      num: 0,
			
 
				+      num: 1,
			
 
				       index: true,
			
 
				       videoActive: 0,
			
 
				       videoItem: [],
			
 
				       active: '',
			
 
				       show: false,
			
 
				       showVideo: false,
			
 
				+      // 功能划分，位置划分
			
 
				+      dis: 1,
			
 
				+      selectList: [],
			
 
				+      selectIds: [],
			
 
				+      // 功能区大列表
			
 
				+      bigMonitList: [],
			
 
				+      // 功能区列表
			
 
				+      monitList: [],
			
 
				+      route_index: '',
			
 
				+      // 选中monitid
			
 
				+      monitId: '',
			
 
				     }
			
 
				   },
			
 
				   watch: {
			
@@ -143,27 +228,40 @@ export default {
 
				   },
			
 
				   methods: {
			
 
				     ...mapActions(['setScreenVideoAsync']),
			
 
				-    init() {
			
 
				+    async init () {
			
 
				       var that = this;
			
 
				-      axios.all([
			
 
				-        getVideoAll({}),
			
 
				-          lastVideo({})
			
 
				-      ]).then(axios.spread(function(res1, res2) {
			
 
				-        if(res1.code === 10000) {
			
 
				-          res1.data.forEach(item => {
			
 
				-            item.cameraList.forEach(items => {
			
 
				-              items.runStatus = !items.runStatus
			
 
				-            })
			
 
				+      let res1 = await getVideoAll({});
			
 
				+      if(res1.code === 10000){
			
 
				+        res1.data.forEach(item => {
			
 
				+          item.isShow = false;
			
 
				+          item.cameraList.forEach(items => {
			
 
				+            items.runStatus = !items.runStatus;
			
 
				+            items.isShow = false;
			
 
				           })
			
 
				-          that.options = res1.data;
			
 
				-          that.videoItem = that.options[0].cameraList;
			
 
				-        }
			
 
				-        if(res2.code === 10000) {
			
 
				-          that.isVideo = true;
			
 
				-          that.cameraOne = res2.data.wsUrl;
			
 
				-          that.cameraTwo = res2.data.rtspUrl;
			
 
				-        }
			
 
				-      }))
			
 
				+        })
			
 
				+        that.options = res1.data;
			
 
				+        that.videoItem = that.options[0].cameraList;
			
 
				+      }
			
 
				+
			
 
				+      let res2 = await lastVideo({});
			
 
				+      if(res2.code === 10000) {
			
 
				+        that.selectList = [res2.data]
			
 
				+        that.isVideo = true;
			
 
				+        this.options.forEach(items => {
			
 
				+          items.cameraList.forEach(item => {
			
 
				+            if(item.id == this.selectList[0].id) {
			
 
				+              item.isShow = true;
			
 
				+            } else {
			
 
				+              item.isShow = false;
			
 
				+            }
			
 
				+          })
			
 
				+        })
			
 
				+      }
			
 
				+
			
 
				+      let res3 = await getVideoLsitAndCamera({});
			
 
				+      if(res3.code === 10000) {
			
 
				+        this.bigMonitList = res3.data;
			
 
				+      }
			
 
				     },
			
 
				     handleChange(value) {
			
 
				       let val = value[value.length - 1];
			
@@ -192,19 +290,14 @@ export default {
 
				     setVideo(item, i) {
			
 
				       this.videoItem = item.cameraList;
			
 
				       this.videoActive = i;
			
 
				+      this.active = '';
			
 
				     },
			
 
				-    getVideoItems(item, i) {
			
 
				-      this.active = i;
			
 
				+    getVideoItems(item) {
			
 
				       let params= {
			
 
				-        cameraIds: [item.id],
			
 
				+        cameraIds: item,
			
 
				       }
			
 
				       getVideo(params).then(res =>{
			
 
				-        this.isVideo = true;
			
 
				-        this.cameraOne = res.data[0].wsUrl;
			
 
				-        this.cameraTwo = res.data[0].rtspUrl;
			
 
				-        saveVideo({cameraId: item.id}).then(res => {
			
 
				-          console.log(res)
			
 
				-        })
			
 
				+        this.selectList = res.data;
			
 
				       })
			
 
				     },
			
 
				     initConfig() {
			
@@ -227,22 +320,175 @@ export default {
 
				           console.log(res)
			
 
				         })
			
 
				         this.setScreenVideoAsync(val)
			
 
				+    },
			
 
				+    cutMonit(num) {
			
 
				+      if(this.dis !== num) {
			
 
				+        this.selectIds = [];
			
 
				+        this.dis = num;
			
 
				+        this.route_index = '';
			
 
				+      }
			
 
				+      this.options.forEach(items => {
			
 
				+        items.isShow = false;
			
 
				+        items.cameraList.forEach(item => {
			
 
				+          item.isShow = false;
			
 
				+        })
			
 
				+      })
			
 
				+      if(num === 2) {
			
 
				+        if(this.bigMonitList.length > 0) {
			
 
				+          this.monitList = this.bigMonitList[0].functionList;
			
 
				+          this.route_index = 0;
			
 
				+        }
			
 
				+        this.monitList.forEach(items => {
			
 
				+          items.isShow = false;
			
 
				+          items.cameraList.forEach(item => {
			
 
				+            item.isShow = false;
			
 
				+          })
			
 
				+        })
			
 
				+      }
			
 
				+    },
			
 
				+    // 新加
			
 
				+    clickParent(i) {
			
 
				+      if(this.dis === 1) {
			
 
				+        this.options.forEach((item, index) => {
			
 
				+          if(i == index) {
			
 
				+            item.isShow = !item.isShow
			
 
				+          } else {
			
 
				+            item.isShow = false
			
 
				+          }
			
 
				+        })
			
 
				+      } else if(this.dis === 2) {
			
 
				+        this.monitList.forEach((item, index) => {
			
 
				+          if(i == index) {
			
 
				+            item.isShow = !item.isShow;
			
 
				+          } else {
			
 
				+            item.isShow = false
			
 
				+          }
			
 
				+        })
			
 
				+        this.$forceUpdate()
			
 
				+      }
			
 
				+      // this.options[i].isShow = !this.options[i].isShow;
			
 
				+    },
			
 
				+    clickChild(id){
			
 
				+      // 单向
			
 
				+      if(this.num === 1) {
			
 
				+        this.getVideoItems([id]);
			
 
				+        if(this.dis === 1) {
			
 
				+          this.options.forEach(items => {
			
 
				+            items.cameraList.forEach(item => {
			
 
				+              if(item.id == id) {
			
 
				+                item.isShow = true;
			
 
				+              } else {
			
 
				+                item.isShow = false;
			
 
				+              }
			
 
				+            })
			
 
				+          })
			
 
				+        } else {
			
 
				+          this.monitList.forEach(items => {
			
 
				+            items.cameraList.forEach(item => {
			
 
				+              if(item.id == id) {
			
 
				+                item.isShow = true;
			
 
				+              } else {
			
 
				+                item.isShow = false;
			
 
				+              }
			
 
				+            })
			
 
				+          })
			
 
				+        }
			
 
				+      } else {
			
 
				+        // 4路
			
 
				+        let delId = '';
			
 
				+        if(this.selectIds.indexOf(id) > -1) {
			
 
				+          return;
			
 
				+        } else {
			
 
				+          if(this.selectIds.length > 3) {
			
 
				+            delId = this.selectIds[0];
			
 
				+            this.selectIds.shift();
			
 
				+            this.selectIds.push(id);
			
 
				+          } else {
			
 
				+            this.selectIds.push(id);
			
 
				+          }
			
 
				+          this.getVideoItems(this.selectIds);
			
 
				+          if(this.dis === 1) {
			
 
				+            this.options.forEach(items => {
			
 
				+              items.cameraList.forEach(item => {
			
 
				+                if(item.id == delId) {
			
 
				+                  item.isShow = false;
			
 
				+                }
			
 
				+                if(item.id == id) {
			
 
				+                  item.isShow = true;
			
 
				+                }
			
 
				+              })
			
 
				+            })
			
 
				+          } else {
			
 
				+            this.monitList.forEach(items => {
			
 
				+              items.cameraList.forEach(item => {
			
 
				+                if(item.id == delId) {
			
 
				+                  item.isShow = false;
			
 
				+                }
			
 
				+                if(item.id == id) {
			
 
				+                  item.isShow = true;
			
 
				+                }
			
 
				+              })
			
 
				+            })
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+      this.monitId = id;
			
 
				+      // this.options[i].cameraList[k].isShow = !this.options[i].cameraList[k].isShow;
			
 
				+    },
			
 
				+    // 点击视图
			
 
				+    setView() {
			
 
				+      this.show = !this.show;
			
 
				+    },
			
 
				+    // 全屏
			
 
				+    onFull() {
			
 
				+      let video = window.frames['myIframe'].document.getElementById('video');
			
 
				+      if (video.requestFullscreen) { //w3c
			
 
				+        video.requestFullscreen();
			
 
				+      } else if (video.mozRequestFullScreen) { //moz Firefox
			
 
				+        video.mozRequestFullScreen();
			
 
				+      } else if (video.msRequestFullscreen) { //IE
			
 
				+        video.msRequestFullscreen();
			
 
				+      } else if (video.oRequestFullscreen) { //Opera
			
 
				+        video.oRequestFullscreen();
			
 
				+      } else if (video.webkitRequestFullscreen) { //webkit内核 Chrome Safari
			
 
				+        video.webkitRequestFullScreen();
			
 
				+      }
			
 
				+    },
			
 
				+    cut() {
			
 
				+      if(this.num === 1) {
			
 
				+        this.num = 4;
			
 
				+        this.selectIds = [];
			
 
				+        this.selectIds.push(this.selectList[0].id);
			
 
				+      } else {
			
 
				+        this.num = 1;
			
 
				+      }
			
 
				+      this.show = false;
			
 
				+    },
			
 
				+    updateRoute(i, item) {
			
 
				+      this.route_index = i;
			
 
				+      this.dis = 2;
			
 
				+      let arr = [];
			
 
				+      item.functionList.forEach(items => {
			
 
				+        items.isShow = false;
			
 
				+        items.cameraList.forEach(items => {
			
 
				+          items.runStatus = !items.runStatus;
			
 
				+          items.isShow = false;
			
 
				+        })
			
 
				+      })
			
 
				+      arr = item.functionList;
			
 
				+      this.monitList = arr;
			
 
				     }
			
 
				   },
			
 
				   mounted() {
			
 
				     this.init()
			
 
				     this.initCrmea();
			
 
				     this.initConfig();
			
 
				-    var that = this;
			
 
				-    if(this.$store.state.screenVideo) {
			
 
				-      this.timer = setInterval(() => {
			
 
				-        that.initCrmea();
			
 
				-      }, 60000)
			
 
				-    }
			
 
				+
			
 
				   },
			
 
				   beforeDestroy() {
			
 
				-    clearInterval(this.timer);
			
 
				-    this.timer = null;
			
 
				+    saveVideo({cameraId: this.monitId}).then(res => {
			
 
				+      console.log(res)
			
 
				+    })
			
 
				   }
			
 
				 }
			
 
				 </script>
			
@@ -252,179 +498,148 @@ export default {
 
				     width: 100%;
			
 
				     height: 100%;
			
 
				     box-sizing: border-box;
			
 
				-    padding: 20px 0 0 0;
			
 
				+    padding: 10px 0 0 0;
			
 
				     display: flex;
			
 
				     justify-content: space-between;
			
 
				     position: relative;
			
 
				   }
			
 
				-  .monit-left {
			
 
				-    flex: 1;
			
 
				+  .monit_left {
			
 
				+    width: 1450px;
			
 
				     height: 100%;
			
 
				-    background: url("../../assets/BioSafety/kuang.png") no-repeat;
			
 
				-    background-size: 100% 100%;
			
 
				-    position: relative;
			
 
				-    box-sizing: border-box;
			
 
				-    padding: 40px 30px 30px 30px;
			
 
				-    display: flex;
			
 
				-    align-items: center;
			
 
				-  }
			
 
				-  .monit-right {
			
 
				-    width: 450px;
			
 
				-    margin-left: 20px;
			
 
				   }
			
 
				-  .case {
			
 
				+  .video_back {
			
 
				     width: 100%;
			
 
				-    height: 100%;
			
 
				-    background: url("../../assets/BioSafety/kuang.png") no-repeat;
			
 
				+    height: calc(100% - 70px);
			
 
				+    background: url("../../assets/video.png") no-repeat;
			
 
				     background-size: 100% 100%;
			
 
				-    box-sizing: border-box;
			
 
				-    padding: 20px;
			
 
				+    position: relative;
			
 
				   }
			
 
				-  .monit-title {
			
 
				-    width: 300px;
			
 
				-    height: 40px;
			
 
				+  .video_shi {
			
 
				+    width: 35px;
			
 
				+    height: 60px;
			
 
				     position: absolute;
			
 
				-    top: 0;
			
 
				-    left: 50%;
			
 
				-    line-height: 40px;
			
 
				-    transform: translate(-50% , 0);
			
 
				-    background-color: #031032;
			
 
				-    text-align: center;
			
 
				-    color: white;
			
 
				-    font-size: 18px;
			
 
				-    display: flex;
			
 
				-    justify-content: center;
			
 
				-    align-items: center;
			
 
				+    top: 20px;
			
 
				+    left: 30px;
			
 
				+    cursor: pointer;
			
 
				+  }
			
 
				+  .video_full {
			
 
				+    width: 35px;
			
 
				+    height: 60px;
			
 
				+    position: absolute;
			
 
				+    top: 25px;
			
 
				+    right: 25px;
			
 
				     cursor: pointer;
			
 
				   }
			
 
				-  .icon {
			
 
				-    width: 18px;
			
 
				-    height: 18px;
			
 
				-    display: inline-block;
			
 
				-    background: url("../../assets/Zoology/u5069.svg") no-repeat;
			
 
				+  .video_icon {
			
 
				+    width: 35px;
			
 
				+    height: 35px;
			
 
				+    background: url("../../assets/shitu.png") no-repeat;
			
 
				     background-size: 100% 100%;
			
 
				-    margin-top: 10px;
			
 
				   }
			
 
				-  .monit-content {
			
 
				-    /*width: 1180px;*/
			
 
				-    /*height: 300px;*/
			
 
				-    position: absolute;
			
 
				-    top: 45px;
			
 
				-    left: 50%;
			
 
				-    transform: translate(-50% , 0);
			
 
				-    border: 5px solid #00FFFF;
			
 
				-    border-radius: 10px;
			
 
				-    background-color: #323232;
			
 
				-    display: flex;
			
 
				-    box-sizing: border-box;
			
 
				-    padding: 60px 20px;
			
 
				+  .video_full_icon {
			
 
				+    width: 35px;
			
 
				+    height: 35px;
			
 
				+    background: url("../../assets/full.png") no-repeat;
			
 
				+    background-size: 100% 100%;
			
 
				   }
			
 
				-  .content-flex {
			
 
				-    flex: 1;
			
 
				+  .monit_right {
			
 
				+    width: 340px;
			
 
				+    height: 100%;
			
 
				+    box-sizing: border-box;
			
 
				+    background: rgba(42,130,228,0.1200);
			
 
				+    box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.5000);
			
 
				+    border: 1px solid #19ADBA;
			
 
				+    padding: 10px 10px;
			
 
				   }
			
 
				-  .monit_left {
			
 
				-    width: 400px;
			
 
				-    height: 640px;
			
 
				-    position: fixed;
			
 
				-    top: 0;
			
 
				-    left: 0;
			
 
				-    background-color: rgba(0,0,0, .5);
			
 
				+  .monit_dis {
			
 
				+    width: 100%;
			
 
				+    height: 40px;
			
 
				     box-sizing: border-box;
			
 
				-    padding: 20px;
			
 
				+    border: 1px solid #ddd;
			
 
				     display: flex;
			
 
				   }
			
 
				-  .boxTile {
			
 
				-    width: 120px;
			
 
				-    height: 30px;
			
 
				-    line-height: 30px;
			
 
				-    border: 1px solid #ddd;
			
 
				-    text-align: center;
			
 
				-    margin: 10px auto;
			
 
				+  .dis_content {
			
 
				+    width: 50%;
			
 
				+    height: 38px;
			
 
				+    line-height: 38px;
			
 
				+    font-size: 16px;
			
 
				+    color: #fff;
			
 
				     cursor: pointer;
			
 
				   }
			
 
				-  .active {
			
 
				-    background-color: #009cff;
			
 
				+  .dis_active {
			
 
				+    background: #19ADBA;
			
 
				   }
			
 
				-  .btn {
			
 
				-    width: 60px;
			
 
				-    height: 30px;
			
 
				-    line-height: 30px;
			
 
				-    background-color: #009cff;
			
 
				-    text-align: center;
			
 
				-    color: white;
			
 
				-    position: absolute;
			
 
				-    top: -15px;
			
 
				-    cursor: pointer;
			
 
				+  .monit_scroll {
			
 
				+    width: 100%;
			
 
				+    height: calc(100% - 50px);
			
 
				+    overflow: auto;
			
 
				+    /*display: flex;*/
			
 
				   }
			
 
				-  .btn-fixed {
			
 
				-    top: -15px;
			
 
				-    right: 25px;
			
 
				+  .monit_scroll::-webkit-scrollbar {
			
 
				+    display: none;
			
 
				   }
			
 
				-  .cancel {
			
 
				-    width: 80px;
			
 
				-    height: 30px;
			
 
				-    line-height: 30px;
			
 
				-    background-color: #009cff;
			
 
				-    text-align: center;
			
 
				-    color: white;
			
 
				-    position: absolute;
			
 
				-    right: -100px;
			
 
				+
			
 
				+  .monit_index {
			
 
				+    margin: 10px auto;
			
 
				+    box-sizing: border-box;
			
 
				+    width: 334px;
			
 
				+    height: 40px;
			
 
				+    background: url("../../assets/on.png") no-repeat;
			
 
				+    background-size: 100% 100%;
			
 
				+    line-height: 40px;
			
 
				+    text-align: left;
			
 
				+    cursor: pointer;
			
 
				+    font-weight: 400;
			
 
				+    padding-left: 40px;
			
 
				+    color: #FFFFFF;
			
 
				+    text-shadow: 0px 2px 4px rgba(0,0,0,0.5000);
			
 
				+    position: relative;
			
 
				+    user-select: none;
			
 
				+  }
			
 
				+  .monit_item {
			
 
				+    margin: 10px auto;
			
 
				+    box-sizing: border-box;
			
 
				+    width: 334px;
			
 
				+    height: 40px;
			
 
				+    background: url("../../assets/on1.png") no-repeat;
			
 
				+    background-size: 100% 100%;
			
 
				+    line-height: 40px;
			
 
				+    text-align: left;
			
 
				     cursor: pointer;
			
 
				+    font-weight: 400;
			
 
				+    padding-left: 60px;
			
 
				+    color: #FFFFFF;
			
 
				+    text-shadow: 0px 2px 4px rgba(0,0,0,0.5000);
			
 
				+    user-select: none;
			
 
				+    position: relative;
			
 
				   }
			
 
				-  .monit-scroll {
			
 
				-    overflow: auto;
			
 
				+
			
 
				+  .monit_item_active {
			
 
				+    background: url("../../assets/non.png") no-repeat;
			
 
				+    background-size: 100% 100%;
			
 
				   }
			
 
				-  .monit-scroll::-webkit-scrollbar {
			
 
				-    /*滚动条整体样式*/
			
 
				-    width : 5px;  /*高宽分别对应横竖滚动条的尺寸*/
			
 
				-    height: 1px;
			
 
				-  }
			
 
				-  .monit-scroll::-webkit-scrollbar-thumb {
			
 
				-    /*滚动条里面小方块*/
			
 
				-    border-radius   : 8px;
			
 
				-    background-color:  #535353;
			
 
				-    background-image: -webkit-linear-gradient(
			
 
				-      45deg,
			
 
				-      rgba(255, 255, 255, 0.2) 25%,
			
 
				-      transparent 25%,
			
 
				-      transparent 50%,
			
 
				-      rgba(255, 255, 255, 0.2) 50%,
			
 
				-      rgba(255, 255, 255, 0.2) 75%,
			
 
				-      transparent 75%,
			
 
				-      transparent
			
 
				-    );
			
 
				-  }
			
 
				-  .monit-scroll::-webkit-scrollbar-track {
			
 
				-    /*滚动条里面轨道*/
			
 
				-    box-shadow   : inset 0 0 5px rgba(0, 0, 0, 0.2);
			
 
				-    /*background   : #ededed;*/
			
 
				-    border-radius: 10px;
			
 
				-  }
			
 
				-  .monit-dialog {
			
 
				-    width: 100vw;
			
 
				-    height: 100vh;
			
 
				-    position: fixed;
			
 
				+  .padding_left_text {
			
 
				+    padding-left: 10px;
			
 
				+  }
			
 
				+  .position_text {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    position: absolute;
			
 
				     top: 0;
			
 
				-    left: 0;
			
 
				-    background-color: rgba(0,0,0, .9);
			
 
				-    z-index: 999;
			
 
				+    right: 30px;
			
 
				+    color: #23FF00;
			
 
				+
			
 
				   }
			
 
				-  .monit-content1 {
			
 
				-    width: 50%;
			
 
				+  .position_text:before{
			
 
				     position: absolute;
			
 
				+    content: '';
			
 
				+    width: 6px;
			
 
				+    height: 6px;
			
 
				     top: 50%;
			
 
				-    left: 50%;
			
 
				-    transform: translate(-50%, -50%);
			
 
				-    /*background-color: #fff;*/
			
 
				-  }
			
 
				-  .monit_box {
			
 
				-    height: 400px;
			
 
				-    background-color: #007aff;
			
 
				-    border-radius: 15px;
			
 
				-    text-align: center;
			
 
				-    box-sizing: border-box;
			
 
				-    padding: 20px;
			
 
				-    color: #fff;
			
 
				+    left: -15px;
			
 
				+    border-radius: 50%;
			
 
				+    background-color: #23FF00;
			
 
				+    transform: translate(0, -50%);
			
 
				   }
			
 
				   .monit_flex {
			
 
				     display: flex;
			
@@ -435,4 +650,133 @@ export default {
 
				     width: 50%;
			
 
				     height: 50px;
			
 
				   }
			
 
				+  .video_iframe {
			
 
				+    width: 90%;
			
 
				+    height: 90%;
			
 
				+    position: absolute;
			
 
				+    top: 70px;
			
 
				+    left: 75px;
			
 
				+    display: flex;
			
 
				+    flex-flow: row wrap;
			
 
				+    justify-content: center;
			
 
				+    align-content: flex-start
			
 
				+    /*z-index: -9;*/
			
 
				+  }
			
 
				+  .video_left_bottom {
			
 
				+    width: 111px;
			
 
				+    height: 111px;
			
 
				+    background: url("../../assets/111.png") no-repeat;
			
 
				+    background-size: cover;
			
 
				+    position: absolute;
			
 
				+    left: 22px;
			
 
				+    bottom: 22px;
			
 
				+    z-index: 99;
			
 
				+  }
			
 
				+  .video_right_bottom {
			
 
				+    width: 111px;
			
 
				+    height: 111px;
			
 
				+    background: url("../../assets/222.png") no-repeat;
			
 
				+    background-size: cover;
			
 
				+    position: absolute;
			
 
				+    right: 15px;
			
 
				+    bottom: 12px;
			
 
				+    z-index: 99;
			
 
				+  }
			
 
				+  .video_left_top{
			
 
				+    width: 111px;
			
 
				+    height: 111px;
			
 
				+    background: url("../../assets/333.png") no-repeat;
			
 
				+    background-size: cover;
			
 
				+    position: absolute;
			
 
				+    z-index: 99;
			
 
				+    top: 19px;
			
 
				+    left: 26px;
			
 
				+  }
			
 
				+  .video_right_top {
			
 
				+    width: 111px;
			
 
				+    height: 111px;
			
 
				+    background: url("../../assets/444.png") no-repeat;
			
 
				+    background-size: cover;
			
 
				+    position: absolute;
			
 
				+    z-index: 99;
			
 
				+    top: 34px;
			
 
				+    right: 17px;
			
 
				+  }
			
 
				+  .view_num {
			
 
				+    width: 111px;
			
 
				+    height: 111px;
			
 
				+    background: url("../../assets/222.png") no-repeat;
			
 
				+    background-size: 100% 100%;
			
 
				+    position: absolute;
			
 
				+    top: 46px;
			
 
				+    left: 55px;
			
 
				+    line-height: 111px;
			
 
				+    box-sizing: border-box;
			
 
				+    padding-left: 20px;
			
 
				+    color: #fff;
			
 
				+    font-size: 16px;
			
 
				+    cursor: pointer;
			
 
				+    z-index: 99;
			
 
				+  }
			
 
				+  .view_box {
			
 
				+    width: 36px;
			
 
				+    cursor: pointer;
			
 
				+  }
			
 
				+  .box_icon {
			
 
				+    width: 36px;
			
 
				+    height: 36px;
			
 
				+    margin-bottom: 10px;
			
 
				+  }
			
 
				+  .box_icon_one {
			
 
				+    background: url("../../assets/oneActive.png") no-repeat;
			
 
				+    background-size: cover;
			
 
				+  }
			
 
				+  .box_icon_one_no {
			
 
				+    background: url("../../assets/oneActiveNo.png") no-repeat;
			
 
				+    background-size: cover;
			
 
				+  }
			
 
				+  .box_icon_four {
			
 
				+    background: url("../../assets/fourActive.png") no-repeat;
			
 
				+    background-size: cover;
			
 
				+  }
			
 
				+  .box_icon_four_no {
			
 
				+    background: url("../../assets/fourActiveNo.png") no-repeat;
			
 
				+    background-size: cover;
			
 
				+  }
			
 
				+  .iframe_list {
			
 
				+    width: 635px;
			
 
				+    height: 351px;
			
 
				+    /*margin: 0 auto;*/
			
 
				+    border: 1px solid #007aff;
			
 
				+  }
			
 
				+  /*.iframe_list:nth-child(n) {*/
			
 
				+  /*  margin-left: 10px;*/
			
 
				+  /*}*/
			
 
				+  /*.iframe_list:nth-child(2n) {*/
			
 
				+  /*  margin-right: 8px;*/
			
 
				+  /*}*/
			
 
				+  .monit_route {
			
 
				+    width: 100%;
			
 
				+    height: 60px;
			
 
				+    margin-bottom: 10px;
			
 
				+    display: flex;
			
 
				+    justify-content: space-around;
			
 
				+    align-items: center;
			
 
				+  }
			
 
				+  .route_box {
			
 
				+    width: 150px;
			
 
				+    height: 52px;
			
 
				+    /*border: 1px solid #Ddd;*/
			
 
				+    border-radius: 5px;
			
 
				+    line-height: 52px;
			
 
				+    color: #fff;
			
 
				+    cursor: pointer;
			
 
				+    background: url("../../assets/noActive.png") no-repeat;
			
 
				+    background-size: 100% 100%;
			
 
				+    font-size: 14px;
			
 
				+  }
			
 
				+  .route_active {
			
 
				+    background: url("../../assets/xuan.png") no-repeat;
			
 
				+    background-size: 100% 100%;
			
 
				+  }
			
 
				 </style>
			
--- a/src/views/Production/Production.vue
+++ b/src/views/Production/Production.vue
@@ -201,7 +201,7 @@
 
				                   <p>{{ monthAmount }}头</p>
			
 
				                 </div>
			
 
				                 <div class="up">
			
 
				-                  <label>本月销售额</label>
			
 
				+                  <label>上月销售额</label>
			
 
				                   <span>{{ weekSales }}元</span>
			
 
				                   <div class="sales-change">
			
 
				                     <div>
			
@@ -220,7 +220,7 @@
 
				                   </div>
			
 
				                 </div>
			
 
				                 <div class="down">
			
 
				-                  <label>本月销售量</label>
			
 
				+                  <label>上月销售量</label>
			
 
				                   <span>{{ weekSalesVolume }}头</span>
			
 
				                   <div class="sales-change">
			
 
				                     <div>
			
@@ -414,6 +414,7 @@ export default {
 
				         month: [],
			
 
				         pigletStock: [],
			
 
				         sowStock: [],
			
 
				+        backPigStock: [],
			
 
				       },
			
 
				       pickerOptions: {
			
 
				         // 快捷选项
			
@@ -584,7 +585,9 @@ export default {
 
				               res.data["grice_stock"],
			
 
				               res.data["piglet_stock"],
			
 
				               res.data["fatpig_stock"],
			
 
				+              res.data['sow_stock_5']
			
 
				             ];
			
 
				+            console.log(this.inventoryPieData)
			
 
				             this.amountPieData = {
			
 
				               name: ["妊娠", "哺乳", "空怀", "后备"],
			
 
				               data: [
			
@@ -613,6 +616,7 @@ export default {
 
				             month: [],
			
 
				             pigletStock: [],
			
 
				             sowStock: [],
			
 
				+            backPigStock: [],
			
 
				           };
			
 
				         }
			
 
				       });
			
@@ -638,6 +642,7 @@ export default {
 
				               if (item === "psy") {
			
 
				                 itemNum = res.data[item].stockQuantity;
			
 
				               }
			
 
				+              console.log(itemNum)
			
 
				               this.importantData.push({
			
 
				                 id: res.data[item].id,
			
 
				                 name: res.data[item].stockName,
			
@@ -647,6 +652,15 @@ export default {
 
				           }
			
 
				           this.dataLoading = false;
			
 
				         }
			
 
				+        // this.importantData = [
			
 
				+        //   { id: 1, name: '产房成活率', num: '96.15%' },
			
 
				+        //   { id: 2, name: '保育成活率', num: '96.39%' },
			
 
				+        //   { id: 3, name: '肥猪成活率', num: '97.25%' },
			
 
				+        //   { id: 4, name: '7日断配率', num: '83.5%' },
			
 
				+        //   { id: 5, name: '配种分娩率', num: '89.82%' },
			
 
				+        //   { id: 6, name: 'PSY', num: '23.96' },
			
 
				+        // ]
			
 
				+
			
 
				       });
			
 
				     },
			
 
				     // 应付排名
			
--- a/src/views/Production/board/ChartAmountLine.vue
+++ b/src/views/Production/board/ChartAmountLine.vue
@@ -39,7 +39,7 @@ export default {
 
				         // legend: {
			
 
				         //   data: ['头']
			
 
				         // },
			
 
				-        color: ["#3aa0ff", "#403DEA", "#226942", "#1AD06C", "#975fe4"],
			
 
				+        color: ["#3aa0ff", "#403DEA", "#226942", "#1AD06C", "#975fe4", '#6A8FF1'],
			
 
				         grid: {
			
 
				           top: "22%",
			
 
				           left: "10%",
			
@@ -182,13 +182,20 @@ export default {
 
				               },
			
 
				             },
			
 
				           },
			
 
				-          // {
			
 
				-          //   name: '湿度',
			
 
				-          //   type: 'line',
			
 
				-          //   smooth: false,
			
 
				-          //   yAxisIndex: 1,
			
 
				-          //   data: [20, 22, 33, 45, 63, 102, 23, 24, 23, 65, 50, 62]
			
 
				-          // }
			
 
				+          {
			
 
				+            name: "后备猪存栏",
			
 
				+            type: "line",
			
 
				+            smooth: false,
			
 
				+            data: this.data.backPigStock,
			
 
				+            itemStyle: {
			
 
				+              normal: {
			
 
				+                color: "#6A8FF1",
			
 
				+                lineStyle: {
			
 
				+                  color: "#6A8FF1",
			
 
				+                },
			
 
				+              },
			
 
				+            },
			
 
				+          }
			
 
				         ],
			
 
				       };
			
 
				       this.myChart.setOption(options);
			
--- a/src/views/Production/board/ChartAmountPie.vue
+++ b/src/views/Production/board/ChartAmountPie.vue
@@ -50,7 +50,7 @@ export default {
 
				           },
			
 
				         },
			
 
				         legend: {
			
 
				-          top: "25%",
			
 
				+          top: "18%",
			
 
				           left: "55%",
			
 
				           orient: "vertical",
			
 
				           icon: "circle",
			
@@ -124,13 +124,13 @@ export default {
 
				               show: false,
			
 
				               // position: 'center'
			
 
				             },
			
 
				-            emphasis: {
			
 
				-              label: {
			
 
				-                show: false,
			
 
				-                fontSize: "40",
			
 
				-                fontWeight: "bold",
			
 
				-              },
			
 
				-            },
			
 
				+            // emphasis: {
			
 
				+            //   label: {
			
 
				+            //     show: false,
			
 
				+            //     fontSize: "40",
			
 
				+            //     fontWeight: "bold",
			
 
				+            //   },
			
 
				+            // },
			
 
				             labelLine: {
			
 
				               show: false,
			
 
				             },
			
@@ -144,11 +144,12 @@ export default {
 
				                     "#226942",
			
 
				                     "#1AD06C",
			
 
				                     "#975fe4",
			
 
				+                    "#6A8FF1"
			
 
				                   ];
			
 
				                   return colorList[colors.dataIndex];
			
 
				                 },
			
 
				-                borderWidth: 3, // 设置各项空隙，白边
			
 
				-                borderColor: "#fff",
			
 
				+                // borderWidth: 3, // 设置各项空隙，白边
			
 
				+                // borderColor: "#fff",
			
 
				               },
			
 
				             },
			
 
				             data: [
			
@@ -157,6 +158,7 @@ export default {
 
				               { value: this.data[2].stockQuantity, name: "哺乳猪存栏" },
			
 
				               { value: this.data[3].stockQuantity, name: "保育猪存栏" },
			
 
				               { value: this.data[4].stockQuantity, name: "育肥猪存栏" },
			
 
				+              { value: this.data[5].stockQuantity, name: '后备猪存栏'}
			
 
				             ],
			
 
				           },
			
 
				         ],
			
--- a/src/views/Production/board/ChartSales.vue
+++ b/src/views/Production/board/ChartSales.vue
@@ -42,41 +42,39 @@ export default {
 
				       let dataAxis = this.data.timeList;
			
 
				       let start = dataAxis.length - 12;
			
 
				       let end = dataAxis.length - 1;
			
 
				-      let quantityList = this.data.quantityList;
			
 
				-      let moneyListTooltip = this.data.moneyList1;
			
 
				+      // let quantityList = this.data.quantityList;
			
 
				+      // let moneyListTooltip = this.data.moneyList1;
			
 
				       let options = {
			
 
				         tooltip: {
			
 
				           trigger: "axis",
			
 
				-          formatter: (params) => {
			
 
				-            var res = "<div>" + params[0].name + "</div>"; // 字符串形式的html标签会被echarts转换渲染成数据，这个res主要是画的tooltip里的上部分的标题部分
			
 
				-            const index = this.data.moneyList.findIndex(
			
 
				-              (item) => item === params[0].value
			
 
				-            );
			
 
				-            for (var i = 0; i < params.length; i++) {
			
 
				-              //因为是个数组，所以要遍历拿到里面的数据，并加入到tooltip的数据内容部分里面去
			
 
				-              res +=
			
 
				-                `<div>
			
 
				-                  <span style="display:inline-block;margin-right:5px;border-radius:5px;width:10px;height:10px;background-color:${[
			
 
				-                    params[i].color, // 默认是小圆点，我们将其修改成有圆角的正方形，这里用的是模板字符串。并拿到对应颜色、名字、数据
			
 
				-                  ]};"></span>
			
 
				-                  ${moneyListTooltip[index]}元
			
 
				-                </div>` +
			
 
				-                `<div><span style="display:inline-block;margin-right:5px;border-radius:5px;width:10px;height:10px;background-color:${[
			
 
				-                  params[i].color,
			
 
				-                ]};"></span>${quantityList[index]}头</div>`;
			
 
				-            }
			
 
				-            return res;
			
 
				-          },
			
 
				+          // formatter: (params) => {
			
 
				+          //   var res = "<div>" + params[0].name + "</div>"; // 字符串形式的html标签会被echarts转换渲染成数据，这个res主要是画的tooltip里的上部分的标题部分
			
 
				+          //   const index = this.data.moneyList.findIndex(
			
 
				+          //     (item) => item === params[0].value
			
 
				+          //   );
			
 
				+          //   for (var i = 0; i < params.length; i++) {
			
 
				+          //     //因为是个数组，所以要遍历拿到里面的数据，并加入到tooltip的数据内容部分里面去
			
 
				+          //     res +=
			
 
				+          //       `<div>
			
 
				+          //         <span style="display:inline-block;margin-right:5px;border-radius:5px;width:10px;height:10px;background-color:${[
			
 
				+          //           params[i].color, // 默认是小圆点，我们将其修改成有圆角的正方形，这里用的是模板字符串。并拿到对应颜色、名字、数据
			
 
				+          //         ]};"></span>
			
 
				+          //         ${moneyListTooltip[index]}元
			
 
				+          //       </div>` +
			
 
				+          //       `<div><span style="display:inline-block;margin-right:5px;border-radius:5px;width:10px;height:10px;background-color:${[
			
 
				+          //         params[i].color,
			
 
				+          //       ]};"></span>${quantityList[index]}头</div>`;
			
 
				+          //   }
			
 
				+          //   return res;
			
 
				+          // },
			
 
				         },
			
 
				-        color: ["#289df5"],
			
 
				+        color: ["#289df5", '#45C3A6'],
			
 
				         dataZoom: [
			
 
				           {
			
 
				             type: "inside",
			
 
				             startValue: start,
			
 
				             endValue: end,
			
 
				             show: false,
			
 
				-            // zoomOnMouseWheel: false,
			
 
				-            // zoomLock: true,
			
 
				           },
			
 
				         ],
			
 
				         grid: {
			
@@ -85,22 +83,7 @@ export default {
 
				           right: "10%",
			
 
				           top: "20%",
			
 
				           bottom: "15%",
			
 
				-          // bottom: '30%',
			
 
				-          // containLabel: true
			
 
				         },
			
 
				-        // dataZoom: [
			
 
				-        //
			
 
				-        //   {
			
 
				-        //     type: 'slider',
			
 
				-        //     startValue: start,
			
 
				-        //     endValue:end,
			
 
				-        //     zoomOnMouseWheel: false,
			
 
				-        //     zoomLock: true,
			
 
				-        //   },
			
 
				-        //   {
			
 
				-        //     type: 'inside'
			
 
				-        //   },
			
 
				-        // ],
			
 
				         xAxis: [
			
 
				           {
			
 
				             type: "category",
			
@@ -141,10 +124,30 @@ export default {
 
				               show: false,
			
 
				             },
			
 
				           },
			
 
				+          {
			
 
				+            type: "value",
			
 
				+            name: "头",
			
 
				+            axisLabel: {
			
 
				+              // formatter: "{value} 元",
			
 
				+              show: true,
			
 
				+            },
			
 
				+            axisLine: {
			
 
				+              show: true,
			
 
				+              lineStyle: {
			
 
				+                color: "rgb(102,255,255)",
			
 
				+              },
			
 
				+            },
			
 
				+            axisTick: {
			
 
				+              show: false,
			
 
				+            },
			
 
				+            splitLine: {
			
 
				+              show: false,
			
 
				+            },
			
 
				+          },
			
 
				         ],
			
 
				         series: [
			
 
				           {
			
 
				-            // name: "销售",
			
 
				+            name: "销售",
			
 
				             type: "line",
			
 
				             // stack: 'Total',
			
 
				             smooth: true,
			
@@ -170,6 +173,34 @@ export default {
 
				             },
			
 
				             data: this.data.moneyList,
			
 
				           },
			
 
				+          {
			
 
				+            name: "头数",
			
 
				+            type: "line",
			
 
				+            yAxisIndex: 1,
			
 
				+            // stack: 'Total',
			
 
				+            smooth: true,
			
 
				+            areaStyle: {},
			
 
				+            emphasis: {
			
 
				+              focus: "series",
			
 
				+            },
			
 
				+            itemStyle: {
			
 
				+              color: "#45C3A6",
			
 
				+              borderColor: "#45C3A6",
			
 
				+              normal: {
			
 
				+                label: {
			
 
				+                  show: false,
			
 
				+                  textStyle: {
			
 
				+                    fontSize: 14,
			
 
				+                  },
			
 
				+                },
			
 
				+                areaStyle: {
			
 
				+                  type: "default",
			
 
				+                  opacity: 0.2,
			
 
				+                },
			
 
				+              },
			
 
				+            },
			
 
				+            data: this.data.quantityList,
			
 
				+          },
			
 
				         ],
			
 
				       };
			
 
				       this.myChart.setOption(options, true);
			
--- a/src/views/Zoology/Zoology.vue
+++ b/src/views/Zoology/Zoology.vue
@@ -75,7 +75,7 @@
 
				             </swiper>
			
 
				           </template>
			
 
				           <template>
			
 
				-            <div style="line-height: 200px;font-size: 18px; color: white">设备已掉线</div>
			
 
				+            <div style="line-height: 200px;font-size: 18px; color: white">维护中...</div>
			
 
				           </template>
			
 
				         </div>
			
 
				       </div>
			
@@ -92,7 +92,7 @@
 
				           @emitDates="getWaterDates"
			
 
				         >
			
 
				           <chart-line v-if="waterData.yAxisData.length > 0" :data="waterData" :id="1"></chart-line>
			
 
				-          <div v-else style="font-size: 18px; line-height: 200px; color: white">设备已掉线</div>
			
 
				+          <div v-else style="font-size: 18px; line-height: 200px; color: white">维护中...</div>
			
 
				         </chart-board>
			
 
				       </div>
			
 
				       <div class="left-bottom">
			
@@ -109,7 +109,7 @@
 
				                 <chart-line :data="tempData" :id="4"></chart-line>
			
 
				               </template>
			
 
				               <template v-else>
			
 
				-                <div style="font-size: 18px; line-height: 150px; color: white">设备已掉线</div>
			
 
				+                <div style="font-size: 18px; line-height: 150px; color: white">维护中...</div>
			
 
				               </template>
			
 
				             </chart-board>
			
 
				           </div>
			
@@ -123,7 +123,7 @@
 
				           >
			
 
				             <chart-board :title="roomName + '湿度'" @emitDates="getWaterDates">
			
 
				               <chart-line v-if="rhData.yAxisData.length > 0" :data="rhData" :id="5"></chart-line>
			
 
				-              <div v-else style="font-size: 18px; line-height: 150px; color: white">设备已掉线</div>
			
 
				+              <div v-else style="font-size: 18px; line-height: 150px; color: white">维护中...</div>
			
 
				             </chart-board>
			
 
				           </div>
			
 
				 
			
@@ -132,6 +132,12 @@
 
				 
			
 
				     <div class="right">
			
 
				       <div class="right-top">
			
 
				+        <div style="color: white; cursor: pointer" @click="isView = true">{{text}}</div>
			
 
				+        <div class="bio-select" v-show="isView">
			
 
				+          <div class="bio-select-text" @click="setNum(1)">一栋二层育肥一舍</div>
			
 
				+          <div class="bio-select-text" @click="setNum(2)">一栋二层育肥二舍</div>
			
 
				+          <div class="bio-select-text" @click="setNum(3)">三栋三层育肥二舍</div>
			
 
				+        </div>
			
 
				         <div class="kuang">
			
 
				           <iframe
			
 
				               v-if="cameraOne !== ''"
			
@@ -172,10 +178,10 @@
 
				           @emitDates="getElecDates"
			
 
				         >
			
 
				           <template v-if="fodderData.yAxisData.length > 0">
			
 
				-            <chart-line :data="fodderData" :id="2"></chart-line>
			
 
				+            <chart-line :data="fodderData" :id="3"></chart-line>
			
 
				           </template>
			
 
				           <template v-else>
			
 
				-            <div style="font-size: 18px; line-height: 150px; color: white">设备已掉线</div>
			
 
				+            <div style="font-size: 18px; line-height: 150px; color: white">维护中...</div>
			
 
				           </template>
			
 
				         </chart-board>
			
 
				       </div>
			
@@ -193,7 +199,7 @@ import ChartBoard from "./charts/ChartBoard.vue";
 
				 import ChartLine from "./charts/ChartLine.vue";
			
 
				 import ChartLineAnd from "./charts/ChartLineAnd.vue";
			
 
				 import {getEnv, getByRoom, getListWater, getRoomVideo, getLastVideo, getSchool, getByFloor, getUid, getFodder} from "@/utils/api";
			
 
				-import { timeDate, Debounce } from "@/utils";
			
 
				+import { timeDate, Debounce, MonthDate } from "@/utils";
			
 
				 import { Form, FormItem ,Select } from "element-ui";
			
 
				 
			
 
				 export default {
			
@@ -258,13 +264,13 @@ export default {
 
				       },
			
 
				       elecData: {
			
 
				         xAxisName: "电量",
			
 
				-        xAxisData: [],
			
 
				+        xAxisData: [ MonthDate(new Date().getTime() - (1000 * 60 * 60 * 24 * 2)), MonthDate(new Date().getTime() - (1000 * 60 * 60 * 24)), MonthDate(new Date().getTime())],
			
 
				         yAxisName: "KW/h",
			
 
				         yAxisData: [],
			
 
				       },
			
 
				       fodderData: {
			
 
				         xAxisName: "饲料",
			
 
				-        xAxisData: [],
			
 
				+        xAxisData: [ MonthDate(new Date().getTime() - (1000 * 60 * 60 * 24 * 2)), MonthDate(new Date().getTime() - (1000 * 60 * 60 * 24)), MonthDate(new Date().getTime())],
			
 
				         yAxisName: 'Kg',
			
 
				         yAxisData: [],
			
 
				       },
			
@@ -282,6 +288,8 @@ export default {
 
				       floorId: '',
			
 
				       unitId: '',
			
 
				       unitList: [],
			
 
				+      isView: false,
			
 
				+      text: '一栋二层育肥一舍'
			
 
				     };
			
 
				   },
			
 
				   computed: {
			
@@ -401,8 +409,10 @@ export default {
 
				       getLastVideo({}).then(res => {
			
 
				         if(res.code === 10000) {
			
 
				           if(res.data !== null) {
			
 
				-            this.cameraOne = res.data.wsUrl;
			
 
				-            this.cameraTwo = res.data.rtspUrl;
			
 
				+            // this.cameraOne = res.data.wsUrl;
			
 
				+            // this.cameraTwo = res.data.rtspUrl;
			
 
				+            this.cameraOne = 'ws://36.26.62.70:9080/camera_relay?tcpaddr=admin%3Ahmkj6688%40172.16.3.39';
			
 
				+            this.cameraTwo = "rtsp://admin:hmkj6688@172.16.3.39/cam/realmonitor?channel=1&subtype=0";
			
 
				           }
			
 
				         }
			
 
				       })
			
@@ -446,6 +456,7 @@ export default {
 
				       });
			
 
				     },
			
 
				     setFodder(data) {
			
 
				+      console.log(data)
			
 
				       this.fodderData.xAxisData = [];
			
 
				       this.fodderData.yAxisData = [];
			
 
				       data.fodderList.forEach(item => {
			
@@ -465,11 +476,35 @@ export default {
 
				           this.setFodder(res.data)
			
 
				         }
			
 
				       })
			
 
				+    },
			
 
				+    initUnit() {
			
 
				+      getFodder({}).then(res => {
			
 
				+        if(res.code === 10000) {
			
 
				+          this.setFodder(res.data)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    setNum(num) {
			
 
				+      this.isView = false;
			
 
				+      if(num === 1) {
			
 
				+        this.cameraOne = 'ws://36.26.62.70:9080/camera_relay?tcpaddr=admin%3Ahmkj6688%40172.16.3.39';
			
 
				+        this.cameraTwo = "rtsp://admin:hmkj6688@172.16.3.39/cam/realmonitor?channel=1&subtype=0";
			
 
				+        this.text = '一栋二层育肥一舍';
			
 
				+      } else if(num === 2) {
			
 
				+        this.cameraOne = 'ws://36.26.62.70:9080/camera_relay?tcpaddr=admin%3Ahmkj6688%40172.16.3.30';
			
 
				+        this.cameraTwo = "rtsp://admin:hmkj6688@172.16.3.30/cam/realmonitor?channel=1&subtype=0";
			
 
				+        this.text = '一栋二层育肥二舍';
			
 
				+      } else {
			
 
				+        this.cameraOne = 'ws://36.26.62.70:9080/camera_relay?tcpaddr=admin%3Ahmkj6688%40172.16.3.164';
			
 
				+        this.cameraTwo = "rtsp://admin:hmkj6688@172.16.3.164/cam/realmonitor?channel=1&subtype=0";
			
 
				+        this.text = '三栋三层育肥二舍';
			
 
				+      }
			
 
				     }
			
 
				   },
			
 
				   mounted() {
			
 
				     this.init();
			
 
				     this.initData();
			
 
				+    this.initUnit()
			
 
				   },
			
 
				 };
			
 
				 </script>
			
@@ -609,6 +644,7 @@ export default {
 
				   /* box-sizing: border-box; */
			
 
				   /* background-color: red; */
			
 
				   padding-left: 25px;
			
 
				+  position: relative;
			
 
				 }
			
 
				 .kuang {
			
 
				   width: 100%;
			
@@ -636,4 +672,28 @@ export default {
 
				   height: 40px;
			
 
				   width: 100%;
			
 
				 }
			
 
				+
			
 
				+.bio-select {
			
 
				+  width: 120px;
			
 
				+  /*height: 60px;*/
			
 
				+  position: absolute;
			
 
				+  background-color: rgba(102, 255, 255, .6);
			
 
				+  top: 26px;
			
 
				+  left: 50%;
			
 
				+  transform: translate(-50%, 0);
			
 
				+}
			
 
				+.bio-select-text {
			
 
				+  line-height: 30px;
			
 
				+  font-size: 14px;
			
 
				+  color: white;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+.bio-select-text:hover {
			
 
				+  background-color: #409eff;
			
 
				+  color: black;
			
 
				+}
			
 
				+.is_select {
			
 
				+  background-color: #409eff;
			
 
				+  color: black;
			
 
				+}
			
 
				 </style>
			
--- a/src/views/Zoology/charts/ChartLine.vue
+++ b/src/views/Zoology/charts/ChartLine.vue
@@ -26,6 +26,8 @@ export default {
 
				   },
			
 
				   methods: {
			
 
				     init() {
			
 
				+      // console.log(this.data.yAxisData.map(Number))
			
 
				+      // let max = Math.max.apply(null, this.data.yAxisData.map(Number))
			
 
				       let start = this.data.xAxisData.length - 7;
			
 
				       let end = this.data.xAxisData.length - 1;
			
 
				       let options = {
			
@@ -70,7 +72,9 @@ export default {
 
				         ],
			
 
				         //[
			
 
				         yAxis: {
			
 
				+          // max: max * 1.5,
			
 
				           type: "value",
			
 
				+          boundaryGap: [0, '100%'],
			
 
				           // name: this.data.yAxisName,
			
 
				           nameTextStyle: {
			
 
				             color: "red",
			
--- a/src/views/Zoology/charts/ChartLineAnd.vue
+++ b/src/views/Zoology/charts/ChartLineAnd.vue
@@ -8,7 +8,7 @@
 
				 -->
			
 
				 <template>
			
 
				   <div :id="'chartLine' + id" class="chart-line">
			
 
				-    
			
 
				+
			
 
				   </div>
			
 
				 </template>
			
 
				 <script>
			
@@ -44,7 +44,7 @@ export default {
 
				         // color: ['#3aa0ff', '#4dcb73', '#fad337', '#f2637b', '#975fe4'],
			
 
				         grid: {
			
 
				           top: '10%',
			
 
				-          left: '10%',
			
 
				+          left: '20%',
			
 
				           bottom: '20%',
			
 
				           right: '10%'
			
 
				         },
			
@@ -100,20 +100,20 @@ export default {
 
				           },
			
 
				         //],
			
 
				         series: [
			
 
				-          {
			
 
				-            name: this.data.yAxisName,
			
 
				-            type: 'line',
			
 
				-            smooth: false,
			
 
				-            data: this.data.yAxisData,
			
 
				-            itemStyle: {
			
 
				-              normal: {
			
 
				-                color: '#3aa0ff',
			
 
				-                lineStyle: {
			
 
				-                  color: '#3aa0ff'
			
 
				-                }
			
 
				-              }
			
 
				-            }
			
 
				-          },
			
 
				+          // {
			
 
				+          //   name: this.data.yAxisName,
			
 
				+          //   type: 'line',
			
 
				+          //   smooth: false,
			
 
				+          //   data: this.data.yAxisData,
			
 
				+          //   itemStyle: {
			
 
				+          //     normal: {
			
 
				+          //       color: '#3aa0ff',
			
 
				+          //       lineStyle: {
			
 
				+          //         color: '#3aa0ff'
			
 
				+          //       }
			
 
				+          //     }
			
 
				+          //   }
			
 
				+          // },
			
 
				           {
			
 
				             name: this.data.yAxisName,
			
 
				             type: 'bar',
			
@@ -127,6 +127,10 @@ export default {
 
				                   color: '#3aa0ff'
			
 
				                 }
			
 
				               }
			
 
				+            },
			
 
				+            label: {
			
 
				+              show: true,
			
 
				+              position: 'top'
			
 
				             }
			
 
				           }
			
 
				         ]
			
--- a/src/views/Zoology/leftTop/SwiperContent.vue
+++ b/src/views/Zoology/leftTop/SwiperContent.vue
@@ -12,11 +12,11 @@
 
				       <div class="title">{{ list.room }}</div>
			
 
				       <div class="item">
			
 
				         <div class="temp-icon"></div>
			
 
				-        <div class="data">{{ list.temperature != null ? list.temperature + '℃' : '设备已掉线' }}</div>
			
 
				+        <div class="data">{{ list.temperature != null ? list.temperature + '℃' : '维护中...' }}</div>
			
 
				       </div>
			
 
				       <div class="item">
			
 
				         <div class="rh-icon"></div>
			
 
				-        <div class="data">{{ list.humidity != null ? list.humidity + 'RH' : '设备已掉线' }}</div>
			
 
				+        <div class="data">{{ list.humidity != null ? list.humidity + 'RH' : '维护中...' }}</div>
			
 
				       </div>
			
 
				     </div>
			
 
				   </div>
			
--- a/vue.config.js
+++ b/vue.config.js
@@ -3,19 +3,19 @@ const path = require('path')
 
				 const productionGzipExtensions = /\.(js|css|json|txt|html|ico|svg)(\?.*)?$/i;
			
 
				 module.exports = {
			
 
				   publicPath: './', // 相对于 HTML 页面（目录相同）
			
 
				-  chainWebpack: config => {
			
 
				-    config.module
			
 
				-      .rule('css')
			
 
				-      .test(/\.css$/)
			
 
				-      .oneOf('vue')
			
 
				-      .resourceQuery(/\?vue/)
			
 
				-      .use('px2rem')
			
 
				-      .loader('px2rem-loader')
			
 
				-      .options({
			
 
				-        remUnit: 192   //代表的是 1rem = ？px  这里假设设计稿是 1920px ，那么这里的比例就是 1/10
			
 
				-      })
			
 
				-      .end()
			
 
				-  },
			
 
				+  // chainWebpack: config => {
			
 
				+  //   config.module
			
 
				+  //     .rule('css')
			
 
				+  //     .test(/\.css$/)
			
 
				+  //     .oneOf('vue')
			
 
				+  //     .resourceQuery(/\?vue/)
			
 
				+  //     .use('px2rem')
			
 
				+  //     .loader('px2rem-loader')
			
 
				+  //     .options({
			
 
				+  //       remUnit: 192   //代表的是 1rem = ？px  这里假设设计稿是 1920px ，那么这里的比例就是 1/10
			
 
				+  //     })
			
 
				+  //     .end()
			
 
				+  // },
			
 
				   configureWebpack: config => {
			
 
				     if(process.env.NODE_ENV === 'production') {
			
 
				       config.plugins.push(
			
@@ -54,4 +54,4 @@ module.exports = {
 
				       }
			
 
				     }
			
 
				   },
			
 
				-}
			
 
				+}