有害生物功能，实验室识别增加鉴定弹窗，UI完成

minggao/src/page/commandCenter/laboratory.vue

@@ -59,9 +59,7 @@
             <el-button type="info" size="mini" @click="searchData"
               >搜索</el-button
             >
-            <el-button type="info" size="mini" @click="reset"
-              >重置</el-button
-            >
+            <el-button type="info" size="mini" @click="reset">重置</el-button>
           </div>
         </div>
       </el-col>
@@ -78,19 +76,19 @@
       >
         <el-table-column prop="serial" label="序号" width="100">
           <template slot-scope="scope">
-            <span>{{ ((page-1)*20)+scope.row.serial}}</span>
+            <span>{{ (page - 1) * 20 + scope.row.serial }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="trap_number" label="设备编号" width="120">
         </el-table-column>
         <el-table-column prop="lng" label="经度" width="150">
           <template slot-scope="scope">
-            <span>{{ scope.row.lng || "无" }}</span>
+            <span>{{ scope.row.lng || '无' }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="lat" label="纬度" width="150">
           <template slot-scope="scope">
-            <span>{{ scope.row.lat || "无" }}</span>
+            <span>{{ scope.row.lat || '无' }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="id" label="任务编号" width="180">
@@ -107,12 +105,12 @@
           width="180"
         >
           <template slot-scope="scope">
-            <span>{{ scope.row.actual_operator_name || "暂无" }}</span>
+            <span>{{ scope.row.actual_operator_name || '暂无' }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="report_time" label="带回时间">
           <template slot-scope="scope">
-            <span>{{ scope.row.report_time || "暂无" }}</span>
+            <span>{{ scope.row.report_time || '暂无' }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="discern_status" label="任务状态" width="280">
@@ -250,6 +248,9 @@
             >
             </el-input>
 
+            <span class="fill__appraisal" @click="handleAppraiseClick"
+              >鉴定</span
+            >
             <span @click="delInsect(item)">删除</span>
           </div>
         </li>
@@ -291,16 +292,97 @@
             @click="addInsect()"
             >+</span
           >
+          <span>&nbsp;</span>
         </li>
       </ul>
 
       <span slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible = false">取 消</el-button>
         <el-button :disabled="submitBtn" type="primary" @click="confirmAxios">{{
-          submitBtn == true ? "发布中..." : "发布"
+          submitBtn == true ? '发布中...' : '发布'
         }}</el-button>
       </span>
     </el-dialog>
+
+    <!-- 鉴定弹框 -->
+    <el-dialog
+      title="鉴定"
+      v-loading="appraiseLoading"
+      :visible.sync="appraiseDialogVisible"
+      width="800px"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+    >
+      <el-form
+        :model="ruleForm"
+        :rules="rules"
+        ref="ruleForm"
+        label-width="140px"
+      >
+        <el-form-item label-width="20px">
+          <el-descriptions>
+            <el-descriptions-item label="样本名称">虫子</el-descriptions-item>
+            <el-descriptions-item label="数量">12</el-descriptions-item>
+          </el-descriptions>
+        </el-form-item>
+
+        <!-- start -->
+
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="样本编号：" prop="desc">
+              <el-input v-model="ruleForm.desc"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="标识：" prop="region">
+              <el-select v-model="ruleForm.region" placeholder="请选择">
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="雌：" prop="region">
+              <el-input
+                v-model="ruleForm.name"
+                onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)));"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="雄：" prop="name">
+              <el-input
+                v-model="ruleForm.name"
+                onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)));"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="监测项目与方法：" prop="desc">
+          <el-input type="textarea" v-model="ruleForm.desc"></el-input>
+        </el-form-item>
+        <el-form-item label="形态学鉴定：" prop="desc">
+          <el-input type="textarea" v-model="ruleForm.desc"></el-input>
+        </el-form-item>
+        <el-form-item label="鉴定结果：" prop="desc">
+          <el-input type="textarea" v-model="ruleForm.desc"></el-input>
+        </el-form-item>
+        <el-form-item label="备注：" prop="desc">
+          <el-input type="textarea" v-model="ruleForm.desc"></el-input>
+        </el-form-item>
+
+        <!-- end -->
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="appraiseDialogVisible = false">取 消</el-button>
+        <el-button :disabled="appraiseSubmitLoading" type="primary"
+          >确定</el-button
+        >
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -313,26 +395,26 @@ export default {
       fullHeight: document.documentElement.clientHeight - 116, //
 
       // 筛选
-      input: "", // 任务处理人
+      input: '', // 任务处理人
       conductorList: [], // 任务处理人列表
       options: [
         {
-          value: "待接收",
-          label: "待接收",
+          value: '待接收',
+          label: '待接收'
         },
         {
-          value: "已接收",
-          label: "已接收",
+          value: '已接收',
+          label: '已接收'
         },
         {
-          value: "已填报",
-          lanbel: "已填报",
-        },
+          value: '已填报',
+          lanbel: '已填报'
+        }
       ],
-      value: "", // 任务状态
-      value1: "", // 时间筛选
-      startTime: "",
-      endTime: "",
+      value: '', // 任务状态
+      value1: '', // 时间筛选
+      startTime: '',
+      endTime: '',
 
       // 表格
       tableData: [],
@@ -343,8 +425,8 @@ export default {
       dialogVisible: false,
       options1: [],
       options2: [], //新增有害生物
-      value2: "",
-      input2: "",
+      value2: '',
+      input2: '',
       loading: false, // 加载
 
       // 已识别
@@ -353,10 +435,60 @@ export default {
       spareData: [], // 填报详情备用数据
       // models: Array(fillList.length).fill(''), // 填报select数据
       models: null, // 填报select数据
-      insectVal: "", // 添加 - 有害生物
-      numVal: "", // 添加 - 数量
+      insectVal: '', // 添加 - 有害生物
+      numVal: '', // 添加 - 数量
       loading1: false, // 加载
       submitBtn: false, // 防止弹框确定按钮重复请求
+      appraiseLoading: false,
+      appraiseDialogVisible: false,
+      appraiseSubmitLoading: false,
+      ruleForm: {
+        name: '',
+        region: '',
+        date1: '',
+        date2: '',
+        delivery: false,
+        type: [],
+        resource: '',
+        desc: ''
+      },
+      rules: {
+        name: [
+          { required: true, message: '请输入活动名称', trigger: 'blur' },
+          { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
+        ],
+        region: [
+          { required: true, message: '请选择活动区域', trigger: 'change' }
+        ],
+        date1: [
+          {
+            type: 'date',
+            required: true,
+            message: '请选择日期',
+            trigger: 'change'
+          }
+        ],
+        date2: [
+          {
+            type: 'date',
+            required: true,
+            message: '请选择时间',
+            trigger: 'change'
+          }
+        ],
+        type: [
+          {
+            type: 'array',
+            required: true,
+            message: '请至少选择一个活动性质',
+            trigger: 'change'
+          }
+        ],
+        resource: [
+          { required: true, message: '请选择活动资源', trigger: 'change' }
+        ],
+        desc: [{ required: true, message: '请填写活动形式', trigger: 'blur' }]
+      }
     };
   },
   //监听属性 类似于data概念
@@ -369,7 +501,7 @@ export default {
         this.fullHeight = val;
         this.timer = true;
         let that = this;
-        setTimeout(function () {
+        setTimeout(function() {
           //防止过度调用监测事件，导致卡顿
           that.timer = false;
         }, 400);
@@ -388,7 +520,7 @@ export default {
     // 填报 - 新添加数据
     numValZ(val) {
       console.log(val);
-    },
+    }
   },
   //方法集合
   methods: {
@@ -407,25 +539,25 @@ export default {
     searchData() {
       // 对时间筛选中获取到的时间进行处理
       if (this.value1) {
-        this.startTime = this.formatTime(this.value1[0], "yyyy-MM-dd");
-        this.endTime = this.formatTime(this.value1[1], "yyyy-MM-dd");
+        this.startTime = this.formatTime(this.value1[0], 'yyyy-MM-dd');
+        this.endTime = this.formatTime(this.value1[1], 'yyyy-MM-dd');
       } else {
-        this.startTime = "";
-        this.endTime = "";
+        this.startTime = '';
+        this.endTime = '';
       }
       this.loading = true;
-      this.page = 1
+      this.page = 1;
       this.tableData = [];
       this.tableList();
     },
 
     // 重置
     reset() {
-      this.input = "";
-      this.value = "";
-      this.value1 = "";
-      this.startTime = "";
-      this.endTime = "";
+      this.input = '';
+      this.value = '';
+      this.value1 = '';
+      this.startTime = '';
+      this.endTime = '';
       this.loading = true;
       this.page = 1;
       this.tableList();
@@ -442,18 +574,18 @@ export default {
     // 表格数据
     tableList() {
       this.$axios({
-        method: "POST",
-        url: "/api/api_gateway?method=control_center.task.discern_list",
+        method: 'POST',
+        url: '/api/api_gateway?method=control_center.task.discern_list',
         data: this.qs.stringify({
           page: this.page,
           page_item: 20,
           operator_user_id: this.input, // 任务处理人id
           start_time: this.startTime, // 开始时间
           end_time: this.endTime, // 结束时间
-          task_status: this.value, // 任务状态
-        }),
+          task_status: this.value // 任务状态
+        })
       })
-        .then((res) => {
+        .then(res => {
           if (res.data.data.total_item !== 0) {
             this.tableSum = res.data.data.total_item;
             var data = res.data.data.page_list;
@@ -466,7 +598,7 @@ export default {
           }
           this.loading = false;
         })
-        .catch((err) => {
+        .catch(err => {
           this.loading = false;
         });
     },
@@ -474,69 +606,69 @@ export default {
     // 筛选列表 - 任务处理人
     conductorAxios() {
       this.$axios({
-        method: "POST",
-        url: "/api/api_gateway?method=control_center.task.task_user_list",
+        method: 'POST',
+        url: '/api/api_gateway?method=control_center.task.task_user_list',
         data: this.qs.stringify({
-          user_type: "operator", // 用户类型，operator（任务处理人）, supervisor（任务监督人）, owner（任务发布人）
-          operator_id: "", // 已经选择的任务处理人id
-          supervisor_id: "", // 已经选择的任务监督人id
-          owner_id: "", // 已经选择的任务发布人id
-        }),
+          user_type: 'operator', // 用户类型，operator（任务处理人）, supervisor（任务监督人）, owner（任务发布人）
+          operator_id: '', // 已经选择的任务处理人id
+          supervisor_id: '', // 已经选择的任务监督人id
+          owner_id: '' // 已经选择的任务发布人id
+        })
       })
-        .then((res) => {
+        .then(res => {
           if (res.data.data.length !== 0) {
             var data = res.data.data;
             var list = [];
-            data.forEach((item) => {
+            data.forEach(item => {
               var obj = {};
-              obj["value"] = item.user_id;
-              obj["label"] = item.real_name;
+              obj['value'] = item.user_id;
+              obj['label'] = item.real_name;
               list.push(obj);
             });
             this.conductorList = list;
           }
         })
-        .catch((err) => {});
+        .catch(err => {});
     },
 
     // 确认接收
     receive(data) {
-      this.$confirm("此操作将确认接收, 是否继续?", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
+      this.$confirm('此操作将确认接收, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
       })
         .then(() => {
           this.$axios({
-            method: "POST",
-            url: "/api/api_gateway?method=control_center.task.discern_modify",
+            method: 'POST',
+            url: '/api/api_gateway?method=control_center.task.discern_modify',
             data: this.qs.stringify({
-              record_id: data.id, // 任务id
-            }),
+              record_id: data.id // 任务id
+            })
           })
-            .then((res) => {
+            .then(res => {
               if (res.data.data == true) {
-                if (document.getElementsByClassName("el-message").length == 0) {
+                if (document.getElementsByClassName('el-message').length == 0) {
                   this.$message({
-                    type: "success",
-                    message: "接收成功!",
-                    duration: 1500,
+                    type: 'success',
+                    message: '接收成功!',
+                    duration: 1500
                   });
                 }
                 this.loading = true;
                 this.tableList();
               }
             })
-            .catch((err) => {
+            .catch(err => {
               console.log(err);
             });
         })
         .catch(() => {
-          if (document.getElementsByClassName("el-message").length == 0) {
+          if (document.getElementsByClassName('el-message').length == 0) {
             this.$message({
-              type: "info",
-              message: "已取消接收",
-              duration: 1500,
+              type: 'info',
+              message: '已取消接收',
+              duration: 1500
             });
           }
         });
@@ -548,23 +680,24 @@ export default {
       this.examineObj = data;
       // 填报记录详情接口
       this.$axios({
-        method: "POST",
-        url: "/api/api_gateway?method=control_center.task.trap_pest_record_info",
+        method: 'POST',
+        url:
+          '/api/api_gateway?method=control_center.task.trap_pest_record_info',
         data: this.qs.stringify({
-          trap_record_id: data.id, // 任务id
-        }),
+          trap_record_id: data.id // 任务id
+        })
       })
-        .then((res) => {
+        .then(res => {
           var data = res.data.data;
           var list = [];
           var arr = [];
           data.forEach((item, index) => {
             var obj = {};
-            obj["value"] = item.id;
-            obj["label"] = item.pest_name;
-            obj["num"] = item.pest_number;
-            obj["ind"] = index;
-            obj["disabled"] = false;
+            obj['value'] = item.id;
+            obj['label'] = item.pest_name;
+            obj['num'] = item.pest_number;
+            obj['ind'] = index;
+            obj['disabled'] = false;
             list.push(obj);
             arr.push(item.id);
           });
@@ -574,7 +707,7 @@ export default {
           this.dialogVisible = true;
           this.addEditor(); // 新添加 - 编辑接口
         })
-        .catch((err) => {
+        .catch(err => {
           console.log(err);
         });
     },
@@ -582,54 +715,54 @@ export default {
     // 新添加 -编辑
     addEditor() {
       this.$axios({
-        method: "POST",
-        url: "/api/api_gateway?method=sysmenage.maintain.pest_list",
+        method: 'POST',
+        url: '/api/api_gateway?method=sysmenage.maintain.pest_list',
         data: this.qs.stringify({
           page: 1, // 页码
-          page_item: "1000000000000000000000000000", // 每页条目数，默认10
-          pest_name: "", // 有害生物
-        }),
+          page_item: '1000000000000000000000000000', // 每页条目数，默认10
+          pest_name: '' // 有害生物
+        })
       })
-        .then((res) => {
+        .then(res => {
           if (res.data.data.total_item !== 0) {
             var data = res.data.data;
             var list = [];
             for (var i = 0; i < data.page_list.length; i++) {
               var obj = {};
-              obj["id"] = data.page_list[i].pest_id;
-              obj["value"] = data.page_list[i].pest_name;
-              obj["label"] = data.page_list[i].pest_name;
-              obj["disabled"] = false;
+              obj['id'] = data.page_list[i].pest_id;
+              obj['value'] = data.page_list[i].pest_name;
+              obj['label'] = data.page_list[i].pest_name;
+              obj['disabled'] = false;
               list.push(obj);
             }
             this.options2 = list;
             this.indexRedact(); // 有害生物删除添加
           }
         })
-        .catch((err) => {
+        .catch(err => {
           console.log(err);
         });
     },
 
     // 添加有害生物
     addInsect() {
-      if (this.insectVal !== "" && this.numVal !== "") {
+      if (this.insectVal !== '' && this.numVal !== '') {
         var array = [];
         var arr = [];
         for (var i = 0; i < this.options2.length; i++) {
           if (this.options2[i].label == this.insectVal) {
             var obj = {};
-            obj["value"] = this.options2[i].id;
-            obj["label"] = this.options2[i].label;
-            obj["num"] = Number(this.numVal);
+            obj['value'] = this.options2[i].id;
+            obj['label'] = this.options2[i].label;
+            obj['num'] = Number(this.numVal);
             arr = [obj, ...this.fillList];
             this.models = [obj.value, ...this.models];
           }
         }
         // 修改原数据
         this.fillList = [];
-        this.insectVal = "";
-        this.numVal = "";
+        this.insectVal = '';
+        this.numVal = '';
         arr.forEach((item, index) => {
           item.ind = index;
           this.fillList.push(item);
@@ -645,11 +778,11 @@ export default {
         // }
         this.indexRedact(); // 有害生物添加
       } else {
-        if (document.getElementsByClassName("el-message").length == 0) {
+        if (document.getElementsByClassName('el-message').length == 0) {
           this.$message({
-            type: "info",
-            message: "请将信息填写完整！",
-            duration: 1500,
+            type: 'info',
+            message: '请将信息填写完整！',
+            duration: 1500
           });
         }
       }
@@ -667,9 +800,9 @@ export default {
       this.fillList = [];
       this.fillList = list;
 
-      this.options2.forEach((item) => {
-        item.disabled = false
-      })
+      this.options2.forEach(item => {
+        item.disabled = false;
+      });
       this.indexRedactA(); // 有害生物删除
     },
 
@@ -679,47 +812,47 @@ export default {
       var array = [];
       for (var i = 0; i < this.fillList.length; i++) {
         var obj = {};
-        obj["pest_name"] = this.fillList[i].label;
-        obj["pest_number"] = this.fillList[i].num;
+        obj['pest_name'] = this.fillList[i].label;
+        obj['pest_number'] = this.fillList[i].num;
         array.push(obj);
       }
 
-      if (this.insectVal !== "" && this.numVal !== "") {
+      if (this.insectVal !== '' && this.numVal !== '') {
         array = [
           {
             pest_name: this.insectVal,
-            pest_number: this.numVal,
+            pest_number: this.numVal
           },
-          ...array,
+          ...array
         ];
       }
 
       this.$axios({
-        method: "POST",
-        url: "/api/api_gateway?method=control_center.task.discern_add",
+        method: 'POST',
+        url: '/api/api_gateway?method=control_center.task.discern_add',
         data: this.qs.stringify({
           record_id: this.examineObj.id, // 任务id
-          pest_list: JSON.stringify(array), // 害虫数组
-        }),
+          pest_list: JSON.stringify(array) // 害虫数组
+        })
       })
-        .then((res) => {
-          if (res.data.message == "") {
-            if (document.getElementsByClassName("el-message").length == 0) {
+        .then(res => {
+          if (res.data.message == '') {
+            if (document.getElementsByClassName('el-message').length == 0) {
               this.$message({
-                type: "success",
-                message: "成功!",
-                duration: 1500,
+                type: 'success',
+                message: '成功!',
+                duration: 1500
               });
             }
             this.fillList = [];
             this.models = [];
             this.dialogVisible = false;
           }
-          this.insectVal = "";
-          this.numVal = "";
+          this.insectVal = '';
+          this.numVal = '';
           this.submitBtn = false;
         })
-        .catch((err) => {
+        .catch(err => {
           this.submitBtn = false;
         });
     },
@@ -729,7 +862,7 @@ export default {
       var list = this.spareData;
       var newList = [];
       // 下拉框数据改变处理
-      var name = "";
+      var name = '';
       for (var i = 0; i < list.length; i++) {
         var obj = {};
         if (e == list[i].value) {
@@ -751,17 +884,17 @@ export default {
       var keychar = String.fromCharCode(keynum); //获取键盘码对应的字符
       if (keynum == 189 || keynum == 109) {
         //禁止输入负数
-        if (document.getElementsByClassName("el-message").length == 0) {
-          this.$message.warning("禁止输入负数");
+        if (document.getElementsByClassName('el-message').length == 0) {
+          this.$message.warning('禁止输入负数');
         }
         e.target.value = 0;
       }
 
-      if (String(e.target.value).indexOf("-") == -1) {
+      if (String(e.target.value).indexOf('-') == -1) {
       } else {
         //禁止输入负数
-        if (document.getElementsByClassName("el-message").length == 0) {
-          this.$message.warning("禁止输入负数");
+        if (document.getElementsByClassName('el-message').length == 0) {
+          this.$message.warning('禁止输入负数');
         }
         e.target.value = 0;
       }
@@ -769,8 +902,8 @@ export default {
 
     // 有害生物添加
     indexRedact() {
-      this.fillList.forEach((item) => {
-        this.options2.forEach((e) => {
+      this.fillList.forEach(item => {
+        this.options2.forEach(e => {
           if (item.label == e.label) {
             e.disabled = true;
             // console.log(e.label, e.disabled);
@@ -780,14 +913,30 @@ export default {
     },
     // 有害生物删除
     indexRedactA() {
-      this.fillList.forEach((item) => {
-        this.options2.forEach((e) => {
+      this.fillList.forEach(item => {
+        this.options2.forEach(e => {
           if (item.label == e.label) {
             // console.log(e.label, e.disabled)
             e.disabled = true;
           }
         });
       });
+    },
+    handleAppraiseClick() {
+      this.appraiseDialogVisible = true;
+    },
+    submitForm(formName) {
+      this.$refs[formName].validate(valid => {
+        if (valid) {
+          alert('submit!');
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    resetForm(formName) {
+      this.$refs[formName].resetFields();
     }
   },
   //生命周期 - 创建完成（可以访问当前this实例）
@@ -805,7 +954,7 @@ export default {
   updated() {}, //生命周期 - 更新之后
   beforeDestroy() {}, //生命周期 - 销毁之前
   destroyed() {}, //生命周期 - 销毁完成
-  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+  activated() {} //如果页面有keep-alive缓存功能，这个函数会触发
 };
 </script>
 <style lang="less" scoped>
@@ -875,6 +1024,11 @@ export default {
           line-height: 30px;
           color: #1890ff;
           cursor: pointer;
+
+          &.fill__appraisal {
+            color: #f55106;
+            text-decoration: underline;
+          }
         }
       }
     }
@@ -891,7 +1045,7 @@ export default {
 /deep/ input::-webkit-inner-spin-button {
   -webkit-appearance: none !important;
 }
-/deep/ input[type="number"] {
+/deep/ input[type='number'] {
   -moz-appearance: textfield !important;
 }
 /deep/.el-date-editor {
@@ -905,4 +1059,10 @@ export default {
   background-color: #409eff;
   border-color: #409eff;
 }
+
+.fill {
+  &__appraisal {
+    color: rgba(245, 81, 6, 1);
+  }
+}
 </style>

minggao/src/page/commandCenter/realTime.vue

@@ -494,7 +494,8 @@ export default {
 
       // 消息发送加载
       msgSetTime: null,
-      socketTimeoutLogs: []
+      socketTimeoutLogs: [],
+      currentVideoCallUserID: ''
     };
   },
   //监听属性 类似于data概念
@@ -729,7 +730,7 @@ export default {
       this.userName = localStorage.getItem('username');
       this.videoTle = '正在和' + data.real_name + '视频通话';
       this.UserID = localStorage.getItem('userID');
-
+      console.warn(data.user_id, '------------------------------ vidoe ');
       // 先获取当前用户的房间号和登录所需的Token
       var obj = {};
       obj = {
@@ -740,6 +741,13 @@ export default {
           msg_info: ''
         }
       };
+      // obj = {
+      //   action: 'reject_video', // 动作标识，必填
+      //   recv_user_id: data.user_id, // 接收人用户id， 非必填
+      //   data: {}
+      // };
+      console.warn(obj, '------------------------------ vidoe ');
+      this.currentVideoCallUserID = data.user_id;
       // console.log('gdahjdgjasgd', data.user_id)
       this.websock.send(JSON.stringify(obj));
       // // 登录房间
@@ -807,6 +815,7 @@ export default {
       clearTimeout(this.timer);
       this.zg.logoutRoom(this.RoomID);
       this.videoVisible = false;
+      this.hangUp();
     },
 
     // 当音视频通话关闭时的回调
@@ -816,6 +825,7 @@ export default {
         .then(_ => {
           done();
           that.notLogin(); // 退出房间
+          this.currentVideoCallUserID = '';
         })
         .catch(_ => {});
     },
@@ -955,12 +965,7 @@ export default {
                 data: {}
               };
 
-              this.websock.send({
-                data: JSON.stringify(obj),
-                async success(res) {
-                  console.warn('占线消息发送成功1111', data.data);
-                }
-              });
+              this.websock.send(JSON.stringify(obj));
               return;
             }
             // 获取当前点击用户的房间号以及登录房间所需的Token
@@ -985,12 +990,7 @@ export default {
                 };
 
                 console.warn('send reject_video', socketData);
-                this.websock.send({
-                  data: JSON.stringify(socketData),
-                  async success(res) {
-                    console.log('reject_video 消息发送成功 reject_video');
-                  }
-                });
+                this.websock.send(JSON.stringify(socketData));
               });
             //
           } else if (data.action == 'send_video_rsp') {
@@ -1271,6 +1271,24 @@ export default {
       //   spinner: "el-icon-loading",
       //   background: "rgba(0, 0, 0, 0.7)",
       // });
+    },
+    hangUp() {
+      if (!this.currentVideoCallUserID) {
+        return;
+      }
+
+      if (this.zg) {
+        this.zg.logoutRoom(this.RoomID);
+      }
+
+      const socketData = {
+        action: 'reject_video', // 动作标识，必填
+        recv_user_id: this.currentVideoCallUserID, // 接收人用户id， 非必填
+        data: {}
+      };
+
+      console.warn('send reject_video', socketData);
+      this.websock.send(JSON.stringify(socketData));
     }
   },
   //生命周期 - 创建完成（可以访问当前this实例）
@@ -1301,6 +1319,8 @@ export default {
   beforeUpdate() {}, //生命周期 - 更新之前
   updated() {}, //生命周期 - 更新之后
   beforeDestroy() {
+    console.log('即时通讯挂断 销毁页面');
+    this.hangUp();
     // var that = this;
     // clearTimeout(that.timeoutnum); // 清除重连
     // clearTimeout(that.timeoutObj); // 清除心跳

minggao/src/page/monitoring/monitoringPest/detail.vue

@@ -0,0 +1,88 @@
+<template>
+  <div>
+    <el-card style="margin-bottom:20px;">
+      <el-descriptions>
+        <el-descriptions-item label="诱捕器编号"
+          >kooriookami</el-descriptions-item
+        >
+        <el-descriptions-item label="隶属海关"
+          >18100000000</el-descriptions-item
+        >
+        <el-descriptions-item label="监测点">苏州市</el-descriptions-item>
+        <el-descriptions-item label="诱剂">
+          <el-tag size="small">蛋白</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="填报人">张三</el-descriptions-item>
+        <el-descriptions-item label="填报时间">张三</el-descriptions-item>
+        <el-descriptions-item label="来源"
+          ><span style="margin-right:20px;"
+            ><el-tag size="small">APP</el-tag></span
+          >
+          <el-button
+            type="info"
+            size="mini"
+            :disabled="exportLoading"
+            @click="handleExportButtonClick"
+          >
+            <i v-if="exportLoading" class="el-icon-loading"></i>导出</el-button
+          ></el-descriptions-item
+        >
+      </el-descriptions>
+    </el-card>
+    <el-card>
+      <el-table :data="tableList" style="width: 100%" :stripe="true">
+        <el-table-column prop="index" label="序号" width="60px">
+          <template slot-scope="scope">
+            <span>{{ scope.row.index }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="pest_name" label="有害生物名称">
+        </el-table-column>
+        <el-table-column prop="pest_number" label="数量"> </el-table-column>
+        <el-table-column prop="pest_number" label="雌"> </el-table-column>
+        <el-table-column prop="pest_number" label="雄"> </el-table-column>
+        <el-table-column prop="pest_number" label="危害作物"> </el-table-column>
+        <el-table-column label="操作" width="100">
+          <template slot-scope="scope">
+            <el-button type="info" size="mini" @click="goToDetail(scope.row)">
+              详情</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      tableList: [],
+      exportLoading: false
+    };
+  },
+  methods: {
+    goToDetail() {},
+    handleExportButtonClick() {
+      this.exportLoading = true;
+
+      setTimeout(() => {
+        this.exportLoading = false;
+      }, 1000);
+    }
+  }
+};
+</script>
+
+<style lang="less" scoped>
+/deep/.el-button--info {
+  background-color: #409eff;
+  border-color: #409eff;
+
+  &.is-disabled {
+    color: #fff;
+    background-color: #c8c9cc;
+    border-color: #c8c9cc;
+  }
+}
+</style>

minggao/src/page/monitoring/monitoringPest.vue

@@ -72,7 +72,10 @@
               <span>{{ (queryInfo.page - 1) * 20 + scope.row.index }}</span>
             </template>
           </el-table-column>
-          <el-table-column prop="trap_number" label="编号"></el-table-column>
+          <el-table-column
+            prop="trap_number"
+            label="诱捕器编号"
+          ></el-table-column>
           <el-table-column prop="org_name" label="隶属组织">
             <template slot-scope="scope">
               <span v-if="scope.row.org_name.split(',').length == 1">{{
@@ -96,13 +99,22 @@
           <el-table-column prop="point_name" label="监测点"> </el-table-column>
           <el-table-column prop="inducer_name" label="诱剂"> </el-table-column>
           <el-table-column prop="pest_name" label="有害生物"> </el-table-column>
-          <el-table-column prop="pest_number" label="有害生物数量">
+          <el-table-column prop="pest_name" label="有害生物种类">
+          </el-table-column>
+          <el-table-column prop="pest_number" label="有害生物总数量">
           </el-table-column>
           <el-table-column prop="user_name" label="填报人"> </el-table-column>
           <el-table-column prop="report_status" label="填报渠道">
           </el-table-column>
           <el-table-column prop="create_time" label="填报时间" width="200">
           </el-table-column>
+          <el-table-column label="操作" width="100">
+            <template slot-scope="scope">
+              <el-button type="info" size="mini" @click="goToDetail(scope.row)">
+                查看详情</el-button
+              >
+            </template>
+          </el-table-column>
         </el-table>
       </div>
       <el-pagination
@@ -345,6 +357,11 @@ export default {
         str += `<p>` + data[i] + `</p>`;
       }
       this.content = str;
+    },
+    goToDetail(row) {
+      this.$router.push({
+        path: '/index/monitoringPestDetail/id'
+      });
     }
   },
   beforeCreate() {}, //生命周期 - 创建之前

minggao/src/router/index.js

@@ -69,7 +69,8 @@ import bait from '@/page/forecasting/trap/bait'; //诱剂维护
 import monitoringtask from '@/page/monitoring/monitoringtask'; //监测任务统计
 import supervisiontask from '@/page/monitoring/supervisiontask'; //监督任务统计
 import monitoringTrack from '@/page/monitoring/monitoringTrack'; //监测轨迹数据
-import monitoringPest from '@/page/monitoring/monitoringPest'; //有害生物数据
+import monitoringPest from '@/page/monitoring/monitoringPest/index'; //有害生物数据
+import monitoringPestDetail from '@/page/monitoring/monitoringPest/detail'; //有害生物数据详情
 
 Vue.use(Router);
 
@@ -337,6 +338,10 @@ export default new Router({
         {
           path: 'monitoringPest',
           component: monitoringPest
+        },
+        {
+          path: 'monitoringPestDetail/:id',
+          component: monitoringPestDetail
         }
       ]
     }