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 | 2553 +++++++++++++++++++++++++++-------------------------------
 1 files changed, 1,185 insertions(+), 1,368 deletions(-)

diff --git a/src/views/realTimePolice/real.vue b/src/views/realTimePolice/real.vue
index 3b88a0f..01519de 100644
--- a/src/views/realTimePolice/real.vue
+++ b/src/views/realTimePolice/real.vue
@@ -1,9 +1,3 @@
-/*
- * @Author: Morpheus
- * @Date: 2021-03-17 15:21:33
- * @Last Modified by: Morpheus
- * @Last Modified time: 2021-04-09 09:59:32
- */
 <template>
   <basic-container>
     <avue-crud
@@ -19,6 +13,7 @@
       @row-save="rowSave"
       :before-open="beforeOpen"
       :row-style="rowStyle"
+      :search.sync="search"
       row-class-name="tabFontSize"
       @search-change="searchChange"
       @search-reset="searchReset"
@@ -27,6 +22,7 @@
       @size-change="sizeChange"
       @refresh-change="refreshChange"
       @on-load="onLoad"
+      v-show="switchChartType == 0"
     >
       <template slot="menuLeft">
         <el-button
@@ -37,7 +33,7 @@
           plain
           v-if="permission.real_delete"
           @click="handleDelete"
-          >删 除
+        >删 除
         </el-button>
       </template>
 
@@ -46,42 +42,72 @@
           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="getBZdata(1)"
-          >本周
+          @click="getBRdata(1)"
+        >本周
         </el-button>
         <el-button
           v-bind:class="activeClass == 2 ? 'btn-color' : ''"
           size="mini"
-          @click="getBYdata(2)"
-          >本月
+          @click="getBRdata(2)"
+        >本月
         </el-button>
         <el-button
           v-bind:class="activeClass == 3 ? 'btn-color' : ''"
           size="mini"
           @click="getQBdata(3)"
-          >全部
+        >全部
         </el-button>
-        <span>
-          <Legend :datas="datalistLIU"></Legend>
-        </span>
+      </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" ? "处理中" : "已处理"
+        >{{
+          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" ? "是" : "事件恢复"
+        >{{
+          row.cid == "1" ? "事件发生" : row.cid == "3" ? "是" : "事件恢复"
           }}
         </el-tag>
       </template>
@@ -92,14 +118,14 @@
           :size="size"
           :type="type"
           @click.stop="handleHistory(row)"
-          >历史
+        >历史
         </el-button>
         <el-button
           icon="el-icon-video-camera-solid"
           :size="size"
           :type="type"
           @click.stop="handleStart(row)"
-          >视频
+        >视频
         </el-button>
         <el-button
           v-if="row.jtype == 0 || row.jtype == ''"
@@ -107,7 +133,7 @@
           :size="size"
           :type="type"
           @click.stop="handleManage(row)"
-          >核实
+        >核实
         </el-button>
         <el-button
           v-if="row.jtype != 0 && row.jtype != ''"
@@ -115,279 +141,55 @@
           :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>
       </template>
     </avue-crud>
 
-    <el-dialog
-      class="real-dialog"
-      title="警情核实"
-      :visible.sync="dialogTableVisible"
-      :append-to-body="true"
-      :close-on-click-modal="false"
-      @opened="realOpenVideoDialog"
-      @close="(videoConversationReal = false), (oldVideoSatart = false)"
-    >
-      <el-dialog
-        class="ss-video-dialog"
-        :modal="false"
-        width="100%"
-        title="视频通话"
-        :visible.sync="videoConversationReal"
-        :close-on-press-escape="false"
-        append-to-body
-        @opened="openRealVideoBox"
-        @close="closeRealVideoBox"
-      >
-        <video
-          src=""
-          id="real_video_conversation"
-          style="width: 100%; height: 100%; object-fit: fill"
-          controls
-        ></video>
-      </el-dialog>
-
-      <el-dialog
-        class="ss-video-dialog"
-        :modal="false"
-        width="100%"
-        title="历史回放"
-        :visible.sync="oldVideoSatart"
-        :close-on-press-escape="false"
-        append-to-body
-        @opened="openOldVideoBox"
-        @close="closeOldVideoBox"
-      >
-        <video
-          src="/oldVideo/ft.mp4"
-          muted="muted"
-          autoplay="autoplay"
-          loop
-          id="real_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">
-            <audio src="" id="real_audio"></audio>
-            <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.phoneNumber"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="负责人">
-              <el-select
-                v-model="peopleName"
-                placeholder="请选择"
-                @change="peopleOrPhone"
-                style="width: 100%"
-              >
-                <el-option
-                  v-for="item in peopleList"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.label"
-                >
-                </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="负责人电话">
-              <el-input
-                disabled="true"
-                v-model="peoplePhone"
-                autocomplete="off"
-                style="width: calc(100% - 110px)"
-              ></el-input>
-              <el-button
-                type="success"
-                style="
-                  margin-left: 10px;
-                  padding: 0px 8px;
-                  width: 100px;
-                  height: 28px;
-                  vertical-align: top;
-                "
-              >
-                <i class="el-icon-phone-outline"></i>
-                联系负责人
-              </el-button>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="省份" class="cityClassParams">
-              <avue-form :option="itemOption" v-model="form"></avue-form>
-            </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.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.jjTime"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col> -->
-          <el-col span="12">
-            <el-form-item label="报警内容">
-              <el-input
-                disabled="true"
-                v-model="form.content"
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-        </el-row>
+        @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-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
-                :class="{ active: isActive }"
-                type="success"
-                @click.stop="
-                  (videoConversationReal = true), (oldVideoSatart = false)
-                "
-                @mousedown.native="aKeyToCall"
-                @mouseup.native="aKeyStopCall"
-                >视频通话
-              </el-button>
-              <el-button
-                v-show="false"
-                type="primary"
-                @click.stop="
-                  (oldVideoSatart = true), (videoConversationReal = false)
-                "
-                >查看历史
-              </el-button>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row>
-          <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 class="opt-btn">
-            <el-form-item>
-              <!-- <el-button
-                :class="{ active: isActive }"
-                type="success"
-                @click.stop="aKeyToCall($event, form)"
-                >查看视频
-              </el-button> -->
-              <el-button
-                type="success"
-                @click.stop="updateJtyep(form, 1, '办结')"
-                >办结
-              </el-button>
-
-              <img
-                src="/img/police-num.png"
-                style="margin-top: -20px; height: 80px; vertical-align: middle"
-                alt=""
-                @click.stop="updateJtyep(form, 1, '推送110')"
-              />
-
-              <el-button
-                type="primary"
-                @click.stop="updateJtyep(form, 1, '派送保安')"
-                >派送保安
-              </el-button>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-    </el-dialog>
-
+    <real-popup ref="realPopupView"></real-popup>
     <el-drawer title="电子地图" append-to-body="true" :visible.sync="showMap">
       <iframe
         id="mapDiv"
@@ -402,1146 +204,1161 @@
 </template>
 
 <script>
-import { getList, remove, update, add, getclient } from "@/api/real/real";
-import { mapGetters } from "vuex";
+  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";
-
-import Legend from '../../components/liu-legend/Legend'
-
-export default {
-  components:{
-      Legend,
-    },
-  data() {
-    return {
-      //legend-liu数据
-      datalistLIU:[
-                {
-                    color: 'rgb(233, 39, 25)',
-                    text: '未处理'
-                },
-                {
-                    color: 'rgb(17, 198, 253)',
-                    text: '处理中'
-                },
-                {
-                    color: 'black',
-                    text: '已处理'
-                }
-            ],
-
-      showMap: false,
-      hls: "",
-      videoSource: "",
-      dialogTableVisible: false,
-      videoConversationReal: false,
-      oldVideoSatart: false,
-      activeClass: 3,
-      form: {},
-      query: {},
-      dateTime: [],
-      loading: true,
-      page: {
-        pageSize: 10,
-        currentPage: 1,
-        total: 0,
-      },
-      selectionList: [],
-      option: {
-        height: "auto",
-        indexLabel: "序号",
-        calcHeight: 30,
-        labelWidth: "100",
-        size: "mini",
-        border: false,
-        stripe: true,
-        menuWidth: 240,
-        dialogWidth: 950,
-        tip: false,
-        searchShow: true,
-        searchMenuSpan: 3,
-        align: "center",
-        index: true,
-        viewBtn: true,
-        selection: true,
-        dialogClickModal: false,
-        column: [
-          {
-            label: "警情类型",
-            prop: "waringType",
-            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: 160,
-            format: "yyyy-MM-dd HH:mm:ss",
-            valueFormat: "yyyy-MM-dd HH:mm:ss",
-            prop: "alarmTime",
-          },
-          {
-            label: "报警时间",
-            prop: "releaseTimeRange",
-            type: "datetime",
-            format: "yyyy-MM-dd",
-            valueFormat: "yyyy-MM-dd",
-            searchRange: true,
-            searchSpan: 5,
-            hide: true,
-            addDisplay: false,
-            editDisplay: false,
-            viewDisplay: false,
-            search: true,
-            rules: [
-              {
-                required: true,
-                message: "请输入时间",
-                trigger: "blur",
-              },
-            ],
-          },
-          {
-            label: "主要负责人",
-            prop: "oneContacts",
-            width: 90,
-          },
-          {
-            label: "负责人电话",
-            prop: "onePhone",
-            width: 110,
-          },
-          {
-            label: "报警人",
-            prop: "galarmPeople",
-            width: 90,
-          },
-          {
-            label: "报警人电话",
-            prop: "phoneNumber",
-            width: 130,
-          },
-          {
-            label: "事发地址",
-            prop: "place",
-          },
-          {
-            label: "设备编号",
-            search: true,
-            searchSpan: 3,
-            width: 130,
-            prop: "deviceNumber",
-          },
-          {
-            label: "警情状态",
-            searchSpan: 3,
-            width: 96,
-            search: true,
-            slot: true,
-            searchPlaceholder: "请选择",
-            prop: "jtype",
-            type: "select",
-            dicData: [
-              {
-                label: "未处理",
-                value: "0",
-              },
-              {
-                label: "处理中",
-                value: "1",
-              },
-              {
-                label: "已处理",
-                value: "2",
-              },
-            ],
-          },
-          {
-            label: "省份",
-            prop: "province",
-            search: true,
-            searchSpan: 2,
-            searchLabelWidth: 45,
-            placeholder: "省份",
-            type: "select",
-            props: {
-              label: "name",
-              value: "code",
-            },
-            cascaderItem: ["city", "district"],
-            dicUrl: "/api/blade-system/region/select",
-            span: 6,
-            className: "cityClass1",
-            hide: true,
-            addDisplay: true,
-            editDisplay: true,
-            viewDisplay: true,
-          },
-          {
-            label: "地市",
-            prop: "city",
-            type: "select",
-            searchPlaceholder: "地市",
-            placeholder: "地市",
-            searchLabelWidth: 1,
-            searchSpan: 2,
-            search: true,
-            props: {
-              label: "name",
-              value: "code",
-            },
-            dicUrl: "/api/blade-system/region/select?code={{key}}",
-            span: 3,
-            labelWidth: "0",
-            className: "cityClass2",
-            hide: true,
-            addDisplay: true,
-            editDisplay: true,
-            viewDisplay: true,
-          },
-          {
-            label: "区县",
-            searchSpan: 2,
-            searchLabelWidth: 1,
-            searchPlaceholder: "区县",
-            placeholder: "区县",
-            search: true,
-            prop: "district",
-            type: "select",
-            props: {
-              label: "name",
-              value: "code",
-            },
-            dicUrl: "/api/blade-system/region/select?code={{key}}",
-            span: 3,
-            labelWidth: "0",
-            className: "cityClass3",
-            hide: true,
-            addDisplay: true,
-            editDisplay: true,
-            viewDisplay: true,
-          },
-          {
-            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,
-          },
-        ],
-      },
-      itemOption: {
-        menuBtn: false,
-        column: [
-          {
-            disabled: true,
-            row: false,
-            prop: "province",
-            type: "select",
-            placeholder: "省份",
-            props: {
-              label: "name",
-              value: "code",
-            },
-            cascaderItem: ["city", "district"],
-            dicUrl: "/api/blade-system/region/select",
-            span: 1,
-            labelWidth: "0",
-            className: "cityClassSelect",
-          },
-          {
-            disabled: true,
-            row: false,
-            prop: "city",
-            type: "select",
-            placeholder: "地市",
-            props: {
-              label: "name",
-              value: "code",
-            },
-            dicUrl: "/api/blade-system/region/select?code={{key}}",
-            span: 1,
-            labelWidth: "0",
-            className: "cityClassSelect",
-          },
-          {
-            disabled: true,
-            row: false,
-            prop: "district",
-            type: "select",
-            placeholder: "区县",
-            props: {
-              label: "name",
-              value: "code",
-            },
-            dicUrl: "/api/blade-system/region/select?code={{key}}",
-            span: 1,
-            labelWidth: "0",
-            className: "cityClassSelect",
-          },
-        ],
-      },
-      data: [],
-      isActive: false,
-      recorder: null,
-      peopleList: [],
-      peopleName: "",
-      peoplePhone: "",
-    };
-  },
-  computed: {
-    ...mapGetters(["permission", "flowRoutes"]),
-    permissionList() {
+  export default {
+    data() {
       return {
-        addBtn: this.vaildData(this.permission.real_add, false),
-        viewBtn: this.vaildData(null, false),
-        delBtn: this.vaildData(null, false),
-        editBtn: this.vaildData(null, false),
-      };
-    },
-    ids() {
-      let ids = [];
-      this.selectionList.forEach((ele) => {
-        ids.push(ele.id);
-      });
-      return ids.join(",");
-    },
-  },
-  created() {
-    this.dateTime = this.getDate();
-  },
-  methods: {
-    rowSave(row, done, loading) {
-      add(row).then(
-        () => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!",
-          });
-          done();
+        showMap: false,
+        hls: "",
+        videoSource: "",
+        activeClass: 3,
+        switchChartType: "0",
+        form: {},
+        query: {},
+        search: {},
+        dateTime: [],
+        loading: true,
+        page: {
+          pageSize: 10,
+          currentPage: 1,
+          total: 0,
         },
-        (error) => {
-          loading();
-        }
-      );
-    },
-    rowUpdate(row, index, done, loading) {
-      row.coordinate = "";
-      update(row).then(
-        () => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!",
-          });
-          done();
-        },
-        (error) => {
-          loading();
-        }
-      );
-    },
-    rowDel(row) {
-      this.$confirm("确定将选择数据删除?", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(() => {
-          return remove(row.id);
-        })
-        .then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!",
-          });
-        });
-    },
-    searchReset() {
-      this.activeClass = 3;
-      this.query = {};
-      this.onLoad(this.page);
-    },
-    searchChange(params, done) {
-      this.query = params;
-      this.page.currentPage = 1;
-      this.onLoad(this.page, params);
-      done();
-    },
-    selectionChange(list) {
-      this.selectionList = list;
-    },
-    selectionClear() {
-      this.selectionList = [];
-      this.$refs.crud.toggleSelection();
-    },
-    handleDelete() {
-      if (this.selectionList.length === 0) {
-        this.$message.warning("请选择至少一条数据");
-        return;
-      }
-      this.$confirm("确定将选择数据删除?", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(() => {
-          return remove(this.ids);
-        })
-        .then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!",
-          });
-          this.$refs.crud.toggleSelection();
-        });
-    },
-    beforeOpen(done, type) {
-      if (["edit", "view"].includes(type)) {
-        getclient(this.form.id).then((res) => {
-          this.form = res.data.data;
-        });
-      }
-      done();
-    },
-    currentChange(currentPage) {
-      this.page.currentPage = currentPage;
-    },
-    sizeChange(pageSize) {
-      this.page.pageSize = pageSize;
-    },
-    refreshChange() {
-      this.onLoad(this.page, this.query);
-    },
-    onLoad(page, params = {}) {
-      const { releaseTimeRange } = this.query;
-      let values = {
-        ...params,
-      };
+        selectionList: [],
+        option: {
+          height: "auto",
+          indexLabel: "序号",
+          calcHeight: 54,
+          labelWidth: "100",
+          size: "mini",
+          border: false,
+          stripe: true,
+          menuWidth: 240,
+          dialogWidth: 950,
+          tip: false,
+          searchShow: true,
+          searchMenuSpan: 3,
+          align: "center",
+          index: true,
+          viewBtn: true,
+          selection: true,
+          dialogClickModal: false,
+          column: [
+            {
+              label: "警情类型",
+              prop: "waringType",
+              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: 160,
+              format: "yyyy-MM-dd HH:mm:ss",
+              valueFormat: "yyyy-MM-dd HH:mm:ss",
+              prop: "alarmTime",
+            },
+            {
+              label: "报警时间",
+              prop: "releaseTimeRange",
+              type: "datetime",
+              format: "yyyy-MM-dd",
+              valueFormat: "yyyy-MM-dd",
+              searchValue: [this.getStartTime(), this.getEndTime()],
+              searchRange: true,
+              searchSpan: 5,
+              hide: true,
+              addDisplay: false,
+              editDisplay: false,
+              viewDisplay: false,
+              search: true,
+              rules: [
+                {
+                  required: true,
+                  message: "请输入时间",
+                  trigger: "blur",
+                },
+              ],
+            },
+            {
+              label: "主要负责人",
+              prop: "oneContacts",
+              width: 90,
+            },
+            {
+              label: "负责人电话",
+              prop: "onePhone",
+              width: 110,
+            },
+            {
+              label: "报警人",
+              prop: "galarmPeople",
+              width: 90,
+            },
+            {
+              label: "报警人电话",
+              prop: "phoneNumber",
+              width: 130,
+            },
+            {
+              label: "事发地址",
+              prop: "place",
+            },
+            {
+              label: "设备编号",
+              search: true,
+              searchSpan: 3,
+              width: 130,
+              prop: "deviceNumber",
+            },
+            {
+              label: "警情状态",
+              searchSpan: 3,
+              width: 96,
+              search: true,
+              slot: true,
+              searchPlaceholder: "请选择",
+              prop: "jtype",
+              type: "select",
+              dicData: [
+                {
+                  label: "未处理",
+                  value: "0",
+                },
+                {
+                  label: "处理中",
+                  value: "1",
+                },
+                {
+                  label: "已处理",
+                  value: "2",
+                },
+              ],
+            },
+            {
+              label: "省份",
+              prop: "province",
+              search: true,
+              searchSpan: 2,
+              searchLabelWidth: 45,
+              placeholder: "省份",
+              type: "select",
+              props: {
+                label: "name",
+                value: "code",
+              },
+              cascaderItem: ["city", "district"],
+              dicUrl: "/api/blade-system/region/select",
+              span: 6,
+              className: "cityreal1",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
+            },
+            {
+              label: "地市",
+              prop: "city",
+              type: "select",
+              searchPlaceholder: "地市",
+              placeholder: "地市",
+              searchLabelWidth: 1,
+              searchSpan: 2,
+              search: true,
+              props: {
+                label: "name",
+                value: "code",
+              },
+              dicUrl: "/api/blade-system/region/select?code={{key}}",
+              span: 3,
+              labelWidth: "0",
+              className: "cityreal2",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
+            },
+            {
+              label: "区县",
+              searchSpan: 2,
+              searchLabelWidth: 1,
+              searchPlaceholder: "区县",
+              placeholder: "区县",
+              search: true,
+              prop: "district",
+              type: "select",
+              props: {
+                label: "name",
+                value: "code",
+              },
+              dicUrl: "/api/blade-system/region/select?code={{key}}",
+              span: 3,
+              labelWidth: "0",
+              className: "cityreal3",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
+            },
 
-      if (
-        this.$route.query.waringType &&
-        this.$route.query != undefined &&
-        this.$route.query != null &&
-        this.$route.query != ""
-      ) {
+            {
+              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: [],
+        recorder: null,
+        peopleList: [],
+      };
+    },
+    computed: {
+      ...mapGetters(["permission", "flowRoutes"]),
+      permissionList() {
+        return {
+          addBtn: this.vaildData(this.permission.real_add, false),
+          viewBtn: this.vaildData(null, false),
+          delBtn: this.vaildData(null, false),
+          editBtn: this.vaildData(null, false),
+        };
+      },
+      ids() {
+        let ids = [];
+        this.selectionList.forEach((ele) => {
+          ids.push(ele.id);
+        });
+        return ids.join(",");
+      },
+    },
+    created() {
+      this.dateTime = this.getDate();
+    },
+    methods: {
+      rowSave(row, done, loading) {
+        add(row).then(
+          () => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!",
+            });
+            done();
+          },
+          (error) => {
+            loading();
+          }
+        );
+      },
+      rowUpdate(row, index, done, loading) {
+        row.coordinate = "";
+        update(row).then(
+          () => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!",
+            });
+            done();
+          },
+          (error) => {
+            loading();
+          }
+        );
+      },
+      rowDel(row) {
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(() => {
+            return remove(row.id);
+          })
+          .then(() => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!",
+            });
+          });
+      },
+      searchReset() {
+        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);
+        done();
+      },
+      selectionChange(list) {
+        this.selectionList = list;
+      },
+      selectionClear() {
+        this.selectionList = [];
+        this.$refs.crud.toggleSelection();
+      },
+      handleDelete() {
+        if (this.selectionList.length === 0) {
+          this.$message.warning("请选择至少一条数据");
+          return;
+        }
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(() => {
+            return remove(this.ids);
+          })
+          .then(() => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!",
+            });
+            this.$refs.crud.toggleSelection();
+          });
+      },
+      beforeOpen(done, type) {
+        if (["edit", "view"].includes(type)) {
+          getclient(this.form.id).then((res) => {
+            this.form = res.data.data;
+          });
+        }
+        done();
+      },
+      currentChange(currentPage) {
+        this.page.currentPage = currentPage;
+      },
+      sizeChange(pageSize) {
+        this.page.pageSize = pageSize;
+      },
+      refreshChange() {
+        this.onLoad(this.page, this.query);
+      },
+      onLoad(page, params = {}) {
+        const {releaseTimeRange} = this.query;
+        let values = {
+          ...params,
+        };
+
         if (
-          this.$route.query.status != undefined &&
-          this.$route.query.status != null &&
-          this.$route.query.status == ""
+          this.$route.query.waringType &&
+          this.$route.query != undefined &&
+          this.$route.query != null &&
+          this.$route.query != ""
         ) {
-          this.activeClass = this.$route.query.status;
-          this.page.currentPage = 1;
-          if (this.$route.query.status == 0) {
+          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,
             };
-          } else if (this.$route.query.status == 1) {
+          }
+
+          if (
+            this.$route.query.startTime != undefined &&
+            this.$route.query.startTime != null &&
+            this.$route.query.startTime != ""
+          ) {
             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,
+              beginTime: this.$route.query.startTime,
+              endTime: this.$route.query.endTime,
             };
           }
+        }
+
+        if (releaseTimeRange) {
+          values = {
+            ...params,
+            beginTime: releaseTimeRange[0],
+            endTime: releaseTimeRange[1],
+            ...this.query,
+          };
+          values.releaseTimeRange = null;
         } else {
-          this.activeClass = 0;
-          this.page.currentPage = 1;
-          params = {
-            waringType: this.$route.query.waringType,
-            beginTime: this.dateTime.day.beginTime,
-            endTime: this.dateTime.day.endTime,
+          values = {
+            ...params,
+            ...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) => {
+          const data = res.data.data;
+          data.records.forEach((item) => {
+            item.waringType == "紧急求救" ? (item.waringType = "一键求助") : "";
+          });
+          this.page.total = data.total;
+
+          data.records.sort((a, b) => {
+            return a.jtype - b.jtype;
+          });
+
+          this.data = data.records;
+
+          this.loading = false;
+          this.selectionClear();
+        });
+      },
+      getDate() {
+        // 当前时间
+        var timestamp = Date.parse(new Date());
+        var serverDate = new Date(timestamp);
+
+        // 本周周一的时间
+        var mondayTime =
+          timestamp - (serverDate.getDay() - 1) * 24 * 60 * 60 * 1000;
+        var mondayData = new Date(mondayTime);
+        //年
+        var mondayY = mondayData.getFullYear();
+        //月
+        var mondayM =
+          mondayData.getMonth() + 1 < 10
+            ? "0" + (mondayData.getMonth() + 1)
+            : mondayData.getMonth() + 1;
+        //日
+        var mondayD =
+          mondayData.getDate() < 10
+            ? "0" + mondayData.getDate()
+            : mondayData.getDate();
+        // 当前时间
+        var currentData = new Date(timestamp);
+        //年
+        var currentY = currentData.getFullYear();
+        //月
+        var currentM =
+          currentData.getMonth() + 1 < 10
+            ? "0" + (currentData.getMonth() + 1)
+            : currentData.getMonth() + 1;
+        //日
+        var currentD =
+          currentData.getDate() < 10
+            ? "0" + currentData.getDate()
+            : currentData.getDate();
+        //时
+        var currenH =
+          currentData.getHours() < 10
+            ? "0" + currentData.getHours()
+            : currentData.getHours();
+        //分
+        var currenM =
+          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:
+              currentY +
+              "-" +
+              currentM +
+              "-" +
+              currentD +
+              " " +
+              currenH +
+              ":" +
+              currenM +
+              ":00",
+          },
+          month: {
+            beginTime: mondayY + "-" + mondayM + "-01 00:00:00",
+            endTime:
+              currentY +
+              "-" +
+              currentM +
+              "-" +
+              currentD +
+              " " +
+              currenH +
+              ":" +
+              currenM +
+              ":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,
+        };
+        this.query = params;
+        this.page.currentPage = 1;
+        this.onLoad(this.page, params);
+      },
+      getBYdata(e) {
+        this.activeClass = e;
+        var params = {
+          beginTime: this.dateTime.month.beginTime,
+          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;
+        this.page.currentPage = 1;
+        this.onLoad(this.page, params);
+      },
+      rowStyle({row, column, rowIndex}) {
+        if (row.jtype == "0") {
+          return {
+            color: "#ff2727",
+          };
+        } else if (row.jtype == "1") {
+          return {
+            color: "#15a2fe",
+          };
+        } else {
+          return {
+            color: "#000000",
+          };
+        }
+      },
+      handleStart(row) {
+        var arr = [];
+        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/`,
+          query: row,
+        });
+      },
+      handleHistory(row) {
+        var arr = [];
+        this.$store.state.tags.tagList.forEach((item) => {
+          if (item.label != "设备历史") {
+            arr.push(item);
+          }
+        });
+        this.$store.state.tags.tagList = arr;
+        this.$router.push({path: `/real/history/${row.deviceNumber}`});
+      },
+      handleMap(row) {
+        this.showMap = true;
+        this.$nextTick(() => {
+          this.$refs.mapDiv.onload = () => {
+            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 != ""
         ) {
-          params = {
-            waringType: this.$route.query.waringType,
-            beginTime: this.$route.query.startTime,
-            endTime: this.$route.query.endTime,
-          };
+          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.$refs.realPopupView.onItemGetParentData(row);
+      },
 
-      if (releaseTimeRange) {
-        values = {
-          ...params,
-          beginTime: releaseTimeRange[0],
-          endTime: releaseTimeRange[1],
-          ...this.query,
+      beginTimeOrEndTime(time) {
+        var beginTime = new Date(time);
+
+        var endTime = new Date(new Date(time).valueOf() - 1000 * 60 * 60 * 3);
+
+        var beginY = beginTime.getFullYear();
+
+        var beginM =
+          beginTime.getMonth() + 1 < 10
+            ? "0" + (beginTime.getMonth() + 1)
+            : beginTime.getMonth() + 1;
+
+        var beginD =
+          beginTime.getDate() < 10
+            ? "0" + beginTime.getDate()
+            : beginTime.getDate();
+
+        var beginH =
+          beginTime.getHours() < 10
+            ? "0" + beginTime.getHours()
+            : beginTime.getHours();
+
+        var beginm =
+          beginTime.getMinutes() < 10
+            ? "0" + beginTime.getMinutes()
+            : beginTime.getMinutes();
+
+        var begins =
+          beginTime.getSeconds() < 10
+            ? "0" + beginTime.getSeconds()
+            : beginTime.getSeconds();
+
+        var endY = endTime.getFullYear();
+
+        var endM =
+          endTime.getMonth() + 1 < 10
+            ? "0" + (endTime.getMonth() + 1)
+            : endTime.getMonth() + 1;
+
+        var endD =
+          endTime.getDate() < 10 ? "0" + endTime.getDate() : endTime.getDate();
+
+        var endH =
+          endTime.getHours() < 10 ? "0" + endTime.getHours() : endTime.getHours();
+
+        var endm =
+          endTime.getMinutes() < 10
+            ? "0" + endTime.getMinutes()
+            : endTime.getMinutes();
+
+        var ends =
+          endTime.getSeconds() < 10
+            ? "0" + endTime.getSeconds()
+            : endTime.getSeconds();
+        return {
+          begin: beginY + beginM + beginD + beginH + beginm + begins,
+          end: endY + endM + endD + endH + endm + ends,
         };
-        values.releaseTimeRange = null;
+      },
+
+      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}`
+          );
+        });
+      },
+      //数据报表导出
+      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 {
-        values = {
-          ...params,
-          ...this.query,
-        };
+        this.switchChartType = 1;
+        setTimeout(function () {
+          that.getData(null);
+          that.getDataBs(null);
+        }, 0);
       }
-
-      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) => {
-        const data = res.data.data;
-        data.records.forEach((item) => {
-          item.waringType == "紧急求救" ? (item.waringType = "一键求助") : "";
-        });
-        this.page.total = data.total;
-
-        data.records.sort((a, b) => {
-          return a.jtype - b.jtype;
-        });
-
-        this.data = data.records;
-
-        this.loading = false;
-        this.selectionClear();
-      });
-    },
-    getDate() {
-      // 当前时间
-      var timestamp = Date.parse(new Date());
-      var serverDate = new Date(timestamp);
-
-      // 本周周一的时间
-      var mondayTime =
-        timestamp - (serverDate.getDay() - 1) * 24 * 60 * 60 * 1000;
-      var mondayData = new Date(mondayTime);
-      //年
-      var mondayY = mondayData.getFullYear();
-      //月
-      var mondayM =
-        mondayData.getMonth() + 1 < 10
-          ? "0" + (mondayData.getMonth() + 1)
-          : mondayData.getMonth() + 1;
-      //日
-      var mondayD =
-        mondayData.getDate() < 10
-          ? "0" + mondayData.getDate()
-          : mondayData.getDate();
-      // 当前时间
-      var currentData = new Date(timestamp);
-      //年
-      var currentY = currentData.getFullYear();
-      //月
-      var currentM =
-        currentData.getMonth() + 1 < 10
-          ? "0" + (currentData.getMonth() + 1)
-          : currentData.getMonth() + 1;
-      //日
-      var currentD =
-        currentData.getDate() < 10
-          ? "0" + currentData.getDate()
-          : currentData.getDate();
-      //时
-      var currenH =
-        currentData.getHours() < 10
-          ? "0" + currentData.getHours()
-          : currentData.getHours();
-      //分
-      var currenM =
-        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:
-            currentY +
-            "-" +
-            currentM +
-            "-" +
-            currentD +
-            " " +
-            currenH +
-            ":" +
-            currenM +
-            ":00",
-        },
-        month: {
-          beginTime: mondayY + "-" + mondayM + "-01 00:00:00",
-          endTime:
-            currentY +
-            "-" +
-            currentM +
-            "-" +
-            currentD +
-            " " +
-            currenH +
-            ":" +
-            currenM +
-            ":00",
-        },
-        current:
-          currentY +
-          "-" +
-          currentM +
-          "-" +
-          currentD +
-          " " +
-          currenH +
-          ":" +
-          currenM +
-          ":" +
-          currenS,
-      };
-    },
-    getBRdata(e) {
-      this.activeClass = e;
-      var params = {
-        beginTime: this.dateTime.day.beginTime,
-        endTime: this.dateTime.day.endTime,
-      };
-      this.query = params;
-      this.page.currentPage = 1;
-      this.onLoad(this.page, params);
-    },
-    getBZdata(e) {
-      this.activeClass = e;
-      var params = {
-        beginTime: this.dateTime.week.beginTime,
-        endTime: this.dateTime.week.endTime,
-      };
-      this.query = params;
-      this.page.currentPage = 1;
-      this.onLoad(this.page, params);
-    },
-    getBYdata(e) {
-      this.activeClass = e;
-      var params = {
-        beginTime: this.dateTime.month.beginTime,
-        endTime: this.dateTime.month.endTime,
-      };
-      this.query = params;
-      this.page.currentPage = 1;
-      this.onLoad(this.page, params);
-    },
-    getQBdata(e) {
-      this.activeClass = e;
-      var params = {};
-      this.query = params;
-      this.page.currentPage = 1;
-      this.onLoad(this.page, params);
-    },
-    rowStyle({ row, column, rowIndex }) {
-      if (row.jtype == "0") {
-        return {
-          color: "#ff2727",
-        };
-      } else if (row.jtype == "1") {
-        return {
-          color: "#15a2fe",
-        };
-      } else {
-        return {
-          color: "#000000",
-        };
-      }
-    },
-    handleStart(row) {
-      var arr = [];
-      this.$store.state.tags.tagList.forEach((item) => {
-        if (item.label != "视频") {
-          arr.push(item);
+    }, 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;
         }
-      });
-      this.$store.state.tags.tagList = arr;
-      this.$router.push({
-        path: `/real/video/`,
-        query: row,
-      });
-    },
-    handleHistory(row) {
-      var arr = [];
-      this.$store.state.tags.tagList.forEach((item) => {
-        if (item.label != "设备历史") {
-          arr.push(item);
-        }
-      });
-      this.$store.state.tags.tagList = arr;
-      this.$router.push({ path: `/real/history/${row.deviceNumber}` });
-    },
-    handleMap(row) {
-      this.showMap = true;
-      this.$nextTick(() => {
-        this.$refs.mapDiv.onload = () => {
-          window.frames[0].init("ClientManagement", { x: row.jd, y: row.wd });
-        };
-      });
-    },
-    handleManage(row) {
-      this.form = row;
-      this.peopleList = [
-        { label: row.oneContacts, value: row.onePhone },
-        { label: row.twoContacts, value: row.twoPhone },
-        { label: row.threeContacts, value: row.threePhone },
-      ];
-      this.peopleName = row.oneContacts;
-      this.peoplePhone = row.onePhone;
-      this.dialogTableVisible = true;
-    },
-    updateJtyep(row, jtype, t) {
-      var that = this;
-
-      axios
-        .post(
-          "/api/blade-jfpts/alarm/alarm/updateJtype",
-          {},
-          {
-            params: {
-              jid: row.id,
-              jtype: jtype,
-              rid: row.alarmId,
-              bz: row.bz,
-              snumber: row.alarmId,
-              sname: row.alarmPeople,
-              zc: t,
-              zctime: that.getDate().current,
+        var option = {
+          title: [
+            {
+              text: sum,
+              subtext: "警情总数",
+              textStyle: {
+                fontSize: 36,
+                fontWeight: "normal",
+                color: "#393939",
+              },
+              subtextStyle: {
+                fontSize: 16,
+                color: "#434343",
+              },
+              textAlign: "center",
+              x: "49%",
+              y: "39%",
             },
-          }
-        )
-        .then(function () {
-          that.dialogTableVisible = false;
-
-          // axios({
-          //   method: "post",
-          //   url: `/api/blade-jfpts/rvideo/stop`,
-          //   params: {
-          //     jid: row.id,
-          //   },
-          // }).then((resdata) => {});
-
-          that.onLoad(that.page, that.query);
-          that.$router.push({
-            path: "/policeTracking/track",
-            query: that.form,
-          });
-        });
-    },
-    beginTimeOrEndTime(time) {
-      var beginTime = new Date(time);
-
-      var endTime = new Date(new Date(time).valueOf() - 1000 * 60 * 60 * 3);
-
-      var beginY = beginTime.getFullYear();
-
-      var beginM =
-        beginTime.getMonth() + 1 < 10
-          ? "0" + (beginTime.getMonth() + 1)
-          : beginTime.getMonth() + 1;
-
-      var beginD =
-        beginTime.getDate() < 10
-          ? "0" + beginTime.getDate()
-          : beginTime.getDate();
-
-      var beginH =
-        beginTime.getHours() < 10
-          ? "0" + beginTime.getHours()
-          : beginTime.getHours();
-
-      var beginm =
-        beginTime.getMinutes() < 10
-          ? "0" + beginTime.getMinutes()
-          : beginTime.getMinutes();
-
-      var begins =
-        beginTime.getSeconds() < 10
-          ? "0" + beginTime.getSeconds()
-          : beginTime.getSeconds();
-
-      var endY = endTime.getFullYear();
-
-      var endM =
-        endTime.getMonth() + 1 < 10
-          ? "0" + (endTime.getMonth() + 1)
-          : endTime.getMonth() + 1;
-
-      var endD =
-        endTime.getDate() < 10 ? "0" + endTime.getDate() : endTime.getDate();
-
-      var endH =
-        endTime.getHours() < 10 ? "0" + endTime.getHours() : endTime.getHours();
-
-      var endm =
-        endTime.getMinutes() < 10
-          ? "0" + endTime.getMinutes()
-          : endTime.getMinutes();
-
-      var ends =
-        endTime.getSeconds() < 10
-          ? "0" + endTime.getSeconds()
-          : endTime.getSeconds();
-      return {
-        begin: beginY + beginM + beginD + beginH + beginm + begins,
-        end: endY + endM + endD + endH + endm + ends,
-      };
-    },
-    // 视频通话打开关闭事件
-    openRealVideoBox() {
-      var that = this;
-      var newAxios = axios.create({
-        baseURL: "https://web.byisf.com:18000",
-        withCredentials: false,
-        headers: {
-          "Content-type": "application/x-www-form-urlencoded",
-        },
-      });
-
-      //this.form.serialNumber
-      newAxios
-        .post(
-          "/api_control",
-          {},
-          {
-            params: {
-              param: JSON.stringify({ PktType: "GetAccessToken" }),
-            },
-          }
-        )
-        .then((res) => {
-          newAxios
-            .get(
-              `https://web.byisf.com:18000/GetPlayUrl?deviceCode=${that.form.serialNumber}&chl=${this.form.channelNumber}`
-            )
-            .then((result) => {
-              that.videoSource = result.data.data.m3u8;
-
-              if (Hls.isSupported()) {
-                var dom = document.getElementById("real_video_conversation");
-
-                that.hls = new Hls();
-
-                var m3u8Url = decodeURIComponent(that.videoSource);
-
-                that.hls.loadSource(m3u8Url);
-
-                that.hls.attachMedia(dom);
-
-                that.hls.on(Hls.Events.MANIFEST_PARSED, function () {
-                  dom.play();
-                });
-
-                that.hls.on(Hls.Events.ERROR, function (event, data) {
-                  console.log(data, 4566824159, "视频播放有问题!!!");
-                  if (data.fatal) {
-                    switch (data.type) {
-                      case Hls.ErrorTypes.NETWORK_ERROR:
-                        // try to recover network error
-                        console.log(
-                          "fatal network error encountered, try to recover"
-                        );
-                        that.hls.startLoad();
-                        break;
-                      case Hls.ErrorTypes.MEDIA_ERROR:
-                        console.log(
-                          "fatal media error encountered, try to recover"
-                        );
-                        that.hls.recoverMediaError();
-                        break;
-                      default:
-                        // cannot recover
-                        that.hls.destroy();
-                        break;
-                    }
-                  }
-                });
-              }
-            });
-        });
-    },
-    closeRealVideoBox() {
-      var dom = document.getElementById("real_video_conversation");
-
-      if (dom.getAttribute("src") != "") {
-        dom.pause();
-
-        dom.setAttribute("src", "");
-
-        this.hls.destroy();
-      }
-    },
-    // 历史视频打开关闭事件
-    openOldVideoBox() {
-      var dom = document.getElementById("real_old_video");
-      dom.currentTime = 0;
-      dom.play();
-    },
-    closeOldVideoBox() {
-      var dom = document.getElementById("real_old_video");
-      dom.pause();
-    },
-
-    aKeyToCall() {
-      this.isActive = true;
-      var that = this;
-      if (this.recorder == null) {
-        this.recorder = new Recorder({
-          sampleBits: 16, // 采样位数,支持 8 或 16,默认是16
-          sampleRate: 8000, // 采样率,支持 11025、16000、22050、24000、44100、48000,根据浏览器默认值,我的chrome是48000
-          numChannels: 1, // 声道,支持 1 或 2, 默认是1
-          // compiling: false,(0.x版本中生效,1.x增加中)  // 是否边录边转换,默认是false
-        });
-      }
-
-      // 一键呼叫相关函数
-      that.recorder.start().then(
-        () => {
-          // 开始录音
-        },
-        (error) => {
-          // 出错了
-          console.log(`${error.name} : ${error.message}`);
-        }
-      );
-    },
-
-    // 序列号后期待修改
-    aKeyStopCall() {
-      this.isActive = false;
-      var newCallAxios = axios.create({
-        baseURL: "https://web.byisf.com:18000",
-        withCredentials: false,
-        headers: {
-          "Content-Type": "application/json;",
-        },
-      });
-      var that = this;
-
-      newCallAxios
-        .post(
-          `/api_control`,
-          {},
-          {
-            params: {
-              param: { PktType: "GetAccessToken" },
-            },
-          }
-        )
-        .then((result) => {
-          var formData = new FormData();
-          // that.recorder.downloadWAV("新文件");
-
-          var blob = that.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);
-          newCallAxios
-            .post(`/api_control`, blob, {
-              params: {
-                param: {
-                  PktType: "Talk",
-                  accessToken: result.data.data.accessToken,
-                  deviceCode: this.form.serialNumber,
+          ],
+          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,
                 },
               },
-            })
-            .then(() => {
-              that.recorder.destroy().then(function () {
-                that.recorder = null;
-              });
-            });
-        });
-    },
-
-    peopleOrPhone(e) {
-      this.peopleList.forEach((item) => {
-        if (item.label == e) {
-          this.peoplePhone = item.value;
-        }
+              emphasis: {
+                itemStyle: {
+                  shadowBlur: 10,
+                  shadowOffsetX: 0,
+                  shadowColor: 'rgba(0, 0, 0, 0.5)'
+                }
+              }
+            }
+          ]
+        };
+        // let echarts = require('echarts');
+        let myChart = that.$echarts.init(document.getElementById('alarmTypeProEcharts'));
+        myChart.setOption(option);
       });
     },
-    PoliceTracking(row) {
-      //警情追踪
-      this.$router.push({ path: "/policeTracking/track", query: row });
+      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)'
+                  }
+                }
+              }
+            ]
+          };
+          // let echarts = require('echarts');
+          let myChart = that.$echarts.init(document.getElementById('alarmEcharts'));
+          myChart.setOption(option);
+        });
+      },
     },
-    realOpenVideoDialog() {
-      Recorder.getPermission().then(() => {});
-      this.videoConversationReal = true;
-    },
-  },
-};
+  };
 </script>
 
 <style>
-.el-card__body .waringTypeClass {
-  width: 12%;
-}
+  #alarmEcharts {
+    width: 30%;
+    height: 450px;
+    position: relative;
+    left: 20%;
+  }
 
-/*页面样式*/
-.el-card__body .cityClass1 {
-  width: 155px;
-  padding-right: 0px !important;
-}
+  .el-card__body .waringTypeClass {
+    width: 12%;
+  }
 
-.el-card__body .cityClass2 {
-  width: 100px;
-  padding-left: 0px !important;
-  padding-right: 0px !important;
-}
+  .cityreal2 div label,
+  .cityreal3 div label {
+    display: none;
+  }
 
-.el-card__body .cityClass3 {
-  width: 100px;
-  padding-left: 0px !important;
-  padding-right: 0px !important;
-}
+  /*页面样式*/
+  .el-card__body .cityreal1 {
+    width: 150px;
+    padding-right: 0px !important;
+  }
 
-/*新增窗体样式*/
-.el-dialog .cityClass1 {
-  width: 220px;
-  padding-right: 0px !important;
-}
+  .el-card__body .cityreal2 {
+    width: 100px;
+    padding-left: 10px !important;
+    padding-right: 0px !important;
+  }
 
-.el-dialog .cityClass2 {
-  width: 110px;
-  padding-left: 5px !important;
-  padding-right: 5px !important;
-}
+  .el-card__body .cityreal3 {
+    width: 100px;
+    padding-left: 10px !important;
+    padding-right: 0px !important;
+  }
 
-.el-dialog .cityClass3 {
-  width: 110px;
-  padding-left: 0px !important;
-  padding-right: 0px !important;
-}
+  /*新增窗体样式*/
+  .el-dialog .cityreal1 {
+    width: 216px;
+    padding-right: 0px !important;
+  }
 
-.cityClassParams .avue-form__group.avue-form__group--flex {
-  display: flex;
-  justify-content: space-between;
-}
+  .el-dialog .cityreal2 {
+    width: 130px;
+    padding-left: 10px !important;
+    padding-right: 10px !important;
+  }
 
-.cityClassParams .cityClassSelect {
-  flex: 1;
-  margin: 0 !important;
-  padding-left: 0px !important;
-  padding-right: 0px !important;
-}
+  .el-dialog .cityreal3 {
+    width: 105px;
+    padding-left: 0px !important;
+    padding-right: 0px !important;
+  }
 
-.cityClassParams .cityClassSelect:nth-child(2) {
-  margin: 0 10px !important;
-}
+  .cityClassParams .avue-form__group.avue-form__group--flex {
+    display: flex;
+    justify-content: space-between;
+  }
 
-.cityClassParams .cityClassSelect .el-form-item {
-  margin-bottom: 0px !important;
-}
+  .cityClassParams .cityClassSelect {
+    flex: 1;
+    margin: 0 !important;
+    padding-left: 0px !important;
+    padding-right: 0px !important;
+  }
 
-.cityClassParams .cityClassSelect .el-form-item .el-input__inner {
-  height: 28px !important;
-  line-height: 28px !important;
-}
+  .cityClassParams .cityClassSelect:nth-child(2) {
+    margin: 0 10px !important;
+  }
 
-.cityClass2 div label {
-  display: none;
-}
+  .cityClassParams .cityClassSelect .el-form-item {
+    margin-bottom: 0px !important;
+  }
 
-.cityClass3 div label {
-  display: none;
-}
+  .cityClassParams .cityClassSelect .el-form-item .el-input__inner {
+    height: 28px !important;
+    line-height: 28px !important;
+  }
 
-.old-video-dialog {
-  position: absolute !important;
-  top: 0 !important;
-  left: auto !important;
-  right: 0px !important;
-  bottom: 0 !important;
-  margin: auto !important;
-  height: 100% !important;
-  width: 476px !important;
-}
+  .cityClass2 div label {
+    display: none;
+  }
 
-.old-video-dialog .el-dialog {
-  position: absolute !important;
-  top: 0 !important;
-  left: 0 !important;
-  right: 0 !important;
-  bottom: 0 !important;
-  margin: auto !important;
-  margin-top: 15vh !important;
-  height: 538px;
-}
+  .cityClass3 div label {
+    display: none;
+  }
 
-.old-video-dialog .el-dialog .el-dialog__body {
-  height: calc(100% - 54px);
-  box-sizing: border-box;
-}
+  .old-video-dialog {
+    position: absolute !important;
+    top: 0 !important;
+    left: auto !important;
+    right: 0px !important;
+    bottom: 0 !important;
+    margin: auto !important;
+    height: 100% !important;
+    width: 476px !important;
+  }
 
-.el-button.active {
-  background: #ff0000 !important;
-}
+  .old-video-dialog .el-dialog {
+    position: absolute !important;
+    top: 0 !important;
+    left: 0 !important;
+    right: 0 !important;
+    bottom: 0 !important;
+    margin: auto !important;
+    margin-top: 15vh !important;
+    height: 538px;
+  }
 
-.el-button.btn-color {
-  color: rgb(255, 255, 255);
-  background-color: rgb(64, 158, 255);
-  border-color: rgb(64, 158, 255);
-}
+  .old-video-dialog .el-dialog .el-dialog__body {
+    height: calc(100% - 54px);
+    box-sizing: border-box;
+  }
 
-.tabFontSize {
-  font-size: 15px;
-}
+  .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