From 8aa3edd56c279100c9053576f3e90fa55459fe77 Mon Sep 17 00:00:00 2001
From: zengh <123456>
Date: Mon, 16 Jan 2023 16:15:55 +0800
Subject: [PATCH] 修改

---
 src/views/realTimePolice/real.vue | 1300 +++++++++++++++++++++++++++++++++-------------------------
 1 files changed, 746 insertions(+), 554 deletions(-)

diff --git a/src/views/realTimePolice/real.vue b/src/views/realTimePolice/real.vue
index 6cd563d..01519de 100644
--- a/src/views/realTimePolice/real.vue
+++ b/src/views/realTimePolice/real.vue
@@ -13,6 +13,8 @@
       @row-save="rowSave"
       :before-open="beforeOpen"
       :row-style="rowStyle"
+      :search.sync="search"
+      row-class-name="tabFontSize"
       @search-change="searchChange"
       @search-reset="searchReset"
       @selection-change="selectionChange"
@@ -20,11 +22,13 @@
       @size-change="sizeChange"
       @refresh-change="refreshChange"
       @on-load="onLoad"
+      v-show="switchChartType == 0"
     >
       <template slot="menuLeft">
         <el-button
           type="danger"
-          size="small"
+          v-show="true"
+          size="mini"
           icon="el-icon-delete"
           plain
           v-if="permission.real_delete"
@@ -35,28 +39,75 @@
 
       <template slot="menuLeft">
         <el-button
-          v-bind:class=" activeClass==1 ? 'btn-color' : '' "
-          size="small"
-          @click="getBZdata(1)"
+          v-bind:class="activeClass == 0 ? 'btn-color' : ''"
+          size="mini"
+          @click="getBRdata(0)"
+        >本日
+        </el-button>
+        <el-button
+          v-bind:class="activeClass == 1 ? 'btn-color' : ''"
+          size="mini"
+          @click="getBRdata(1)"
         >本周
         </el-button>
         <el-button
-          v-bind:class=" activeClass==2 ? 'btn-color' : '' "
-          size="small"
-          @click="getBYdata(2)"
+          v-bind:class="activeClass == 2 ? 'btn-color' : ''"
+          size="mini"
+          @click="getBRdata(2)"
         >本月
         </el-button>
         <el-button
-          v-bind:class=" activeClass==3 ? 'btn-color' : '' "
-          size="small"
+          v-bind:class="activeClass == 3 ? 'btn-color' : ''"
+          size="mini"
           @click="getQBdata(3)"
         >全部
         </el-button>
       </template>
 
+      <template slot="menuLeft">
+        <el-button
+          type="warning"
+          size="mini"
+          plain
+          icon="el-icon-download"
+          @click="handleExport"
+        >导出
+        </el-button>
+        <el-button
+          type="warning"
+          size="mini"
+          plain
+          icon="el-icon-pie-chart"
+          @click="handleExportStatis"
+        >导出报表
+        </el-button>
+        <el-button type="success"
+                   size="mini"
+                   icon="el-icon-s-marketing"
+                   @click="switchChart">图 表
+        </el-button>
+      </template>
+
       <template slot-scope="{ row }" slot="jtype">
-        <el-tag>{{
-          row.jtype == "0" ? "否" : row.jtype == "1" ? "是" : "无"
+        <el-tag
+        >{{
+          row.jtype == "0" ? "未处理" : row.jtype == "1" ? "处理中" : "已处理"
+          }}
+        </el-tag>
+      </template>
+
+      <template slot-scope="{ row }" slot="alarmbs">
+        <el-tag
+        >{{
+          row.alarmbs == "0" ? "一般警情" : row.alarmbs == "1" ? "误报警情" : row.alarmbs == "2" ? "重大警情" : "暂无"
+          }}
+        </el-tag>
+      </template>
+
+      <template slot-scope="{ row }" slot="cid">
+        <el-tag
+        >{{
+          row.cid == "1" ? "事件发生" : row.cid == "3" ? "是" : "事件恢复"
           }}
         </el-tag>
       </template>
@@ -68,227 +119,82 @@
           :type="type"
           @click.stop="handleHistory(row)"
         >历史
-        </el-button
-        >
+        </el-button>
         <el-button
           icon="el-icon-video-camera-solid"
           :size="size"
           :type="type"
           @click.stop="handleStart(row)"
         >视频
-        </el-button
-        >
+        </el-button>
         <el-button
+          v-if="row.jtype == 0 || row.jtype == ''"
           icon="el-icon-edit"
           :size="size"
           :type="type"
           @click.stop="handleManage(row)"
-        >处置
-        </el-button
-        >
+        >核实
+        </el-button>
+        <el-button
+          v-if="row.jtype != 0 && row.jtype != ''"
+          icon="el-icon-s-order"
+          :size="size"
+          :type="type"
+          @click.stop="PoliceTracking(row)"
+        >追踪
+        </el-button>
         <el-button
           icon="el-icon-location-outline"
           :size="size"
           :type="type"
           @click.stop="handleMap(row)"
         >定位
-        </el-button
-        >
+        </el-button>
       </template>
     </avue-crud>
 
-    <el-dialog
-      title="警情处置"
-      :visible.sync="dialogTableVisible"
-      append-to-body="true"
-      @close="innerVisibleVideo = false"
-    >
-      <el-dialog
-        class="old-video-dialog"
-        :modal="false"
-        width="100%"
-        title="历史视频"
-        :visible.sync="innerVisibleVideo"
-        :close-on-press-escape="false"
-        append-to-body
-        @opened="openOldVideoBox"
-        @close="closeOldVideoBox"
-      >
-        <video
-          src=""
-          id="old_video"
-          style="width: 100%; height: 100%; object-fit:fill"
-          controls
-        ></video>
-      </el-dialog>
-
-      <el-form
-        :model="form"
-        label-position="right"
+    <el-row v-show="switchChartType == 1">
+      <el-button
+        v-bind:class="activeClass == 0 ? 'btn-color' : ''"
         size="mini"
-        label-width="100px"
-      >
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="报警人">
-              <el-input
-                disabled="true"
-                v-model="form.alarmPeople"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="联系电话">
-              <el-input
-                disabled="true"
-                v-model="form.phoneNumber"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="行政区">
-              <el-input
-                disabled="true"
-                v-model="form.district"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="事发地址">
-              <el-input
-                disabled="true"
-                v-model="form.place"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="警情类别">
-              <el-input
-                disabled="true"
-                v-model="form.waringType"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="设备编号">
-              <el-input
-                disabled="true"
-                v-model="form.deviceNumber"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="接警人">
-              <el-input
-                disabled="true"
-                v-model="form.galarmPeople"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="接警时间">
-              <el-input
-                disabled="true"
-                v-model="form.jjTime"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="报警时间">
-              <el-input
-                disabled="true"
-                v-model="form.alarmTime"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="历史视频">
-              <el-button type="primary" @click.stop="queryOldVideo(form)"
-              >查看视频
-              </el-button
-              >
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-form-item label="报警内容">
-            <el-input
-              disabled="true"
-              v-model="form.content"
-              autocomplete="off"
-            ></el-input>
-          </el-form-item>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="要求处置时间">
-              <el-date-picker
-                v-model="form.czTime"
-                type="datetime"
-                value-format="yyyy-MM-dd hh:mm:ss"
-                placeholder="选择日期时间"
-              >
-              </el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="备注">
-              <el-input v-model="form.bz" autocomplete="off"></el-input>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :align="center">
-          <el-col :offset="4">
-            <el-form-item>
-              <el-button
-                :class="{ active: isActive }"
-                type="success"
-                @click.stop="aKeyToCall($event, form)"
-              >一键呼叫
-              </el-button
-              >
-              <el-button type="success">视频对讲</el-button>
-              <el-button type="primary" @click.stop="generate(form)"
-              >生成警单
-              </el-button
-              >
-              <el-button type="warning" @click.stop="revoke(form)"
-              >警情撤销
-              </el-button
-              >
-              <el-button type="danger">推送110</el-button>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-    </el-dialog>
+        @click="getswitchChartdate(0)"
+      >本日
+      </el-button>
+      <el-button
+        v-bind:class="activeClass == 1 ? 'btn-color' : ''"
+        size="mini"
+        @click="getswitchChartdate(1)"
+      >本周
+      </el-button>
+      <el-button
+        v-bind:class="activeClass == 2 ? 'btn-color' : ''"
+        size="mini"
+        @click="getswitchChartdate(2)"
+      >本月
+      </el-button>
+      <el-button
+        v-bind:class="activeClass == 3 ? 'btn-color' : ''"
+        size="mini"
+        @click="getswitchChartdate(3)"
+      >全部
+      </el-button>
+      <el-button type="success"
+                 size="mini"
+                 icon="el-icon-s-marketing"
+                 @click="switchChart">表 格
+      </el-button>
+      <div class="alarmTypeEcharts">
+        <div id="alarmTypeProEcharts"></div>
+        <div id="alarmEcharts"></div>
+      </div>
+    </el-row>
 
-    <el-drawer
-      title="电子地图"
-      append-to-body="true"
-      :visible.sync="showMap"
-    >
+    <real-popup ref="realPopupView"></real-popup>
+    <el-drawer title="电子地图" append-to-body="true" :visible.sync="showMap">
       <iframe
         id="mapDiv"
         ref="mapDiv"
-        src="/map/index.html?openid=ClientManagement"
+        src="/map/index.html?openid=ClientManagement&ISinit=1"
         frameborder="0"
         width="100%"
         height="100%"
@@ -298,14 +204,8 @@
 </template>
 
 <script>
-  import {getList, remove, update, add, getclient} from "@/api/real/real";
+  import {getList, remove, update, add, getclient,getChartData,getChartDataBs} from "@/api/real/real";
   import {mapGetters} from "vuex";
-
-  import Hls from "hls.js";
-
-  import axios from "axios";
-
-  import Recorder from "js-audio-recorder";
 
   export default {
     data() {
@@ -313,56 +213,70 @@
         showMap: false,
         hls: "",
         videoSource: "",
-        dialogTableVisible: false,
-        innerVisibleVideo: false,
-        activeClass: -1,
+        activeClass: 3,
+        switchChartType: "0",
         form: {},
         query: {},
+        search: {},
         dateTime: [],
         loading: true,
         page: {
           pageSize: 10,
           currentPage: 1,
-          total: 0
+          total: 0,
         },
         selectionList: [],
         option: {
           height: "auto",
           indexLabel: "序号",
-          calcHeight: 30,
+          calcHeight: 54,
           labelWidth: "100",
           size: "mini",
+          border: false,
+          stripe: true,
           menuWidth: 240,
           dialogWidth: 950,
           tip: false,
           searchShow: true,
           searchMenuSpan: 3,
-          border: true,
+          align: "center",
           index: true,
           viewBtn: true,
-          selection: false,
+          selection: true,
           dialogClickModal: false,
           column: [
             {
               label: "警情类型",
               prop: "waringType",
-              search: true,
-              searchSpan: 3
+              search: false,
+              searchSpan: 3,
+              width: 85,
+              className: "waringTypeClass",
+              searchPlaceholder: "请选择",
+              type: "select",
+              props: {
+                label: "dictValue",
+                value: "dictValue",
+              },
+              //cascaderItem: ["city", "district"],
+              dicUrl:
+                "/api/blade-system/dict-biz/child-list?parentId=1356523651644043266",
             },
             {
               label: "报警时间",
               type: "datetime",
-              width: 130,
+              width: 160,
               format: "yyyy-MM-dd HH:mm:ss",
               valueFormat: "yyyy-MM-dd HH:mm:ss",
-              prop: "alarmTime"
+              prop: "alarmTime",
             },
             {
               label: "报警时间",
               prop: "releaseTimeRange",
               type: "datetime",
-              format: "yyyy-MM-dd HH:mm:ss",
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
+              format: "yyyy-MM-dd",
+              valueFormat: "yyyy-MM-dd",
+              searchValue: [this.getStartTime(), this.getEndTime()],
               searchRange: true,
               searchSpan: 5,
               hide: true,
@@ -374,82 +288,85 @@
                 {
                   required: true,
                   message: "请输入时间",
-                  trigger: "blur"
-                }
-              ]
+                  trigger: "blur",
+                },
+              ],
             },
             {
-              label: "报警内容",
-              prop: "rname"
+              label: "主要负责人",
+              prop: "oneContacts",
+              width: 90,
+            },
+            {
+              label: "负责人电话",
+              prop: "onePhone",
+              width: 110,
             },
             {
               label: "报警人",
-              prop: "alarmPeople"
+              prop: "galarmPeople",
+              width: 90,
             },
             {
-              label: "联系电话",
+              label: "报警人电话",
               prop: "phoneNumber",
-              width: 130
-            },
-            {
-              label: "接警人",
-              prop: "galarmPeople"
-            },
-            {
-              label: "接警时间",
-              type: "datetime",
-              format: "yyyy-MM-dd HH:mm:ss",
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
               width: 130,
-              prop: "jjTime"
             },
             {
               label: "事发地址",
-              width: 200,
-              prop: "place"
+              prop: "place",
             },
             {
               label: "设备编号",
               search: true,
               searchSpan: 3,
               width: 130,
-              prop: "deviceNumber"
+              prop: "deviceNumber",
             },
             {
-              label: "生成警单",
-              search: true,
+              label: "警情状态",
               searchSpan: 3,
+              width: 96,
+              search: true,
               slot: true,
-              searchPlaceholder: "",
+              searchPlaceholder: "请选择",
               prop: "jtype",
               type: "select",
               dicData: [
                 {
-                  label: "否",
-                  value: "0"
+                  label: "未处理",
+                  value: "0",
                 },
                 {
-                  label: "是",
-                  value: "1"
-                }
-              ]
+                  label: "处理中",
+                  value: "1",
+                },
+                {
+                  label: "已处理",
+                  value: "2",
+                },
+              ],
             },
             {
               label: "省份",
               prop: "province",
               search: true,
-              searchSpan: 3,
-              searchLabelWidth: 60,
+              searchSpan: 2,
+              searchLabelWidth: 45,
               placeholder: "省份",
               type: "select",
               props: {
                 label: "name",
-                value: "code"
+                value: "code",
               },
               cascaderItem: ["city", "district"],
               dicUrl: "/api/blade-system/region/select",
               span: 6,
-              className: "cityClass1"
+              className: "cityreal1",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
             },
             {
               label: "地市",
@@ -462,12 +379,16 @@
               search: true,
               props: {
                 label: "name",
-                value: "code"
+                value: "code",
               },
               dicUrl: "/api/blade-system/region/select?code={{key}}",
               span: 3,
               labelWidth: "0",
-              className: "cityClass2"
+              className: "cityreal2",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
             },
             {
               label: "区县",
@@ -480,20 +401,66 @@
               type: "select",
               props: {
                 label: "name",
-                value: "code"
+                value: "code",
               },
               dicUrl: "/api/blade-system/region/select?code={{key}}",
               span: 3,
               labelWidth: "0",
-              className: "cityClass3"
-            }
-          ]
+              className: "cityreal3",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
+            },
+
+            {
+              label: "警情标识",
+              prop: "alarmbs",
+              width: 90,
+              search: true,
+              searchSpan: 3,
+              slot: true,
+              type: "select",
+              dicData: [
+                {
+                  label: "一般警情",
+                  value: "0",
+                },
+                {
+                  label: "误报警情",
+                  value: "1",
+                },
+                {
+                  label: "严重警情",
+                  value: "2",
+                }
+              ],
+              addDisplay: false,
+              editDisplay: false,
+              viewDisplay: false,
+            }, {
+              label: "接警人",
+              prop: "alarmPeople",
+              width: 90,
+            },
+            {
+              label: "接警时间",
+              type: "datetime",
+              format: "yyyy-MM-dd HH:mm:ss",
+              valueFormat: "yyyy-MM-dd HH:mm:ss",
+              width: 130,
+              prop: "jjTime",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
+            },
+          ],
         },
         data: [],
-        isActive: false,
-        recorder: null
+        recorder: null,
+        peopleList: [],
       };
-
     },
     computed: {
       ...mapGetters(["permission", "flowRoutes"]),
@@ -501,27 +468,20 @@
         return {
           addBtn: this.vaildData(this.permission.real_add, false),
           viewBtn: this.vaildData(null, false),
-          delBtn: this.vaildData(this.permission.real_delete, false),
-          editBtn: this.vaildData(this.permission.real_edit, false)
+          delBtn: this.vaildData(null, false),
+          editBtn: this.vaildData(null, false),
         };
       },
       ids() {
         let ids = [];
-        this.selectionList.forEach(ele => {
+        this.selectionList.forEach((ele) => {
           ids.push(ele.id);
         });
         return ids.join(",");
-      }
+      },
     },
     created() {
       this.dateTime = this.getDate();
-
-      this.recorder = new Recorder({
-        sampleBits: 16, // 采样位数,支持 8 或 16,默认是16
-        sampleRate: 16000, // 采样率,支持 11025、16000、22050、24000、44100、48000,根据浏览器默认值,我的chrome是48000
-        numChannels: 1 // 声道,支持 1 或 2, 默认是1
-        // compiling: false,(0.x版本中生效,1.x增加中)  // 是否边录边转换,默认是false
-      });
     },
     methods: {
       rowSave(row, done, loading) {
@@ -530,12 +490,11 @@
             this.onLoad(this.page);
             this.$message({
               type: "success",
-              message: "操作成功!"
+              message: "操作成功!",
             });
             done();
           },
-          error => {
-            window.console.log(error);
+          (error) => {
             loading();
           }
         );
@@ -547,12 +506,11 @@
             this.onLoad(this.page);
             this.$message({
               type: "success",
-              message: "操作成功!"
+              message: "操作成功!",
             });
             done();
           },
-          error => {
-            window.console.log(error);
+          (error) => {
             loading();
           }
         );
@@ -561,7 +519,7 @@
         this.$confirm("确定将选择数据删除?", {
           confirmButtonText: "确定",
           cancelButtonText: "取消",
-          type: "warning"
+          type: "warning",
         })
           .then(() => {
             return remove(row.id);
@@ -570,16 +528,21 @@
             this.onLoad(this.page);
             this.$message({
               type: "success",
-              message: "操作成功!"
+              message: "操作成功!",
             });
           });
       },
       searchReset() {
-        this.activeClass = -1;
+        this.activeClass = 3;
+        //清空搜索框中的内容
         this.query = {};
+        //清空this.$route.query
+        this.$router.push({query: {}});
         this.onLoad(this.page);
       },
       searchChange(params, done) {
+        //清空this.$route.query
+        this.$router.push({query: {}});
         this.query = params;
         this.page.currentPage = 1;
         this.onLoad(this.page, params);
@@ -600,7 +563,7 @@
         this.$confirm("确定将选择数据删除?", {
           confirmButtonText: "确定",
           cancelButtonText: "取消",
-          type: "warning"
+          type: "warning",
         })
           .then(() => {
             return remove(this.ids);
@@ -609,14 +572,14 @@
             this.onLoad(this.page);
             this.$message({
               type: "success",
-              message: "操作成功!"
+              message: "操作成功!",
             });
             this.$refs.crud.toggleSelection();
           });
       },
       beforeOpen(done, type) {
         if (["edit", "view"].includes(type)) {
-          getclient(this.form.id).then(res => {
+          getclient(this.form.id).then((res) => {
             this.form = res.data.data;
           });
         }
@@ -634,25 +597,93 @@
       onLoad(page, params = {}) {
         const {releaseTimeRange} = this.query;
         let values = {
-          ...params
+          ...params,
         };
+
+        if (
+          this.$route.query.waringType &&
+          this.$route.query != undefined &&
+          this.$route.query != null &&
+          this.$route.query != ""
+        ) {
+          if (
+            this.$route.query.status != undefined &&
+            this.$route.query.status != null &&
+            this.$route.query.status == ""
+          ) {
+            this.activeClass = this.$route.query.status;
+            this.page.currentPage = 1;
+            if (this.$route.query.status == 0) {
+              params = {
+                waringType: this.$route.query.waringType,
+                beginTime: this.dateTime.day.beginTime,
+                endTime: this.dateTime.day.endTime,
+              };
+            } else if (this.$route.query.status == 1) {
+              params = {
+                waringType: this.$route.query.waringType,
+                beginTime: this.dateTime.week.beginTime,
+                endTime: this.dateTime.week.endTime,
+              };
+            } else if (this.$route.query.status == 2) {
+              params = {
+                waringType: this.$route.query.waringType,
+                beginTime: this.dateTime.month.beginTime,
+                endTime: this.dateTime.month.endTime,
+              };
+            }
+          } else {
+            this.activeClass = 0;
+            this.page.currentPage = 1;
+            params = {
+              waringType: this.$route.query.waringType,
+              beginTime: this.dateTime.day.beginTime,
+              endTime: this.dateTime.day.endTime,
+            };
+          }
+
+          if (
+            this.$route.query.startTime != undefined &&
+            this.$route.query.startTime != null &&
+            this.$route.query.startTime != ""
+          ) {
+            params = {
+              waringType: this.$route.query.waringType,
+              beginTime: this.$route.query.startTime,
+              endTime: this.$route.query.endTime,
+            };
+          }
+        }
+
         if (releaseTimeRange) {
           values = {
             ...params,
             beginTime: releaseTimeRange[0],
             endTime: releaseTimeRange[1],
-            ...this.query
+            ...this.query,
           };
           values.releaseTimeRange = null;
         } else {
           values = {
             ...params,
-            ...this.query
+            ...this.query,
           };
         }
+
+        if (this.$route.query.timeDesc) {
+          values = {
+            ...params,
+            timeDesc: this.$route.query.timeDesc,
+            ...this.query,
+          };
+        }
+
         this.loading = true;
-        getList(page.currentPage, page.pageSize, values).then(res => {
+        getList(page.currentPage, page.pageSize, values).then((res) => {
           const data = res.data.data;
+          data.records.forEach((item) => {
+            item.waringType == "紧急求救" ? (item.waringType = "一键求助") : "";
+          });
           this.page.total = data.total;
 
           data.records.sort((a, b) => {
@@ -660,6 +691,7 @@
           });
 
           this.data = data.records;
+
           this.loading = false;
           this.selectionClear();
         });
@@ -709,8 +741,27 @@
           currentData.getMinutes() < 10
             ? "0" + currentData.getMinutes()
             : currentData.getMinutes();
+        //秒
+        var currenS =
+          currentData.getSeconds() < 10
+            ? "0" + currentData.getSeconds()
+            : currentData.getSeconds();
 
         return {
+          day: {
+            beginTime: currentY + "-" + currentM + "-" + currentD + " 00:00:00",
+            endTime:
+              currentY +
+              "-" +
+              currentM +
+              "-" +
+              currentD +
+              " " +
+              currenH +
+              ":" +
+              currenM +
+              ":00",
+          },
           week: {
             beginTime: mondayY + "-" + mondayM + "-" + mondayD + " 00:00:00",
             endTime:
@@ -723,7 +774,7 @@
               currenH +
               ":" +
               currenM +
-              ":00"
+              ":00",
           },
           month: {
             beginTime: mondayY + "-" + mondayM + "-01 00:00:00",
@@ -737,15 +788,131 @@
               currenH +
               ":" +
               currenM +
-              ":00"
-          }
+              ":00",
+          },
+          current:
+            currentY +
+            "-" +
+            currentM +
+            "-" +
+            currentD +
+            " " +
+            currenH +
+            ":" +
+            currenM +
+            ":" +
+            currenS,
         };
+      },
+      getBRdata(e) {
+        this.activeClass = e;
+        this.query = {};
+        this.$router.push({query: {}});
+        var today = new Date();
+        var params = {};
+
+        if (e == 0) {
+          params = {
+            beginTime: this.showToDay(today) + " 00:00:00",
+            endTime: this.showToDay(today) + " 23:59:59",
+          };
+          //修改搜索框中的值
+          this.search.releaseTimeRange = [this.showToDay(today) + " 00:00:00", this.showToDay(today) + " 23:59:59"]
+        }
+        if (e == 1) {
+          params = {
+            beginTime: this.showWeekFirstDay(today) + " 00:00:00",
+            endTime: this.showToDay(today) + " 23:59:59",
+          };
+          //修改搜索框中的值
+          this.search.releaseTimeRange = [this.showWeekFirstDay(today) + " 00:00:00", this.showToDay(today) + " 23:59:59"]
+        }
+        if (e == 2) {
+          params = {
+            beginTime: this.showMonthFirstDay(today) + " 00:00:00",
+            endTime: this.showToDay(today) + " 23:59:59",
+          };
+          //修改搜索框中的值
+          this.search.releaseTimeRange = [this.showMonthFirstDay(today) + " 00:00:00", this.showToDay(today) + " 23:59:59"]
+        }
+        this.query = params;
+        this.page.currentPage = 1;
+        this.onLoad(this.page, params);
+      },
+
+      getswitchChartdate(e){
+        var params = {};
+        var today = new Date();
+        this.activeClass = e;
+        if (e == 0) {
+          params = {
+            beginTime: this.showToDay(today) + " 00:00:00",
+            endTime: this.showToDay(today) + " 23:59:59",
+          };
+        }
+        if (e == 1) {
+          params = {
+            beginTime: this.showWeekFirstDay(today) + " 00:00:00",
+            endTime: this.showToDay(today) + " 23:59:59",
+          };
+        }
+        if (e == 2) {
+          params = {
+            beginTime: this.showMonthFirstDay(today) + " 00:00:00",
+            endTime: this.showToDay(today) + " 23:59:59",
+          };
+        }
+
+        if (e == 3){
+          params = null;
+        }
+
+        this.getData(params);
+        this.getDataBs(params);
+
+      },
+
+      //本日
+      showToDay(Nowdate) {
+        var M = Number(Nowdate.getMonth()) + 1;
+        if (M < 10) {
+          M = "0" + M;
+        }
+        var day = Nowdate.getDate();
+        if (day < 10) {
+          day = "0" + day;
+        }
+        return Nowdate.getFullYear() + "-" + M + "-" + day;
+      },
+
+      //本周第一天
+      showWeekFirstDay(Nowdate) {
+        var WeekFirstDay = new Date(Nowdate - (Nowdate.getDay() - 1) * 86400000);
+        var M = Number(WeekFirstDay.getMonth()) + 1;
+        if (M < 10) {
+          M = "0" + M;
+        }
+        var day = WeekFirstDay.getDate();
+        if (day < 10) {
+          day = "0" + day;
+        }
+        return WeekFirstDay.getFullYear() + "-" + M + "-" + day;
+      },
+
+      //本月第一天
+      showMonthFirstDay(Nowdate) {
+        var MonthFirstDay = new Date(Nowdate.getFullYear(), Nowdate.getMonth(), 1);
+        var M = Number(MonthFirstDay.getMonth()) + 1;
+        if (M < 10) {
+          M = "0" + M;
+        }
+        return MonthFirstDay.getFullYear() + "-" + M + "-" + "0" + MonthFirstDay.getDate();
       },
       getBZdata(e) {
         this.activeClass = e;
         var params = {
           beginTime: this.dateTime.week.beginTime,
-          endTime: this.dateTime.week.endTime
+          endTime: this.dateTime.week.endTime,
         };
         this.query = params;
         this.page.currentPage = 1;
@@ -755,13 +922,14 @@
         this.activeClass = e;
         var params = {
           beginTime: this.dateTime.month.beginTime,
-          endTime: this.dateTime.month.endTime
+          endTime: this.dateTime.month.endTime,
         };
         this.query = params;
         this.page.currentPage = 1;
         this.onLoad(this.page, params);
       },
       getQBdata(e) {
+        this.search.releaseTimeRange = ["", ""];
         this.activeClass = e;
         var params = {};
         this.query = params;
@@ -769,31 +937,37 @@
         this.onLoad(this.page, params);
       },
       rowStyle({row, column, rowIndex}) {
-        if (row.jtype == "1") {
+        if (row.jtype == "0") {
           return {
-            color: "#15a2fe"
+            color: "#ff2727",
+          };
+        } else if (row.jtype == "1") {
+          return {
+            color: "#15a2fe",
           };
         } else {
           return {
-            color: "#ff2727"
+            color: "#000000",
           };
         }
       },
       handleStart(row) {
         var arr = [];
-        this.$store.state.tags.tagList.forEach(item => {
+        this.$store.state.tags.tagList.forEach((item) => {
           if (item.label != "视频") {
+            //海康分流
             arr.push(item);
           }
         });
         this.$store.state.tags.tagList = arr;
         this.$router.push({
-          path: `/real/video/${row.channelNumber}/${row.serialNumber}`
+          path: `/real/video/`,
+          query: row,
         });
       },
       handleHistory(row) {
         var arr = [];
-        this.$store.state.tags.tagList.forEach(item => {
+        this.$store.state.tags.tagList.forEach((item) => {
           if (item.label != "设备历史") {
             arr.push(item);
           }
@@ -805,90 +979,32 @@
         this.showMap = true;
         this.$nextTick(() => {
           this.$refs.mapDiv.onload = () => {
-            window.frames[0].init(null,{x: row.jd, y: row.wd});
+            window.frames[1].init("ClientManagement", {x: row.jd, y: row.wd, clientID: row.deviceNumber});
           };
-        })
+        });
+      },
+      getStartTime() {
+        if (
+          this.$route.query.startTime != undefined &&
+          this.$route.query.startTime != null &&
+          this.$route.query.startTime != ""
+        ) {
+          return this.$route.query.startTime;
+        }
+        return "";
+      },
+      getEndTime() {
+        if (
+          this.$route.query.endTime != undefined &&
+          this.$route.query.endTime != null &&
+          this.$route.query.endTime != ""
+        ) {
+          return this.$route.query.endTime;
+        }
+        return "";
       },
       handleManage(row) {
-        this.form = row;
-        this.dialogTableVisible = true;
-      },
-      generate(row) {
-        var that = this;
-        if (row.czTime == "" || row.czTime == null) {
-          this.$message({
-            message: "请选择处置时间",
-            type: "warning"
-          });
-        } else {
-          axios({
-            url:
-              "/api/blade-jfpts/jingdan/jingdan/submit",
-            method: "post",
-            data: {
-              rName: row.rname,
-              galarmPeople: row.galarmPeople,
-              phoneNumber: row.phoneNumber,
-              place: row.place,
-              content: row.content,
-              galarmTime: row.alarmTime,
-              waringType: row.waringType,
-              deviceNumber: row.deviceNumber,
-              type: "0",
-              handleP: null,
-              handleTime: null,
-              handName: null,
-              level: row.level,
-              coordinate: null,
-              jd: row.jd,
-              wd: row.wd,
-              addvcd: row.district,
-              czTime: row.czTime,
-              jjTime: row.jjTime,
-              bz: row.bz
-            }
-          })
-            .then(function (response) {
-              that.$message({
-                message: "生成警单成功",
-                type: "success"
-              });
-              that.updateJtyep(row);
-              that.dialogTableVisible = false;
-              that.$router.push({ path: "/distribution/index", query: row });
-
-            })
-            .catch(function (error) {
-              that.dialogTableVisible = false;
-            });
-        }
-      },
-      revoke(row) {
-        var that = this;
-        axios({
-          url:
-            "/api/blade-jfpts/alarm/alarm/deletejj?id=" +
-            row.id,
-          method: "post"
-        }).then(function () {
-          that.dialogTableVisible = false;
-          that.onLoad(that.page, that.query);
-        });
-      },
-      updateJtyep(row) {
-        var that = this;
-        axios({
-          url:
-            "/api/blade-jfpts/alarm/alarm/updateJtype?id=" +
-            row.id +
-            "&czTime=" +
-            row.czTime +
-            "&bz=" +
-            row.bz,
-          method: "post"
-        }).then(function () {
-          that.onLoad(that.page, that.query);
-        });
+        this.$refs.realPopupView.onItemGetParentData(row);
       },
 
       beginTimeOrEndTime(time) {
@@ -947,177 +1063,248 @@
             : endTime.getSeconds();
         return {
           begin: beginY + beginM + beginD + beginH + beginm + begins,
-          end: endY + endM + endD + endH + endm + ends
+          end: endY + endM + endD + endH + endm + ends,
         };
       },
-      queryOldVideo(data) {
-        var newAxios = axios.create({
-          baseURL: "http://36.134.81.48:18000",
-          withCredentials: false,
-          headers: {
-            "Content-type": "application/x-www-form-urlencoded"
-          }
+
+      PoliceTracking(row) {
+        //警情追踪
+        this.$router.push({path: "/policeTracking/track", query: row});
+      },
+
+      //数据导出
+      handleExport() {
+        this.$confirm("是否导出实时警情数据?", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }).then(() => {
+          window.open(
+            `/api/blade-jfpts/alarm/alarm/export-alarm?beginTime=${this.$route.query.startTime}&endTime=${this.$route.query.endTime}&waringType=${this.$route.query.waringType}&timeDesc=${this.$route.query.timeDesc}`
+          );
         });
-
-        var time = this.beginTimeOrEndTime(data.alarmTime);
-
-        newAxios
-          .post(
-            "/api_control",
-            {},
+      },
+      //数据报表导出
+      handleExportStatis() {
+        let beginTime =
+          this.$route.query.startTime == undefined
+            ? ""
+            : this.$route.query.startTime;
+        let endTime =
+          this.$route.query.endTime == undefined ? "" : this.$route.query.endTime;
+        let waringType =
+          this.$route.query.waringType == undefined
+            ? ""
+            : this.$route.query.waringType;
+        let timeDesc =
+          this.$route.query.timeDesc == undefined
+            ? ""
+            : this.$route.query.timeDesc;
+        window.open(
+          `https://web.byisf.com/api/blade-report/ureport/preview?_u=blade-alarm.statis.ureport.xml&beginTime=${beginTime}&endTime=${endTime}&waringType=${waringType}&timeDesc=${timeDesc}`
+        );
+        //window.open(`http://localhost:8108/ureport/excel?_u=blade-alarm.statis.ureport.xml&beginTime=${beginTime}&endTime=${endTime}&waringType=${waringType}&timeDesc=${timeDesc}`);
+      }
+    , switchChart() {
+      var that = this;
+      //图表切换
+      if (this.switchChartType == 1) {
+        this.switchChartType = 0;
+      } else {
+        this.switchChartType = 1;
+        setTimeout(function () {
+          that.getData(null);
+          that.getDataBs(null);
+        }, 0);
+      }
+    }, getData(data) {
+      var that = this;
+      getChartData(data).then(res => {
+        var data = res.data.data;
+        var sum  = 0;
+        for (let i = 0; i < data.length; i++) {
+          sum += data[i].value;
+        }
+        var option = {
+          title: [
             {
-              params: {
-                param: JSON.stringify({PktType: "GetAccessToken"})
-              }
-            }
-          )
-          .then(res => {
-            newAxios
-              .get(
-                `/GetPlayUrl?deviceCode=${data.channelNumber}&chl=${data.serialNumber}`
-              )
-              .then(result => {
-                this.innerVisibleVideo = true;
-
-                this.videoSource = result.data.data.m3u8;
-              });
-
-            //   newAxios
-            //     .post(
-            //       "/api_control",
-            //       {},
-            //       {
-            //         params: {
-            //           param: JSON.stringify({
-            //             PktType: "RemotePlayback",
-            //             accessToken: res.data.data.accessToken,
-            //             deviceCode: "001231409472",
-            //             startTime: "20210130150000",
-            //             endTime: "20210130160000",
-            //             chl: data.serialNumber
-            //           })
-            //         }
-            //       }
-            //     )
-            //     .then(result => {
-
-            //       this.innerVisibleVideo = true;
-
-            //       this.videoSource = result.data.data.m3u8;
-
-            //     });
-          });
-      },
-      openOldVideoBox() {
-        if (Hls.isSupported()) {
-          var dom = document.getElementById("old_video");
-
-          // if (dom.volume) dom.volume = 1.0;
-
-          this.hls = new Hls();
-
-          var m3u8Url = decodeURIComponent(this.videoSource);
-
-          this.hls.loadSource(m3u8Url);
-
-          this.hls.attachMedia(dom);
-
-          this.hls.on(Hls.Events.MANIFEST_PARSED, function () {
-            dom.play();
-          });
-        }
-      },
-      closeOldVideoBox() {
-        var dom = document.getElementById("old_video");
-
-        if (dom.getAttribute("src") != "") {
-          dom.pause();
-
-          dom.setAttribute("src", "");
-
-          this.hls.destroy();
-        }
-      },
-      aKeyToCall(e, form) {
-        var newCallAxios = axios.create({
-          baseURL: "http://36.134.81.48:18000",
-          withCredentials: false,
-          headers: {
-            "Content-Type": "application/json;"
-          }
-        });
-
-        // 一键呼叫相关函数
-        if (this.isActive == true) {
-          this.isActive = false;
-
-          newCallAxios
-            .post(
-              `/api_control`,
-              {},
-              {
-                params: {
-                  param: {PktType: "GetAccessToken"}
+              text: sum,
+              subtext: "警情总数",
+              textStyle: {
+                fontSize: 36,
+                fontWeight: "normal",
+                color: "#393939",
+              },
+              subtextStyle: {
+                fontSize: 16,
+                color: "#434343",
+              },
+              textAlign: "center",
+              x: "49%",
+              y: "39%",
+            },
+          ],
+          color:['#ff5127','#ffc666',  '#5380f5'],
+          tooltip: {
+            trigger: 'item'
+          },
+          legend: {
+            orient: 'vertical',
+            left: 'right',
+          },
+          series: [
+            {
+              name: '警情状态',
+              type: "pie",
+              radius: ["46%", "66%"],
+              data: data,
+              label: {
+                normal: {
+                  show: false,
+                },
+              },
+              emphasis: {
+                itemStyle: {
+                  shadowBlur: 10,
+                  shadowOffsetX: 0,
+                  shadowColor: 'rgba(0, 0, 0, 0.5)'
                 }
               }
-            )
-            .then(result => {
-              var formData = new FormData();
-              var blob = this.recorder.getPCMBlob(); //获取pcm格式音频数据
-              //此处获取到blob对象后需要设置fileName满足当前项目上传需求,其它项目可直接传把blob作为file塞入formData
-              var newbolb = new Blob([blob], {type: "audio/pcm"});
-              var fileOfBlob = new File([newbolb], new Date().getTime() + ".pcm");
-              formData.append("file", fileOfBlob);
-
-              document
-                .getElementById("real_audio")
-                .setAttribute("src", URL.createObjectURL(blob));
-
-              console.log(
-                blob,
-                newbolb,
-                fileOfBlob,
-                window.URL.createObjectURL(blob),
-                99999
-              );
-
-              this.recorder.play();
-
-              newCallAxios
-                .post(`/api_control`, blob, {
-                  params: {
-                    param: {
-                      PktType: "Talk",
-                      accessToken: result.data.data.accessToken,
-                      deviceCode: form.channelNumber
-                    }
+            }
+          ]
+        };
+        // let echarts = require('echarts');
+        let myChart = that.$echarts.init(document.getElementById('alarmTypeProEcharts'));
+        myChart.setOption(option);
+      });
+    },
+      getDataBs(data) {
+        var that = this;
+        getChartDataBs(data).then(res => {
+          var data = res.data.data;
+          var sum  = 0;
+          for (let i = 0; i < data.length; i++) {
+            sum += data[i].value;
+          }
+          var option = {
+            title: {
+              text: '警情严重程度',
+              left: 'center'
+            },
+            color:['#F48F57','#59b5f6',  '#F34A4A'],
+            tooltip: {
+              trigger: 'item'
+            },
+            legend: {
+              orient: 'vertical',
+              left: 'right',
+            },
+            series: [
+              {
+                name: '严重程度',
+                type: "pie",
+                radius: ['65%'],
+                data: data,
+                label: {
+                  normal: {
+                    show: false,
+                  },
+                },
+                emphasis: {
+                  itemStyle: {
+                    shadowBlur: 10,
+                    shadowOffsetX: 0,
+                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                   }
-                })
-                .then(result => {
-                });
-            });
-        } else {
-          this.isActive = true;
-
-          Recorder.getPermission().then(() => {
-            this.recorder.start().then(() => {
-              // 开始录音
-            });
-          });
-        }
-      }
-    }
+                }
+              }
+            ]
+          };
+          // let echarts = require('echarts');
+          let myChart = that.$echarts.init(document.getElementById('alarmEcharts'));
+          myChart.setOption(option);
+        });
+      },
+    },
   };
 </script>
 
 <style>
-  .cityClass1 {
-    padding-right: 5px !important;
+  #alarmEcharts {
+    width: 30%;
+    height: 450px;
+    position: relative;
+    left: 20%;
   }
 
-  .cityClass2 {
+  .el-card__body .waringTypeClass {
+    width: 12%;
+  }
+
+  .cityreal2 div label,
+  .cityreal3 div label {
+    display: none;
+  }
+
+  /*页面样式*/
+  .el-card__body .cityreal1 {
+    width: 150px;
+    padding-right: 0px !important;
+  }
+
+  .el-card__body .cityreal2 {
+    width: 100px;
+    padding-left: 10px !important;
+    padding-right: 0px !important;
+  }
+
+  .el-card__body .cityreal3 {
+    width: 100px;
+    padding-left: 10px !important;
+    padding-right: 0px !important;
+  }
+
+  /*新增窗体样式*/
+  .el-dialog .cityreal1 {
+    width: 216px;
+    padding-right: 0px !important;
+  }
+
+  .el-dialog .cityreal2 {
+    width: 130px;
+    padding-left: 10px !important;
+    padding-right: 10px !important;
+  }
+
+  .el-dialog .cityreal3 {
+    width: 105px;
     padding-left: 0px !important;
     padding-right: 0px !important;
+  }
+
+  .cityClassParams .avue-form__group.avue-form__group--flex {
+    display: flex;
+    justify-content: space-between;
+  }
+
+  .cityClassParams .cityClassSelect {
+    flex: 1;
+    margin: 0 !important;
+    padding-left: 0px !important;
+    padding-right: 0px !important;
+  }
+
+  .cityClassParams .cityClassSelect:nth-child(2) {
+    margin: 0 10px !important;
+  }
+
+  .cityClassParams .cityClassSelect .el-form-item {
+    margin-bottom: 0px !important;
+  }
+
+  .cityClassParams .cityClassSelect .el-form-item .el-input__inner {
+    height: 28px !important;
+    line-height: 28px !important;
   }
 
   .cityClass2 div label {
@@ -1126,10 +1313,6 @@
 
   .cityClass3 div label {
     display: none;
-  }
-
-  .cityClass3 {
-    padding-left: 5px !important;
   }
 
   .old-video-dialog {
@@ -1159,14 +1342,23 @@
     box-sizing: border-box;
   }
 
-  .el-button.active {
-    background: #ff0000;
-  }
-
   .el-button.btn-color {
     color: rgb(255, 255, 255);
     background-color: rgb(64, 158, 255);
     border-color: rgb(64, 158, 255);
   }
 
+  .tabFontSize {
+    font-size: 15px;
+  }
+
+  .alarmTypeEcharts{
+    display: flex;
+    background-color: #ffffff;
+    width: 98.6%;
+    height: 450px;
+    position: relative;
+    left: 0.8%;
+    top: 9.5%;
+  }
 </style>

--
Gitblit v1.9.3