fix():添加历史回放视频上传和下载

王鑫
1 parent f27bd761
Showing 11 changed files with 472 additions and 64 deletions
src/main/java/com/genersoft/iot/vmp/vmanager/jt1078/platform/Jt1078OfCarController.java
src/main/java/com/genersoft/iot/vmp/vmanager/jt1078/platform/controller/HistoryRecordController.java
src/main/java/com/genersoft/iot/vmp/vmanager/jt1078/platform/domain/HistoryRecord.java
src/main/java/com/genersoft/iot/vmp/vmanager/jt1078/platform/mapper/HisToryRecordMapper.java
src/main/java/com/genersoft/iot/vmp/vmanager/jt1078/platform/service/HisToryRecordService.java
src/main/java/com/genersoft/iot/vmp/vmanager/jt1078/platform/service/impl/HisToryRecordServiceImpl.java
src/main/resources/mapper/HisToryRecordMapper.xml
web_src/src/components/FlowStatistics.vue
web_src/src/components/HistoricalRecord.vue
web_src/src/components/JT1078Components/HistoryData.vue
web_src/src/components/JT1078Components/historical/HistoricalDataTree.vue
@@ -28,9 +28,11 @@ import com.genersoft.iot.vmp.vmanager.jt1078.platform.ben.HttpClientPostEntity;
 import com.genersoft.iot.vmp.vmanager.jt1078.platform.config.Jt1078ConfigBean;
 import com.genersoft.iot.vmp.vmanager.jt1078.platform.config.RtspConfigBean;
 import com.genersoft.iot.vmp.vmanager.jt1078.platform.config.TuohuaConfigBean;
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.domain.HistoryRecord;
 import com.genersoft.iot.vmp.vmanager.jt1078.platform.domain.PatrolDataReq;
 import com.genersoft.iot.vmp.vmanager.jt1078.platform.handler.HttpClientUtil;
 import com.genersoft.iot.vmp.vmanager.jt1078.platform.service.FlowService;
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.service.HisToryRecordService;
 import com.genersoft.iot.vmp.vmanager.jt1078.platform.service.Jt1078OfService;
 import com.genersoft.iot.vmp.vmanager.streamProxy.StreamProxyController;
 import com.genersoft.iot.vmp.vmanager.streamPush.StreamPushController;
@@ -106,6 +108,8 @@ public class Jt1078OfCarController {
     private FlowService flowService;
     @Resource
     private Jt1078OfService jt1078OfService;
+    @Resource
+    private HisToryRecordService hisToryRecordService;
     //存储历史端口 key -->端口  value ---> sim-channel-startTime-endTime-port
     public static final ConcurrentHashMap<Integer, Set<String>> map = new ConcurrentHashMap<>();
@@ -157,7 +161,6 @@ public class Jt1078OfCarController {
             String msg = jt1078ConfigBean.formatMessageHistoryUpload(stream);
             HttpClientPostEntity httpClientPost = this.httpClientUtil.doPost(url, msg, (String) null);
             chooseEntity(httpClientPost, url, false);
-
         } catch (Exception e) {
             throw new RuntimeException(e);
         }
+package com.genersoft.iot.vmp.vmanager.jt1078.platform.controller;
+
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.domain.HistoryRecord;
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.service.HisToryRecordService;
+import lombok.AllArgsConstructor;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+/**
+ * 历史视频下载记录控制层
+ *
+ * @Author WangXin
+ * @Data 2025/2/22
+ * @Version 1.0.0
+ */
+@RestController
+@RequestMapping("/historyRecord")
+@AllArgsConstructor
+public class HistoryRecordController {
+
+    private final HisToryRecordService hisToryRecordService;
+
+    /**
+     * 添加历史下载记录
+     * @param record 历史视频下载记录对象
+     */
+    @PostMapping("/addRecode")
+    public String addRecode(@RequestBody HistoryRecord record) {
+        return hisToryRecordService.addRecode(record);
+    }
+
+
+}
+package com.genersoft.iot.vmp.vmanager.jt1078.platform.domain;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import lombok.AllArgsConstructor;
+import lombok.Data;
+import lombok.NoArgsConstructor;
+import lombok.experimental.SuperBuilder;
+import org.springframework.format.annotation.DateTimeFormat;
+
+import java.util.Date;
+
+/**
+ * 历史视频下载记录类
+ *
+ * @Author WangXin
+ * @Data 2025/2/22
+ * @Version 1.0.0
+ */
+@Data
+@SuperBuilder
+@AllArgsConstructor
+@NoArgsConstructor
+public class HistoryRecord {
+    /**
+     * 主键
+     */
+    private String id;
+    /**
+     * 名称
+     */
+    private String name;
+    /**
+     * sim号
+     */
+    private String sim;
+    /**
+     * 通道号
+     */
+    private String channel;
+    /**
+     * 状态
+     */
+    private String status;
+    /**
+     * FTP IP
+     */
+    private String ip;
+    /**
+     * FTP端口
+     */
+    private String port;
+    /**
+     * FTP账号
+     */
+    private String username;
+    /**
+     * FTP密码
+     */
+    private String password;
+    /**
+     * 修改时间
+     */
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    @DateTimeFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private Date createTime;
+    /**
+     * 创建时间
+     */
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    @DateTimeFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private Date updateTime;
+    /**
+     * 创建人
+     */
+    private String createBy;
+    /**
+     * 修改人
+     */
+    private String updateBy;
+    /**
+     * 备注
+     */
+    private String remark;
+
+}
+package com.genersoft.iot.vmp.vmanager.jt1078.platform.mapper;
+
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.domain.HistoryRecord;
+import org.apache.ibatis.annotations.Mapper;
+
+/**
+ * @Author WangXin
+ * @Data 2025/2/22
+ * @Version 1.0.0
+ */
+@Mapper
+public interface HisToryRecordMapper {
+
+    /**
+     * 添加历史下载记录
+     * @param record 历史视频下载记录对象
+     */
+    Integer addRecode(HistoryRecord record);
+}
+package com.genersoft.iot.vmp.vmanager.jt1078.platform.service;
+
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.domain.HistoryRecord;
+
+/**
+ * @Author WangXin
+ * @Data 2025/2/22
+ * @Version 1.0.0
+ */
+public interface HisToryRecordService {
+    /**
+     * 添加历史下载记录
+     * @param record 历史视频下载记录对象
+     */
+    String addRecode(HistoryRecord record);
+}
+package com.genersoft.iot.vmp.vmanager.jt1078.platform.service.impl;
+
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.domain.HistoryRecord;
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.mapper.HisToryRecordMapper;
+import com.genersoft.iot.vmp.vmanager.jt1078.platform.service.HisToryRecordService;
+import lombok.AllArgsConstructor;
+import org.springframework.stereotype.Service;
+
+/**
+ * @Author WangXin
+ * @Data 2025/2/22
+ * @Version 1.0.0
+ */
+@Service
+@AllArgsConstructor
+public class HisToryRecordServiceImpl implements HisToryRecordService {
+
+    private final HisToryRecordMapper hisToryRecordMapper;
+    /**
+     * 添加历史下载记录
+     * @param record 历史视频下载记录对象
+     */
+    @Override
+    public String addRecode(HistoryRecord record) {
+        return hisToryRecordMapper.addRecode(record) > 0 ? "success" : "fail";
+    }
+}
+<?xml version="1.0" encoding="UTF-8" ?>
+<!DOCTYPE mapper
+        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
+        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
+<mapper namespace="com.genersoft.iot.vmp.vmanager.jt1078.platform.mapper.HisToryRecordMapper">
+
+    <insert id="addRecode">
+        INSERT INTO `wvp_history_record`
+            (`id`, `name`, `sim`, `channel`, `status`, `ip`, `port`, `username`, `password`, `create_time`, `update_time`, `create_by`, `update_by`, `remark`)
+        VALUES
+            (#{id}, #{name}, #{sim}, #{channel}, #{status}, #{ip}, #{port}, #{username}, #{password}, #{createTime}, #{updateTime}, #{createBy}, #{updateBy}, #{remark})
+    </insert>
+</mapper>
@@ -228,11 +228,7 @@ export default {
      */
     searchFlowList() {
       this.loading = true
-      let simChannel = null;
-      console.log(this.sim_channel);
-      if (this.sim_channel) {
-        simChannel = this.sim_channel[this.sim_channel.length - 1];
-      }
+      let simChannel = this.sim_channel;
       this.$axios({
         method: "GET",
         url: "/flow/list/" + this.timeType + "/" + this.statisticsType + "/" + this.time + "/" + simChannel,
 <template>
   <div style="width: 2000px">
-    <el-container v-loading="loading" style="height: 100%;width: 100%" element-loading-text="拼命加载中">
-      <div style="width:100%;display: flex;flex-direction: column;justify-content: space-between;">
-        <div class="block" style="width: 99%;text-align:left;margin-bottom:15px;">
-          <el-card class="box-card" style="width: 100%">
-            <car-tree v-model="sim_channel" />
-            <el-date-picker
-              v-model="date"
-              align="right"
-              type="date"
-              placeholder="选择日期"
-              :picker-options="pickerOptions">
-            </el-date-picker>
-            <el-time-picker
-              is-range
-              v-model="timeList"
-              range-separator="至"
-              start-placeholder="开始时间"
-              end-placeholder="结束时间"
-              placeholder="选择时间范围">
-            </el-time-picker>
-            <el-button @click="searchHitoryList()">搜索</el-button>
-            <el-button @click="downloadFunction()">下载播放视频</el-button>
-          </el-card>
-        </div>
-
-        <div style="width: 100%;display:flex;flex-direction:row; justify-content:space-between;">
-          <div style="width:22%;height: 80vh" >
-            <historical-data :history-data="historyData" @click="clickHistoricalPlay" />
-          </div>
-          <div style="width: 77%;">
-            <div style="width: 99%;height: 80vh;display: flex;flex-wrap: wrap;background-color: #000;">
+    <el-container v-loading="loading" style="height: 93vh;" element-loading-text="拼命加载中">
+      <el-aside width="400px" style="background-color: #ffffff;height: 100%;">
+        <el-main style="padding: 0;width: 100%;height: 68%;background: white;margin-bottom: 10px">
+          <device1078-tree :tree-data="sourceValue" @node-click="nodeClick"></device1078-tree>
+        </el-main>
+        <el-footer style="width: 100%;height: 30%;background: grey">
+          <el-form ref="form" class="historyButton" style="padding-top: 20px">
+            <el-form-item label="日期">
+              <el-date-picker
+                v-model="date"
+                align="right"
+                type="date"
+                style="width: 70%;"
+                placeholder="选择日期"
+                :picker-options="pickerOptions">
+              </el-date-picker>
+            </el-form-item>
+            <el-form-item label="时间">
+              <el-time-picker
+                is-range
+                v-model="timeList"
+                style="width: 70%;"
+                range-separator="至"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                placeholder="选择时间范围">
+              </el-time-picker>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="searchHistoryList" style="width: 70%;">搜索</el-button>
+            </el-form-item>
+          </el-form>
+        </el-footer>
+      </el-aside>
+      <el-container style="height: 93vh;">
+        <el-main style="padding: 0;height: 65%;">
+          <div class="scroll-container"
+               style="width: 100%;height: 99%;display: flex;flex-wrap: wrap;background-color: #000;">
+            <div style="width: 99%;height: 99%;display: flex;flex-wrap: wrap;background-color: #000;">
               <div v-if="!videoUrl[0]" style="color: #ffffff;font-size: 30px;font-weight: bold;"></div>
               <player ref="player" v-else :videoUrl="videoUrl[0]" fluent autoplay @screenshot="shot"
-                      @destroy="destroy" style="width: 100%;height: 100%;"/>
+                      @destroy="destroy" style="width: 100%;height: 99%;"/>
             </div>
           </div>
-        </div>
-      </div>
+        </el-main>
+        <el-footer style="width: 100%;height: 30%;">
+          <historical-data :history-data="historyData" @click="clickHistoricalPlay" />
+        </el-footer>
+      </el-container>
     </el-container>
   </div>
 </template>
@@ -49,15 +60,23 @@ import player from &quot;./common/jessibuca.vue&quot;;
 import CarTree from "./JT1078Components/cascader/CarTree.vue";
 import {parseTime} from "../../utils/ruoyi";
 import HistoricalData from "./JT1078Components/historical/HistoricalDataTree.vue";
+import HistoryList from "./JT1078Components/HistoryData.vue";
+import Device1078Tree from "./JT1078Components/deviceList/Device1078Tree.vue";
 export default {
   //import引入的组件需要注入到对象中才能使用"
-  components: {HistoricalData, CarTree, player},
+  components: {HistoryList, Device1078Tree, HistoricalData, CarTree, player},
   props: {},
   data() {
     //这里存放数据"
     return {
-      historyData: [],
+      historyData: [{name: "aaaa"},{name: "bbbb"}],
+      targetValue: [],
+      //源列表数据
+      sourceValue: [],
+      //车辆数据定时器
+      carInfoTimeout: null,
+      simList: [],
       //遮罩层
       loading: false,
       //sim号和通道号，格式为：sim-channel
@@ -104,6 +123,135 @@ export default {
   //方法集合",
   methods: {
     /**
+     * 树点击事件
+     */
+    nodeClick(data, node) {
+     if (data.children === undefined && data) {
+       let split = data.id.split("_");
+       if (split.length === 3){
+        this.sim_channel = split[1] + '_' + split[2]
+       } else {
+         console.log("node click ==> ",data)
+       }
+      }
+    },
+    /**
+     * 查询车辆信息
+     */
+    getCarInfoBuffer() {
+      this.loading = true;
+      this.getCarInfo()
+    },
+    getCarInfo() {
+      this.$axios({
+        method: 'get',
+        url: `/api/jt1078/query/car/tree/100`,
+      }).then(res => {
+        if (res && res.data && res.data.data) {
+          if (res.data.data.code == 1) {
+            //处理数据
+            this.simList = []
+            this.processingSimList(res.data.data.result)
+            this.processingTreeData(res.data.data.result, 0);
+            this.statisticsOnline(res.data.data.result)
+            this.sourceValue = res.data.data.result;
+            this.loading = false
+            //定时更新数据
+            let this_ = this
+            this.carInfoTimeout = setTimeout(function () {
+              this_.getCarInfo()
+            }, 45000);
+          } else if (res.data.data.message) {
+            this.$message.error(res.data.data.message);
+          }
+        } else {
+          this.$message.error("请求错误，请刷新再试");
+        }
+        this.loading = false
+      }).catch(error => {
+        this.$message.error(error.message);
+      })
+    },
+    /**
+     * 统计树节点下一级有多少在线数量
+     */
+    statisticsOnline(data) {
+      for (let i in data) {
+        if (data[i].abnormalStatus === undefined && data[i].children && data[i].children.length > 0) {
+          data[i].onlineData = data[i].children.filter(item => item.abnormalStatus === 1);
+        }
+      }
+    },
+    /**
+     * 处理返回的tree数据
+     */
+    processingTreeData(data, pid, parent) {
+      for (let i in data) {
+        data[i].pid = pid
+        data[i].parent = parent;
+        if (data[i].children || (Array.isArray(data[i].children) && data[i].abnormalStatus === undefined)) {
+          this.processingTreeData(data[i].children, data[i].id, data[i]);
+        } else {
+          data[i].name = data[i].code
+          if (data[i].abnormalStatus !== 1) {
+            data[i].disabled = true;
+            let targetValue = this.targetValue;
+            if (targetValue.length > 0) {
+              this.disableItemsByName(targetValue, data[i].name);
+            }
+          }
+          this.addChannels(data[i])
+        }
+      }
+    },
+    /**
+     * 添加通道
+     */
+    addChannels(data) {
+      let labels = ['ADAS', 'DSM', '路况', '司机', '整车前', '中门', '倒车', '前门客流', '后面客流'];
+      let children = [];
+      for (let i in labels) {
+        children.push({
+          id: `${data.id}_${data.sim}_${Number(i) + Number(1)}`,
+          pid: data.id,
+          name: labels[i],
+          disabled: data.disabled,
+          parent: data
+        })
+      }
+      data.children = children;
+    },
+    /**
+     * 处理巡查列表数据
+     */
+    disableItemsByName(arr, targetName) {
+      arr.forEach(item => {
+        // 检查当前项是否是对象并且包含 name 属性且值为 targetName
+        if (item && typeof item === 'object' && item.name === targetName) {
+          item.disabled = true;
+        }
+        // 如果当前项有 children 属性且是数组，则递归调用自身
+        if (item && Array.isArray(item.children)) {
+          this.disableItemsByName(item.children, targetName);
+        }
+      });
+    },
+    /**
+     * 原始sim列表数据 （用来验证视屏巡查车辆是否在线）
+     * @param data 查询后台树列表
+     */
+    processingSimList(data) {
+      if (data && data.length > 0) {
+        for (let i in data) {
+          if (data[i].children === undefined && data[i].abnormalStatus) {
+            this.simList.push(data[i]);
+          } else if (data[i].children && data[i].children.length > 0) {
+            this.processingSimList(data[i].children);
+          }
+        }
+      }
+    },
+    /**
      * 点击播放视频
      */
     clickHistoricalPlay(data) {
@@ -123,15 +271,16 @@ export default {
     /**
      * 搜索历史视频
      */
-    searchHitoryList() {
+    searchHistoryList() {
       this.getDateTime();
       let simChannel = this.sim_channel;
+      console.log(this.sim_channel)
       if (this.isEmpty(simChannel)) {
         this.$message.error('请选择车辆');
         return;
       }
-      let split = simChannel[simChannel.length - 1].split('-');
-      console.log("simChannel:",simChannel)
+      let split = simChannel.split('_');
+      console.log("simChannel:", simChannel)
       let sim = split[0];
       if (this.isEmpty(sim)) {
         this.$message.error('无法获取SIM卡信息，请检查设备');
@@ -142,6 +291,7 @@ export default {
         this.$message.error('请选择通道');
         return;
       }
+      console.log(channel);
       if (this.isEmpty(this.startTime) || this.isEmpty(this.endTime)) {
         this.$message.error('请选择开始和结束时间');
         return;
@@ -151,7 +301,7 @@ export default {
         method: 'get',
         url: '/api/jt1078/query/history/list/' + sim + '/' + channel + "/" + this.startTime + "/" + this.endTime
       }).then(
-        res=>{
+        res => {
           console.log(res.data)
           let items = res.data.data.obj.data.items;
           if (res && res.data && res.data.data && res.data.data.obj && res.data.data.code == 1 && res.data.data.obj.data && items) {
@@ -168,11 +318,11 @@ export default {
           } else if (items === undefined) {
             this.historyData = [];
             this.loading = false
-          }else {
+          } else {
             this.loading = false
           }
         }).cache(res => {
-          this.$message.error(res.msg);
+        this.$message.error(res.msg);
         this.loading = false
       })
     },
@@ -182,8 +332,8 @@ export default {
     getDateTime() {
       let date = this.date;
       let timeList = this.timeList;
-      console.log(date)
-      console.log(timeList)
+      console.log("date ",date)
+      console.log("timeList ",timeList)
       if (this.isEmpty(date)) {
         this.$message.error("请选择日期")
         return false;
@@ -219,7 +369,7 @@ export default {
       this.$axios({
         method: 'get',
         url: '/api/jt1078/query/send/request/io/history/' + e.sim + '/' + e.channel + "/" + e.startTime + "/" + e.endTime + "/" + e.channelMapping
-      }).then(res=> {
+      }).then(res => {
         if (res.data && res.data.data && res.data.data.data) {
           let videoUrl1;
           if (location.protocol === "https:") {
@@ -322,6 +472,7 @@ export default {
   },
   //生命周期 - 创建完成（可以访问当前this实例）",
   created() {
+    this.getCarInfoBuffer()
   },
   //生命周期 - 挂载完成（可以访问DOM元素）",
   mounted() {
+<template>
+  <div style="width: 100%;border: black 100px">
+    <el-row :gutter="20">
+      <el-col :span="6"><div class="grid-content bg-purple">{{data.name}}</div></el-col>
+      <el-col :span="6" :offset="12">
+        <el-button icon="el-icon-upload" size="small" style="border: none"></el-button>
+        <el-button icon="el-icon-download" size="small" style="border: none"></el-button>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
+//例如：import 《组件名称》 from '《组件路径》,
+  export default {
+    //import引入的组件需要注入到对象中才能使用"
+    components: {},
+    props: {
+      data: {
+        type: Object,
+        default: null
+      }
+    },
+    data() {
+      //这里存放数据"
+
+      return {};
+    },
+    //计算属性 类似于data概念",
+    computed: {},
+    //监控data中的数据变化",
+    watch: {},
+    //方法集合",
+    methods: {},
+    //生命周期 - 创建完成（可以访问当前this实例）",
+    created() {
+    },
+    //生命周期 - 挂载完成（可以访问DOM元素）",
+    mounted() {
+    },
+    beforeCreate() {
+    }, //生命周期 - 创建之前",
+    beforeMount() {
+    }, //生命周期 - 挂载之前",
+    beforeUpdate() {
+    }, //生命周期 - 更新之前",
+    updated() {
+    }, //生命周期 - 更新之后",
+    beforeDestroy() {
+    }, //生命周期 - 销毁之前",
+    destroyed() {
+    }, //生命周期 - 销毁完成",
+    activated() {
+    } //如果页面有keep-alive缓存功能，这个函数会触发",
+  };
+</script>
+<style scoped>
+
+</style>
 <template>
-  <div style="width: 100%;height: 80vh" class="page-container">
-    <el-card class="box-card" >
-      <div class="scroll-container">
-        <el-scrollbar style="height: 79vh">
-          <el-tree v-if="historyData.length > 0" :data="historyData" class="historical-list-tree">
-            <span class="custom-tree-node" slot-scope="{ node , data }">
-              <el-button @click="clickButton(data)" >{{ data.name }}</el-button>
-            </span>
-          </el-tree>
-          <el-empty v-else></el-empty>
-        </el-scrollbar>
-      </div>
-    </el-card>
+  <div style="width: 100%;height: 100%" class="page-container">
+    <div class="scroll-container">
+      <el-scrollbar style="width:100%;height: 79vh">
+        <el-tree v-if="historyData.length > 0" :data="historyData" class="historical-list-tree">
+          <span class="custom-tree-node" style="width: 100%;border: 1px" slot-scope="{ node , data }">
+            <history-data :data="data"></history-data>
+          </span>
+        </el-tree>
+        <el-empty v-else></el-empty>
+      </el-scrollbar>
+    </div>
   </div>
 </template>
 <script>
+import HistoryData from "../HistoryData.vue";
+
 export default {
   name: 'historical-data',
+  components: {HistoryData},
   props: {
     historyData: {
       type: Array,
@@ -40,6 +41,7 @@ export default {
   },
   //生命周期 - 挂载完成（可以访问DOM元素）",
   mounted() {
+
   },
   beforeCreate() {
   }, //生命周期 - 创建之前",
@@ -58,6 +60,7 @@ export default {
 };
 </script>
 <style scoped>
+
 .page-container {
   display: flex;
   flex-direction: column;