From de0bcfd8a025f11b95a0add789f65cf4912fadab Mon Sep 17 00:00:00 2001
From: fanluyan <754122931@qq.com>
Date: Mon, 26 Jun 2023 14:22:53 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96gps?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/alarmHandling/index.vue             |   4 +-
 src/views/components/carouselChart.vue        |   4 +-
 .../components/gpsPosition.vue                | 128 ++++++++++++++++++
 src/views/realTimeMonitor/index.vue           |  71 +++++++++-
 4 files changed, 201 insertions(+), 6 deletions(-)
 create mode 100644 src/views/realTimeMonitor/components/gpsPosition.vue

diff --git a/src/views/alarmHandling/index.vue b/src/views/alarmHandling/index.vue
index 28495ce..c958e50 100644
--- a/src/views/alarmHandling/index.vue
+++ b/src/views/alarmHandling/index.vue
@@ -328,6 +328,7 @@ export default {
   },
   methods: {
     imgOnload() {
+      console.log("加载完成");
       this.alarmLoading = false;
       this.canvasloading = false;
     },
@@ -450,7 +451,6 @@ export default {
       this.ctx.strokeStyle = "#ff0000";
       // 线宽设置，必须放在绘制之前
       this.ctx.lineWidth = 1;
-
       // 绘制矩形
       var scaleX = this.canvas.width / data.photoWidth, //this.iw图片的宽
         scaleY = this.canvas.height / data.photoHeight; //this.ih图片的高
@@ -507,6 +507,7 @@ export default {
       this.alarmLoading = true;
       console.log(row);
       this.photoPic = row.path;
+      console.log(this.photoPic);
       this.selectRow = row;
       //未读变已读
       if (row.isread == 0) {
@@ -524,6 +525,7 @@ export default {
             });
         }, 300);
       }
+
       this.$nextTick(() => {
         this.drawline(row);
       });
diff --git a/src/views/components/carouselChart.vue b/src/views/components/carouselChart.vue
index 93c3991..16012f1 100644
--- a/src/views/components/carouselChart.vue
+++ b/src/views/components/carouselChart.vue
@@ -1,12 +1,12 @@
 <template>
   <div class="thumb-example">
     <div class="picTop">
-      <div class="bigimg" v-if="bigPicPath.indexOf('nopic') !== -1">
+      <div class="bigimg nopic" v-if="bigPicPath.indexOf('nopic') !== -1">
         <img class="animImg" :src="bigPicPath" />
       </div>
       <div
         class="bigimg"
-        v-if="
+        v-else-if="
           bigPicPath.indexOf('nopic') == -1 &&
           bigPicPath.indexOf('videos') == -1
         "
diff --git a/src/views/realTimeMonitor/components/gpsPosition.vue b/src/views/realTimeMonitor/components/gpsPosition.vue
new file mode 100644
index 0000000..11a06cf
--- /dev/null
+++ b/src/views/realTimeMonitor/components/gpsPosition.vue
@@ -0,0 +1,128 @@
+<template>
+  <el-dialog
+    class="gpsPoisitiondialog"
+    title="GPS位置"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="662px"
+    @close="handleclose"
+  >
+    <div class="gpsbox" v-loading="loading">
+      <p>
+        <span>经度：</span><span>{{ infornr.longitude }}</span>
+      </p>
+      <p>
+        <span>纬度：</span><span>{{ infornr.latitude }}</span>
+      </p>
+      <p>
+        <span>半径：</span><span>{{ infornr.radius }}</span>
+      </p>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="isShow = false">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { getTermGPSJoggle, getTermGPSPosition } from "@/utils/api/index";
+export default {
+  props: {
+    title: String,
+  },
+  data() {
+    return {
+      loading: true,
+      isShow: false,
+      timer: null,
+      infornr: {},
+      i: 0,
+      queryTime: "", //查询ID
+      zzcmdid: "",
+      zztermid: "",
+    };
+  },
+  mounted() {},
+  methods: {
+    //获取第一次数据
+    getgpsData(zzcmdidval, zztermidval) {
+      this.zzcmdid = zzcmdidval;
+      this.zztermid = zztermidval;
+      console.log(this.zzcmdid);
+      console.log(this.zztermid);
+      this.loading = true;
+      getTermGPSPosition({
+        cmdId: zzcmdidval,
+      })
+        .then((res) => {
+          this.queryTime = res.data;
+          console.log(this.zztermid);
+          this.getNewgpsData(this.zztermid);
+          this.timer = window.setInterval(() => {
+            this.getNewgpsData(this.zztermid);
+            this.i++;
+          }, 5000);
+        })
+        .catch((err) => {});
+    },
+    //最新数据
+    getNewgpsData(val) {
+      getTermGPSJoggle({
+        queryTime: this.queryTime,
+        termid: val,
+      })
+        .then((res) => {
+          this.loading = true;
+          if (res.code == 200) {
+            this.infornr = res.data;
+            if (res.data.hasNew == true) {
+              this.loading = false;
+              this.i = 0;
+              this.$message({
+                duration: 1500,
+                showClose: true,
+                message: "gps信息已更新",
+                type: "success",
+              });
+              clearInterval(this.timer);
+            } else if (this.i > 9) {
+              this.loading = false;
+              this.i = 0;
+              this.$message({
+                duration: 1500,
+                showClose: true,
+                message: "暂未获取到GPS信息，请稍后再试！！",
+                type: "warning",
+              });
+              clearInterval(this.timer);
+            }
+          } else {
+            this.$message.error(res.code.msg);
+          }
+        })
+        .catch((err) => {});
+    },
+    display() {
+      this.isShow = true;
+    },
+    hide() {
+      this.isShow = false;
+    },
+    handleclose() {
+      this.i = 0;
+      clearInterval(this.timer);
+      this.timer = null;
+    },
+  },
+};
+</script>
+<style lang="less">
+.gpsPoisitiondialog {
+  .gpsbox {
+    p {
+      line-height: 32px;
+      height: 32px;
+      font-size: 16px;
+    }
+  }
+}
+</style>
diff --git a/src/views/realTimeMonitor/index.vue b/src/views/realTimeMonitor/index.vue
index c99658c..d30358b 100644
--- a/src/views/realTimeMonitor/index.vue
+++ b/src/views/realTimeMonitor/index.vue
@@ -61,9 +61,6 @@
             :terminalPhoto="terminalPhoto"
             v-if="terminalPhoto.length > 0"
           ></carouselChart>
-          <!-- <div class="totalPic" v-if="totalPic !== 0">
-            图片总数：{{ totalPic }}张
-          </div> -->
         </div>
         <div class="parameterArea">
           <div class="zzbox">
@@ -182,12 +179,31 @@
                   <el-dropdown-item command="close">关闭</el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
+              <!-- 获取gps位置 -->
+              <el-button type="primary" @click.native.stop="handleShowGPS()"
+                >获取GPS位置</el-button
+              >
+              <!-- gps开关 -->
+              <el-dropdown
+                class="dropgps"
+                trigger="click"
+                @command="handleCommandGps"
+              >
+                <el-button type="primary">
+                  GPS开关<i class="el-icon-arrow-down el-icon--right"></i>
+                </el-button>
+                <el-dropdown-menu slot="dropdown" class="gpsdropStyle">
+                  <el-dropdown-item command="open">开启GPS</el-dropdown-item>
+                  <el-dropdown-item command="close">关闭GPS</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
             </div>
           </div>
         </div>
       </div>
       <setschedule ref="setschedule_ref"></setschedule>
       <info-dialog ref="infodialog_ref"></info-dialog>
+      <gps-position ref="gpsdialog_ref"></gps-position>
     </div>
   </div>
 </template>
@@ -201,18 +217,21 @@ import {
   getReturnedPhotoJoggle,
   alarmMarkJoggle,
   getTermStatus,
+  setTermGPSJoggle,
 } from "@/utils/api/index";
 import { mapState } from "vuex";
 import carouselChart from "../components/carouselChart.vue";
 import setschedule from "./components/setschedule.vue";
 import deviceUpgrade from "./components/deviceUpgrade.vue";
 import infoDialog from "./components/infoDialog.vue";
+import gpsPosition from "./components/gpsPosition.vue";
 export default {
   components: {
     carouselChart,
     setschedule,
     deviceUpgrade,
     infoDialog,
+    gpsPosition,
   },
   data() {
     return {
@@ -493,6 +512,7 @@ export default {
       this.$refs.setschedule_ref.getSingleAccess(this.channelId, this.cmdid);
       this.$refs.setschedule_ref.deviceList();
     },
+    //声光报警开启关闭
     handleCommandWarn(command) {
       switch (command) {
         case "open": //开启
@@ -731,6 +751,51 @@ export default {
         }
       });
     },
+    //获取GPS位置
+
+    handleShowGPS() {
+      this.$refs.gpsdialog_ref.display();
+      this.$refs.gpsdialog_ref.getgpsData(this.cmdid, this.newTermId);
+      console.log(this.cmdid, this.newTermId);
+    },
+
+    //切换gps开启关闭
+    handleCommandGps(command) {
+      switch (command) {
+        case "open": //开启
+          this.changeGPS(1, this.cmdid);
+          break;
+        case "close": //关闭
+          this.changeGPS(0, this.cmdid);
+          break;
+      }
+    },
+    changeGPS(val, cmdid) {
+      console.log(val, cmdid);
+      setTermGPSJoggle({ gpsstatus: val, cmdId: cmdid })
+        .then((res) => {
+          console.log(res);
+          if (val == 0) {
+            this.$message({
+              duration: 1500,
+              message: "关闭GPS",
+              type: "success",
+              showClose: true,
+            });
+          } else {
+            this.$message({
+              duration: 1500,
+              message: "成功开启GPS",
+              type: "success",
+              showClose: true,
+            });
+          }
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+
     //历史图片
     // handlehistoryPic() {
     //   this.$router.push({ path: "/realTimeSearch" });