录音，及闪烁点得完成

shuishen

2021-04-20 e28cf8c01eb57b72155ba2052890b326d051ba20

录音，及闪烁点得完成

 public/map/images/1.gif

 public/map/images/real-time-callPolice-opcity.png

 public/map/widgets/alertSecurity/AlertSecurity.js

@@ -204,8 +204,10 @@
      var deptId = that.getQueryStringByKey('deptId');
      var oneId = that.getQueryStringByKey('oneId');

      that.createEntitys(that.addEntitys, lgtd, lttd, './images/real-time-callPolice-opcity.png');
      that.createTwinkleEntitys(that.addEntitys, lgtd, lttd, './images/real-time-callPolice-opcity.png');
      that.addPoint(that.addEntitys, lgtd, lttd, './images/jingbaored.png');
     
      
      $.ajax({
        url: "https://web.byisf.com/api/blade-user/pages?current=1&size=9999&work_status=&deptId=" + deptId,
        type: 'get',
@@ -232,65 +234,83 @@
    close: function () {

    },
    // 获取当前时间，以及昨天现在的时间
    getTime: function getTime() {
      var timestamp = Date.parse(new Date());

      // 当前时间
      var currentTime = new Date(timestamp);
      // 年
      var currentY = currentTime.getFullYear();
      // 月
      var currentM = currentTime.getMonth() + 1 < 10 ? '0' + (currentTime.getMonth() + 1) : currentTime.getMonth() + 1;
      // 日
      var currentD = currentTime.getDate() < 10 ? '0' + currentTime.getDate() : currentTime.getDate();
      // 时
      var currentH = currentTime.getHours() < 10 ? '0' + currentTime.getHours() : currentTime.getHours();
      // 分
      var currentDd = currentTime.getMinutes() < 10 ? '0' + currentTime.getMinutes() : currentTime.getMinutes();
      // 明天
      var tomorrowTime = new Date(timestamp - 60 * 60 * 24 * 1000);
      // 年
      var tomorrowY = tomorrowTime.getFullYear();
      // 月
      var tomorrowM = tomorrowTime.getMonth() + 1 < 10 ? '0' + (tomorrowTime.getMonth() + 1) : tomorrowTime.getMonth() + 1;
      // 日
      var tomorrowD = tomorrowTime.getDate() < 10 ? '0' + tomorrowTime.getDate() : tomorrowTime.getDate();
      // 时
      var tomorrowH = tomorrowTime.getHours() < 10 ? '0' + tomorrowTime.getHours() : tomorrowTime.getHours();
      // 分
      var tomorrowDd = tomorrowTime.getMinutes() < 10 ? '0' + tomorrowTime.getMinutes() : tomorrowTime.getMinutes();
      return {
        current: currentY + '-' + currentM + '-' + currentD + ' ' + currentH + ':' + currentDd,
        tomorrow: tomorrowY + '-' + tomorrowM + '-' + tomorrowD + ' ' + tomorrowH + ':' + tomorrowDd,
        month: currentM + currentD
      };
    },

    // 创建实体图层
    createEntitys: function (entitys, entityContent, name, item, lgtd, lttd, outlineColors) {

      var symbol = new esri.symbol.PictureMarkerSymbol(outlineColors, 26, 26);
      symbol.name = name;
      var pt = new Point(lgtd, lttd, new esri.SpatialReference({
        wkid: 4326
      }));
      pt.entityData = item;
      var graphic = new esri.Graphic(pt, symbol);
      entitys.add(graphic);


      entityContent.push(item);
    },

    addPoint: function (entitys, lgtd, lttd, img) {
      var symbol = new esri.symbol.PictureMarkerSymbol(img, 33, 48);
      var symbol = new esri.symbol.PictureMarkerSymbol(img, 22, 32);
      symbol.xoffset = 0; 
      symbol.yoffset = -2;
      var pt = new Point(lgtd, lttd, new SpatialReference({
        wkid: 4326
      }));
      var graphic = new esri.Graphic(pt, symbol);
      entitys.add(graphic);
    },
    /**
     * 添加实体的公共方法
     * @param {*} entitys 实体类
     * @param {Array} entityContent 存放每个点详细数据的数组
     * @param {string} name 实体的名字
     * @param {*} item 实体数据
     * @param {*} lgtd 经度
     * @param {*} lttd 纬度
     * @param {*} outlineColors 颜色
     */
    createEntitys: function (entitys, lgtd, lttd, image) {

      var symbol = new esri.symbol.PictureMarkerSymbol(image, 44, 44);
   
      var width = 44;
      var height = 44;
      var pt = new Point(lgtd, lttd, new SpatialReference({
        wkid: 4326
      }));

      var graphic = new esri.Graphic(pt, symbol);

      setInterval(function () {
        if (width >= 60) {
          width = 44;
          height = 44;
        }
        width += 1;
        height += 1;
        symbol.width = width;
        symbol.height = height;
        graphic.setSymbol(symbol)
        entitys.add(graphic);
      }, 50)

    },
    /**
     * 添加闪烁实体的公共方法
     * @param {*} entitys 实体类
     * @param {*} lgtd 经度
     * @param {*} lttd 纬度
     * @param {*} color 颜色
     */
    createTwinkleEntitys: function (entitys, lgtd, lttd, image, color) {
      var symbol = new esri.symbol.PictureMarkerSymbol(image, 64, 64);
      var width = 64;
      var height = 64;
      var pt = new Point(lgtd, lttd, new SpatialReference({
        wkid: 4326
      }));

      var graphic = new esri.Graphic(pt, symbol);

      setInterval(function () {
        if (width >= 80) {
          width = 64;
          height = 64;
        }
        width += 1;
        height += 1;
        symbol.width = width;
        symbol.height = height;
        graphic.setSymbol(symbol)
        entitys.add(graphic);
      }, 50)
    },

    addPoints: function (entitys, lgtd, lttd, img) {
      var symbol = new esri.symbol.PictureMarkerSymbol(img, 20, 20);

 src/views/policeTracking/policeTracking.vue

@@ -295,6 +295,31 @@
              class="el-collapse-item__header focusing is-active"
            >
              <div class="avue-group__header avue-group">
                <i class="el-icon-document avue-group__icon"></i>
                <h1 class="avue-group__title">对讲信息</h1>
              </div>
            </div>
          </div>

          <el-card class="receiving-alarm-box">
            <div v-for="(item, index) in audios" :key="index" style="margin: 10px 0; width: 100%; height: 40px;">
              <audio :src="item.address" style="width: 40%; height: 100%;"  controls></audio>
            </div>
          </el-card>

          <div
            style="margin-top: 20px"
            role="tab"
            aria-expanded="true"
            aria-controls="el-collapse-content-823"
            aria-describedby="el-collapse-content-823"
          >
            <div
              role="button"
              tabindex="0"
              class="el-collapse-item__header focusing is-active"
            >
              <div class="avue-group__header avue-group">
                <i class="el-icon-s-custom avue-group__icon"></i>
                <h1 class="avue-group__title">保安信息</h1>
              </div>
@@ -608,6 +633,7 @@
      baseUrl: "",
      oldVideoSatart: false,
      vaddress: null,
      audios: [],
    };
  },
  created() {
@@ -618,7 +644,7 @@
  },
  mounted() {
    this.getList();

    this.getAudios();
    this.$refs.mapDiv.onload = () => {
      window.frames[0].init("AlertSecurity", {
        x: this.form.jd,
@@ -790,7 +816,9 @@
    getList() {
      var that = this;
      axios
        .get(`/api/blade-user/pages?current=1&size=9999&work_status=&deptId=${that.form.deptId}`)
        .get(
          `/api/blade-user/pages?current=1&size=9999&work_status=&deptId=${that.form.deptId}`
        )
        .then(function (res) {
          that.tableData = [];
          var i = 0;
@@ -849,6 +877,18 @@
        this.$refs.multipleTable.clearSelection();
      }
    },

    getAudios() {
      axios({
        method: "get",
        url: "/api/blade-jfpts/avideo/list",
        params: {
          jid: this.form.id,
        },
      }).then((resdata) => {
        this.audios = resdata.data.data.records;
      });
    },
  },
};
</script>

 src/views/realTimePolice/real.vue

@@ -2,7 +2,7 @@
 * @Author: Morpheus
 * @Date: 2021-03-17 15:21:33
 * @Last Modified by: Morpheus
 * @Last Modified time: 2021-04-12 17:28:33
 * @Last Modified time: 2021-04-19 14:32:44
 */
<template>
  <basic-container>
@@ -69,21 +69,24 @@
      </template>

      <template slot="menuLeft">
        <el-button type="warning"
                    size="mini"
                    plain
                    icon="el-icon-download"
                    @click="handleExport">导出
        <el-button
          type="warning"
          size="mini"
          plain
          icon="el-icon-download"
          @click="handleExport"
          >导出
        </el-button>
        <el-button type="warning"
        style="display:none"
                    size="small"
                    plain
                    icon="el-icon-download"
                    @click="handleExportStatis">导出报表
        <el-button
          type="warning"
          style="display: none"
          size="small"
          plain
          icon="el-icon-download"
          @click="handleExportStatis"
          >导出报表
        </el-button>
      </template>


      <template slot-scope="{ row }" slot="jtype">
        <el-tag
@@ -495,7 +498,7 @@
            type: "datetime",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            searchValue:[this.getStartTime(),this.getEndTime()],
            searchValue: [this.getStartTime(), this.getEndTime()],
            searchRange: true,
            searchSpan: 5,
            hide: true,
@@ -1456,26 +1459,61 @@
      this.$confirm("是否导出实时警情数据?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
        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}`);
        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() {
        this.$confirm("是否导出实时警情数据?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          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(`http://localhost:8108/ureport/excel?_u=blade-alarm.statis.ureport.xml&beginTime=${beginTime}&endTime=${endTime}&waringType=${waringType}&timeDesc=${timeDesc}`);
        });
    handleExportStatis() {
      this.$confirm("是否导出实时警情数据?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        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(
          `http://localhost:8108/ureport/excel?_u=blade-alarm.statis.ureport.xml&beginTime=${beginTime}&endTime=${endTime}&waringType=${waringType}&timeDesc=${timeDesc}`
        );
      });
    },
    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 "";
    },
  },
};
</script>