弹框内容更改，视频对讲方式更改，部分逻辑微调整

shuishen

2021-03-20 8c372e643f381f0bf17b976eddf694d9cf7aef33

 src/page/index/logo.vue

@@ -20,6 +20,7 @@
        :append-to-body="true"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
        @opened="videoConversationReal = true"
        @close="closeDialog"
      >
        <el-form
@@ -109,7 +110,7 @@
          </el-row>
          <el-row>
            <el-col span="12">
              <el-form-item label="警情类别">
              <el-form-item label="警情类型">
                <el-input
                  disabled="true"
                  v-model="form.waringType"
@@ -138,10 +139,10 @@
              </el-form-item>
            </el-col>
            <el-col span="12">
              <el-form-item label="接警时间">
              <el-form-item label="报警内容">
                <el-input
                  disabled="true"
                  v-model="form.jjTime"
                  v-model="form.content"
                  autocomplete="off"
                ></el-input>
              </el-form-item>
@@ -160,10 +161,13 @@
            <el-col span="12">
              <el-form-item label="监控视频">
                <el-button
                  :class="{ active: isActive }"
                  type="success"
                  @click.stop="
                    (videoConversationReal = true), (oldVideoSatart = fasle)
                    (videoConversationReal = true), (oldVideoSatart = false)
                  "
                  @mousedown.native="aKeyToCall"
                  @mouseup.native="aKeyStopCall"
                  >视频通话
                </el-button>
                <el-button
@@ -177,15 +181,6 @@
            </el-col>
          </el-row>
          <el-row>
            <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-col span="12">
              <el-form-item label="备注">
                <el-input v-model="form.bz" autocomplete="off"></el-input>
@@ -209,12 +204,12 @@
                    vertical-align: middle;
                  "
                  alt=""
                  @click.stop="updateJtyep(form, 2, '推送110')"
                  @click.stop="updateJtyep(form, 1, '推送110')"
                />

                <el-button
                  type="primary"
                  @click.stop="updateJtyep(form, 3, '派送保安')"
                  @click.stop="updateJtyep(form, 1, '派送保安')"
                  >派送保安
                </el-button>
              </el-form-item>
@@ -271,6 +266,7 @@
import { mapGetters } from "vuex";
import axios from "axios";
import Hls from "hls.js";
import Recorder from "js-audio-recorder";

export default {
  name: "logo",
@@ -332,6 +328,8 @@
          },
        ],
      },
      isActive: false,
      recorder: null,
      peopleList: [],
      peopleName: "",
      peoplePhone: "",
@@ -339,6 +337,13 @@
  },
  created() {
    this.getData();
    Recorder.getPermiRecorderssion().then(() => {});
    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
    });
  },
  computed: {
    ...mapGetters(["website", "keyCollapse"]),
@@ -376,7 +381,7 @@
              response.data.data[0].waringType == "紧急求救" &&
              response.data.data[0].alarmId == userId
            ) {
              response.data.data[0].waringType == "一键求助";
              response.data.data[0].waringType = "一键求助";
              that.form = response.data.data[0];
              that.peopleList = [
                { label: that.form.oneContacts, value: that.form.onePhone },
@@ -386,7 +391,6 @@
              that.peopleName = that.form.oneContacts;
              that.peoplePhone = that.form.onePhone;
              that.dialogTableVisible = true;
              that.videoConversationReal = true;
              that.$refs.realAudio.src = "./realVideo/audio.mp3";
              that.$refs.realAudio.play();
            }
@@ -397,12 +401,119 @@
    closeDialog() {
      //关闭窗口回调，关闭警报
      this.$refs.realAudio.pause();
     this.videoConversationReal = false;
      this.videoConversationReal = false;
      this.oldVideoSatart = false;
    },
    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,
      };
    },
    updateJtyep(row, jtype, t) {
      var that = this;

      axios
        .post(
          "/api/blade-jfpts/alarm/alarm/updateJtype",
@@ -413,15 +524,15 @@
              jtype: jtype,
              rid: row.alarmId,
              bz: row.bz,
              snumber: row.alarmPeople,
              sname: row.alarmId,
              snumber: row.alarmId,
              sname: row.alarmPeople,
              zc: t,
              zctime: that.getDate().current,
            },
          }
        )
        .then(function () {
          that.onLoad(that.page, that.query);
          that.dialogTableVisible = false;
        });
    },
    beginTimeOrEndTime(time) {
@@ -515,8 +626,6 @@
              if (Hls.isSupported()) {
                var dom = document.getElementById("video_conversation");

                // if (dom.volume) dom.volume = 1.0;

                this.hls = new Hls();

                var m3u8Url = decodeURIComponent(this.videoSource);
@@ -530,31 +639,6 @@
                });
              }
            });

          //   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.videoConversationReal = true;

          //       this.videoSource = result.data.data.m3u8;

          //     });
        });
    },

@@ -582,6 +666,79 @@
      dom.pause();
    },

    aKeyToCall() {
      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
        });
      }
      this.isActive = true;

      // 一键呼叫相关函数
      that.recorder.start().then(
        () => {
          // 开始录音
          console.log(111);
        },
        (error) => {
          // 出错了
          console.log(`${error.name} : ${error.message}`);
        }
      );
    },

    // 序列号后期待修改
    aKeyStopCall() {
      var newCallAxios = axios.create({
        baseURL: "https://web.byisf.com:18000",
        withCredentials: false,
        headers: {
          "Content-Type": "application/json;",
        },
      });
      var that = this;
      that.isActive = false;

      newCallAxios
        .post(
          `/api_control`,
          {},
          {
            params: {
              param: { PktType: "GetAccessToken" },
            },
          }
        )
        .then((result) => {
          var formData = new FormData();
          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: form.channelNumber,
                  deviceCode: "001241945990",
                },
              },
            })
            .then(() => {
              that.recorder.destroy().then(function () {
                that.recorder = null;
              });
            });
        });
    },

    peopleOrPhone(e) {
      this.peopleList.forEach((item) => {
        if (item.label == e) {