wangmengwei 7 小時之前
父節點
當前提交
8ab74d6766

+ 6 - 0
ruoyi-ui/package.json

@@ -38,6 +38,8 @@
   "dependencies": {
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@riophae/vue-treeselect": "0.4.0",
+    "@vue/composition-api": "^1.7.2",
+    "area-data": "^5.0.6",
     "axios": "0.28.1",
     "better-scroll": "^2.5.1",
     "clipboard": "2.0.8",
@@ -61,10 +63,14 @@
     "splitpanes": "2.4.1",
     "video.js": "^8.23.3",
     "vue": "2.6.12",
+    "vue-area-linkage": "^5.1.0",
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.5",
+    "vue-masonry": "^0.16.0",
     "vue-meta": "2.4.0",
     "vue-router": "3.4.9",
+    "vue-waterfall-plugin": "^3.3.2",
+    "vue-waterfall2": "^1.10.9",
     "vuedraggable": "2.24.3",
     "vuex": "3.6.0"
   },

+ 72 - 13
ruoyi-ui/public/index.html

@@ -8,11 +8,10 @@
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title><%= webpackConfig.name %></title>
     <script src="./jquery-1.7.1.min.js"></script>
-    <script src="./jsVideoPlugin-1.0.0.min.js"></script>
-    <script src="./webVideoCtrl.js"></script>
-    <script src="./static/webrtcstreamer.js" charset="utf-8"></script>
-    <script src="./static/adapter.min.js" charset="utf-8"></script>
-    <!-- <div>123</div> -->
+        <script src="./jsVideoPlugin-1.0.0.min.js"></script>
+        <script src="./webVideoCtrl.js"></script>
+        <script src="./static/webrtcstreamer.js" charset="utf-8"></script>
+        <script src="./static/adapter.min.js" charset="utf-8"></script>
     <!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
 	  <style>
     html,
@@ -43,8 +42,8 @@
       position: relative;
       left: 50%;
       top: 50%;
-      width: 150px;
-      height: 150px;
+      width: 180px;
+      height: 180px;
       margin: -75px 0 0 -75px;
       border-radius: 50%;
       border: 3px solid transparent;
@@ -105,6 +104,8 @@
       }
     }
 
+
+
     @keyframes spin {
       0% {
         -webkit-transform: rotate(0deg);
@@ -125,8 +126,7 @@
       width: 51%;
       height: 100%;
       /* background: #7171C6; */
-      background: linear-gradient(to top,#c7f2b9,#aadae6);
-
+       background: linear-gradient(to top,#c7f2b9,#aadae6);
       z-index: 1000;
       -webkit-transform: translateX(0);
       -ms-transform: translateX(0);
@@ -183,13 +183,13 @@
 
     #loader-wrapper .load_title {
       font-family: 'Open Sans';
-      color: #FFF;
+      color: #72b88d ;
       font-size: 19px;
       width: 100%;
       text-align: center;
       z-index: 9999999999999;
       position: absolute;
-      top: 60%;
+      top: 70%;
       opacity: 1;
       line-height: 30px;
     }
@@ -201,15 +201,74 @@
       color: #FFF;
       opacity: 0.5;
     }
+	.loading {
+	  width: 100px;
+	  height: 100px;
+	  z-index: 1001;
+	  border-radius: 50%;
+	  position: relative;
+	  position: relative;
+	  left: 48%;
+	  top: 45%;
+
+	}
+
+	.loading .item {
+	  width: 100%;
+	  height: 100%;
+	  border-radius: 50%;
+	  position: absolute;
+	}
+
+	.loading .item:nth-child(1) {
+	  border-bottom: 7px solid #b2db9a;
+	  transform: rotateX(15deg) rotateY(-45deg);
+	  animation: rotate_one 1s linear infinite -0.8s;
+	}
+
+	.loading .item:nth-child(2) {
+	  border-bottom: 7px solid #e1f5b1;
+	  transform: rotateX(50deg) rotateY(10deg);
+	  animation: rotate_two 1s linear infinite -0.4s;
+	}
+
+	.loading .item:nth-child(3) {
+	  border-bottom: 7px solid  #e2ffd9;
+	  transform: rotateX(35deg) rotateY(55deg);
+	  animation: rotate_three 1s linear infinite;
+	}
+
+	@keyframes rotate_one {
+	  to {
+	    transform: rotateX(15deg) rotateY(-45deg) rotateZ(360deg);
+	  }
+	}
+
+	@keyframes rotate_two {
+	  to {
+	    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
+	  }
+	}
+
+	@keyframes rotate_three {
+	  to {
+	    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
+	  }
+	}
   </style>
   </head>
   <body>
     <div id="app">
 	    <div id="loader-wrapper">
-		    <div id="loader"></div>
+		    <!-- <div id="loader"></div> -->
+			<div class="loading">
+			  <div class="item"></div>
+			  <div class="item"></div>
+			  <div class="item"></div>
+			</div>
 		    <div class="loader-section section-left"></div>
 		    <div class="loader-section section-right"></div>
-		    <div class="load_title">正在加载系统资源,请耐心等待</div>
+		    <div class="load_title">加载中,请耐心等待...</div>
         </div>
 	</div>
   </body>

+ 8 - 1
ruoyi-ui/src/api/system/dept.js

@@ -8,6 +8,13 @@ export function listDept(query) {
     params: query
   })
 }
+// 查询部门下拉树结构
+// export function treeselect() {
+//   return request({
+//     url: '/system/dept/treeselect',
+//     method: 'get'
+//   })
+// }
 
 // 查询部门列表(排除节点)
 export function listDeptExcludeChild(deptId) {
@@ -49,4 +56,4 @@ export function delDept(deptId) {
     url: '/system/dept/delete/' + deptId,
     method: 'get'
   })
-}
+}

+ 4 - 2
ruoyi-ui/src/components/ImageUpload/index.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="component-upload-image">
+    <el-tooltip class="item" effect="dark" :content="'请上传大小不超过'+ fileSize +'mb,格式为png,jpg,jpeg' " placement="top-start">
     <el-upload
       multiple
       :action="uploadImgUrl"
@@ -20,14 +21,15 @@
     >
       <i class="el-icon-plus"></i>
     </el-upload>
+    </el-tooltip>
 
     <!-- 上传提示 -->
-    <div class="el-upload__tip" slot="tip" v-if="showTip">
+    <!-- <div class="el-upload__tip" slot="tip" v-if="showTip">
       请上传
       <template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template>
       <template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template>
       的文件
-    </div>
+    </div> -->
 
     <el-dialog
       :visible.sync="dialogVisible"

+ 1 - 1
ruoyi-ui/src/components/ImageUploadr/index.vue

@@ -21,7 +21,7 @@
      <!--  -->
      <div>
        <i class="el-icon-camera"></i>
-       <div style=" margin-top: -50px; font-weight: 500;font-size: 14px;color: #C3C3C3;line-height: 25px;">支持上传照片或 在线拍摄照片</div>
+       <div class="ingwe" style=" margin-top: -50px; font-weight: 500;font-size: 14px;color: #C3C3C3;line-height: 25px;">支持上传照片或 在线拍摄照片</div>
      </div>
     </el-upload>
 

+ 29 - 30
ruoyi-ui/src/components/Paginations/index.vue

@@ -1,19 +1,18 @@
-<template >
-
-  <div class="tuwe">
-    <div :class="{'hidden':hidden}" class="pagination-container ">
+<template>
+  <div class="daba">
+    <div :class="{'hidden':hidden}" class="pagination-container ike">
       <el-pagination
-            :current-page.sync="currentPage"
-            :page-size.sync="pageSize"
-            :layout="layout"
-      	  :small="true"
-            :page-sizes="pageSizes"
-            :pager-count="pagerCount"
-            :total="total"
-            v-bind="$attrs"
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-          />
+        :current-page.sync="currentPage"
+          :page-size.sync="pageSize"
+          :layout="layout"
+        :small="true"
+          :page-sizes="pageSizes"
+          :pager-count="pagerCount"
+          :total="total"
+          v-bind="$attrs"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+      />
     </div>
   </div>
 </template>
@@ -39,7 +38,7 @@ export default {
     pageSizes: {
       type: Array,
       default() {
-        return [3,10, 20, 30, 50]
+        return [10, 20, 30, 50]
       }
     },
     // 移动端页码按钮的数量端默认值5
@@ -49,7 +48,7 @@ export default {
     },
     layout: {
       type: String,
-     default: 'total,  prev, pager, next'
+      default: 'total,  prev, pager, next'
     },
     background: {
       type: Boolean,
@@ -66,7 +65,7 @@ export default {
   },
   data() {
     return {
-    };
+    }
   },
   computed: {
     currentPage: {
@@ -107,11 +106,16 @@ export default {
 </script>
 
 <style scoped>
-.pagination-container {
+.ike {
   /* background: #fff; */
-  /* padding: 32px 16px; */
+  text-align: center;
+  height: 50px;
 }
-.tuwe {
+.daba{
+  .pagination-container .el-pagination{
+    left: 50%;
+    transform: translateX(-50%);
+  }
   .el-input__inner{
     border: 0;
     background: #DDEBE7;
@@ -127,7 +131,7 @@ export default {
     color: #4B5A6D;
   }
   .el-pager li{
-    margin-right: 5px;
+    /* margin-right: 5px; */
     background-color:#DDEBE7;
     color: #4B5A6D;
   }
@@ -136,19 +140,14 @@ export default {
     color: #fff;
   }
   .el-pager li.active{
-    background-color:#03BF8A;
-    color: #fff;
+    background-color:#DDEBE7;
+    color: #4B5A6D;
   }
   .el-pager li:nth-child(1){
-    margin-left: 5px;
+    /* margin-left: 5px; */
   }
 }
 
-.tuwe .pagination-container .el-pagination{
-  left: 50%;
-  transform: translateX(-50%);
-  text-align: center;
-}
 .pagination-container.hidden {
   display: none;
 }

+ 0 - 12
ruoyi-ui/src/layout/components/Navbar.vue

@@ -300,28 +300,16 @@ export default {
 	  this.$store.dispatch('TabFn', path)
 	},
     async logout() {
-      this.$confirm('确定注销并退出系统吗?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
          sessionStorage.removeItem('companyName')
         this.$store.dispatch('LogOut').then(() => {
           location.href = '/index';
         })
-      }).catch(() => {});
     },
     async logouth() {
-      this.$confirm('确定注销并退出系统吗?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
         sessionStorage.removeItem('companyName')
         this.$store.dispatch('LogOut').then(() => {
           location.href = '/index';
         })
-      }).catch(() => {});
     }
   }
 }

+ 7 - 0
ruoyi-ui/src/main.js

@@ -4,6 +4,8 @@ import Cookies from 'js-cookie'
 
 import Element from 'element-ui'
 import './assets/styles/element-variables.scss'
+// import waterfall from 'vue-masonry'
+
 
 import '@/assets/styles/index.scss' // global css
 import '@/assets/styles/ruoyi.scss' // ruoyi css
@@ -22,6 +24,7 @@ import './assets/icons' // icon
 import './permission' // permission control
 import { getDicts } from "@/api/system/dict/data"
 import { getConfigKey } from "@/api/system/config"
+
 import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, handleTree } from "@/utils/ruoyi"
 // 分页组件
 import Pagination from "@/components/Pagination"
@@ -50,6 +53,8 @@ import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
 // import Mqttzj from '@/components/Mqttzj'
+import {VueMasonryPlugin} from 'vue-masonry';
+// var VueMasonryPlugin = window["vue-masonry-plugin"].VueMasonryPlugin
 
 
 // 全局方法挂载
@@ -85,6 +90,8 @@ Vue.use(directive)
 Vue.use(plugins)
 Vue.use(VueMeta)
 Vue.use(VueAreaLinkage)
+// Vue.use(waterfall)
+Vue.use(VueMasonryPlugin);
 DictData.install()
 
 /**

+ 3 - 3
ruoyi-ui/src/settings.js

@@ -1,9 +1,9 @@
 module.exports = {
-  urls: `http://192.168.101.245:8099`,
-   // urls: `http://10.90.90.53:8099`,
+  // urls: `http://192.168.101.245:8099`,
+   urls: `http://10.90.90.53:8099`,
   // 10.90.90.52 192.168.101.245
   // 10.90.90.53
-  // urls:`https://zxygj.qs163.cn`,
+  // urls:`http://111.39.53.163:5000`,
   /**
    * 侧边栏主题 深色主题theme-dark,浅色主题theme-light
    */

+ 7 - 6
ruoyi-ui/src/views/dashboard/LineChart.vue

@@ -61,10 +61,11 @@ export default {
       this.chart = echarts.init(this.$el, 'macarons')
       this.setOptions(this.chartData)
     },
-    setOptions({ expectedData, actualData } = {}) {
+    setOptions({ x, y1,y2 } = {}) {
+      console.log(x,y1,y2)
       this.chart.setOption({
         xAxis: {
-          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+          data: x,
           boundaryGap: false,
           axisTick: {
             show: false
@@ -123,9 +124,9 @@ export default {
           },
           smooth: true,
           type: 'line',
-          data: expectedData,
+          data: y1,
           animationDuration: 2800,
-          animationEasing: 'cubicInOut'
+          animationEasing: '离岗告警'
         },
         {
           name: 'actual',
@@ -143,9 +144,9 @@ export default {
               }
             }
           },
-          data: actualData,
+          data: y2,
           animationDuration: 2800,
-          animationEasing: 'quadraticOut'
+          animationEasing: '玩手机告警'
         }]
       })
     }

+ 288 - 353
ruoyi-ui/src/views/index.vue

@@ -17,47 +17,68 @@
                      <div class="group_3 flex-row">
                        <div class="text-wrapper_1 flex-col justify-between">
                          <span class="text_4">本月告警总数</span>
-                         <span class="text_5">17</span>
+                         <span class="text_5" @click="gahse('zs')">{{tongjlie.warnMonthAll}}</span>
                          <div style="display: flex; margin-top:20px;">
                            <span class="text_14">较上月</span>
                            <img
                              class="thumbnail_6"
                              referrerpolicy="no-referrer"
                              src="../assets/images/icon_htgl_hp_tjss.png"
+                             v-if = "tongjlie.warnMonthPtStatus == 1"
                            />
-                           <span class="text_15">28%</span>
+                           <img
+                             class="thumbnail_6"
+                             referrerpolicy="no-referrer"
+                             src="../assets/images/icon_htgl_sjtj_xj.png"
+                             v-if = "tongjlie.warnMonthPtStatus == 2"
+                           />
+                           <span class="text_15">{{tongjlie.warnMonthPt}}</span>
                          </div>
                        </div>
                       <img
-                                                                 class="image_2"
-                                                                 referrerpolicy="no-referrer"
-                                                                 src="../assets/images/pic_gjpt_hp_sfgx.png"
-                                                               />
+                      class="image_2"
+                      referrerpolicy="no-referrer"
+                      src="../assets/images/pic_gjpt_hp_sfgx.png"
+                      />
                        <div class="text-wrapper_2 flex-col justify-between" style="width: 84px;">
                          <span class="text_6">摸鱼告警</span>
-                         <span class="text_7">08</span>
+                         <span class="text_7"  @click="gahse(1)">{{tongjlie.warnMonthPlay}}</span>
                          <div style="display: flex; margin-top:20px;">
                                                    <span class="text_14">较上月</span>
-                                                   <img
-                                                     class="thumbnail_6"
-                                                     referrerpolicy="no-referrer"
-                                                     src="../assets/images/icon_htgl_hp_tjss.png"
-                                                   />
-                                                   <span class="text_15">28%</span>
+                         <img
+                           class="thumbnail_6"
+                           referrerpolicy="no-referrer"
+                           src="../assets/images/icon_htgl_hp_tjss.png"
+                           v-if = "tongjlie.warnMonthPlay == 1"
+                         />
+                         <img
+                           class="thumbnail_6"
+                           referrerpolicy="no-referrer"
+                           src="../assets/images/icon_htgl_sjtj_xj.png"
+                           v-if = "tongjlie.warnMonthPlay == 2"
+                         />
+                                                   <span class="text_15">{{tongjlie.warnMonthPlayPt}}</span>
                                                  </div>
 
                        </div>
                        <div class="text-wrapper_3 flex-col justify-between" style="width: 84px;">
                          <span class="text_8">离岗告警</span>
-                         <span class="text_9">06</span>
+                         <span class="text_9" @click="gahse(0)">{{tongjlie.warnMonthLeave}}</span>
                           <div style="display: flex; margin-top:20px;">
                                                     <span class="text_14">较上月</span>
-                                                    <img
-                                                      class="thumbnail_6"
-                                                      referrerpolicy="no-referrer"
-                                                      src="../assets/images/icon_htgl_hp_tjss.png"
-                                                    />
-                                                    <span class="text_15">28%</span>
+                            <img
+                              class="thumbnail_6"
+                              referrerpolicy="no-referrer"
+                              src="../assets/images/icon_htgl_hp_tjss.png"
+                              v-if = "tongjlie.warnMonthLeavePt == 1"
+                            />
+                            <img
+                              class="thumbnail_6"
+                              referrerpolicy="no-referrer"
+                              src="../assets/images/icon_htgl_sjtj_xj.png"
+                              v-if = "tongjlie.warnMonthLeavePt == 2"
+                            />
+                                                    <span class="text_15">{{tongjlie.warnMonthLeavePt}}</span>
                                                   </div>
                        </div>
 
@@ -67,7 +88,7 @@
                    </div>
          </el-col>
          <el-col :span="12" style="padding-left: 0; padding-right: 0;border-radius: 10px;" v-if="shoue"  v-hasPermi="['manage:index:shuju']">
-           <div class="block_4 flex-col">
+           <div class="block_4 flex-col " >
                      <div class="group_2 flex-row justify-between">
                        <img
                          class="thumbnail_5"
@@ -76,18 +97,25 @@
                        />
                        <span class="text_3">部门告警频次统计</span>
                      </div>
-                     <div class="group_3 flex-row">
-                       <div class="text-wrapper_1 flex-col justify-between">
-                         <span class="text_4">宣传部</span>
-                         <span class="text_5">38</span>
+                     <div v-if="shouengs "  :class=" tongjlie.deptNameMapList.length >3 ? 'group_3 flex-row gunshe' : 'group_3 flex-row '" :style="tongjlie.deptNameMapList.length >3 ? ' height: 97px; padding-left: 50px;' : ' height: 97px; padding-left: 15px; justify-content:flex-start'" >
+                       <div @click="deckauie(item)" v-if="tongjlie.deptNameMapList.length !=0" class="text-wrapper_1 flex-col justify-between" v-for="(item,index) in tongjlie.deptNameMapList" :key="index" style="width: 33%;">
+                         <span class="text_4">{{item.deptName}}</span>
+                         <span class="text_5">{{item.warnNum}}</span>
                          <div style="display: flex; margin-top:20px;">
                            <span class="text_14" style="width: 50px;">上月排名</span>
 
-                           <span class="text_15">28%</span>
+                           <span class="text_15">{{item.warnDeptPt}}</span>
                            <img
                              class="thumbnail_6"
                              referrerpolicy="no-referrer"
                              src="../assets/images/icon_htgl_hp_tjss.png"
+                             v-if = "item.warnDeptPtStatus == 1"
+                           />
+                           <img
+                             class="thumbnail_6"
+                             referrerpolicy="no-referrer"
+                             src="../assets/images/icon_htgl_sjtj_xj.png"
+                             v-if = "item.warnDeptPtStatus == 2"
                            />
                          </div>
                        </div>
@@ -96,7 +124,7 @@
                          referrerpolicy="no-referrer"
                          src="https://lanhu-oss-2537-2.lanhuapp.com/ps7mxkzc5neit681xsy8xznba7hm35r4ttv08926882-7cd0-4694-a312-ebee13b874e7"
                        /> -->
-                       <div class="text-wrapper_2 flex-col justify-between" style="width: 84px;">
+                       <!-- <div class="text-wrapper_2 flex-col justify-between" style="width: 84px;">
                          <span class="text_6">人事部</span>
                          <span class="text_7">24</span>
                          <div style="display: flex; margin-top:20px;">
@@ -110,8 +138,8 @@
                                                    />
                                                  </div>
 
-                       </div>
-                       <div class="text-wrapper_3 flex-col justify-between" style="width: 84px;">
+                       </div> -->
+                       <!-- <div class="text-wrapper_3 flex-col justify-between" style="width: 84px;">
                          <span class="text_8">档案部</span>
                          <span class="text_9">6</span>
                           <div style="display: flex; margin-top:20px;">
@@ -124,11 +152,19 @@
                                                       src="../assets/images/icon_htgl_sjtj_xj.png"
                                                     />
                                                   </div>
-                       </div>
-
+                       </div> -->
+                      <div v-if="tongjlie.deptNameMapList.length ==0" style="margin-top: -20px; margin-left: 50%;transform: translateX(-50%);">
+                        <img
+                          style="height: 81px;"
+                          referrerpolicy="no-referrer"
+                          src="../assets/images/pic_hp_zwsj.png"
+                        />
+                        <p style="text-align: center; margin-top: 5px; margin: 0; font-weight: 400;font-size: 12px;color: #C4C4C4;">当前暂无数据喔</p>
+                      </div>
 
                      </div>
 
+
                    </div>
          </el-col>
                   <!-- 全部 -->
@@ -221,14 +257,15 @@
          <el-col :span="24" style="padding-left: 0;padding-right: 0; border-radius: 10px;" >
            <div class="group_5 flex-col">
                        <div class="group_6 flex-row" style="justify-content: space-between;">
-                         <div class="flex-row">
+                         <div class="flex-row nshhgesindex index">
                            <img
                              class="thumbnail_19"
                              referrerpolicy="no-referrer"
                              src="../assets/images/icon_htgl_hp_ndtj.png"
                            />
                            <span class="text_30">年度告警统计</span>
-                           <div class="section_1 flex-row">
+                           <!-- 全部 -->
+                           <!-- <div class="section_1 flex-row">
                              <el-select v-model="value" placeholder="请选择">
                                  <el-option
                                    v-for="item in options"
@@ -237,26 +274,36 @@
                                    :value="item.value">
                                  </el-option>
                                </el-select>
+                           </div> -->
+                           <!-- 数据居 -->
+                           <div class="section_1 flex-row">
+                              <el-date-picker
+                                  v-model="zhess.time"
+                                  @change="zheschan"
+                                  type="year"
+                                  value-format="yyyy"
+                                  placeholder="选择年">
+                                </el-date-picker>
                            </div>
                          </div>
-                         <span class="text_32">查看更多&nbsp;→</span>
+                         <span class="text_32" @click="naidue">查看更多&nbsp;→</span>
                        </div>
                        <div class="group_7 flex-row" style="justify-content: space-between;">
-                         <span class="text_33">2025年</span>
+                         <span class="text_33">{{zhess.time}}年</span>
                          <div class="flex-row">
                            <div class="flex-row">
                              <div class="box_5 flex-col"></div>
-                             <span class="text_34">告警总数</span>
+                             <span class="text_34">离岗告警</span>
                            </div>
                            <div class="flex-row">
                             <div class="box_6 flex-col"></div>
-                            <span class="text_35">越线告警</span>
+                            <span class="text_35">玩手机告警</span>
                            </div>
                          </div>
                          <span class="text_36">告警数/件</span>
                        </div>
                        <div class="group_8 flex-row justify-between">
-                            <line-chart :chart-data="lineChartData" />
+                            <line-chart :chart-data="zheixnhey"  v-if="zheshowe"/>
                        </div>
 
                      </div>
@@ -369,23 +416,33 @@
                          />
                          <span class="text-group_3" style="margin-left: 10px;">设备运行状态</span>
                        </div>
-                       <div>
+                       <div @click="cnahgshe">
                          查看更多 →
                        </div>
                      </div>
-                     <div style="display: flex;justify-content: space-between;">
-                       <div style="border: 1px solid #DADADA;border-radius: 8px; width: 24%;padding: 14px;margin-top: 20px;" v-for="(item,idnex) in 4" :key="item">
+                     <div style="display: flex;justify-content: flex-start;">
+                       <div style="border: 1px solid #DADADA;border-radius: 8px; width: 24%;padding: 14px;margin-top: 20px; margin-left: 3px; margin-right: 3px;" v-for="(item,idnex) in equipmentManageList" :key="item" v-if="equipmentManageList.length != 0">
                          <div style="display: flex; justify-content: space-between;align-items: center;">
-                           <div style="font-weight: 500;font-size: 16px;color: #333333;">设备0{{item}}</div>
+                           <div style="font-weight: 500;font-size: 16px;color: #333333;">{{item.equipmentName}}</div>
                            <div>
-                             <img referrerpolicy="no-referrer" src="../assets/images/icon_htgl_hp_sbkg_selected.png" v-if="item == 1 || item == 2 "/>
-                             <img referrerpolicy="no-referrer" src="../assets/images/icon_htgl_hp_sbkg_normal.png" v-if="item == 3 || item == 4 "/>
+                             <span v-if="item.runState == 0" style="color: #1890ff;">正常</span>
+                             <span v-if="item.runState == 1" style="color: #ff6969;">停用</span>
+                             <!-- <img referrerpolicy="no-referrer" src="../assets/images/icon_htgl_hp_sbkg_selected.png" v-if="item == 1 || item == 2 "/> -->
+                             <!-- <img referrerpolicy="no-referrer" src="../assets/images/icon_htgl_hp_sbkg_normal.png" v-if="item == 3 || item == 4 "/> -->
                              </div>
                          </div>
                          <div style="font-weight: 500;font-size: 16px;color: #AAAAAA; margin-top: 10px;">
-                           业务部办公室
+                           {{item.equipmentRegion}}
                          </div>
                        </div>
+                       <div v-if="equipmentManageList.length ==0" style="margin-top: -20px; margin-left: 50%;transform: translateX(-50%);text-align: center;">
+                         <img
+                           style="height: 81px;"
+                           referrerpolicy="no-referrer"
+                           src="../assets/images/pic_hp_zwsj.png"
+                         />
+                         <p style="text-align: center; margin-top: 5px; margin: 0; font-weight: 400;font-size: 12px;color: #C4C4C4;">当前暂无数据喔,请去设备管理中进行设置</p>
+                       </div>
                      </div>
                    </div>
                </el-col>
@@ -402,7 +459,7 @@
                     <span class="text_24">快捷功能</span>
                   </div>
                   <div class="image-wrapper_1 flex-row justify-between">
-                    <div style="text-align: center;cursor: pointer;" @click="tiahz(0)">
+                    <!-- <div style="text-align: center;cursor: pointer;" @click="tiahz(0)">
                       <img
                         class="label_2"
                         referrerpolicy="no-referrer"
@@ -411,6 +468,16 @@
                       <div style="margin-top: 10px;">
                          <span class="text_25">人员管理</span>
                       </div>
+                    </div> -->
+                    <div style="text-align: center;cursor: pointer;" @click="tiahz(0)">
+                      <img
+                        class="label_2"
+                        referrerpolicy="no-referrer"
+                        src="../assets/images/icon_hthp_kj_ssjc.png"
+                      />
+                      <div style="margin-top: 10px;">
+                         <span class="text_25">实时检测</span>
+                      </div>
                     </div>
                     <div style="text-align: center;cursor: pointer;" @click="tiahz(1)">
                       <img
@@ -436,10 +503,10 @@
                       <img
                         class="label_5"
                         referrerpolicy="no-referrer"
-                        src="../assets/images/icon_hthp_kj_yjbk.png"
+                        src="../assets/images/icon_hthp_kj_cssz.png"
                       />
                       <div style="margin-top: 10px;">
-                          <span class="text_28">网络管理</span>
+                          <span class="text_28">参数设置</span>
                       </div>
                     </div>
                     <div style="text-align: center; cursor: pointer;" @click="tiahz(4)">
@@ -512,20 +579,42 @@
                                 />
                               </div></div>
                                 </div>
-                    <div v-for="(item,index) in 3" :key="index" class="box_14 flex-row" style="justify-content: space-between;padding: 0 20px;" v-if="shoue == true">
+                    <div v-for="(item,index) in warnManageList" :key="index" class="box_14 flex-row" style="justify-content: space-between;padding: 0 20px;" v-if="shoue == true && warnManageList.length !=0">
                                   <div class="text-wrapper_17 flex-col justify-between">
-                                    <span class="text_94">25/04/23&nbsp;&nbsp;10:31:46</span>
-                                    <span class="text_95">通道001</span>
+                                    <span class="text_94">{{item.createTime}}</span>
+                                    <span class="text_95" style="color: #666666;font-weight: 400<strong></strong>;"> <span style="font-weight: 800;font-size: 15px;color: #333333;">{{item.rangName}}</span>
+                                     <span style="font-weight: 800;font-size: 15px;color: #03BF8A; margin-left: 5px;">{{ (item.algorithmType == 0 ? '离岗' : '玩手机')  }}</span> 告警</span>
+                                    <!-- <span class="text_95">
+                                      <span style="color: #333333; font-weight: 700;">{{item.deptName}} </span>
+                                       <span style="color: #03BF8A; font-weight: 700;">{{item.equipmentName}} </span> 通道001</span> -->
+
                                   </div>
-                                  <div class="text-wrapper_18 ">
-                                    <div class="text_96">越线告警</div>
+                                  <div class="text-wrapper_18 " @click="thse(item)">
+                                    <div class="text_96" v-if="item.algorithmType == 1">玩手机</div>
+                                     <div class="text_96s" v-if="item.algorithmType == 0">离岗</div>
                                     <div><img
                                     class="thumbnail_27"
                                     referrerpolicy="no-referrer"
                                     src="../assets/images/icon_hthp_rl_enter.png"
+
                                   />
                                 </div></div>
                                   </div>
+                    <div v-if="warnManageList.length ==0" style="height: 340px; display: flex;align-items: center;">
+                        <div style="flex: 1; display: flex;flex-direction: column;justify-content: center;align-items: center;">
+                          <img src="../assets/images/pic_htgl_zwxx.png" alt="">
+                          <span style="margin-top: 10px;">今日暂无告警信息喔</span>
+                        </div>
+                        <div @click="tiahou" style="cursor: pointer; position: relative; width: 20px;color: #03BF8A; font-weight: 500;font-size: 13px;">
+                          查看历史告警
+                          <img
+                            class="thumbnail_27"
+                            referrerpolicy="no-referrer"
+                            src="../assets/images/icon_htgl_rljr.png"
+                            style="position: absolute; top: 50%;transform: translateY(-50%); right: -10px;"
+                          />
+                        </div>
+                    </div>
 
                 </div>
           </div>
@@ -567,153 +656,6 @@
     </el-row>
     </div>
 
-
-
-    <!-- 添加或修改投诉建议对话框 -->
-    <el-dialog title="回复建议" :visible.sync="open" width="800px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-row>
-          <el-col :span="24">
-            <el-form-item label="回复内容" prop="replyContent">
-              <!-- <editor v-model="form.replyContent" :min-height="192"/> -->
-              <el-input v-model="form.replyContent" type="textarea" placeholder="请输入内容" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="上传附件">
-              <fileUploadh :limit="20" v-model="form.suggestionFjList" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-    <el-dialog title="指派" :visible.sync="openz" width="640px" append-to-body>
-      <el-form ref="formz" :model="formz" :rules="rulesz" label-width="80px">
-        <el-row>
-          <el-col :span="24">
-            <el-form-item label="选择人员" prop="staffName">
-              <el-select style="width: 100%;" v-model="formz.staffName" placeholder="请选择维修人员">
-                <el-option @click.native="xuanse(dict)" v-for="dict in staffManageList" :key="dict.staffId"
-                  :label="dict.staffName + '('+ (dict.status == null?'' : dict.status == 1?'空闲中' : '指派中') + ')'"
-                  :value="dict.staffId"></el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitFormz">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-
-    <el-dialog title="完善信息" :visible.sync="openg" width="640px" append-to-body>
-      <el-form ref="formg" :model="formg" :rules="rulesg" label-width="80px">
-        <el-row>
-          <el-col :span="24" class="ngeshimg" >
-            <el-form-item label="身份证号" prop="idCard" style="position: relative;">
-                  <el-input v-model="formg.idCard" placeholder="请输入身份证号码" />
-                  <!-- <image-upload :limit="1" v-model="form.idCardBack"/> -->
-                  <image-uploadshib @uploadedSuccessfully="uploadedSuccessfully" :typeg = "1" :limit="1" v-model="formg.idCardBack"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="选择小区" prop="tenantId">
-               <el-select
-               style="width:100%;"
-               			  v-model="formg.tenantId"
-               			  clearable
-               			  filterable
-               			  reserve-keyword
-               			  placeholder="选择物业"
-               			>
-                    <!-- @click.native="chahue(item)" -->
-               			  <el-option v-for="item in tenantList" :key="item.tenantId" :label="item.companyName" :value="item.tenantId" > </el-option>
-               			  <template ><svg-icon icon-class="company" class="el-input__icon input-icon" /></template>
-               			</el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="人员性别" prop="gender">
-                      <el-select v-model="formg.gender" placeholder="请选择员工性别">
-                        <el-option
-                          v-for="dict in dict.type.gender"
-                          :key="dict.value"
-                          :label="dict.label"
-                          :value="dict.value"
-                        ></el-option>
-                      </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-                     <el-form-item label="员工类别" prop="staffCategory">
-                                           <el-select v-model="formg.staffCategory" placeholder="请选择员工类别">
-                                            <el-option
-                                            v-for="dict in dict.type.yaungong"
-                                            :key="dict.value"
-                                            :label="dict.label"
-                                            :value="dict.value"
-                                            ></el-option>
-                                           </el-select>
-                                         </el-form-item>
-                    </el-col>
-          <el-col :span="12">
-            <el-form-item label="维修分类" prop="maintenanceCategory">
-                      <el-select clearable v-model="formg.maintenanceCategory" placeholder="请选择维修分类">
-                        <el-option
-                          v-for="dict in dict.type.weixiutype"
-                          :key="dict.value"
-                          :label="dict.label"
-                          :value="dict.value"
-                        ></el-option>
-                      </el-select>
-                    </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="手机号码" prop="phoneNumber">
-                <el-input v-model="formg.phoneNumber" placeholder="请输入手机号码" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="15">
-            <el-form-item label="员工姓名" prop="staffName">
-               <el-input v-model="formg.staffName" placeholder="请输入员工姓名" />
-            </el-form-item>
-          </el-col>
-
-
-          <el-col :span="12" class="shefnze" >
-              <el-form-item label="头像" prop="avatarPhoto">
-            <image-upload :limit="1" v-model="formg.avatarPhoto"/>
-          </el-form-item>
-            </el-col>
-          <el-col :span="12" class="shefnze">
-             <el-form-item label="身份证国徽面" prop="idCardFront">
-               <image-upload :limit="1" v-model="formg.idCardFront"/>
-             </el-form-item>
-          </el-col>
-
-          <el-col :span="24" >
-              <el-form-item label="相关证件" prop="certificate">
-                        <file-upload v-model="formg.certificate"/>
-             </el-form-item>
-          </el-col>
-        </el-row>
-
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitFormg">确 定</el-button>
-      </div>
-    </el-dialog>
-
-    <!-- <el-dialog title="完善信息" :visible.sync="openg" width="640px" append-to-body>
-
-    </el-dialog> -->
-
-
   </div>
 </template>
 
@@ -741,11 +683,11 @@
       actualData: [120, 82, 91, 154, 162, 140, 130]
     }
   }
-
-
-
-  import { getTenantList} from "@/api/login";
+  // import { getTenantList} from "@/api/login";
   import {listNoPage} from "@/api/system/role";
+  import {warnManageIndex,warnManageIndexYear} from "@/api/index";
+  import { listWarnManage } from "@/api/manage/warnManage"
+  import { listEquipmentManage, getEquipmentManage, delEquipmentManage, addEquipmentManage, updateEquipmentManage } from "@/api/manage/equipmentManage"
   export default {
     name: "Index",
     dicts: ['baoxiutype', 'repair_status', 'patrol_type','yaungong', 'gender', 'weixiutype'],
@@ -795,31 +737,8 @@
             trigger: "blur"
           }],
         },
-        rulesz: {
-          staffName: [{
-            required: true,
-            message: "不能为空",
-            trigger: "blur"
-          }],
-
-        },
         value:'',
         options:[{label:'测试',value:1},{label:'测试1',value:2}],
-        rulesg:{
-          tenantId: [
-                            { required: true, message: "不能为空", trigger: "blur" }
-                          ],
-          staffName: [
-                            { required: true, message: "姓名不能为空", trigger: "blur" }
-                          ],
-                          // staffCategory: [
-                          //   { required: true, message: "员工类别", trigger: "change" }
-                          // ],
-
-                          phoneNumber: [
-                            { required: true, message: "手机号码不能为空", trigger: "blur" }
-                          ],
-        },
         staffManageList: [],
         xunjiantj: {},
         tatse: 0,
@@ -846,7 +765,19 @@
                     weekAll: [
                       '星期一','星期二','星期三','星期四','星期五','星期六','星期日',
                     ],
-        shoue:true
+        shoue:true,
+        tongjlie:{},
+        shouengs:false,
+        zhess:{
+          time:'2025'
+        },
+        // 告警管理表格数据
+        warnManageList: [],
+        // 折线图数据
+        zheixnhey:{},
+        zheshowe:false,
+        // 设备管理表格数据
+        equipmentManageList: [],
       };
     },
     created() {
@@ -855,30 +786,17 @@
       this.setDate(new Date())
       // 旧的
       this.userid = this.$store.getters.userId
-      if(this.$store.getters.authenticationUser =='1' || this.$store.getters.authenticationUser =='2'){
-        // 认证未通过或者未认证
-        this.shouzu = false
-        // this.getxinaqren()
-        // this.getrou(this.$store.getters.tenantId)
-      }else{
-        // if(){
-
-        // }
         this.shouzu = true
-        // this.getcharnae()
+        this.getxinaqren()
+
         // this.setTimer()
         this.gettime()
-        // this.getListtion()
-        // this.getListpair()
-        // this.getstaffManageList()
-        // this.getListRecord()
-        // this.getListRecordcun()
-        // this.baozhe()
-        // this.getche()
-      }
+        this.getrou()
+        this.getcharnae(this.getyer)
+        this.getListshe()
+
       clearInterval(this.timer)
       this.timer = null
-      this.getnhgwzuhue()
       console.log(this.shouzu)
     },
     methods: {
@@ -927,50 +845,37 @@
               },
               getAdate (item) {
                  this.todayDate = item.adate
+                 this.getrou(item.adate)
                 console.log(item)
               },
       // 日历结束
-      // 小区切换
-         chahue(row){
-           this.getrou(row.tenantId)
-         },
-         // 查询角色信息
+         // 查询视频告警
          getrou(row){
-           let pade={'tenantId':row}
-           listNoPage(pade).then(response => {
-               this.roleList = response.rows;
-               this.roleList.filter(rou=>{
-                 rou.dictValue=rou.roleKey
-                 rou.dictLabel=rou.roleName
-               })
-               if(response.rows.length !=0){
-                 this.formg.staffCategory = response.rows[0].roleKey
-               }
+            let sngse={'pageNum':1,'pageSize':3,'warnTime': null}
+           if(row != undefined){
+            sngse.warnTime =  row
+           }else{
+             sngse.warnTime = this.getyer + '-' + this.getmor+'-' +this.getday
+           }
+           listWarnManage(sngse).then(response => {
+               this.warnManageList = response.rows
+               console.log(this.warnManageList,91234)
              }
            );
          },
+         // 告警内容+部门统计
       getxinaqren(){
-        staffManagexq(this.$store.getters.userId).then(response => {
-          if(response.data == null){
-            this.ishsoe = true
-          }else{
-            this.ishsoe = false
-            this.forewg = response.data
-            this.tesrtw = response.data.tenantId
-          }
-          // this.tenantEnabled = response.data.tenantEnabled
-          // this.tenantList = response.data.voList;
-          // this.loading = false;
+        this.shouengs = false
+        warnManageIndex().then(response => {
+         this.tongjlie = response.data
+         this.shouengs = true
         });
 
       },
-      getnhgwzuhue(){
-        // this.loading = true;
-        getTenantList().then(response => {
-      	  // this.tenantEnabled = response.data.tenantEnabled
-          this.tenantList = response.data.voList;
-          // this.loading = false;
-        });
+      // 折线时间切换
+      zheschan(){
+        console.log(this.zhess)
+        this.getcharnae(this.zhess.time)
       },
       zhuhuet(){
           this.reset()
@@ -989,75 +894,24 @@
         // console.log(this.formg.phoneNumber,this.$store.getters.user.phonenumber)
 
       },
-      // 车辆进入\
-      getcharnae(){
-        car().then(response => {
-          this.carNume = response.data;
-        });
-      },
-      // 车辆管控
-      getche() {
-        vehicleControl().then(response => {
-          this.chelisngguan = response.data;
-        });
-      },
-      // 车辆管控点击
-      iszhe(val){
-        this.isacr = val
-      },
-      // 报修折线
-      baozhe() {
-        qx().then(response => {
-          this.zhexian = response.data;
-        });
-      },
-
-      // 巡更记录
-      getListRecord() {
-        let sgmse = {
-          'pageNum': 1,
-          'pageSize': 2,
-          'params':{
-            'createTime':this.getyer + '-' + this.getmor + '-' + this.getday,
-          },
-          // params:{'checkTime': this.getyer + '-' + this.getmor + '-' + this.getday},
-          // 'createTime': this.getyer + '-' + this.getmor + '-' + this.getday,
-          'checkStatus': 2,
-          'userId': this.userid
-        }
-        this.isxug = false
-        listCheckPointRecord(sgmse).then(response => {
-          this.checkPointRecordList = response.rows;
-          // this.checkPointRecordList .filter(rou=>{
-          //   rou.imges = []
-          //   if(rou.checkResultPhoto != null && rou.checkResultPhoto != ''){
-          //     rou.imges = rou.checkResultPhoto.split(',')
-          //   }
-          // })
-          if (this.checkPointRecordList.length == 0) {
-            let gh = {
-              'checkTime': '暂无数据',
-              'checkAddress': '暂无数据',
-              'checkUserName': '暂无数据',
-              'checkResult': '暂无数据',
-              'checkType': '暂无数据'
-            }
-            this.checkPointRecordList.push(gh)
-            this.checkPointRecordList.push(gh)
-          }
-          if (this.checkPointRecordList.length == 1) {
-            let gh = {
-              'checkTime': '暂无数据',
-              'checkAddress': '暂无数据',
-              'checkUserName': '暂无数据',
-              'checkResult': '暂无数据',
-              'checkType': '暂无数据'
-            }
-            this.checkPointRecordList.push(gh)
-          }
-          this.isxug = true
+      // 折线图
+      getcharnae(row){
+        this.zheshowe = false
+        warnManageIndexYear(row).then(response => {
+          this.zheixnhey = response.data;
+           this.zheshowe = true
+          console.log(this.zheixnhey)
         });
       },
+ /** 查询设备管理列表 */
+        getListshe() {
+          let queryParams={ pageNum: 1,
+              pageSize: 4,}
+          listEquipmentManage(queryParams).then(response => {
+            this.equipmentManageList = response.rows
+            this.total = response.total
+          })
+        },
       getListRecordcun() {
         count().then(response => {
           this.xunjiantj = response.data
@@ -1434,11 +1288,26 @@
                     };
               this.resetForm("formg");
             },
+      tiahou(){
+        // 视频告警
+        this.$router.push({
+          path: '/gaojingguanli',
+        })
+      },
+      thse(item){
+        this.$router.push({
+          path: '/gaojingguanli',
+          query: {
+          	'rangName':item.rangName,
+            'type':item.algorithmType
+          }
+        })
+      },
       tiahz(item){
         if(item == 0){
-          // 人员管理
+          // 实时检测
           this.$router.push({
-            path: '/renyuan',
+            path: '/shishi',
           })
         }else if(item == 1){
           // 设备管理
@@ -1451,9 +1320,9 @@
             path: '/gaojingguanli',
           })
         }else if(item == 3){
-          // 网络告警
+          // 参数设置
           this.$router.push({
-            path: '/NetworkManage',
+            path: '/huabuhaik',
           })
         }else if(item == 4){
           // 通道管理
@@ -1462,6 +1331,35 @@
           })
         }
 
+      },
+      cnahgshe(){
+        this.$router.push({
+          path: '/shebei',
+        })
+      },
+      gahse(row){
+        this.$router.push({
+          path: '/gaojingguanli',
+          query: {
+          	'type':row,
+          }
+        })
+      },
+      deckauie(row){
+        this.$router.push({
+          path: '/gaojingguanli',
+          query: {
+          	'deptId':row.deptId,
+          }
+        })
+      },
+      naidue(){
+        this.$router.push({
+          path: '/gaojingguanli',
+          query: {
+          	'year':this.zhess.time,
+          }
+        })
       }
 
     }
@@ -1531,11 +1429,23 @@
       line-height: 102px;
     }
   }
+
   .index{
     .el-select-dropdown__item .selected{
       color: #03BF8A;
     }
   }
+  .nshhgesindex{
+    .el-input--medium .el-input__inner{
+      border: none;
+      width: 98px;
+      height: 23px;
+      background-color: #EEF8F5;
+    }
+    .el-input--medium .el-input__icon{
+      line-height: 26px;
+    }
+  }
 
 
   </style>
@@ -1614,7 +1524,7 @@
   }
 
 </style>
-<style lang="scss">
+<style scoped lang="scss">
 // 蓝湖样式粘贴
 body {
   font-family: PingFangSC-Regular, Roboto, Helvetica Neue, Helvetica, Tahoma,
@@ -1841,6 +1751,11 @@ button:active {
   justify-content: space-around;
 }
 
+.gunshe{
+  width: 100%;
+    overflow-x: scroll;
+    white-space: nowrap;
+}
 .text-wrapper_1 {
   width: 84px;
   height: 44px;
@@ -3779,7 +3694,7 @@ button:active {
   height: 16px;
   overflow-wrap: break-word;
   color: rgba(51, 51, 51, 1);
-  font-size: 16px;
+  font-size: 15px;
   font-family: PingFang-SC-Heavy;
   font-weight: 900;
   text-align: left;
@@ -3816,6 +3731,26 @@ button:active {
   // margin: 6px 0 0 14px;
 }
 
+.text_96s {
+  // width: 56px;
+  // height: 14px;
+  background-color: #E1F2FA;
+  border-radius: 4px;
+  // height: 26px;
+  border: 1px solid #009FE8;
+  overflow-wrap: break-word;
+  color: #009FE8;
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 14px;
+  padding: 5px;
+  margin-right: 10px;
+  // margin: 6px 0 0 14px;
+}
+
 .thumbnail_27 {
   width: 18px;
   height: 14px;

+ 578 - 205
ruoyi-ui/src/views/shipinggaoj/channelNumber/index.vue

@@ -1,215 +1,265 @@
 <template>
   <div class="app-container " >
-    <div style="background-color: #fff;padding: 20px;border-radius: 10px; padding-bottom: 0;">
-                  <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;margin-left: -20px;">
-                    <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
-                   <span style="margin-left: 10px;">搜索条件</span>
-                  </p>
-                  <div style="padding-bottom: 0;margin-bottom: 20px;">
-    <el-form  class="qucheu" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="88px">
-      <el-form-item label="通道编号" prop="channelNum">
-        <el-input
-          v-model="queryParams.channelNum"
-          placeholder="请输入通道编号"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="视频地址" prop="videoAddress">
-        <el-input
-          v-model="queryParams.videoAddress"
-          placeholder="请输入视频地址"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item style="border: 0;">
-         <el-button style="background-color: #03BF8A; border-color: #03BF8A;" type="primary" size="mini"  @click="handleQuery">查询 </el-button>
-        <el-button  size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-    </div>
-    </div>
+    <el-row :gutter="10">
+      <el-col :span="4">
+          <div  class=" infinite-list" style="overflow:auto; background-color: #fff;border-radius: 10px;padding: 10px 20px;height: 96vh;">
+            <p style="margin: 0;border-left: 6px solid #03BF8A;margin-left: -20px;padding-left: 10px;font-weight: 800;">选择设备</p>
+            <div :class="ishge == index ? 'anche' : ''" style=" height: 36px;;line-height: 36px;margin-top: 10px;padding: 0 10px; cursor: pointer;"v-for="(item,index) in equipmentManageList" :key="index">
+                            <div @click="ishg(item,index)" style="display: flex;align-items: center;justify-content: space-between;">
+                              <div style="font-size: 16px;
+            color: #333333;"> {{item.equipmentName == null?'暂无数据' : item.equipmentName}}</div>
+                              <img src="../../../assets/images/icon_htgl_zd.png" alt="" style="width: 10px;height: 12px;">
+                            </div>
+                        </div>
 
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['manage:channelNumber:add']"
-        >新增</el-button>
-      </el-col>
-      <!-- <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['manage:channelNumber:edit']"
-        >修改</el-button>
-      </el-col> -->
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['manage:channelNumber:remove']"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['manage:channelNumber:export']"
-        >导出</el-button>
+
+          </div>
       </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
+      <el-col :span="open == false? 20 : 14">
+          <div style="background-color: #fff;padding: 20px;border-radius: 10px; padding-bottom: 0; padding-top: 10px;">
+                        <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;margin-left: -20px;">
+                          <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+                         <span style="margin-left: 10px;">搜索条件</span>
+                        </p>
+                        <div style="padding-bottom: 0;margin-bottom: 20px;">
+          <el-form  class="qucheu" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="88px">
+            <el-form-item label="通道编号" prop="channelNum">
+              <el-input
+                v-model="queryParams.channelNum"
+                placeholder="请输入通道编号"
+                clearable
+                @keyup.enter.native="handleQuery"
+              />
+            </el-form-item>
+            <el-form-item style="border: 0;">
+               <el-button style="background-color: #03BF8A; border-color: #03BF8A;" type="primary" size="mini"  @click="handleQuery">查询 </el-button>
+              <el-button  size="mini" @click="resetQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+          </div>
+          </div>
 
+          <el-row :gutter="10" class="mb8">
+            <el-col :span="24">
+              <div style="display: flex; justify-content: space-between;">
+                <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;">
+                  <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+                 <span style="margin-left: 10px;">通道列表</span>
+                </p>
+                <div>
+                  <el-button
+                    type="success"
+                    plain
+                    size="mini"
+                    @click="handleAdd"
+                    v-hasPermi="['manage:channelNumber:add']"
+                  >新增</el-button>
+                 <el-button
+                   type="danger"
+                   plain
+                   size="mini"
+                   :disabled="multiple"
+                   @click="handleDelete"
+                   v-hasPermi="['manage:channelNumber:remove']"
+                 >删除</el-button>
+                 <el-button
+                   type="warning"
+                   plain
+                   size="mini"
+                   @click="handleExport"
+                   v-hasPermi="['manage:channelNumber:export']"
+                 >导出</el-button>
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+          <div class=" infinite-list" :style="dynamicStyle" >
+            <div   style="display: flex;flex-wrap: wrap;" v-if="inhgeshwe">
+              <!-- item.channelDetails == null?'height:200px; margin-bottom: 10px;' : -->
+              <div   class="box_3dr flex-col" style="margin-bottom: 10px;" v-for="(item,index ) in channelNumberList" :key="index" >
+                            <div class="box_4 flex-row" style="justify-content: space-between;margin: 0;">
+                              <div  @click="handleSelectionChange(item)" style="display: flex;align-items: center;">
+                                <img
+                                  class="thumbnail_21"
+                                  referrerpolicy="no-referrer"
+                                  src="../../../assets/images/icon_lby_gx_normal.png"
+                                  v-show="!item.isnum && isgsow"
+                                />
+                                <img
+                                  class="thumbnail_21"
+                                  referrerpolicy="no-referrer"
+                                  src="../../../assets/images/icon_lby_gx_selcted.png"
+                                  v-show="item.isnum && isgsow"
+                                />
+                                <span class="text_19">{{item.channelNum}}</span>
+                              </div>
+                              <div>
+                                <img
+                                  class="image_1"
+                                  style="cursor: pointer;"
+                                  referrerpolicy="no-referrer"
+                                  @click="handleUpdate(item)"
+                                  v-hasPermi="['manage:equipmentManage:edit']"
+                                  src="../../../assets/images/icon_lby_gdtc_bj.png"
+                                />
+                                <img
+                                  class="thumbnail_22"
+                                   style="cursor: pointer;"
+                                  @click="handleDelete(item)"
+                                  v-hasPermi="['manage:equipmentManage:remove']"
+                                  referrerpolicy="no-referrer"
+                                   src="../../../assets/images/icon_lby_gdtc_del.png"/>
+                              </div>
+                            </div>
+                            <div style="padding: 10px;">
+                              <div class="box_6 flex-row jiange" style="  align-items: center;">
+                                <span class="text_21">视频地址: </span>
+                                <el-tooltip class="item" effect="dark" :content="item.videoAddress" placement="top-start">
+                                <div style=" margin-left: 12px; font-weight: 500;font-size: 13px;color: #222327; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+                                     {{item.videoAddress}}
+                                </div>
+                                </el-tooltip>
+                              </div>
+                              <div class="box_6 flex-row jiange" style="align-items: center;">
+                                <span class="text_21">协议类型: </span>
+                                <div style="margin-left: 12px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+                                  <dict-tag :options="dict.type.probing_protocol" :value="item.protocolType"/>
+                                </div>
+                              </div>
+                              <!-- <span class="text_20">设备地址:192.168.1.1</span> -->
+                              <div class="box_6 flex-row jiange">
+                                <span class="text_21">设备账号: </span>
+                                <div style=" margin-left: 12px; font-weight: 500;font-size: 13px;color: #222327; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+                                     {{item.account}}
+                                </div>
+                              </div>
 
-    <el-table  :height="tableMaxHeight" v-loading="loading" :data="channelNumberList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <!-- <el-table-column label="通道ID" align="center" prop="channelId" /> -->
-      <el-table-column label="通道编号" align="center" prop="channelNum" />
-      <el-table-column label="视频地址" align="center" prop="videoAddress" />
-      <el-table-column label="通道描述" align="center" prop="channelDetails" />
-      <el-table-column label="探测协议类型" align="center" prop="protocolType">
-              <template slot-scope="scope">
-                <dict-tag :options="dict.type.probing_protocol" :value="scope.row.protocolType"/>
-              </template>
-            </el-table-column>
-      <!-- <el-table-column label="备注" align="center" prop="remark" /> -->
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-        <template slot-scope="scope">
-          <el-button
-             size="mini"
-                        style="width: 42px;height: 26px;
-                        background: #E5F9F3;
-                               border-radius: 4px;border: 1px solid #03BF8A;color: #03BF8A;
-                        "
-                       type="text"
-                       plain
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['manage:channelNumber:edit']"
-          >修改</el-button>
-          <el-button
-            size="mini"
-                       type="text"
-                       style="width: 42px;height: 26px;background: #FFF1EA;
-                              border-radius: 4px;border: 1px solid #FE570E;color: #FE570E;"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['manage:channelNumber:remove']"
-          >删除</el-button>
-          <el-button
-            size="mini"
-                       type="text"
-                       style="width: 72px;height: 26px;background: #FFF1EA;
-                              border-radius: 4px;border: 1px solid #FE570E;color: #FE570E;"
-            @click="canshu(scope.row)"
-            v-hasPermi="['manage:channelNumber:remove']"
-          >参数配置</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
+                              <div class="box_6 flex-row jiange">
+                                <span class="text_21">设备密码: </span>
+                                <div style=" margin-left: 12px; font-weight: 500;font-size: 13px;color: #222327; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+                                     {{item.password}}
+                                </div>
+                              </div>
+                              <div class="box_6 flex-row jiange" style="  align-items: center;">
+                                <span class="text_21">预览端口: </span>
+                                <div style=" margin-left: 12px; font-weight: 500;font-size: 13px;color: #222327; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+                                     {{item.equipmentAddress}}
+                                </div>
+                              </div>
+                              <div class="box_6 flex-row jiange" style="  align-items: center;" >
+                                <span class="text_21">通道描述: </span>
+                                <el-tooltip class="item" effect="dark" :content="item.channelDetails" placement="top-start">
+                                <div style=" margin-left: 12px; font-weight: 500;font-size: 13px;color: #222327; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+                                     {{item.channelDetails}}
+                                </div>
+                                </el-tooltip>
+                              </div>
+                            </div>
 
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
-    <!-- 添加或修改通道管理对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-        <el-row>
-          <el-col :span="24">
-            <el-form-item label="选择设备" prop="channelNum">
-              <el-select style="width: 100%;" v-model="form.equipmentId" placeholder="请选择">
-                  <el-option
-                  @click.native="issheg(item)"
-                    v-for="item in equipmentManageList"
-                    :key="item.equipmentId"
-                    :label="item.equipmentName"
-                    :value="item.equipmentId">
-                  </el-option>
-                </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编号" prop="channelNum">
-              <el-input v-model="form.channelNum" placeholder="请输入通道编号" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="视频地址" prop="videoAddress">
-              <el-input v-model="form.videoAddress" placeholder="请输入视频地址" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="账号" prop="account">
-              <el-input v-model="form.account" placeholder="请输入账号" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="探测协议类型" prop="protocolType">
-                      <el-select style="width:100%" v-model="form.protocolType" placeholder="请选择探测协议类型">
-                        <el-option
-                          v-for="dict in dict.type.probing_protocol"
-                          :key="dict.value"
-                          :label="dict.label"
-                          :value="dict.value"
-                        ></el-option>
-                      </el-select>
-                    </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="密码" prop="password">
-              <el-input v-model="form.password" placeholder="请输入密码" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="预览端口" prop="port">
-              <el-input v-model="form.port"  placeholder="请输入内容" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="备注" prop="remark">
-              <el-input v-model="form.remark"  placeholder="请输入内容" />
-            </el-form-item>
-          </el-col>
+                          </div>
+            </div>
+          </div>
 
-          <el-col :span="12">
-            <el-form-item label="通道描述" prop="channelDetails">
-              <el-input v-model="form.channelDetails" type="textarea" placeholder="请输入内容" />
-            </el-form-item>
-          </el-col>
+          <paginations
+            v-show="total>0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+          />
+      </el-col>
+      <el-col :span="6" v-if="open">
+       <div style="background-color: #fff;padding: 10px 20px;border-radius: 10px; padding-bottom: 10px;">
+         <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;">
+           <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+          <span style="margin-left: 10px;">通道信息</span>
+         </p>
+         <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+           <el-row>
+             <el-col :span="24" v-if="xiugai">
+               <el-form-item label="设备管理" prop="protocolType">
+                         <el-select style="width:100%" v-model="form.equipmentId" placeholder="请选择设备管理">
+                           <el-option
+                           @click="issheg(dict)"
+                             v-for="dict in equipmentManageList"
+                             :key="dict.equipmentId"
+                             :label="dict.equipmentName"
+                             :value="dict.equipmentId"
+                           ></el-option>
+                         </el-select>
+                       </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="编号" prop="channelNum">
+                 <el-input v-model="form.channelNum" placeholder="请输入通道编号" />
+               </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="视频地址" prop="videoAddress">
+                 <el-input v-model="form.videoAddress" placeholder="请输入视频地址" />
+               </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="账号" prop="account">
+                 <el-input v-model="form.account" placeholder="请输入账号" />
+               </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="探测协议" prop="protocolType">
+                         <el-select style="width:100%" v-model="form.protocolType" placeholder="请选择探测协议类型">
+                           <el-option
+                             v-for="dict in dict.type.probing_protocol"
+                             :key="dict.value"
+                             :label="dict.label"
+                             :value="dict.value"
+                           ></el-option>
+                         </el-select>
+                       </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="密码" prop="password">
+                 <el-input v-model="form.password" placeholder="请输入密码" />
+               </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="预览端口" prop="port">
+                 <el-input v-model="form.port"  placeholder="请输入内容" />
+               </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="备注" prop="remark">
+                 <el-input v-model="form.remark"  placeholder="请输入内容" />
+               </el-form-item>
+             </el-col>
+
+             <el-col :span="24">
+               <el-form-item label="通道描述" prop="channelDetails">
+                 <el-input v-model="form.channelDetails" type="textarea" placeholder="请输入内容" />
+               </el-form-item>
+             </el-col>
+
+           </el-row>
+          <!-- <el-form-item label="删除标志" prop="delFlag">
+             <el-input v-model="form.delFlag" placeholder="请输入删除标志" />
+           </el-form-item> -->
+
+         </el-form>
+         <div slot="footer" class="dialog-footer" style="display: flex;justify-content: flex-end;">
+           <el-button style="background-color:#03BF8A ; border-color: #03BF8A;" type="primary" @click="submitForm">确 定</el-button>
+           <el-button style="background-color:#DDEBE7 ; border-color: #DDEBE7; color: #475669;" @click="cancel">取 消</el-button>
+         </div>
+       </div>
+      </el-col>
+    </el-row>
 
-        </el-row>
-       <!-- <el-form-item label="删除标志" prop="delFlag">
-          <el-input v-model="form.delFlag" placeholder="请输入删除标志" />
-        </el-form-item> -->
 
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button style="background-color:#03BF8A ; border-color: #03BF8A;" type="primary" @click="submitForm">确 定</el-button>
-        <el-button style="background-color:#DDEBE7 ; border-color: #DDEBE7; color: #475669;" @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
   </div>
 </template>
 
 <script>
 import { listChannelNumber, getChannelNumber, delChannelNumber, addChannelNumber, updateChannelNumber } from "@/api/system/channelNumber"
 import { listEquipmentManageNoPage,  } from "@/api/manage/equipmentManage"
+import Masonry from "masonry-layout";
 export default {
   name: "ChannelNumber",
   dicts: ['probing_protocol'],
@@ -229,6 +279,7 @@ export default {
       total: 0,
       // 通道管理表格数据
       channelNumberList: [],
+      equipmentManageList:[],
       // 弹出层标题
       title: "",
       // 是否显示弹出层
@@ -236,7 +287,7 @@ export default {
       // 查询参数
       queryParams: {
         pageNum: 1,
-        pageSize: 10,
+        pageSize: 8,
         channelNum: null,
         videoAddress: null,
         protocolType: null,
@@ -252,12 +303,23 @@ export default {
         account: [
                   { required: true, message: "不能为空", trigger: "blur" }
                 ],
-        password: [
+        // password: [
+        //           { required: true, message: "不能为空", trigger: "blur" }
+        //         ],
+        videoAddress: [
                   { required: true, message: "不能为空", trigger: "blur" }
                 ],
+
       },
        tableMaxHeight:'200',
-       equipmentManageList:[]
+       equipmentManageList:[],
+       ishge:0,
+       singleg:true,
+       xiugai:false,
+       ishsouetan:false,
+        isgsow:true,
+        manid:0,
+        inhgeshwe:true
     }
   },
   created() {
@@ -268,6 +330,14 @@ export default {
     	    }
     	    this.changeTableMaxHeight()
   },
+  computed: {
+    dynamicStyle() {
+      return {
+        overflow:'auto',
+        height:  this.tableMaxHeight + 'px',
+      }
+    }
+    },
   mounted() {
   	window.onresize = () => {
   	          this.changeTableMaxHeight()
@@ -275,11 +345,42 @@ export default {
   	        this.changeTableMaxHeight()
   },
   methods: {
+    // 切换点击
+    sande(row){
+      console.log(row)
+      this.isgsow = false
+      row.isnum =  !row.isnum
+      this.isgsow = true
+      let nhde = []
+      let nsg = ''
+      this.equipmentManageList.filter(rou=>{
+        if(rou.isnum == true){
+          nhde.push(rou.equipmentId)
+        }
+      })
+      if(nhde.length == 1){
+        this.equipmentManageList.filter(rou=>{
+          if(rou.isnum == true){
+            console.log(rou.equipmentId)
+            this.manid = rou.equipmentId
+            console.log(this.manid)
+          }
+        })
+        this.singleg = false
+      }else{
+        // this.manid  = row.
+        this.singleg = true
+      }
+      // console.log()
+    },
     /** 查询通道管理列表 */
     getList() {
       this.loading = true
       listChannelNumber(this.queryParams).then(response => {
         this.channelNumberList = response.rows
+        this.channelNumberList.filter(rou=>{
+          rou.isnum = false
+        })
         this.total = response.total
         this.loading = false
       })
@@ -289,9 +390,24 @@ export default {
           this.loading = true
           listEquipmentManageNoPage().then(response => {
             this.equipmentManageList = response.rows
+            if(this.equipmentManageList.length !=0){
+               // this.queryParams.equipmentId = this.equipmentManageList[0].equipmentId
+               this.form.equipmentId = this.equipmentManageList[0].equipmentId
+               this.form.equipmentNum = this.equipmentManageList[0].equipmentNum
+               this.form.equipmentName = this.equipmentManageList[0].equipmentName
+            }
             this.loading = false
           })
         },
+        // 设备点击
+        ishg(row,index){
+          this.ishge = index
+          this.queryParams.equipmentId = row.equipmentId
+          this.form.equipmentId = row.equipmentId
+          this.form.equipmentNum = row.equipmentNum
+          this.form.equipmentName = row.equipmentName
+          this.getList()
+        },
     // 取消按钮
     cancel() {
       this.open = false
@@ -303,7 +419,7 @@ export default {
         channelId: null,
         channelNum: null,
         videoAddress: null,
-        protocolType: null,
+        protocolType: '1',
         channelDetails: null,
         delFlag: null,
         createBy: null,
@@ -323,25 +439,42 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
+      this.queryParams.equipmentId = null
       this.resetForm("queryForm")
       this.handleQuery()
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.channelId)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
+      // console.log(selection)
+      this.isgsow = false
+      selection.isnum = !selection.isnum
+      this.isgsow = true
+      let nhseg= []
+      this.channelNumberList.filter(rou=>{
+        if(rou.isnum == true){
+          nhseg.push(rou)
+        }
+      })
+      console.log(nhseg)
+      this.ids = nhseg.map(item => item.channelId)
+      console.log(this.ids,nhseg)
+      this.single = nhseg.length!==1
+      this.multiple = !nhseg.length
     },
     /** 新增按钮操作 */
     handleAdd() {
       this.reset()
       this.open = true
-      this.title = "添加通道管理"
+      // this.title = "添加通道管理"
+      this.xiugai = false
+      this.inhgeshwe = false
+      this.form.port = '80'
       if(this.equipmentManageList.length !=0){
         this.form.equipmentId = this.equipmentManageList[0].equipmentId
         this.form.equipmentNum = this.equipmentManageList[0].equipmentNum
         this.form.equipmentName = this.equipmentManageList[0].equipmentName
       }
+      this.inhgeshwe = true
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
@@ -349,8 +482,9 @@ export default {
       const channelId = row.channelId || this.ids
       getChannelNumber(channelId).then(response => {
         this.form = response.data
+        this.xiugai = true
         this.open = true
-        this.title = "修改通道管理"
+        // this.title = "修改通道管理"
       })
     },
     /** 提交按钮 */
@@ -440,7 +574,246 @@ export default {
     .el-input__inner{
       border:0;
     }
+
+  }
+
+.anche{
+  background: #E7F1EE !important;
+  border-radius: 4px  !important;
+  font-weight: 400;
+  div{
+    color: #03BF8A !important;
+  }
+}
+
+</style>
+<style scoped>
+  .el-table .el-table__header-wrapper th, .el-table .el-table__fixed-header-wrapper th{
+    background-color:#F5F6F8;
+  }
+  .el-checkbox__input.is-checked .el-checkbox__inner{
+    background-color: #03BF8A;
+    border-color: #03BF8A;
+  }
+  .el-checkbox__input.is-indeterminate .el-checkbox__inner{
+    background-color: #03BF8A;
+    border-color: #03BF8A;
   }
 
+.flex-col {
+  display: flex;
+  flex-direction: column;
+}
+.flex-row {
+  display: flex;
+  flex-direction: row;
+}
+.justify-between {
+  display: flex;
+  justify-content: space-between;
+}
 
+.box_3dr {
+  background-color: rgba(255, 255, 255, 1);
+  border-radius: 10px;
+  position: relative;
+  width: 49%;
+  height: 100%;
+  /* padding-bottom: 15px; */
+margin-left: 3px ;
+  margin-right: 3px;
+}
+.box_4 {
+  width: 100%;
+  /* height: 18px; */
+  padding: 11px 10px 11px 10px;
+  border-bottom: 1px solid #E6E6E6;
+}
+.thumbnail_21 {
+  width: 18px;
+  height: 18px;
+}
+.text_19 {
+  /* width: 97px; */
+  height: 13px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Bold;
+  font-weight: 700;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 13px;
+  margin: 0 0 0 11px;
+}
+.image_1 {
+  width:14px;
+  height: 14px;
+  /* margin-left: 51px; */
+}
+.thumbnail_22 {
+  width: 14px;
+  height: 14px;
+  margin: 3px 0 0 10px;
+}
+.image_2 {
+  width: 248px;
+  height: 1px;
+  margin-top: 9px;
+}
+.box_5 {
+  background-color: rgba(255, 255, 255, 1);
+ /* width: 220px; */
+  height: 118px;
+  padding: 10px;
+  /* margin: 12px 0 0 14px; */
+}
+.text_20 {
+  /* width: 139px; */
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 8px;
+  margin: 0 0 14px 0;
+}
+.box_6 {
+  /* width: 126px; */
+  height: 24px;
+  margin: 0;
+}
+.text_21 {
+  width: 60px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 8px;
+  margin-top: 5px;
+}
+.text-wrapper_7 {
+  background-color: rgba(255, 244, 235, 1);
+  border-radius: 4px;
+  height: 24px;
+  border: 1px solid rgba(253, 127, 16, 1);
+  width: 58px;
+}
+.text_22 {
+  width: 42px;
+  height: 13px;
+  overflow-wrap: break-word;
+  color: rgba(253, 127, 16, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 46px;
+  margin: 6px 0 0 8px;
+}
+.text_23 {
+  width: 145px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 46px;
+  margin: 8px 0 0 14px;
+}
+.text_24 {
+  width: 152px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 46px;
+  margin: 13px 0 0 14px;
+}
+.text_25 {
+  width: 154px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 46px;
+  margin: 13px 0 15px 15px;
+}
+.box_7 {
+  box-shadow: 0px 0px 10px 0px rgba(209, 209, 209, 1);
+  background-color: rgba(255, 255, 255, 1);
+  border-radius: 8px;
+  position: absolute;
+  left: 159px;
+  top: 35px;
+  width: 88px;
+  height: 70px;
+}
+.image-text_2 {
+  width: 58px;
+  height: 15px;
+  margin: 13px 0 0 16px;
+}
+.thumbnail_23 {
+  width: 15px;
+  height: 15px;
+}
+.text-group_2 {
+  width: 27px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(61, 69, 91, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 80px;
+  margin-top: 1px;
+}
+.image-text_3 {
+  width: 59px;
+  height: 17px;
+  margin: 11px 0 14px 15px;
+}
+.thumbnail_24 {
+  width: 16px;
+  height: 17px;
+}
+.text-group_3 {
+  width: 27px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(61, 69, 91, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 80px;
+  margin-top: 2px;
+}
+.jiange{
+margin-bottom: 3px;
+align-items: center;
+}
 </style>

+ 87 - 53
ruoyi-ui/src/views/shipinggaoj/gaojingguanli/index.vue

@@ -9,10 +9,9 @@
         <div style="padding-bottom: 0;margin-bottom: 20px;">
           <el-form class="qucheu" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="88px">
             <el-row>
-              <el-col :span="24">
-                <el-col :span="8">
+                <el-col :span="6">
                   <el-form-item label="告警类别" prop="algorithmType">
-                          <el-select v-model="queryParams.algorithmType" placeholder="请选择告警类别" clearable>
+                          <el-select style="width: 140px;" v-model="queryParams.algorithmType" placeholder="请选择告警类别" clearable>
                             <el-option
                               v-for="dict in dict.type.gaojing_typeshuju"
                               :key="dict.value"
@@ -22,40 +21,16 @@
                           </el-select>
                         </el-form-item>
                 </el-col>
-                <el-col :span="8">
-                 <el-form-item label="上报状态" prop="reportStatus">
-                         <el-select v-model="queryParams.reportStatus" placeholder="请选择上报状态" clearable>
-                           <el-option
-                             v-for="dict in dict.type.shagnt"
-                             :key="dict.value"
-                             :label="dict.label"
-                             :value="dict.value"
-                           />
-                         </el-select>
-                       </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                 <el-form-item label="视频通道" prop="channelNum">
-                         <el-input
-                           v-model="queryParams.channelNum"
-                           placeholder="请输入视频通道"
-                           clearable
-                           @keyup.enter.native="handleQuery"
-                         />
-                       </el-form-item>
+                <el-col :span="6">
+                  <el-form-item label="告警时间" prop="warnTime">
+                          <el-date-picker style="width: 140px;" clearable
+                            v-model="queryParams.warnTime"
+                            type="date"
+                            value-format="yyyy-MM-dd"
+                            placeholder="请选择告警时间">
+                          </el-date-picker>
+                        </el-form-item>
                 </el-col>
-
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="告警时间" prop="warnTime" style="width: 90%;">
-                        <el-date-picker style="width: 100%;" clearable
-                          v-model="queryParams.warnTime"
-                          type="date"
-                          value-format="yyyy-MM-dd"
-                          placeholder="请选择告警时间">
-                        </el-date-picker>
-                      </el-form-item>
-              </el-col>
               <el-col :span="5">
                 <el-form-item class="butt" style="border: 0;">
                   <el-button style="background-color: #03BF8A; border-color: #03BF8A;" type="primary" size="mini"  @click="handleQuery">查询 </el-button>
@@ -113,18 +88,19 @@
               <div class=" infinite-list" :style="dynamicStyle">
                 <el-row :gutter="10" v-if="warnManageList.length !=0" style="width: 100%;margin-left: 0;">
                   <el-col :span="6" v-for="(item,index) in warnManageList" :key="index" style="cursor: pointer;">
-                    <div v-if="isshoe"  @click="isac(item)"  :class=" item.isnum ==true ? 'ingwe' :'' " style="position: relative; background-color: #fff;box-shadow: 0px 0px 10px 0px #CDCDCD;border-radius: 10px;margin-bottom: 10px;height: 370px;">
+                    <div v-if="isshoe"  @click="isac(item)"  :class=" item.isnum ==true ? 'ingwe' :'' " style="position: relative; background-color: #fff;box-shadow: 0px 0px 10px 0px #CDCDCD;border-radius: 10px;margin-bottom: 10px;padding-bottom: 10px;">
                       <div class="quning">
                         <div class="shipige">
                           <div style="display: flex;align-items: center;">
                             <img src="../../../assets/images/icon_gjgl_gx_normal.png" alt="" v-if="item.isnum == false">
                             <img src="../../../assets/images/icon_gjgl_gx_selected.png" alt="" v-if="item.isnum == true">
-                            <p style="font-size: 14px;color: #333;font-weight: 700; margin-left: 5px;">告警任务{{index + 1}}</p>
+                            <p style="font-size: 14px;color: #333;font-weight: 700; margin-left: 5px;">{{ item.rangName + (item.algorithmType == 0 ? '离岗' : '玩手机') + '告警'}}</p>
                           </div>
-                          <p style="font-size: 14px; color: #aaa;font-weight: 500;" @click="tiahzo(item)">详情→</p>
+                          <!-- <p style="font-size: 14px; color: #aaa;font-weight: 500;" @click="tiahzo(item)">详情→</p> -->
                         </div>
-                        <image-preview :src="item.warnImage" :width="100 +'%'" :height="150"  style=""/>
-                       <!-- <video
+                        <!-- <img :src="item.warnImage" alt="" style="width: 100%; height: 150px;"> -->
+                        <image-preview v-if="item.warnImage != null && item.warnImage != ''" :src="item.warnImage" :width="100 +'%'" :height="150"  style=""/>
+                      <video
                                  :id="'myVideo' + (index+1)"
                                  data-setup="{}"
                                  loop="loop"
@@ -134,10 +110,11 @@
                                  @play="videoPlay(item)"
                                  poster=""
                                  style="width: 100%;height: 150px;"
+                                 v-if=" item.videoAddress != null && item.videoAddress != ''"
                                >
                                <!-- + baseUrl -->
-                                 <!-- <source  :src="defaultSettings.urls+ item.videoUrl " />
-                               </video> -->
+                                 <source  :src="item.videoAddress " />
+                               </video>
                       </div>
 
                       <div class="goe">
@@ -149,26 +126,26 @@
                           <p>算法参数:</p>
                           <p>{{item.parameterSet == null?'暂无数据' : item.parameterSet}}</p>
                         </div>
-                        <div style="display: flex;align-items: center;margin-top: 8px;">
+                       <!-- <div style="display: flex;align-items: center;margin-top: 8px;">
                           <p>视频通道:</p>
                           <p>{{item.channelNum == null?'暂无数据' : item.channelNum}}</p>
-                        </div>
+                        </div> -->
                         <div style="display: flex;align-items: center;margin-top: 8px;">
                           <p>告警日期:</p>
                           <p>{{item.warnTime == null?'暂无数据' : item.warnTime}}</p>
                         </div>
-                        <div style="display: flex;align-items: center;margin-top: 8px;">
+                        <!-- <div style="display: flex;align-items: center;margin-top: 8px;">
                           <p>上报地址:</p>
                           <p>{{item.reportAddress == null?'暂无数据' : item.reportAddress}}</p>
-                        </div>
+                        </div> -->
                         <div style="display: flex;align-items: center;margin-top: 8px;">
                           <p>上报状态:</p>
                           <div><dict-tag :options="dict.type.shagnt" :value="item.reportStatus"/></div>
                         </div>
-                        <div style="display: flex;align-items: center;margin-top: 8px;">
+                        <!-- <div style="display: flex;align-items: center;margin-top: 8px;">
                           <p>告警内容:</p>
                           <div><dict-tag :options="dict.type.gaojing_typeshuju" :value="item.algorithmType"/></div>
-                        </div>
+                        </div> -->
                       </div>
                       <!-- <img v-if="item.isnum == true" src="../../../assets/images/icon_htgl_kp_gx.png" alt="" style="width: 35px;height: 35px;position: absolute;bottom: 0;right: 0;"> -->
                     </div>
@@ -334,6 +311,10 @@ export default {
               reportStatus: null,
               warnTime: null,
               warnImage: null,
+              algorithmType:null,
+              params:{
+                month:null
+              }
             },
             // 表单参数
             form: {},
@@ -378,16 +359,47 @@ export default {
       },
   created() {
     this.startTime = Date.now()
+    if(this.$route.query.type != undefined){
+      if(this.$route.query.type == 'zs'){
+        this.queryParams.params.month =  this.gettimeyer()
+      }else {
+         this.queryParams.algorithmType =  this.$route.query.type
+      }
+    }else{
+      this.queryParams.params.month = null
+      this.queryParams.algorithmType =  null
+    }
+    if(this.$route.query.deptId != undefined){
+      this.queryParams.params.month =  this.gettimeyer()
+      this.queryParams.deptId = this.$route.query.deptId
+    }else{
+      this.queryParams.params.month =  null
+      this.queryParams.deptId = null
+    }
+    if(this.$route.query.rangName != undefined){
+      this.queryParams.warnTime =  this.gettime()
+      this.queryParams.rangName = this.$route.query.rangName
+      this.queryParams.algorithmType =  this.$route.query.type
+    }else{
+      this.queryParams.warnTime =  null
+      this.queryParams.rangName = null
+    }
+    if(this.$route.query.year != undefined){
+      this.queryParams.params.year = this.$route.query.year
+    }else{
+      this.queryParams.params.year = null
+    }
+
+
     this.getList();
     this.getListt()
   window.onresize = () => {
   	      this.changeTableMaxHeight()
   	    }
   	    this.changeTableMaxHeight()
-
-
   },
   mounted() {
+
     // this.createMqtt() // 建立mqtt通信
   	window.onresize = () => {
   	          this.changeTableMaxHeight()
@@ -407,6 +419,22 @@ export default {
       // this.disconnect()
     },
   methods: {
+    gettimeyer(){
+      let nowDate = new Date()
+      				  let date = {
+      				    year: nowDate.getFullYear(),
+      				    month: nowDate.getMonth() + 1,
+      				    date: nowDate.getDate()
+      				  }
+                 if (parseInt(date.month) < 10) {
+                    date.month = '0' + date.month
+                  }
+      				   if (parseInt(date.date) < 10) {
+      				      date.date = '0' + date.date
+      				    }
+                  let nghe = date.year + '-' + date.month
+      				  return nghe
+    },
        minToHm(min) {
           let h = Math.floor(min / 60);
           let m = min % 60;
@@ -419,14 +447,13 @@ export default {
     getList() {
       this.loading = true;
       this.isshoe = false
-
       listWarnManage(this.queryParams).then(response => {
         this.warnManageList   = response.rows;
         this.warnManageList.filter(rou=>{
           rou.isnum = false
         })
         this.isshoe = true
-
+        // this.getge(this.warnManageList)
         this.total = response.total;
         this.loading = false;
       });
@@ -574,6 +601,13 @@ export default {
         },
         /** 重置按钮操作 */
         resetQuery() {
+          this.queryParams.pageNum = 1
+          this.queryParams.params.month = null
+          this.queryParams.algorithmType =  null
+          this.queryParams.deptId = null
+          this.queryParams.warnTime =  null
+          this.queryParams.rangName = null
+          this.queryParams.params.year = null
           this.resetForm("queryForm")
           this.handleQuery()
         },

文件差異過大導致無法顯示
+ 570 - 537
ruoyi-ui/src/views/shipinggaoj/huabuhaik/index.vue


+ 192 - 188
ruoyi-ui/src/views/shipinggaoj/renyuan/index.vue

@@ -1,191 +1,184 @@
 <template>
   <div class="app-container">
     <div >
-      <div style="background-color: #fff;padding: 20px;border-radius: 10px; padding-bottom: 0;">
-              <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;margin-left: -20px;">
-                <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
-               <span style="margin-left: 10px;">搜索条件</span>
-              </p>
-              <div style="padding-bottom: 0;margin-bottom: 20px;">
-                <el-form class="qucheu" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="108px">
-                  <el-row>
-
-                    <el-col :span="24">
-                      <el-col :span="8">
-                        <el-form-item label="人员姓名" prop="staffName">
-                                <el-input
-                                  v-model="queryParams.staffName"
-                                  placeholder="请输入人员姓名"
-                                  clearable
-                                  @keyup.enter.native="handleQuery"
-                                />
-                              </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                       <el-form-item label="联系方式" prop="staffPhone">
-                               <el-input
-                                 v-model="queryParams.staffPhone"
-                                 placeholder="请输入人员联系方式"
-                                 clearable
-                                 @keyup.enter.native="handleQuery"
-                               />
+      <el-row :gutter="10">
+        <el-col :span="17">
+          <div style="background-color: #fff;padding: 20px;border-radius: 10px; padding-bottom: 0;">
+                  <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;margin-left: -20px;">
+                    <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+                   <span style="margin-left: 10px;">搜索条件</span>
+                  </p>
+                  <div style="padding-bottom: 0;margin-bottom: 20px;">
+                    <el-form class="qucheu" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="88px">
+                      <el-row>
+                            <el-form-item label="人员姓名" prop="staffName">
+                                    <el-input
+                                      v-model="queryParams.staffName"
+                                      placeholder="请输入人员姓名"
+                                      clearable
+                                      @keyup.enter.native="handleQuery"
+                                    />
+                                  </el-form-item>
+
+                           <el-form-item label="联系方式" prop="staffPhone">
+                                   <el-input
+                                     v-model="queryParams.staffPhone"
+                                     placeholder="请输入人员联系方式"
+                                     clearable
+                                     @keyup.enter.native="handleQuery"
+                                   />
+                                 </el-form-item>
+                          <el-form-item class="butt" style="border: 0; float: right;">
+                            <el-button style="background-color: #03BF8A; border-color: #03BF8A;" type="primary" size="mini"  @click="handleQuery">查询 </el-button>
+                            <el-button size="mini"  @click="resetQuery">重置</el-button>
+                          </el-form-item>
+                      </el-row>
+
+                    </el-form>
+                  </div>
+                </div>
+             <div class="casr"  >
+                     <el-row :gutter="10" class="mb8">
+                       <!-- <el-col :span="1.5">
+                         <div style="font-weight: bold;font-size: 14px;color: #343434; display: flex;align-items: center;">
+                           当夜全选
+                         </div>
+                       </el-col> -->
+                       <el-col :span="1.5">
+                         <el-button
+                           type="success"
+                           plain
+                           size="mini"
+                           @click="handleAdd"
+                           v-hasPermi="['manage:staffManage:add']"
+                         >添加</el-button>
+                       </el-col>
+                       <!-- <el-col :span="1.5">
+                         <el-button
+                           type="success"
+                           plain
+                           size="mini"
+                           :disabled="single"
+                           @click="handleUpdate"
+                           v-hasPermi="['system:post:edit']"
+                         >修改</el-button>
+                       </el-col>
+                       <el-col :span="1.5">
+                         <el-button
+                           type="danger"
+                           plain
+                           size="mini"
+                           :disabled="multiple"
+                           @click="handleDelete"
+                           v-hasPermi="['system:post:remove']"
+                         >删除</el-button>
+                       </el-col> -->
+                       <el-col :span="1.5">
+                         <el-button
+                           type="warning"
+                           plain
+                           size="mini"
+                           @click="handleExport"
+                           v-hasPermi="['manage:staffManage:export']"
+                         >导出</el-button>
+                       </el-col>
+                     </el-row>
+                     <div class=" infinite-list" :style="dynamicStyle">
+                       <el-row :gutter="10" v-if="staffManageList.length !=0" style="width:100%;margin-left: 0;">
+                         <el-col :span="8" v-for="(item,index) in staffManageList" :key="index"  >
+                           <!-- @click="isac(item)" -->
+                           <div v-if="isshoe"  :class=" item.isnum ==true ? 'ingwe' :'' " style="position: relative; background-color: #fff;box-shadow: 0px 0px 10px 0px #CDCDCD;border-radius: 4px;margin-bottom: 10px;">
+                             <div style="display: flex; align-items: center;padding: 15px 20px; position: relative;padding-bottom: 0;">
+                             <div>
+                                <image-preview :src="item.staffImage" :width="50" :height="50"  style="border-radius:50%;margin-top: -10px;"/>
+                                <!-- <img src="../../../assets/images/icon_htgl_rylb_mrtx.png" alt="" style="width: 50px;height: 50px;border-radius: 50%;" > -->
+                             </div>
+                             <div class="haned">
+                               <p style="margin-bottom: 5px;">
+                                 <span style="font-weight: bold;font-size: 16px;color: #161616;margin-left: 15px;margin-right: 10px;">{{item.staffName ==null?'暂无数据' : item.staffName}}</span>
+                                 <img v-hasPermi="['manage:staffManage:edit']" src="../../../assets/images/icon_htgl_rylb_bj.png" alt=""  style="cursor: pointer;" @click="handleUpdate(item)">
+                                 <img v-hasPermi="['manage:staffManage:remove']" src="../../../assets/images/icon_htgl_rylb_del.png" alt=""  style="float: right;cursor: pointer;" @click="handleDelete(item)">
+                               </p>
+                               <div style="display: flex; margin-left: 15px;font-size: 14px;color: #666666;margin-top: 5px;">
+                                 <p  style="text-align: left; width: 40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" > 电话号码:</p>
+                                 <p style="width: 60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left: 5px;font-size: 14px;color: #666666;">
+                                   {{item.staffPhone ==null?'暂无数据' : item.staffPhone}}
+                                 </p>
+                               </div>
+                               <div style="display: flex; margin-left: 15px;font-size: 14px;color: #666666;margin-top: 5px;">
+                                 <el-tooltip class="item" effect="dark" content="紧急联系人" placement="top-start">
+                                 <p style="width: 40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" >紧急联系人:</p>
+                                 </el-tooltip>
+                                 <p style="width: 60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left: 5px;font-size: 14px;color: #666666;">
+                                   {{item.emergencyContact ==null?'暂无数据' : item.emergencyContact}}
+                                 </p>
+                               </div>
+                               <div style=" display: flex; margin-left: 15px;font-size: 14px;color: #666666;margin-top: 5px;">
+                                 <el-tooltip class="item" effect="dark" content="紧急电话号码" placement="top-start">
+                                 <p style="width: 40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">紧急电话号码:</p>
+                                 </el-tooltip>
+                                 <p style="width: 60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left: 5px;font-size: 14px;color: #666666;">
+                                   {{item.emergencyContactPhone ==null?'暂无数据' : item.emergencyContactPhone}}
+                                 </p>
+                               </div>
+                             </div>
+                             </div>
+                              <!-- <div class="weit">
+                                                     <p>开发部</p>
+                                                     <p>白名单</p>
+                                                   </div> -->
+
+
+                             <img v-if="item.isnum == true" src="../../../assets/images/icon_htgl_kp_gx.png" alt="" style="width: 35px;height: 35px;position: absolute;bottom: 0;right: 0;">
+                           </div>
+                         </el-col>
+                       </el-row>
+                       <div style="margin-top: 20px;display: flex;justify-content: center;align-items: center;" v-if="staffManageList.length ==0">
+                          <img   src="../../../assets/images/zwshjbig.png" alt="" style="">
+                       </div>
+                     </div>
+             </div>
+        </el-col>
+        <el-col :span="7" class="ite">
+           <div style="background-color: #fff;padding: 10px;border-radius: 10px;">
+             <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;">
+               <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+              <span style="margin-left: 10px;">人员信息</span>
+             </p>
+             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+
+                     <el-form-item label="人员姓名" prop="staffName">
+                               <el-input v-model="form.staffName" placeholder="请输入人员姓名" />
                              </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                       <el-form-item label="紧急联系人" prop="emergencyContact">
-                               <el-input
-                                 v-model="queryParams.emergencyContact"
-                                 placeholder="请输入紧急联系人"
-                                 clearable
-                                 @keyup.enter.native="handleQuery"
-                               />
+
+                     <el-form-item label="联系方式" prop="staffPhone">
+                               <el-input v-model="form.staffPhone" placeholder="请输入人员联系方式" />
                              </el-form-item>
-                      </el-col>
-
-                    </el-col>
-                    <el-col :span="8">
-                      <el-form-item label="紧急联系方式" prop="emergencyContactPhone">
-                              <el-input
-                                v-model="queryParams.emergencyContactPhone"
-                                placeholder="请输入紧急联系人手机"
-                                clearable
-                                @keyup.enter.native="handleQuery"
-                              />
+
+                     <el-form-item label="紧急联系人" prop="emergencyContact">
+                              <el-input v-model="form.emergencyContact" placeholder="请输入紧急联系人" />
                             </el-form-item>
-                    </el-col>
-                    <el-col :span="8">
-                       <el-form-item label="创建时间" prop="createTime">
-                                              <el-date-picker clearable
-                                              style="width: 100%;"
-                                                v-model="queryParams.createTime"
-                                                type="date"
-                                                value-format="yyyy-MM-dd"
-                                                placeholder="请选择创建时间">
-                                              </el-date-picker>
-                                       </el-form-item>
-                    </el-col>
-                    <el-col :span="5">
-                      <el-form-item class="butt" style="border: 0;">
-                        <el-button style="background-color: #03BF8A; border-color: #03BF8A;" type="primary" size="mini"  @click="handleQuery">查询 </el-button>
-                        <el-button size="mini"  @click="resetQuery">重置</el-button>
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-
-                </el-form>
-              </div>
-            </div>
-
-
-      <div class="casr"  >
-              <el-row :gutter="10" class="mb8">
-                <!-- <el-col :span="1.5">
-                  <div style="font-weight: bold;font-size: 14px;color: #343434; display: flex;align-items: center;">
-                    当夜全选
-                  </div>
-                </el-col> -->
-                <el-col :span="1.5">
-                  <el-button
-                    type="success"
-                    plain
-                    size="mini"
-                    @click="handleAdd"
-                    v-hasPermi="['manage:staffManage:add']"
-                  >添加</el-button>
-                </el-col>
-                <!-- <el-col :span="1.5">
-                  <el-button
-                    type="success"
-                    plain
-                    size="mini"
-                    :disabled="single"
-                    @click="handleUpdate"
-                    v-hasPermi="['system:post:edit']"
-                  >修改</el-button>
-                </el-col>
-                <el-col :span="1.5">
-                  <el-button
-                    type="danger"
-                    plain
-                    size="mini"
-                    :disabled="multiple"
-                    @click="handleDelete"
-                    v-hasPermi="['system:post:remove']"
-                  >删除</el-button>
-                </el-col> -->
-                <el-col :span="1.5">
-                  <el-button
-                    type="warning"
-                    plain
-                    size="mini"
-                    @click="handleExport"
-                    v-hasPermi="['manage:staffManage:export']"
-                  >导出</el-button>
-                </el-col>
-                <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-              </el-row>
-              <div class=" infinite-list" :style="dynamicStyle">
-                <el-row :gutter="10" v-if="staffManageList.length !=0" style="width:100%;margin-left: 0;">
-                  <el-col :span="6" v-for="(item,index) in staffManageList" :key="index"  >
-                    <!-- @click="isac(item)" -->
-                    <div v-if="isshoe"  :class=" item.isnum ==true ? 'ingwe' :'' " style="position: relative; background-color: #fff;box-shadow: 0px 0px 10px 0px #CDCDCD;border-radius: 4px;margin-bottom: 10px;">
-                      <div style="display: flex; align-items: center;padding: 15px 20px; position: relative;padding-bottom: 0;">
-                      <div>
-                         <image-preview :src="item.staffImage" :width="50" :height="50"  style="border-radius:50%;margin-top: -10px;"/>
-                         <!-- <img src="../../../assets/images/icon_htgl_rylb_mrtx.png" alt="" style="width: 50px;height: 50px;border-radius: 50%;" > -->
-                      </div>
-                      <div class="haned">
-                        <p style="margin-bottom: 5px;">
-                          <span style="font-weight: bold;font-size: 16px;color: #161616;margin-left: 15px;margin-right: 10px;">{{item.staffName ==null?'暂无数据' : item.staffName}}</span>
-                          <img v-hasPermi="['manage:staffManage:edit']" src="../../../assets/images/icon_htgl_rylb_bj.png" alt=""  style="cursor: pointer;" @click="handleUpdate(item)">
-                          <img v-hasPermi="['manage:staffManage:remove']" src="../../../assets/images/icon_htgl_rylb_del.png" alt=""  style="float: right;cursor: pointer;" @click="handleDelete(item)">
-                        </p>
-                        <div style="display: flex; margin-left: 15px;font-size: 14px;color: #666666;margin-top: 5px;">
-                          <p  style="text-align: left; width: 40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" > 电话号码:</p>
-                          <p style="width: 60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left: 5px;font-size: 14px;color: #666666;">
-                            {{item.staffPhone ==null?'暂无数据' : item.staffPhone}}
-                          </p>
-                        </div>
-                        <div style="display: flex; margin-left: 15px;font-size: 14px;color: #666666;margin-top: 5px;">
-                          <el-tooltip class="item" effect="dark" content="紧急联系人" placement="top-start">
-                          <p style="width: 40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" >紧急联系人:</p>
-                          </el-tooltip>
-                          <p style="width: 60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left: 5px;font-size: 14px;color: #666666;">
-                            {{item.emergencyContact ==null?'暂无数据' : item.emergencyContact}}
-                          </p>
-                        </div>
-                        <div style=" display: flex; margin-left: 15px;font-size: 14px;color: #666666;margin-top: 5px;">
-                          <el-tooltip class="item" effect="dark" content="紧急电话号码" placement="top-start">
-                          <p style="width: 40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">紧急电话号码:</p>
-                          </el-tooltip>
-                          <p style="width: 60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left: 5px;font-size: 14px;color: #666666;">
-                            {{item.emergencyContactPhone ==null?'暂无数据' : item.emergencyContactPhone}}
-                          </p>
-                        </div>
-
-
-
-                      </div>
-
-
-
-
-                      </div>
-                       <!-- <div class="weit">
-                                              <p>开发部</p>
-                                              <p>白名单</p>
-                                            </div> -->
-
-
-                      <img v-if="item.isnum == true" src="../../../assets/images/icon_htgl_kp_gx.png" alt="" style="width: 35px;height: 35px;position: absolute;bottom: 0;right: 0;">
-                    </div>
-                  </el-col>
-                </el-row>
-                <div style="margin-top: 20px;display: flex;justify-content: center;align-items: center;" v-if="staffManageList.length ==0">
-                   <img   src="../../../assets/images/zwshjbig.png" alt="" style="">
-                </div>
-              </div>
-      </div>
+
+                     <el-form-item label="联系方式" prop="emergencyContactPhone">
+                               <el-input v-model="form.emergencyContactPhone" placeholder="请输入紧急联系人手机" />
+                             </el-form-item>
+                    <el-form-item label="人脸照片" prop="emergencyContactPhone" class="shewsfimgrenl">
+                             <image-uploadr :limit="1" v-model="form.staffImage"/>
+                             <div style="font-weight: bold;font-size: 14px;color: #03BF8A;margin-top: 10px;" @click="openClick">点击拍照</div>
+                            </el-form-item>
+                     <!-- onTake -->
+             </el-form>
+             <div slot="footer" class="dialog-footer" style="text-align: right;">
+                           <el-button style="background-color:#03BF8A ; border-color: #03BF8A;" type="primary" @click="submitForm">确 定</el-button>
+                           <el-button style="background-color:#DDEBE7 ; border-color: #DDEBE7; color: #475669;" @click="cancel">取 消</el-button>
+                         </div>
+           </div>
+        </el-col>
+      </el-row>
+
+
+
+
 
 
 
@@ -230,7 +223,7 @@
                   <div style=" margin:10px 0; font-weight: bold;font-size: 14px;color: #333333;text-align: center;">人脸照片</div>
 
                   <image-uploadr :limit="1" v-model="form.staffImage"/>
-                  <div style="font-weight: bold;font-size: 14px;color: #03BF8A;text-align: center;margin-top: 10px;" @click="openClick">点击拍照</div>
+                  <div style="font-weight: bold;font-size: 14px;color: #03BF8A;margin-top: 10px;" @click="openClick">点击拍照</div>
                   <!-- onTake -->
               </el-col>
 
@@ -242,10 +235,7 @@
             </el-row>
 
           </el-form>
-         <div slot="footer" class="dialog-footer">
-                       <el-button style="background-color:#03BF8A ; border-color: #03BF8A;" type="primary" @click="submitForm">确 定</el-button>
-                       <el-button style="background-color:#DDEBE7 ; border-color: #DDEBE7; color: #475669;" @click="cancel">取 消</el-button>
-                     </div>
+
         </el-dialog>
         <photo ref="photo" v-model="form.staffImage" :title="'图片拍照上传'" />
                    <!--开启摄像头的弹窗-->
@@ -312,7 +302,7 @@ export default {
                 // 查询参数
                 queryParams: {
                   pageNum: 1,
-                  pageSize: 10,
+                  pageSize: 9,
                   staffName: null,
                   staffPhone: null,
                   emergencyContact: null,
@@ -765,6 +755,20 @@ export default {
 };
 </script>
 <style  lang="scss">
+  .shewsfimgrenl{
+    .el-upload--picture-card{
+      width: 120px;
+      height: 120px;
+      line-height:88px;
+    }
+    .el-upload-list--picture-card .el-upload-list__item{
+      width: 120px;
+      height: 120px;
+    }
+    .ingwe{
+      margin-top:-30px !important;
+    }
+  }
   .ite{
     .el-form-item{
       margin-bottom: 30px;

+ 15 - 9
ruoyi-ui/src/views/shipinggaoj/shebecanshu/index.vue

@@ -1,8 +1,5 @@
 <template>
-  <div class="app-container" style="padding-top: 20px;height: 120vh;"  v-loading="loading"
-    element-loading-text="拼命加载中"
-    element-loading-spinner="el-icon-loading"
-    element-loading-background="rgba(0, 0, 0, 0.8)">
+  <div class="app-container" style="padding-top: 20px;height: 120vh;" >
     <div class="ntgs">
     <el-row :gutter="10" class="mb8">
      <div class="iuer" style="margin-bottom:10px;">
@@ -70,8 +67,8 @@
 					<el-col :span='5'>
 						<div style="background-color: #fff;border-radius: 10px;padding: 20px 20px;height: 100vh;">
               <p style="margin: 0;border-left: 6px solid #03BF8A;margin-left: -20px;padding-left: 10px;font-weight: 800;">通道列表</p>
-              <div style=" height: 36px;;line-height: 36px;margin-top: 10px;"v-for="(item,index) in channelNumberList">
-                              <div @click="ishg(item)" style="display: flex;align-items: center;justify-content: space-between;">
+              <div :class="ishge == index ? 'anche' : ''" style=" height: 36px;;line-height: 36px;margin-top: 10px;padding: 0 10px ;"v-for="(item,index) in channelNumberList" :key="index">
+                              <div  @click="ishg(item,index)" style="display: flex;align-items: center;justify-content: space-between;">
                                 <div style="font-size: 16px;
               color: #333333;"> {{item.channelNum == null?'暂无数据' : item.channelNum}}</div>
                                 <img src="../../../assets/images/icon_htgl_zd.png" alt="" style="width: 10px;height: 12px;">
@@ -87,7 +84,8 @@
         <el-col :span='19' style="padding-left: 30px; background-color: #fff;border-radius: 10px;padding: 20px; height: 100vh;" >
           <div style="display: flex;align-items: center;justify-content: space-between;margin-bottom: 18px;">
             <p style="margin: 0;border-left: 6px solid #03BF8A;margin-left: -20px;padding-left: 10px;font-weight: 800;">实时预览
-
+              <span style="font-size: 12px; color: red;cursor: pointer;" @click="xiazag">下载插件</span>
+              </p>
             </p>
             <div>
 
@@ -101,7 +99,6 @@
 
          <div style="width: 100%; height: 480px;">
            <div v-if="isfse" id="divPlugin" style="width: 100%; height: 440px;" ></div>
-
          </div>
 
 
@@ -307,6 +304,7 @@ export default {
     	url: 'ws://13.229.167.76:1884/mqtt',
     	topic: 'detection/rect'
     },
+    ishge:0
 
     };
   },
@@ -598,7 +596,8 @@ export default {
 
 
     // 通道点击
-    ishg(val){
+    ishg(val,row){
+      this.ishge = row
       this.isfse = false
       if(WebVideoCtrl){
         console.log(this.szDeviceIdentify)
@@ -1165,6 +1164,9 @@ export default {
     		startRealPlay();
     	}
     },
+    xiazag(){
+
+    }
   }
 };
 </script>
@@ -1409,4 +1411,8 @@ export default {
   font-size: 14px;
   color: #444444;
 }
+.anche{
+  background: #E7F1EE !important;
+  border-radius: 4px  !important;
+}
 </style>

+ 653 - 248
ruoyi-ui/src/views/shipinggaoj/shebei/index.vue

@@ -1,275 +1,334 @@
 <template>
   <div class="app-container">
-    <div style="background-color: #fff;padding: 20px;border-radius: 10px; padding-bottom: 0;">
-                  <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;margin-left: -20px;">
-                    <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
-                   <span style="margin-left: 10px;">搜索条件</span>
-                  </p>
-                  <div style="padding-bottom: 0;margin-bottom: 20px;">
-                    <el-form class="qucheu" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="88px">
-                      <el-row>
+    <el-row :gutter="10" >
+      <!--部门数据-->
 
-                        <el-col :span="24">
-                          <el-col :span="8">
-                            <el-form-item label="设备编号" prop="equipmentNum">
-                                    <el-input
-                                      v-model="queryParams.equipmentNum"
-                                      placeholder="请输入设备编号"
-                                      clearable
-                                      @keyup.enter.native="handleQuery"
-                                    />
-                                  </el-form-item>
-                          </el-col>
-                          <el-col :span="8">
-                           <el-form-item label="设备名称" prop="equipmentName">
-                                   <el-input
-                                   style="width: 100%;"
-                                     v-model="queryParams.equipmentName"
-                                     placeholder="请输入设备名称"
-                                     clearable
-                                     @keyup.enter.native="handleQuery"
-                                   />
-                                 </el-form-item>
-                          </el-col>
-                          <el-col :span="8">
-                             <el-form-item label="安装时间" prop="equipmentTime">
-                                     <el-date-picker style="width: 100%;" clearable
-                                       v-model="queryParams.equipmentTime"
-                                       type="date"
-                                       value-format="yyyy-MM-dd"
-                                       placeholder="请选择安装时间">
-                                     </el-date-picker>
-                                   </el-form-item>
-                          </el-col>
-
-                        </el-col>
-                        <el-col :span="8">
-                          <el-form-item label="运行状态" prop="runState">
-                                 <el-select v-model="queryParams.manualType" placeholder="请选择运行状态" clearable>
-                                    <el-option
-                                    v-for="dict in dict.type.sys_job_status"
-                                                                        :key="dict.value"
-                                                                        :label="dict.label"
-                                                                        :value="dict.value"
-                                                                      />
-                                                                    </el-select>
-                                </el-form-item>
+      <el-col :span="4" >
+        <div style="background-color: #fff;padding: 10px;border-radius: 10px;">
+          <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;">
+            <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+           <span style="margin-left: 10px;">选择部门</span>
+          </p>
+          <div class=" infinite-list" style="overflow:auto;height:  93vh" >
+            <div class="head-container">
+              <el-input
+                v-model="deptName"
+                placeholder="请输入部门名称"
+                clearable
+                size="small"
+                prefix-icon="el-icon-search"
+                style="margin-bottom: 20px"
+              />
+            </div>
+            <div class="head-container">
+              <el-tree
+                :data="deptOptions"
+                :props="defaultProps"
+                :expand-on-click-node="false"
+                :filter-node-method="filterNode"
+                ref="tree"
+                default-expand-all
+                highlight-current
+                @node-click="handleNodeClick"
+              />
+            </div>
+          </div>
+        </div>
+      </el-col>
+      <el-col :span=" ishsouetan == false? 20 :  14" >
+        <div style="background-color: #fff;padding: 20px;border-radius: 10px; padding-bottom: 0; padding-top: 10px;">
+                      <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;margin-left: -20px;">
+                        <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+                       <span style="margin-left: 10px;">搜索条件</span>
+                      </p>
+                      <div style="padding-bottom: 0;margin-bottom: 20px;">
+                        <el-form class="qucheu" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
+                          <el-row>
+                              <el-col :span="11">
+                               <el-form-item label="设备名称" prop="equipmentName" style="display: flex;">
+                                       <el-input
+                                       style="width: 100%;"
+                                         v-model="queryParams.equipmentName"
+                                         placeholder="请输入设备名称"
+                                         clearable
+                                         @keyup.enter.native="handleQuery"
+                                       />
+                                     </el-form-item>
+                              </el-col>
 
-                        </el-col>
+                            <el-col :span="9">
+                              <el-form-item label="运行状态" prop="runState" style="display: flex;">
+                                     <el-select style="width: 150px;"  v-model="queryParams.manualType" placeholder="请选择运行状态" clearable>
+                                        <el-option
+                                        v-for="dict in dict.type.sys_job_status"
+                                                                            :key="dict.value"
+                                                                            :label="dict.label"
+                                                                            :value="dict.value"
+                                                                          />
+                                                                        </el-select>
+                                    </el-form-item>
 
-                        <el-col :span="8">
-                          <el-form-item label="设备地址" prop="equipmentAddress">
-                                  <el-input
-                                    v-model="queryParams.equipmentAddress"
-                                    placeholder="请输入设备地址"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                                  />
+                            </el-col>
+                            <el-col :span="4" class="bhhsbu">
+                              <div>
+                                <el-form-item class="butt"  style="border: 0;display: flex; margin: 0;margin-top: 5px;">
+                                  <el-button style="background-color: #03BF8A; border-color: #03BF8A;" type="primary" size="mini"  @click="handleQuery">查询 </el-button>
+                                  <el-button size="mini"  @click="resetQuery">重置</el-button>
                                 </el-form-item>
-                        </el-col>
+                              </div>
+                            </el-col>
+                          </el-row>
 
-                        <el-col :span="5">
-                          <el-form-item class="butt" style="border: 0;">
-                            <el-button style="background-color: #03BF8A; border-color: #03BF8A;" type="primary" size="mini"  @click="handleQuery">查询 </el-button>
-                            <el-button size="mini"  @click="resetQuery">重置</el-button>
-                          </el-form-item>
-                        </el-col>
-                      </el-row>
+                        </el-form>
+                      </div>
+                    </div>
 
-                    </el-form>
-                  </div>
-                </div>
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="24">
+            <div style="display: flex; justify-content: space-between;">
+              <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;">
+                <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+               <span style="margin-left: 10px;">设备列表</span>
+              </p>
+              <div>
+                <el-button
+                  type="success"
+                  plain
+                  size="mini"
+                  @click="handleAdd"
+                  v-hasPermi="['manage:equipmentManage:add']"
+                >新增</el-button>
+                <el-button
+                  type="danger"
+                  plain
+                  size="mini"
+                  :disabled="singleg"
+                  @click="handleDeletej"
+                  v-hasPermi="['manage:equipmentManage:remove']"
+                >删除</el-button>
+              </div>
+            </div>
+          </el-col>
+          <el-col :span="1.5">
 
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['manage:equipmentManage:add']"
-        >新增</el-button>
-      </el-col>
-      <!-- <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['manage:equipmentManage:edit']"
-        >修改</el-button>
-      </el-col> -->
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['manage:equipmentManage:remove']"
-        >删除</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
+          </el-col>
+          <!-- <el-col :span="1.5">
+            <el-button
+              type="success"
+              plain
+              icon="el-icon-edit"
+              size="mini"
+              :disabled="single"
+              @click="handleUpdate"
+              v-hasPermi="['manage:equipmentManage:edit']"
+            >修改</el-button>
+          </el-col> -->
+          <el-col :span="1.5">
 
-    <el-table :height="tableMaxHeight" v-loading="loading" :data="equipmentManageList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="设备编号" align="center" prop="equipmentNum" show-overflow-tooltip/>
-            <el-table-column label="设备名称" align="center" prop="equipmentName" show-overflow-tooltip/>
-            <el-table-column label="设备类型" align="center" prop="equipmentType" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <dict-tag :options="dict.type.shebie_type" :value="scope.row.equipmentType"/>
-              </template>
-            </el-table-column>
-            <el-table-column label="设备地址" align="center" prop="equipmentAddress" show-overflow-tooltip />
-            <el-table-column label="设备区域" align="center" prop="equipmentRegion" show-overflow-tooltip />
-            <el-table-column label="安装时间" align="center" prop="equipmentTime" width="180">
-              <template slot-scope="scope">
-                <span>{{ scope.row.equipmentTime }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column label="设备状态" align="center" key="runState" >
-              <template slot-scope="scope">
-                <el-switch v-model="scope.row.runState" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)"></el-switch>
-              </template>
-            </el-table-column>
-            <el-table-column label="设备图片" align="center" prop="equipmentImage" width="100">
-              <template slot-scope="scope">
-                <image-preview :src="scope.row.equipmentImage" :width="50" :height="50"/>
-              </template>
-            </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            style="width: 42px;height: 26px;"
-           type="success"
-           plain
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['manage:equipmentManage:edit']"
-          >修改</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            style="width: 42px;height: 26px;background: #FFF1EA;
-                   border-radius: 4px;border: 1px solid #FE570E;color: #FE570E;"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['manage:equipmentManage:remove']"
-          >删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
+          </el-col>
+        </el-row>
+        <div class=" infinite-list" :style="dynamicStyle"  v-if="inhgeshwe">
+          <div  v-masonry   :class=" ishsouetan == false? 'imghse hyeg' : 'hyeg'"   style="display: flex;flex-wrap: wrap;justify-content: space-between; " >
+            <div v-if="inhgeshwe" v-masonry-tile  :class=" ishsouetan == false? 'box_3dr zuihsoue flex-col' : 'box_3dr  flex-col'" :style=" item.equipmentImage ==null? ' height:240px; margin-bottom: 10px;' : 'margin-bottom: 10px;' "  v-for="(item,index ) in equipmentManageList" :key="index" >
+                          <div class="box_4 flex-row" style="justify-content: space-between;margin: 0;">
+                            <div  @click="handleSelectionChange(item)" style="display: flex;align-items: center; cursor: pointer;">
+                              <img
+                                class="thumbnail_21"
+                                referrerpolicy="no-referrer"
+                                src="../../../assets/images/icon_lby_gx_normal.png"
+                                v-show="!item.isnum && isgsow"
+                              />
+                              <img
+                                class="thumbnail_21"
+                                referrerpolicy="no-referrer"
+                                src="../../../assets/images/icon_lby_gx_selcted.png"
+                                v-show="item.isnum && isgsow"
+                              />
+                              <span class="text_19">{{item.equipmentName}}</span>
+                            </div>
+                            <div>
+                              <img
+                                class="image_1"
+                                referrerpolicy="no-referrer"
+                                @click="handleUpdate(item)"
+                                v-hasPermi="['manage:equipmentManage:edit']"
+                                src="../../../assets/images/icon_lby_gdtc_bj.png"
+                              />
+                              <img
+                                class="thumbnail_22"
+                                @click="handleDelete(item)"
+                                v-hasPermi="['manage:equipmentManage:remove']"
+                                referrerpolicy="no-referrer"
+                                 src="../../../assets/images/icon_lby_gdtc_del.png"/>
+                            </div>
+                          </div>
+                          <div class="box_5 flex-col" v-if="item.equipmentImage != null">
+                            <image-preview  :src="item.equipmentImage" :width="100 +'%'" :height="100 + '%'"  style=""/>
+                          </div>
+                          <div style="padding: 10px;">
+                            <span class="text_20">设备编号:{{item.equipmentNum}}</span>
+                            <div class="box_6 flex-row " style="align-items: center;">
+                              <span class="text_21">设备类型: </span>
+                              <div style="margin-left: 12px;">
+                                <dict-tag :options="dict.type.shebie_type" :value="item.equipmentType"/>
+                              </div>
+                            </div>
+                            <div class="box_6 flex-row " style=" margin-bottom: 10px; align-items: center;">
+                              <span class="text_21">设备地址: </span>
+                              <el-tooltip class="item" effect="dark" :content="item.equipmentAddress" placement="top-start">
+                              <div style=" margin-left: 12px; font-weight: 500;font-size: 13px;color: #222327; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+                                   {{item.equipmentAddress}}
+                              </div>
+                              </el-tooltip>
+                            </div>
+                            <!-- <span class="text_20">设备地址:192.168.1.1</span> -->
+                            <span class="text_20" >设备区域:{{item.equipmentRegion}}</span>
+                            <div style="margin-top: 10px;margin-bottom: 10px;">
+                              <span class="text_20">安装时间:{{item.equipmentTime}}</span>
+                            </div>
+                            <div class="box_6 flex-row " style="align-items: center;">
+                              <span class="text_21">设备状态: </span>
+                              <div style="margin-left: 12px;">
+                                <dict-tag :options="dict.type.sys_job_status" :value="item.runState"/>
+                              </div>
+                            </div>
+                          </div>
 
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
+                        </div>
 
-    <!-- 添加或修改公告对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="780px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="设备编号" prop="equipmentNum">
-                      <el-input v-model="form.equipmentNum" placeholder="请输入设备编号" />
-                    </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="设备名称" prop="equipmentName">
-                      <el-input v-model="form.equipmentName" placeholder="请输入设备名称" />
-                    </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="设备区域" prop="equipmentRegion">
-                      <el-input v-model="form.equipmentRegion" placeholder="请输入设备区域" />
-                    </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="设备地址" prop="equipmentAddress">
-                      <el-input v-model="form.equipmentAddress" placeholder="请输入设备地址" />
-                    </el-form-item>
-          </el-col>
+          </div>
 
-          <el-col :span="12">
-             <el-form-item label="安装时间" prop="equipmentTime">
-                      <el-date-picker style="width: 100%;" clearable
-                        v-model="form.equipmentTime"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        placeholder="请选择安装时间">
-                      </el-date-picker>
-                    </el-form-item>
-          </el-col>
-          <el-col :span="12">
-             <el-form-item label="运行状态" prop="runState">
-               <el-select style="width: 100%;" v-model="form.runState" placeholder="请选择运行状态" >
-                    <el-option
-                      v-for="dict in dict.type.sys_job_status"
-                      :key="dict.value"
-                      :label="dict.label"
-                      :value="dict.value"
-                       />
-                    </el-select>
-             </el-form-item>
-          </el-col>
-          <el-col :span="12">
-             <el-form-item label="设备类型" prop="equipmentType">
-                       <el-select style="width: 100%;"  v-model="form.equipmentType" placeholder="请选择设备类型">
-                         <el-option
-                           v-for="dict in dict.type.shebie_type"
-                           :key="dict.value"
-                           :label="dict.label"
-                           :value="dict.value"
-                         ></el-option>
+          <div v-if='equipmentManageList == 0'>
+            <el-empty :image-size="200"></el-empty>
+          </div>
+        </div>
+        <paginations
+          v-show="total>0"
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList"
+        />
+      </el-col>
+      <el-col :span="6" v-if="ishsouetan">
+       <div style="background-color: #fff; border-radius: 4px;padding: 10px;" class="shenbfe">
+         <p style="margin: 0; font-weight: 800;font-size: 16px;color: #343434;display: flex;align-items: center;margin-bottom: 20px;border-left: 6px solid #03BF8A;">
+           <!-- <img src="../../../assets/images/icon_htgl_btzs.png" alt="" style="width: 16px;height: 20px;"> -->
+          <span style="margin-left: 10px;">设备信息</span>
+         </p>
+          <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+         <el-row>
+             <el-col :span="24">
+               <el-form-item label="设备编号" prop="equipmentNum">
+                         <el-input v-model="form.equipmentNum" placeholder="请输入设备编号" />
+                       </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="设备名称" prop="equipmentName">
+                         <el-input v-model="form.equipmentName" placeholder="请输入设备名称" />
+                       </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="设备区域" prop="equipmentRegion">
+                         <el-input v-model="form.equipmentRegion" placeholder="请输入设备区域" />
+                       </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="设备地址" prop="equipmentAddress">
+                         <el-input v-model="form.equipmentAddress" placeholder="请输入设备地址" />
+                       </el-form-item>
+             </el-col>
+
+             <el-col :span="24">
+                <el-form-item label="安装时间" prop="equipmentTime">
+                         <el-date-picker style="width: 100%;" clearable
+                           v-model="form.equipmentTime"
+                           type="date"
+                           value-format="yyyy-MM-dd"
+                           placeholder="请选择安装时间">
+                         </el-date-picker>
+                       </el-form-item>
+             </el-col>
+             <el-col :span="24">
+                <el-form-item label="运行状态" prop="runState">
+                  <el-select style="width: 100%;" v-model="form.runState" placeholder="请选择运行状态" >
+                       <el-option
+                         v-for="dict in dict.type.sys_job_status"
+                         :key="dict.value"
+                         :label="dict.label"
+                         :value="dict.value"
+                          />
                        </el-select>
-                     </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="设备ip" prop="equipmentIp">
-                      <el-input v-model="form.equipmentIp"  placeholder="请输入内容" />
-                    </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="备注" prop="remark">
-                      <el-input v-model="form.remark"  placeholder="请输入内容" />
-                    </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="设备图片" prop="equipmentImage">
-                      <image-upload v-model="form.equipmentImage"/>
-                    </el-form-item>
-          </el-col>
+                </el-form-item>
+             </el-col>
+             <el-col :span="24">
+                <el-form-item label="设备类型" prop="equipmentType">
+                          <el-select style="width: 100%;"  v-model="form.equipmentType" placeholder="请选择设备类型">
+                            <el-option
+                              v-for="dict in dict.type.shebie_type"
+                              :key="dict.value"
+                              :label="dict.label"
+                              :value="dict.value"
+                            ></el-option>
+                          </el-select>
+                        </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="设备ip" prop="equipmentIp">
+                         <el-input v-model="form.equipmentIp"  placeholder="请输入内容" />
+                       </el-form-item>
+             </el-col>
+             <el-col :span="24">
+               <el-form-item label="备注" prop="remark">
+                         <el-input v-model="form.remark"  placeholder="请输入内容" />
+                       </el-form-item>
+             </el-col>
+             <el-col :span="24" class="shewsfimg">
+               <el-form-item label="设备图片" prop="equipmentImage">
+                         <image-upload v-model="form.equipmentImage"/>
+                       </el-form-item>
+             </el-col>
 
-        </el-row>
-      </el-form>
-       <div slot="footer" class="dialog-footer">
-              <el-button style="background-color:#03BF8A ; border-color: #03BF8A;" type="primary" @click="submitForm">确 定</el-button>
-              <el-button style="background-color:#DDEBE7 ; border-color: #DDEBE7; color: #475669;" @click="cancel">取 消</el-button>
-            </div>
-    </el-dialog>
+           </el-row>
+         </el-form>
+          <div slot="footer" class="dialog-footer" style="display: flex;justify-content: flex-end;">
+                 <el-button style="background-color:#03BF8A ; border-color: #03BF8A;" type="primary" @click="submitForm">确 定</el-button>
+                 <el-button style="background-color:#DDEBE7 ; border-color: #DDEBE7; color: #475669;" @click="cancel">取 消</el-button>
+               </div>
+       </div>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
 <script>
 import { listEquipmentManage, getEquipmentManage, delEquipmentManage, addEquipmentManage, updateEquipmentManage } from "@/api/manage/equipmentManage"
-
+import { treeselect,listDept  } from "@/api/system/dept";
+// import VueMasonry from 'vue-masonry';
+import Masonry from "masonry-layout";
+import Waterfall from 'vue-waterfall-plugin'
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 export default {
   name: "EquipmentManage",
   dicts: ['sys_job_status', 'sys_notice_type','shebie_type'],
+  components: { Treeselect ,Waterfall},
   data() {
     return {
       // 遮罩层
       // 遮罩层
             loading: true,
+            defaultProps: {
+              children: "children",
+              label: "deptName",
+              value:'deptId'
+            },
+            singleg:true,
             // 选中数组
             ids: [],
             // 非单个禁用
             single: true,
+            deptName:null,
             // 非多个禁用
             multiple: true,
             // 显示搜索条件
@@ -285,7 +344,7 @@ export default {
             // 查询参数
             queryParams: {
               pageNum: 1,
-              pageSize: 10,
+              pageSize: 8,
               equipmentNum: null,
               equipmentName: null,
               equipmentType: null,
@@ -299,38 +358,101 @@ export default {
             form: {},
             // 表单校验
             rules: {
+              equipmentNum: [
+                        { required: true, message: "不能为空", trigger: "blur" }
+                      ],
+              equipmentName: [
+                        { required: true, message: "不能为空", trigger: "blur" }
+                      ],
+              equipmentType: [
+                        { required: true, message: "不能为空", trigger: "blur" }
+                      ],
+              equipmentIp: [
+                        { required: true, message: "不能为空", trigger: "blur" }
+                      ],
+              equipmentAddress: [
+                        { required: true, message: "不能为空", trigger: "blur" }
+                      ],
+
             },
-      tableMaxHeight:'200',
+      tableMaxHeight:'480',
+      ghwe:{},
+      // 部门树选项
+      deptOptions: undefined,
+      ishsouetan:false,
+      isgsow:true,
+      manid:0,
+      inhgeshwe:true
     }
   },
   created() {
     this.getList()
+    this.getTreeselect()
    window.onresize = () => {
         	      this.changeTableMaxHeight()
         	    }
         	    this.changeTableMaxHeight()
       },
+      computed: {
+        dynamicStyle() {
+          return {
+            overflow:'auto',
+            height:  this.tableMaxHeight + 'px',
+          }
+        }
+        },
       mounted() {
+
       	window.onresize = () => {
       	          this.changeTableMaxHeight()
       	        }
       	        this.changeTableMaxHeight()
       },
   methods: {
+    // 筛选节点
+    filterNode(value, data) {
+      if (!value) return true;
+      return data.label.indexOf(value) !== -1;
+    },
+    /** 查询部门下拉树结构 */
+    getTreeselect() {
+      listDept(this.queryParams).then(response => {
+        this.deptOptions = this.handleTree(response.data, "deptId")
+        this.loading = false
+      })
+    },
+    // 节点单击事件
+    handleNodeClick(data) {
+      this.queryParams.deptId = data.deptId;
+      this.ghwe.deptName = data.deptName
+      this.ghwe.deptId = data.deptId
+      this.handleQuery();
+    },
     /** 查询设备管理列表 */
         getList() {
           this.loading = true
           listEquipmentManage(this.queryParams).then(response => {
             this.equipmentManageList = response.rows
+            this.equipmentManageList.filter(rou=>{
+              rou.isnum = false
+            })
             this.total = response.total
             this.loading = false
+            this.inhgeshwe = true
           })
         },
         // 取消按钮
         cancel() {
           this.open = false
+           this.ishsouetan = false
+            this.inhgeshwe = false
+           this.queryParams.pageSize = 9
+           // this.created()
+           this.getList()
+           // this.inhgeshwe = true''
           this.reset()
         },
+
         // 获取当前时间
         gettime(){
           let nowDate = new Date()
@@ -383,24 +505,50 @@ export default {
         },
         // 多选框选中数据
         handleSelectionChange(selection) {
-          this.ids = selection.map(item => item.equipmentId)
-          this.single = selection.length!==1
-          this.multiple = !selection.length
+          // console.log(selection)
+          this.isgsow = false
+          selection.isnum = !selection.isnum
+          this.isgsow = true
+          let nhseg= []
+          this.equipmentManageList.filter(rou=>{
+            if(rou.isnum == true){
+              nhseg.push(rou)
+            }
+          })
+          console.log(nhseg)
+          this.ids = nhseg.map(item => item.equipmentId)
+          console.log(this.ids,nhseg)
+          this.single = nhseg.length!==1
+          this.multiple = !nhseg.length
         },
         /** 新增按钮操作 */
         handleAdd() {
           this.reset()
-          this.open = true
+          console.log(this.ghwe)
+          if(this.ghwe.deptId == undefined){
+            this.$message.error('请先选择部门');
+            // this.$modal.msgSuccess("请先选择部门")
+            return
+          }
+          this.inhgeshwe = false
+          this.queryParams.pageSize = 10
+          this.getList()
+          this.ishsouetan = true
           this.title = "添加设备管理"
+          this.inhgeshwe = true
         },
         /** 修改按钮操作 */
         handleUpdate(row) {
           this.reset()
           const equipmentId = row.equipmentId || this.ids
+          this.queryParams.pageSize = 10
+          this.getList()
+           this.inhgeshwe = false
           getEquipmentManage(equipmentId).then(response => {
             this.form = response.data
-            this.open = true
             this.title = "修改设备管理"
+            this.ishsouetan = true
+             this.inhgeshwe = true
           })
         },
         /** 提交按钮 */
@@ -411,13 +559,19 @@ export default {
                 updateEquipmentManage(this.form).then(response => {
                   this.$modal.msgSuccess("修改成功")
                   this.open = false
+                  this.queryParams.pageSize = 9
                   this.getList()
+                  this.ishsouetan = false
                 })
               } else {
+               this.form.deptName =  this.ghwe.deptName
+                this.form.deptId =  this.ghwe.deptId
                 addEquipmentManage(this.form).then(response => {
                   this.$modal.msgSuccess("新增成功")
                   this.open = false
+                  this.queryParams.pageSize = 9
                   this.getList()
+                  this.ishsouetan = false
                 })
               }
             }
@@ -432,6 +586,12 @@ export default {
 
       })
     },
+    handleDeletej(){
+      delEquipmentManage(this.manid).then(response => {
+        this.$modal.msgSuccess("操作成功")
+        this.getList()
+      })
+    },
     /** 删除按钮操作 */
         handleDelete(row) {
           const equipmentIds = row.equipmentId || this.ids
@@ -465,7 +625,30 @@ export default {
   }
 }
 </script>
-<style>
+<style lang="scss" >
+  .bhhsbu{
+    .el-form-item__content{
+      display: flex;
+    }
+  }
+  .shewsfimg{
+    .el-upload--picture-card{
+      width: 90px;
+      height: 90px;
+      line-height:88px;
+    }
+    .el-upload-list--picture-card .el-upload-list__item{
+      width: 90px;
+      height: 90px;
+    }
+  }
+  .shenbfe{
+    .el-form-item{
+      margin-bottom: 12px;
+    }
+  }
+</style>
+<style scoped>
   .el-table .el-table__header-wrapper th, .el-table .el-table__fixed-header-wrapper th{
     background-color:#F5F6F8;
   }
@@ -478,5 +661,227 @@ export default {
     border-color: #03BF8A;
   }
 
+.flex-col {
+  display: flex;
+  flex-direction: column;
+}
+.flex-row {
+  display: flex;
+  flex-direction: row;
+}
+.justify-between {
+  display: flex;
+  justify-content: space-between;
+}
 
+.box_3dr {
+  background-color: rgba(255, 255, 255, 1);
+  border-radius: 10px;
+  position: relative;
+  width: 49%;
+  height: 100%;
+  /* padding-bottom: 15px; */
+  /* margin-left: 5px ;
+  margin-right: 5px; */
+}
+.box_4 {
+  width: 100%;
+  /* height: 18px; */
+  padding: 11px 10px 11px 10px;
+  border-bottom: 1px solid #E6E6E6;
+}
+.thumbnail_21 {
+  width: 18px;
+  height: 18px;
+}
+.text_19 {
+  /* width: 97px; */
+  height: 13px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Bold;
+  font-weight: 700;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 13px;
+  margin: 0 0 0 11px;
+}
+.image_1 {
+  width:14px;
+  height: 14px;
+  /* margin-left: 51px; */
+}
+.thumbnail_22 {
+  width: 14px;
+  height: 14px;
+  margin: 3px 0 0 10px;
+}
+.image_2 {
+  width: 248px;
+  height: 1px;
+  margin-top: 9px;
+}
+.box_5 {
+  background-color: rgba(255, 255, 255, 1);
+ /* width: 220px; */
+  height: 118px;
+  padding: 10px;
+  /* margin: 12px 0 0 14px; */
+}
+.text_20 {
+  /* width: 139px; */
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 8px;
+  margin: 0 0 14px 0;
+}
+.box_6 {
+  /* width: 126px; */
+  height: 24px;
+  margin: 8px 0 0 0;
+}
+.text_21 {
+  width: 60px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 8px;
+  margin-top: 5px;
+}
+.text-wrapper_7 {
+  background-color: rgba(255, 244, 235, 1);
+  border-radius: 4px;
+  height: 24px;
+  border: 1px solid rgba(253, 127, 16, 1);
+  width: 58px;
+}
+.text_22 {
+  width: 42px;
+  height: 13px;
+  overflow-wrap: break-word;
+  color: rgba(253, 127, 16, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 46px;
+  margin: 6px 0 0 8px;
+}
+.text_23 {
+  width: 145px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 46px;
+  margin: 8px 0 0 14px;
+}
+.text_24 {
+  width: 152px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 46px;
+  margin: 13px 0 0 14px;
+}
+.text_25 {
+  width: 154px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(34, 35, 39, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 46px;
+  margin: 13px 0 15px 15px;
+}
+.box_7 {
+  box-shadow: 0px 0px 10px 0px rgba(209, 209, 209, 1);
+  background-color: rgba(255, 255, 255, 1);
+  border-radius: 8px;
+  position: absolute;
+  left: 159px;
+  top: 35px;
+  width: 88px;
+  height: 70px;
+}
+.image-text_2 {
+  width: 58px;
+  height: 15px;
+  margin: 13px 0 0 16px;
+}
+.thumbnail_23 {
+  width: 15px;
+  height: 15px;
+}
+.text-group_2 {
+  width: 27px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(61, 69, 91, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 80px;
+  margin-top: 1px;
+}
+.image-text_3 {
+  width: 59px;
+  height: 17px;
+  margin: 11px 0 14px 15px;
+}
+.thumbnail_24 {
+  width: 16px;
+  height: 17px;
+}
+.text-group_3 {
+  width: 27px;
+  height: 14px;
+  overflow-wrap: break-word;
+  color: rgba(61, 69, 91, 1);
+  font-size: 14px;
+  font-family: PingFang-SC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 80px;
+  margin-top: 2px;
+}
+.zuihsoue{
+  width: 32.2%;
+  margin: 0 5px;
+  justify-content: flex-start !important;
+}
+.imghse{
+  justify-content: flex-start !important;
+}
+.hyeg{
+  height: 100% !important;
+}
 </style>

+ 1 - 0
ruoyi-ui/src/views/system/dict/index.vue

@@ -285,6 +285,7 @@ export default {
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
+      console.log(selection)
       this.ids = selection.map(item => item.dictId)
       this.single = selection.length!=1
       this.multiple = !selection.length

部分文件因文件數量過多而無法顯示