修改bug

src/api/monitor/monitorList.js

@@ -8,3 +8,19 @@ export function list(query) {
     params: query
   })
 }
+
+export function addRow(data) {
+  return request({
+    url: '/warehouse/webcam/add',
+    method: 'post',
+    data: data
+  })
+}
+
+export function editRow(data) {
+  return request({
+    url: '/warehouse/webcam/edit',
+    method: 'post',
+    data: data
+  })
+}

src/views/monitor/alrtmList/index.vue

@@ -49,7 +49,6 @@
     <div style="display:flex;justify-content: space-between;">
       <div>
         <el-button type="primary" size="mini" @click="getData">重新获取告警列表</el-button>
-        </el-button>
       </div>
       <div>
         <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@@ -69,18 +68,27 @@
         :prop="item.label" header-align="center" :align="item.align" :fixed="item.fixed" :show-overflow-tooltip="true">
         <template slot-scope="scope">
           <span v-if="item.label == 'alarmDealResult'">
-            {{ scope.row.alarmDealResult | dealFormat(dealOptions) }}
+            {{  scope.row.alarmDealResult | dealFormat(dealOptions)  }}
           </span>
           <span v-else-if="item.label == 'deviceState'">
             <span>
-              {{ scope.row.deviceState | deviceFormat(deviceOptions) }}
+              {{  scope.row.deviceState | deviceFormat(deviceOptions)  }}
             </span>
           </span>
-          <span v-else>{{ scope.row[item.label] }}</span>
+          <span v-else-if="item.label == 'alarmPicUrl'" @click="openImg(scope.row.alarmPicUrl)">
+            <img ref="img" :src="scope.row.alarmPicUrl" style="width: 100px;height: 60px;" alt="">
+          </span>
+          <span v-else>{{  scope.row[item.label]  }}</span>
         </template>
       </el-table-column>
     </el-table>
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" />
+    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+      @pagination="getList" />
+    <el-dialog title="预警图片" v-dialogDrag :visible.sync="dialogImg" @closed="imgClosed">
+      <div style="width:100%; height:60vh;">
+        <img ref="img" :src="imgUrl" style="width: 100%;height:100%;" alt="">
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -94,6 +102,7 @@ export default {
   data() {
     return {
       show: false,
+      dialogImg: false,
       tableOption: tableOption,
       // 遮罩层
       loading: true,
@@ -109,6 +118,7 @@ export default {
       showSearch: true,
       dealOptions: [],
       deviceOption: [],
+      imgUrl: '',
     };
   },
   created() {
@@ -176,6 +186,15 @@ export default {
             this.handleQuery()
           });
       })
+    },
+    openImg(row) {
+      if (row) {
+        this.imgUrl = row;
+        this.dialogImg = true
+      }
+    },
+    imgClosed() {
+      this.imgUrl = this.$options.data().imgUrl
     }
   }
 };

src/views/monitor/alrtmList/js/index.js

@@ -1,105 +1,113 @@
 export const tableOption = [{
-    surface: "1",
-    label: "projectName",
-    name: "项目名称",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "2",
-    label: "companyName",
-    name: "客户名称",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "3",
-    label: "dNickName",
-    name: "设备名",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "4",
-    label: "alarmDate",
-    name: "告警时间",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "5",
-    label: "alarmDealDate",
-    name: "告警处理时间",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "6",
-    label: "alarmDealPeople",
-    name: "告警处理人",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "7",
-    label: "alarmDealResult",
-    name: "告警处理结果",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "8",
-    label: "alarmLocation",
-    name: "告警位置",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "9",
-    label: "alarmTypeName",
-    name: "报警类型名称",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "10",
-    label: "deviceLocation",
-    name: "设备位置",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "11",
-    label: "deviceState",
-    name: "设备状态",
-    align:"center",
-    checked: 0,
-    width: 100,
-  },
-  {
-    surface: "12",
-    label: "alarmSiteDescription",
-    name: "现场报警情况描述",
-    align:"center",
-    checked: 0,
-    width: 140,
-  },
-  {
-    surface: "13",
-    label: "alarmPlanResult",
-    name: "处理方案及结果",
-    align:"center",
-    checked: 0,
-    width: 120,
-  }
+  surface: "1",
+  label: "projectName",
+  name: "项目名称",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "2",
+  label: "companyName",
+  name: "客户名称",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "3",
+  label: "dNickName",
+  name: "设备名",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "4",
+  label: "alarmDate",
+  name: "告警时间",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "5",
+  label: "alarmDealDate",
+  name: "告警处理时间",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "6",
+  label: "alarmDealPeople",
+  name: "告警处理人",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "7",
+  label: "alarmDealResult",
+  name: "告警处理结果",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "8",
+  label: "alarmLocation",
+  name: "告警位置",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "9",
+  label: "alarmTypeName",
+  name: "报警类型名称",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "10",
+  label: "deviceLocation",
+  name: "设备位置",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "11",
+  label: "deviceState",
+  name: "设备状态",
+  align: "center",
+  checked: 0,
+  width: 100,
+},
+{
+  surface: "12",
+  label: "alarmSiteDescription",
+  name: "现场报警情况描述",
+  align: "center",
+  checked: 0,
+  width: 140,
+},
+{
+  surface: "13",
+  label: "alarmPlanResult",
+  name: "处理方案及结果",
+  align: "center",
+  checked: 0,
+  width: 120,
+},
+{
+  surface: "14",
+  label: "alarmPicUrl",
+  name: "预警图片",
+  align: "center",
+  checked: 0,
+  width: 200,
+}
 ]

src/views/monitor/monitorList/index.vue

@@ -1,24 +1,29 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" label-width="80px" v-show="showSearch">
+    <el-form :model="queryParams" label-width="80px" v-show="showSearch">
       <el-row>
         <el-col :span="6">
-          <el-form-item label="仓库" prop="fWarehouseName">
-            <el-input v-model="queryParams.fWarehouseName" placeholder="请输入仓库" clearable size="small"
-              @keyup.enter.native="handleQuery" />
+          <el-form-item label="仓库" prop="fWarehouseId">
+            <!-- <el-input v-model="queryParams.fWarehouseId" placeholder="请输入仓库" clearable size="small"
+              @keyup.enter.native="handleQuery" /> -->
+            <el-select v-model="queryParams.fWarehouseId" clearable filterable style="width: 100%" placeholder="请选择仓库"
+              size="small" @change="warehouseChange">
+              <el-option v-for="(item, index) in warehouseOptions" :key="index.fId" :label="item.fName"
+                :value="item.fId"></el-option>
+            </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-        <el-form-item label="监控名称" prop="deviceName">
-          <el-input v-model="queryParams.deviceName" placeholder="请输入监控名称" clearable size="small"
-            @keyup.enter.native="handleQuery" />
-        </el-form-item>
+          <el-form-item label="设备名称" prop="deviceName">
+            <el-input v-model="queryParams.deviceName" placeholder="请输入监控项目" clearable size="small"
+              @keyup.enter.native="handleQuery" />
+          </el-form-item>
         </el-col>
       </el-row>
     </el-form>
     <div style="display:flex;justify-content: space-between;">
       <div>
-        <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" disabled>新增
+        <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增
         </el-button>
       </div>
       <div>
@@ -30,47 +35,63 @@
     <el-table v-loading="loading" :data="list" style="width: 100%;">
       <el-table-column label="序号" type="index" width="50" />
       <el-table-column v-for="(item, index) in tableOption" :key="index" :label="item.name" :width="item.width"
-        :prop="item.label" header-align="center" :align="item.align" :fixed="item.fixed"
-        :show-overflow-tooltip="true" />
+        :prop="item.label" header-align="center" :align="item.align" :fixed="item.fixed" :show-overflow-tooltip="true">
+        <template slot-scope="scope">
+          <span v-if="item.label == 'projectId'">
+            {{  scope.row.projectId | projectIdFormat(projectIdOptions)  }}
+          </span>
+          <span v-else>{{  scope.row[item.label]  }}</span>
+        </template>
+      </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200" fixed="right">
         <template slot-scope="scope">
           <el-button size="mini" type="text" icon="el-icon-view" @click="rowView(scope.row)">
             查看视频
           </el-button>
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="rowDell(scope.row)" disabled>
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="rowDell(scope.row)">
             修改
           </el-button>
-          <el-button size="mini" type="text" icon="el-icon-delete" @click="rowDel(scope.row)" disabled>
+          <!-- <el-button size="mini" type="text" icon="el-icon-delete" @click="rowDel(scope.row)" disabled>
             删除
-          </el-button>
+          </el-button> -->
         </template>
       </el-table-column>
     </el-table>
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" />
-    <el-dialog :title="title" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
+    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>
+    <el-dialog :title="title" :visible.sync="dialogVisible" width="30%" @closed="handleClose">
       <span>
-        <el-form :model="form" ref="queryForm" :inline="true" label-width="100px">
-          <el-form-item label="仓库" prop="fWarehouseName">
-            <el-input v-model="form.fWarehouseName" placeholder="请输入仓库" clearable size="small" />
+        <el-form :model="form" :rules="rules" ref="queryForm" label-width="100px">
+          <el-form-item label="仓库" prop="fWarehouseId">
+            <el-select v-model="form.fWarehouseId" clearable filterable style="width: 100%" placeholder="请选择仓库"
+              size="small" @change="warehouseChange">
+              <el-option v-for="(item, index) in warehouseOptions" :key="index.fId" :label="item.fName"
+                :value="item.fId"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="监控项目" prop="projectId">
+            <el-select v-model="form.projectId" clearable placeholder="请选择监控项目" style="width:100%">
+              <el-option v-for="(item, index) in projectIdOptions" :key="index.dictValue" :label="item.dictLabel"
+                :value="item.dictValue" />
+            </el-select>
           </el-form-item>
-          <el-form-item label="监控名称" prop="deviceName">
-            <el-input v-model="form.deviceName" placeholder="请输入监控名称" clearable size="small" />
+          <el-form-item label="设备名称" prop="deviceName">
+            <el-input v-model="form.deviceName" placeholder="请输入设备名称" clearable size="small" />
           </el-form-item>
           <el-form-item label="设备序列号" prop="deviceSerial">
             <el-input v-model="form.deviceSerial" placeholder="请输入设备序列号" clearable size="small" />
           </el-form-item>
-          <el-form-item label="萤石云验证码" prop="code">
-            <el-input v-model="form.code" placeholder="请输入萤石云验证码" clearable size="small" />
+          <el-form-item label="通道号" prop="code">
+            <el-input v-model="form.code" placeholder="请输入通道号" clearable size="small" />
           </el-form-item>
         </el-form>
       </span>
       <span slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="submit">{{ title == '添加' ? '保 存' : '修 改' }}</el-button>
+        <el-button type="primary" @click="submit(title)">{{  title == '添加' ? '保 存' : '修 改'  }}</el-button>
       </span>
     </el-dialog>
-    <el-dialog title="查看监控" :visible.sync="dialogVideo">
-      <div style="width:100%; height:60vh;">
+    <el-dialog title="查看监控" v-dialogDrag :visible.sync="dialogVideo">
+      <div style="width:100%; height:80vh;">
         <iframe :src="iframeSrc" width="100%" height="100%" frameborder="0" scrolling="no">
         </iframe>
       </div>
@@ -80,7 +101,8 @@
 
 <script>
 import { tableOption } from "./js/index";
-import { list, getAccessToken, getTokenvideoWeb } from "@/api/monitor/monitorList";
+import { list, addRow, editRow } from "@/api/monitor/monitorList";
+import { listWarehousesss } from '@/api/basicdata/warehouse'
 import Axios from "axios";
 
 export default {
@@ -103,15 +125,51 @@ export default {
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        fWarehouseName: undefined,
+        fWarehouseId: undefined,
         deviceName: undefined
       },
       showSearch: true,
+      projectIdOptions: [],
+      warehouseOptions: [],
+      rules: {
+        fWarehouseId: [
+          { required: true, message: ' ', trigger: 'blur' }
+        ],
+        projectId: [
+          { required: true, message: ' ', trigger: 'blur' }
+        ],
+        deviceName: [
+          { required: true, message: ' ', trigger: 'blur' }
+        ],
+        deviceSerial: [
+          { required: true, message: ' ', trigger: 'blur' }
+        ],
+        code: [
+          { required: true, message: ' ', trigger: 'blur' }
+        ]
+      }
     };
   },
   created() {
+    this.getDicts("monitor_project").then((response) => {
+      this.projectIdOptions = response.data;
+    });
+    listWarehousesss({ fStatus: 0, delFlag: 0 }).then((response) => {
+      this.warehouseOptions = response.rows
+    })
     this.getList();
   },
+  filters: {
+    projectIdFormat(row, list) {
+      let name = ""
+      list.map((e) => {
+        if (row == e.dictValue) {
+          name = e.dictLabel;
+        }
+      });
+      return name;
+    }
+  },
   methods: {
     /** 查询登录日志列表 */
     getList() {
@@ -136,6 +194,41 @@ export default {
       this.title = '添加'
       this.dialogVisible = true
     },
+    // 获取仓库信息
+    warehouseChange(row) {
+      if (row) {
+        this.warehouseOptions.forEach(item => {
+          if (row == item.fId) {
+            this.form.fWarehouseName = item.fName
+          }
+        })
+      } else {
+        this.form.fWarehouseName = null
+      }
+    },
+    submit(status) {
+      this.$refs.queryForm.validate((valid) => {
+        if (valid) {
+          if (status == '添加') {
+            addRow(this.form).then(response => {
+              this.$message.success('添加成功');
+              this.dialogVisible = false;
+              this.handleQuery();
+            });
+          } else {
+            editRow(this.form).then(response => {
+              this.$message.success('添加成功');
+              this.dialogVisible = false;
+              this.handleQuery();
+            });
+
+          }
+        } else {
+          return false;
+        }
+      });
+
+    },
     rowView(row) {
       Axios.post("/dev-api/api/LiveBroadcast/getAccessToken").then(res => {
         Axios.post(`/dev-api/api/LiveBroadcast/getToken?productCode=1640070936703286&token=${res.data.data.access_token}`).then(res2 => {
@@ -146,12 +239,12 @@ export default {
             params: {
               deviceSerial: row.deviceSerial,
               projectId: row.projectId,
+              channelNo: row.code,
               token: res.data.data.access_token,
               Authorization: res2.data.data.data.Authorization
             }
           })
             .then(response => {
-              console.log(response)
               this.dialogVideo = true
               this.iframeSrc = response.data.data.data.previewUrl
             });
@@ -164,7 +257,8 @@ export default {
       this.form = row
     },
     handleClose() {
-      this.form = this.$options.data().form
+      this.form = this.$options.data().form;
+      this.dialogVisible = false;
     }
   }
 };

src/views/monitor/monitorList/js/index.js

@@ -1,33 +1,41 @@
 export const tableOption = [{
-    surface: "1",
-    label: "fWarehouseName",
-    name: "仓库",
-    align:"center",
-    checked: 0,
-    width: 200,
-  },
-  {
-    surface: "2",
-    label: "deviceName",
-    name: "监控名称",
-    align:"center",
-    checked: 0,
-    width: 200,
-  },
-  {
-    surface: "3",
-    label: "deviceSerial",
-    name: "设备序列号",
-    align:"center",
-    checked: 0,
-    width: 200,
-  },
-  {
-    surface: "4",
-    label: "code",
-    name: "萤石云验证码",
-    align:"center",
-    checked: 0,
-    width: 200,
-  }
+  surface: "1",
+  label: "fWarehouseName",
+  name: "仓库",
+  align: "center",
+  checked: 0,
+  width: 200,
+},
+{
+  surface: "2",
+  label: "projectId",
+  name: "监控项目",
+  align: "center",
+  checked: 0,
+  width: 200,
+},
+{
+  surface: "2",
+  label: "deviceName",
+  name: "设备名称",
+  align: "center",
+  checked: 0,
+  width: 200,
+},
+{
+  surface: "3",
+  label: "deviceSerial",
+  name: "设备序列号",
+  align: "center",
+  checked: 0,
+  width: 200,
+},
+{
+  surface: "4",
+  label: "code",
+  name: "通道号",
+  align: "center",
+  checked: 0,
+  width: 200,
+}
 ]