优化通道数据显示

src/main/java/com/genersoft/iot/vmp/gb28181/dao/DeviceChannelMapper.java

@@ -35,7 +35,7 @@ public interface DeviceChannelMapper {
             ", device_id=#{deviceId}" +
             ", device_db_id=#{deviceDbId}" +
             ", name=#{name}" +
-            ", manufacturer#{manufacturer}" +
+            ", manufacturer=#{manufacturer}" +
             ", model=#{model}" +
             ", owner=#{owner}" +
             ", civil_code=#{civilCode}" +
@@ -118,6 +118,7 @@ public interface DeviceChannelMapper {
 
     @Select(value = {" <script>" +
             "SELECT " +
+            " dc.id,\n" +
             " dc.device_db_id,\n" +
             " dc.create_time,\n" +
             " dc.update_time,\n" +
@@ -254,6 +255,7 @@ public interface DeviceChannelMapper {
     List<DeviceChannelExtend> queryChannelsWithDeviceInfo(@Param("deviceId") String deviceId, @Param("parentChannelId") String parentChannelId, @Param("query") String query, @Param("hasSubChannel") Boolean hasSubChannel, @Param("online") Boolean online, @Param("channelIds") List<String> channelIds);
 
     @Select("SELECT " +
+            " dc.id,\n" +
             " dc.device_db_id,\n" +
             " dc.create_time,\n" +
             " dc.update_time,\n" +

src/main/java/com/genersoft/iot/vmp/gb28181/dao/DeviceMapper.java

@@ -338,7 +338,7 @@ public interface DeviceMapper {
             " FROM wvp_device de" +
             " where 1 = 1 "+
             " <if test='status != null'> AND de.on_line=${status}</if>"+
-            " <if test='query != null'> AND coalesce(custom_name, name) as name LIKE '%${query}%'</if> " +
+            " <if test='query != null'> AND coalesce(custom_name, name) LIKE '%${query}%'</if> " +
             " order by create_time desc "+
             " </script>")
     List<Device> getDeviceList(@Param("query") String query, @Param("status") Boolean status);

src/main/java/com/genersoft/iot/vmp/vmanager/gb28181/device/DeviceQuery.java

@@ -108,8 +108,9 @@ public class DeviceQuery {
 	@GetMapping("/devices")
 	@Options()
 	public PageInfo<Device> devices(int page, int count, String query, Boolean status){
-//		if (page == null) page = 0;
-//		if (count == null) count = 20;
+		if (ObjectUtils.isEmpty(query)){
+			query = null;
+		}
 		return deviceService.getAll(page, count, query, status);
 	}
 

web_src/src/components/ChannelEdit.vue

@@ -0,0 +1,142 @@
+<template>
+  <div id="ChannelEdit" v-loading="isLoging">
+    <el-form ref="passwordForm" :rules="rules" status-icon label-width="80px">
+      <el-form-item label="用户名" prop="username">
+        <el-input v-model="username" autocomplete="off"></el-input>
+      </el-form-item>
+      <el-form-item label="用户类型" prop="roleId" >
+        <el-select v-model="roleId"  placeholder="请选择" style="width: 100%">
+          <el-option
+            v-for="item in options"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input v-model="password" autocomplete="off"></el-input>
+      </el-form-item>
+      <el-form-item label="确认密码" prop="confirmPassword">
+        <el-input v-model="confirmPassword" autocomplete="off"></el-input>
+      </el-form-item>
+
+      <el-form-item>
+        <div style="float: right;">
+          <el-button type="primary" @click="onSubmit">保存</el-button>
+          <el-button @click="close">取消</el-button>
+        </div>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "channelEdit",
+  props: {},
+  computed: {},
+  created() {
+
+  },
+  data() {
+    let validatePass1 = (rule, value, callback) => {
+      if (value === '') {
+        callback(new Error('请输入新密码'));
+      } else {
+        if (this.confirmPassword !== '') {
+          this.$refs.passwordForm.validateField('confirmPassword');
+        }
+        callback();
+      }
+    };
+    let validatePass2 = (rule, value, callback) => {
+      if (this.confirmPassword === '') {
+        callback(new Error('请再次输入密码'));
+      } else if (this.confirmPassword !== this.password) {
+        callback(new Error('两次输入密码不一致!'));
+      } else {
+        callback();
+      }
+    };
+    return {
+      value:"",
+      options: [],
+      loading: false,
+      username: null,
+      password: null,
+      roleId: null,
+      confirmPassword: null,
+      listChangeCallback: null,
+      showDialog: false,
+      isLoging: false,
+      rules: {
+        newPassword: [{required: true, validator: validatePass1, trigger: "blur"}, {
+          pattern: /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,.\/]).{8,20}$/,
+          message: "密码长度在8-20位之间,由字母+数字+特殊字符组成",
+        },],
+        confirmPassword: [{required: true, validator: validatePass2, trigger: "blur"}],
+      },
+    };
+  },
+  methods: {
+    openDialog: function (callback) {
+      this.listChangeCallback = callback;
+      this.showDialog = true;
+    },
+    onSubmit: function () {
+      this.$axios({
+        method: 'post',
+        url: "/api/user/add",
+        params: {
+          username: this.username,
+          password: this.password,
+          roleId: this.roleId
+        }
+      }).then((res) => {
+        if (res.data.code === 0) {
+          this.$message({
+            showClose: true,
+            message: '添加成功',
+            type: 'success',
+
+          });
+          this.showDialog = false;
+          this.listChangeCallback()
+
+        } else {
+          this.$message({
+            showClose: true,
+            message: res.data.msg,
+            type: 'error'
+          });
+        }
+      }).catch((error) => {
+        console.error(error)
+      });
+    },
+    close: function () {
+      this.showDialog = false;
+      this.password = null;
+      this.confirmPassword = null;
+      this.username = null;
+      this.roleId = null;
+    },
+    getAllRole:function () {
+
+      this.$axios({
+        method: 'get',
+        url: "/api/role/all"
+      }).then((res) => {
+        this.loading = true;
+        if (res.data.code === 0) {
+          this.options=res.data.data
+        }
+      }).catch((error) => {
+        console.error(error)
+      });
+    }
+  },
+};
+</script>

web_src/src/components/DeviceList.vue

@@ -3,6 +3,16 @@
     <div class="page-header">
       <div class="page-title">设备列表</div>
       <div class="page-header-btn">
+        搜索:
+        <el-input @input="getDeviceList" style="margin-right: 1rem; width: auto;" size="mini" placeholder="关键字"
+                  prefix-icon="el-icon-search" v-model="searchSrt" clearable></el-input>
+        在线状态:
+        <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="getDeviceList" v-model="online" placeholder="请选择"
+                   default-first-option>
+          <el-option label="全部" value=""></el-option>
+          <el-option label="在线" value="true"></el-option>
+          <el-option label="离线" value="false"></el-option>
+        </el-select>
         <el-button icon="el-icon-plus" size="mini" style="margin-right: 1rem;" type="primary" @click="add">添加设备
         </el-button>
         <el-button icon="el-icon-refresh-right" circle size="mini" :loading="getDeviceListLoading"
@@ -106,7 +116,8 @@ export default {
     return {
       deviceList: [], //设备列表
       currentDevice: {}, //当前操作设备对象
-
+      searchSrt: "",
+      online: null,
       videoComponentList: [],
       updateLooper: 0, //数据刷新轮训标志
       currentDeviceChannelsLenth: 0,
@@ -157,7 +168,9 @@ export default {
         url: `/api/device/query/devices`,
         params: {
           page: this.currentPage,
-          count: this.count
+          count: this.count,
+          query: this.searchSrt,
+          status: this.online,
         }
       }).then( (res)=> {
         if (res.data.code === 0) {

web_src/src/components/channelList.vue

@@ -52,20 +52,9 @@
       <el-main style="padding: 5px;">
         <el-table ref="channelListTable" :data="deviceChannelList" :height="winHeight" style="width: 100%"
                   header-row-class-name="table-header">
-          <el-table-column prop="deviceId" label="编号" min-width="180">
-          </el-table-column>
           <el-table-column prop="name" label="名称" min-width="180">
-            <template v-slot:default="scope">
-              <el-input
-                v-show="scope.row.edit"
-                v-model="scope.row.name"
-                placeholder="通道名称"
-                :maxlength="255"
-                show-word-limit
-                clearable
-              />
-              <span v-show="!scope.row.edit">{{ scope.row.name }}</span>
-            </template>
+          </el-table-column>
+          <el-table-column prop="deviceId" label="编号" min-width="180">
           </el-table-column>
           <el-table-column label="快照" min-width="100">
             <template v-slot:default="scope">
@@ -85,20 +74,7 @@
           </el-table-column>
           <el-table-column prop="manufacturer" label="厂家" min-width="100">
           </el-table-column>
-          <el-table-column prop="model" label="型号" min-width="150">
-          </el-table-column>
-          <el-table-column label="位置信息" min-width="120">
-            <template v-slot:default="scope">
-              <el-input
-                v-show="scope.row.edit"
-                v-model="scope.row.location"
-                placeholder="例：117.234,36.378"
-                :maxlength="30"
-                show-word-limit
-                clearable
-              />
-              <span v-show="!scope.row.edit">{{ scope.row.location }}</span>
-            </template>
+          <el-table-column prop="location" label="位置信息" min-width="120">
           </el-table-column>
           <el-table-column prop="ptzType" label="云台类型" min-width="100">
             <template v-slot:default="scope">
@@ -146,16 +122,6 @@
               </el-button>
               <el-divider direction="vertical"></el-divider>
               <el-button
-                v-if="scope.row.edit"
-                size="medium"
-                type="text"
-                icon="el-icon-edit-outline"
-                @click="handleSave(scope.row)"
-              >
-                保存
-              </el-button>
-              <el-button
-                v-else
                 size="medium"
                 type="text"
                 icon="el-icon-edit"
@@ -169,13 +135,6 @@
                          @click="changeSubchannel(scope.row)">查看
               </el-button>
               <el-divider v-if="scope.row.subCount > 0 || scope.row.parental === 1" direction="vertical"></el-divider>
-<!--              <el-button size="medium" v-bind:disabled="device == null || device.online === 0"-->
-<!--                         icon="el-icon-video-camera"-->
-<!--                         type="text" @click="queryRecords(scope.row)">设备录像-->
-<!--              </el-button>-->
-<!--              <el-button size="medium" v-bind:disabled="device == null || device.online === 0" icon="el-icon-cloudy"-->
-<!--                         type="text" @click="queryCloudRecords(scope.row)">云端录像-->
-<!--              </el-button>-->
               <el-dropdown @command="(command)=>{moreClick(command, scope.row)}">
                 <el-button size="medium" type="text" >
                   更多功能<i class="el-icon-arrow-down el-icon--right"></i>
@@ -315,11 +274,8 @@ export default {
           that.deviceChannelList = res.data.data.list;
           that.deviceChannelList.forEach(e => {
             e.ptzType = e.ptzType + "";
-            that.$set(e, "edit", false);
             that.$set(e, "location", "");
-            if (e.customLongitude && e.customLatitude) {
-              that.$set(e, "location", e.customLongitude + "," + e.customLatitude);
-            }else if (e.longitude && e.latitude) {
+            if (e.longitude && e.latitude) {
               that.$set(e, "location", e.longitude + "," + e.latitude);
             }
           });
@@ -415,7 +371,7 @@ export default {
     },
     getSnap: function (row) {
       let baseUrl = window.baseUrl ? window.baseUrl : "";
-      return ((process.env.NODE_ENV === 'development') ? process.env.BASE_API : baseUrl) + '/api/device/query/snap/' + row.deviceId + '/' + row.channelId;
+      return ((process.env.NODE_ENV === 'development') ? process.env.BASE_API : baseUrl) + '/api/device/query/snap/' + this.deviceId + '/' + row.deviceId;
     },
     getBigSnap: function (row) {
       return [this.getSnap(row)]
@@ -472,11 +428,8 @@ export default {
             this.deviceChannelList = res.data.data.list;
             this.deviceChannelList.forEach(e => {
               e.ptzType = e.ptzType + "";
-              this.$set(e, "edit", false);
               this.$set(e, "location", "");
-              if (e.customLongitude && e.customLatitude) {
-                this.$set(e, "location", e.customLongitude + "," + e.customLatitude);
-              }else if (e.longitude && e.latitude) {
+              if (e.longitude && e.latitude) {
                 this.$set(e, "location", e.longitude + "," + e.latitude);
               }
             });
@@ -590,65 +543,9 @@ export default {
       }
       this.initData();
     },
-    // 保存
-    handleSave(row) {
-      if (row.location) {
-        const segements = row.location.split(",");
-        if (segements.length !== 2) {
-          console.log(1)
-          this.$message.warning("位置信息格式有误，例：117.234,36.378");
-          return;
-        } else {
-          row.customLongitude = parseFloat(segements[0]);
-          row.customLatitude = parseFloat(segements[1]);
-          if (!(row.customLongitude && row.customLatitude)) {
-            this.$message.warning("位置信息格式有误，例：117.234,36.378");
-            return;
-          }
-        }
-      } else {
-        delete row.longitude;
-        delete row.latitude;
-      }
-      Object.keys(row).forEach(key => {
-        const value = row[key];
-        if (value === null || value === undefined || (typeof value === "string" && value.trim() === "")) {
-          delete row[key];
-        }
-      });
-      this.$axios({
-        method: 'post',
-        url: `/api/device/query/channel/update/${this.deviceId}`,
-        params: row
-      }).then(response => {
-        if (response.data.code === 0) {
-          this.$message.success("修改成功！");
-          this.initData();
-        } else {
-          this.$message.error("修改失败！");
-        }
-      }).catch(_ => {
-        this.$message.error("修改失败！");
-      })
-    },
-    // 是否正在编辑
-    isEdit() {
-      let editing = false;
-      this.deviceChannelList.forEach(e => {
-        if (e.edit) {
-          editing = true;
-        }
-      });
-
-      return editing;
-    },
     // 编辑
     handleEdit(row) {
-      if (this.isEdit()) {
-        this.$message.warning('请保存当前编辑项！');
-      } else {
-        row.edit = true;
-      }
+
     }
   }
 };