add:提升机系统

package.json

@@ -45,6 +45,7 @@
     "element-ui": "2.15.14",
     "file-saver": "2.0.5",
     "fuse.js": "6.4.3",
+    "highcharts": "^9.2.2",
     "highlight.js": "9.18.5",
     "js-beautify": "1.13.0",
     "js-cookie": "3.0.1",

src/api/tyler/screen.js

@@ -36,10 +36,10 @@ export function stationStatus(query) {
   });
 }
 
-//近30天报警分析
+//30天井下人数变化趋势
 export function recentThDaysAlarms(query) {
   return request({
-    url: "/business/screen/per/recentThDaysAlarms",
+    url: "/business/screen/per/30DaysTrend",
     method: "get",
     params: query,
   });
@@ -79,4 +79,21 @@ export function eleAll(query) {
     method: "get",
     params: query,
   });
+}
+
+//rydw中段基站分析
+export function rydwMidStation(query) {
+  return request({
+    url: "/business/screen/per/baseStationAnalysis",
+    method: "get",
+    params: query,
+  });
+}
+//当月人员下井次数排行
+export function monthlyRankings(query) {
+  return request({
+    url: "/business/screen/per/monthlyRanking",
+    method: "get",
+    params: query,
+  });
 }
\ No newline at end of file

src/views/Screen/index.vue

@@ -8,17 +8,25 @@
       v-if="showMenu === 3"
       style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
     ></psxt>
-    
+
     <v-scale-screen
       ref="scale-screen"
       width="1920"
       height="1080"
       :fullScreen="true"
     >
-    <dlxt
-      v-if="showMenu === 6"
-      style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
-    ></dlxt>
+      <dlxt
+        v-if="showMenu === 6"
+        style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
+      ></dlxt>
+      <tfxt
+        v-if="showMenu === 5"
+        style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
+      ></tfxt>
+      <tsj
+        v-if="showMenu === 4"
+        style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
+      ></tsj>
       <div class="container">
         <!-- 头部 -->
         <div class="header por"></div>
@@ -37,7 +45,7 @@
               key=""
               :class="showMenu == 2 ? 'active' : ''"
             >
-              <p>环境监测</p>
+              <p>监测监控</p>
             </div>
             <div
               class="sub-item"
@@ -57,9 +65,27 @@
             </div>
           </div>
           <div class="sub-header-right">
-            <div class="sub-item" :class="showMenu == 4 ? 'active' : ''" @click="changeMenu(4)"><p>提升机系统</p></div>
-            <div class="sub-item" :class="showMenu == 5 ? 'active' : ''" @click="changeMenu(5)"><p>风机系统</p></div>
-            <div class="sub-item" :class="showMenu == 6 ? 'active' : ''" @click="changeMenu(6)"><p>电力系统</p></div>
+            <div
+              class="sub-item"
+              :class="showMenu == 4 ? 'active' : ''"
+              @click="changeMenu(4)"
+            >
+              <p>提升机系统</p>
+            </div>
+            <div
+              class="sub-item"
+              :class="showMenu == 5 ? 'active' : ''"
+              @click="changeMenu(5)"
+            >
+              <p>通风系统</p>
+            </div>
+            <div
+              class="sub-item"
+              :class="showMenu == 6 ? 'active' : ''"
+              @click="changeMenu(6)"
+            >
+              <p>电力系统</p>
+            </div>
           </div>
         </div>
 
@@ -84,6 +110,8 @@ import hjjc from "./items/hjjc.vue";
 import psxt from "./items/psxt.vue";
 import home from "./items/home.vue";
 import dlxt from "./items/dlxt.vue";
+import tfxt from "./items/tfxt.vue";
+import tsj from "./items/tsj.vue";
 export default {
   name: "cockpit",
   components: {
@@ -92,16 +120,18 @@ export default {
     hjjc,
     psxt,
     dlxt,
+    tfxt,
+    tsj,
   },
   data() {
     return {
       previewUrl: process.env.VUE_APP_API_TARGET,
       showMenu: 0,
-      videoData:null,
+      videoData: null,
     };
   },
   mounted() {
-    this.getVideo()
+    this.getVideo();
     if (screenfull && screenfull.enabled && !screenfull.isFullscreen) {
       screenfull.request();
     }
@@ -109,19 +139,16 @@ export default {
     //     this.alarm30();
   },
   methods: {
-    getVideo(){
+    getVideo() {
       this.videoData = null;
-      listVideo().then(res => {
+      listVideo().then((res) => {
         this.videoData = this.previewUrl + res.data;
-       
-      })
+      });
     },
     changeMenu(val) {
       this.showMenu = val;
     },
-    sysAnalysis(){
-
-    },
+    sysAnalysis() {},
     goToSys() {
       var link = this.$router.resolve({
         path: "/",
@@ -129,7 +156,7 @@ export default {
       window.open(link.href);
       return;
     },
-    openVideo(){
+    openVideo() {
       window.open(this.videoData);
       return;
     },
@@ -178,11 +205,10 @@ export default {
 .header {
   width: 590px;
   height: 80px;
-  
+
   background: url("~@/assets/images/screen/tit.png") no-repeat center;
-    background-size: 100%;
+  background-size: 100%;
   margin: 0 auto;
-  
 }
 .sub-header {
   display: flex;

src/views/system/waterSysSet/index.vue

@@ -32,34 +32,58 @@
       <el-divider></el-divider>
       <!-- 液体高度设置 -->
       <div class="section">
-        <h3>设置液体高度 <el-link type="primary" :underline="false" @click="setDis">设置说明</el-link></h3>
-        
+        <h3>
+          设置液体高度
+          <el-link type="primary" :underline="false" @click="setDis"
+            >设置说明</el-link
+          >
+        </h3>
+
         <!-- 每个水仓的设置 -->
-        <div v-for="(sump, index) in formData.draPeakSumpVos" :key="sump.sumpId">
+        <div
+          v-for="(sump, index) in formData.draPeakSumpVos"
+          :key="sump.sumpId"
+        >
           <div class="sump-item">
             <div class="sump-header">
               <span>{{ sump.sumpName }}液位高度（m）：</span>
             </div>
-            
+
             <div class="threshold-inputs">
               <div class="threshold-item">
                 <span>A点值</span>
-                <el-input v-model="sump.heghtThresholdA" placeholder="请输入A点值" size="small"></el-input>
+                <el-input
+                  v-model="sump.heghtThresholdA"
+                  placeholder="请输入A点值"
+                  size="small"
+                ></el-input>
               </div>
               <div class="threshold-item">
                 <span>B点值</span>
-                <el-input v-model="sump.heghtThresholdB" placeholder="请输入B点值" size="small"></el-input>
+                <el-input
+                  v-model="sump.heghtThresholdB"
+                  placeholder="请输入B点值"
+                  size="small"
+                ></el-input>
               </div>
               <div class="threshold-item">
                 <span>C点值</span>
-                <el-input v-model="sump.heghtThresholdC" placeholder="请输入C点值" size="small"></el-input>
+                <el-input
+                  v-model="sump.heghtThresholdC"
+                  placeholder="请输入C点值"
+                  size="small"
+                ></el-input>
               </div>
               <div class="threshold-item">
                 <span>D点值</span>
-                <el-input v-model="sump.heghtThresholdD" placeholder="请输入D点值" size="small"></el-input>
+                <el-input
+                  v-model="sump.heghtThresholdD"
+                  placeholder="请输入D点值"
+                  size="small"
+                ></el-input>
               </div>
             </div>
-            
+
             <div class="pump-selection">
               <span>对应控制水泵：</span>
               <div class="pump-checkboxes">
@@ -76,8 +100,10 @@
               </div>
             </div>
           </div>
-          
-          <el-divider v-if="index < formData.draPeakSumpVos.length - 1"></el-divider>
+
+          <el-divider
+            v-if="index < formData.draPeakSumpVos.length - 1"
+          ></el-divider>
         </div>
       </div>
 
@@ -89,17 +115,16 @@
     </el-card>
     <!-- 弹窗 -->
     <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
-        <div class="warter-lev">
-          <div class="lev-pic"></div>
-          <div class="lev-content">
-            <p>①液位高度X>A时，不考虑是否在峰谷时间，自动开启水泵。</p>
-            <p>如果未在峰谷期内液压高度X<=B时，关闭水泵。</p>
-            <p>如果在峰谷期内液压高度X<=D时,关闭水泵。</p>
-            <p>②A>=X（液压高度）X<=C时，等待峰谷期内，自动开启水泵。</p>
-            <p>液压高度X<=D时，自动关闭水泵。</p>
-          </div>
+      <div class="warter-lev">
+        <div class="lev-pic"></div>
+        <div class="lev-content">
+          <p>①液位高度X>A时，不考虑是否在峰谷时间，自动开启水泵。</p>
+          <p>如果未在峰谷期内液压高度X<=B时，关闭水泵。</p>
+          <p>如果在峰谷期内液压高度X<=D时,关闭水泵。</p>
+          <p>②A>=X（液压高度）X<=C时，等待峰谷期内，自动开启水泵。</p>
+          <p>液压高度X<=D时，自动关闭水泵。</p>
         </div>
-      
+      </div>
     </el-dialog>
   </div>
 </template>
@@ -108,18 +133,18 @@
 import { peakGetDra, peakEditDra } from "@/api/tyler/sys";
 
 export default {
-  name: 'AutomationControl',
+  name: "AutomationControl",
   data() {
     return {
       open: false,
       formData: {
         status: "1", // 默认开启
-        peakBeginTime: '',
-        peakEndTime: '',
-        draPeakSumpVos: []
+        peakBeginTime: "",
+        peakEndTime: "",
+        draPeakSumpVos: [],
       },
       timeRange: [],
-      title:'液位高度设置说明：'
+      title: "液位高度设置说明：",
     };
   },
   created() {
@@ -127,34 +152,37 @@ export default {
   },
   methods: {
     getList() {
-      peakGetDra().then(res => {
+      peakGetDra().then((res) => {
         const data = res.data;
-        
+
         // 保存原始水泵顺序
         this.originalPumpOrder = new Map();
         data.draPeakSumpVos.forEach((sump, sumpIndex) => {
-          this.originalPumpOrder.set(sumpIndex, sump.draPeakPumpVos.map(p => p.pumpId));
+          this.originalPumpOrder.set(
+            sumpIndex,
+            sump.draPeakPumpVos.map((p) => p.pumpId)
+          );
         });
 
         // 处理数据时保持原始顺序
         data.draPeakSumpVos = data.draPeakSumpVos.map((sump, sumpIndex) => {
           const orderedPumps = [];
           const originalOrder = this.originalPumpOrder.get(sumpIndex);
-          
+
           // 按照原始顺序重新排列水泵
-          originalOrder.forEach(pumpId => {
-            const found = sump.draPeakPumpVos.find(p => p.pumpId === pumpId);
+          originalOrder.forEach((pumpId) => {
+            const found = sump.draPeakPumpVos.find((p) => p.pumpId === pumpId);
             if (found) {
               orderedPumps.push({
                 ...found,
-                pumpStatus: parseInt(found.pumpStatus, 10)
+                pumpStatus: parseInt(found.pumpStatus, 10),
               });
             }
           });
 
           return {
             ...sump,
-            draPeakPumpVos: orderedPumps
+            draPeakPumpVos: orderedPumps,
           };
         });
 
@@ -163,7 +191,7 @@ export default {
       });
     },
     handleStatusChange(value) {
-      console.log('自动化控制状态已切换为:', value);
+      console.log("自动化控制状态已切换为:", value);
     },
     handleTimeRangeChange(value) {
       if (value && value.length === 2) {
@@ -178,24 +206,24 @@ export default {
       // 深拷贝时保持数组顺序
       const postData = {
         ...this.formData,
-        draPeakSumpVos: this.formData.draPeakSumpVos.map(sump => ({
+        draPeakSumpVos: this.formData.draPeakSumpVos.map((sump) => ({
           ...sump,
-          draPeakPumpVos: sump.draPeakPumpVos.map(pump => ({
+          draPeakPumpVos: sump.draPeakPumpVos.map((pump) => ({
             ...pump,
-            pumpStatus: pump.pumpStatus.toString()
-          }))
-        }))
+            pumpStatus: pump.pumpStatus.toString(),
+          })),
+        })),
       };
 
-      peakEditDra(postData).then(res => {
-        this.$message.success('设置保存成功');
+      peakEditDra(postData).then((res) => {
+        this.$message.success("设置保存成功");
         this.getList();
       });
     },
-    setDis(){
+    setDis() {
       this.open = true;
     },
-  }
+  },
 };
 </script>
 
@@ -217,9 +245,9 @@ export default {
 .control-header {
   display: flex;
   align-items: center;
-  justify-content: start;
+  justify-content: flex-start;
   gap: 20px;
-  span{
+  span {
     font-weight: bold;
   }
 }
@@ -268,20 +296,20 @@ export default {
 
 .button-group {
   display: flex;
-  justify-content: start;
+  justify-content: flex-start;
   gap: 15px;
   margin-top: 20px;
 }
-.warter-lev{
+.warter-lev {
   display: flex;
   justify-content: center;
-  .lev-pic{
+  .lev-pic {
     width: 105px;
     height: 343px;
     background: url("~@/assets/images/sys/warterSysSet.png") no-repeat center;
     background-size: 100%;
   }
-  .lev-content{
+  .lev-content {
     height: 343px;
     display: flex;
     justify-content: center;
@@ -293,4 +321,4 @@ export default {
 ::v-deep .el-date-editor .el-range-separator {
   width: 30px;
 }
-</style>
+</style>
\ No newline at end of file

vue.config.js

@@ -91,41 +91,49 @@ module.exports = {
         symbolId: 'icon-[name]'
       })
       .end()
+    config.module
+      .rule('highcharts')
+      .test(/node_modules[\\/]highcharts[\\/].*\.js$/)
+      .use('babel-loader')
+      .loader('babel-loader')
+      .options({
+        presets: ['@babel/preset-env']
+      });
 
     config.when(process.env.NODE_ENV !== 'development', config => {
-          config
-            .plugin('ScriptExtHtmlWebpackPlugin')
-            .after('html')
-            .use('script-ext-html-webpack-plugin', [{
-            // `runtime` must same as runtimeChunk name. default is `runtime`
-              inline: /runtime\..*\.js$/
-            }])
-            .end()
+      config
+        .plugin('ScriptExtHtmlWebpackPlugin')
+        .after('html')
+        .use('script-ext-html-webpack-plugin', [{
+          // `runtime` must same as runtimeChunk name. default is `runtime`
+          inline: /runtime\..*\.js$/
+        }])
+        .end()
 
-          config.optimization.splitChunks({
-            chunks: 'all',
-            cacheGroups: {
-              libs: {
-                name: 'chunk-libs',
-                test: /[\\/]node_modules[\\/]/,
-                priority: 10,
-                chunks: 'initial' // only package third parties that are initially dependent
-              },
-              elementUI: {
-                name: 'chunk-elementUI', // split elementUI into a single package
-                test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
-                priority: 20 // the weight needs to be larger than libs and app or it will be packaged into libs or app
-              },
-              commons: {
-                name: 'chunk-commons',
-                test: resolve('src/components'), // can customize your rules
-                minChunks: 3, //  minimum common number
-                priority: 5,
-                reuseExistingChunk: true
-              }
-            }
-          })
-          config.optimization.runtimeChunk('single')
+      config.optimization.splitChunks({
+        chunks: 'all',
+        cacheGroups: {
+          libs: {
+            name: 'chunk-libs',
+            test: /[\\/]node_modules[\\/]/,
+            priority: 10,
+            chunks: 'initial' // only package third parties that are initially dependent
+          },
+          elementUI: {
+            name: 'chunk-elementUI', // split elementUI into a single package
+            test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
+            priority: 20 // the weight needs to be larger than libs and app or it will be packaged into libs or app
+          },
+          commons: {
+            name: 'chunk-commons',
+            test: resolve('src/components'), // can customize your rules
+            minChunks: 3, //  minimum common number
+            priority: 5,
+            reuseExistingChunk: true
+          }
+        }
+      })
+      config.optimization.runtimeChunk('single')
     })
   }
 }