Merge remote-tracking branch 'origin/master' into master

648540858

2020-11-09 2e9b4b4e5e86c84088c45563cd61d18d8c7e5fea

Merge remote-tracking branch 'origin/master' into master

 src/main/java/com/genersoft/iot/vmp/gb28181/transmit/request/impl/MessageRequestProcessor.java

@@ -310,73 +310,76 @@
            recordInfo.setSumNum(Integer.parseInt(XmlUtil.getText(rootElement, "SumNum")));

            String sn = XmlUtil.getText(rootElement, "SN");

            Element recordListElement = rootElement.element("RecordList");

            if (recordListElement == null) {

            if (recordListElement == null || recordInfo.getSumNum() == 0) {

                logger.info("无录像数据");

                // responseAck(evt);

                return;

            }



            Iterator<Element> recordListIterator = recordListElement.elementIterator();

            List<RecordItem> recordList = new ArrayList<RecordItem>();

            if (recordListIterator != null) {

                RecordItem record = new RecordItem();

                logger.info("处理录像列表数据...");

                // 遍历DeviceList

                while (recordListIterator.hasNext()) {

                    Element itemRecord = recordListIterator.next();

                    Element recordElement = itemRecord.element("DeviceID");

                    if (recordElement == null) {

                        logger.info("记录为空，下一个...");

                        continue;

                // return;

            } else {

                Iterator<Element> recordListIterator = recordListElement.elementIterator();

                List<RecordItem> recordList = new ArrayList<RecordItem>();

                if (recordListIterator != null) {

                    RecordItem record = new RecordItem();

                    logger.info("处理录像列表数据...");

                    // 遍历DeviceList

                    while (recordListIterator.hasNext()) {

                        Element itemRecord = recordListIterator.next();

                        Element recordElement = itemRecord.element("DeviceID");

                        if (recordElement == null) {

                            logger.info("记录为空，下一个...");

                            continue;

                        }

                        record = new RecordItem();

                        record.setDeviceId(XmlUtil.getText(itemRecord, "DeviceID"));

                        record.setName(XmlUtil.getText(itemRecord, "Name"));

                        record.setFilePath(XmlUtil.getText(itemRecord, "FilePath"));

                        record.setAddress(XmlUtil.getText(itemRecord, "Address"));

                        record.setStartTime(

                                DateUtil.ISO8601Toyyyy_MM_dd_HH_mm_ss(XmlUtil.getText(itemRecord, "StartTime")));

                        record.setEndTime(

                                DateUtil.ISO8601Toyyyy_MM_dd_HH_mm_ss(XmlUtil.getText(itemRecord, "EndTime")));

                        record.setSecrecy(itemRecord.element("Secrecy") == null ? 0

                                : Integer.parseInt(XmlUtil.getText(itemRecord, "Secrecy")));

                        record.setType(XmlUtil.getText(itemRecord, "Type"));

                        record.setRecorderId(XmlUtil.getText(itemRecord, "RecorderID"));

                        recordList.add(record);

                    }

                    record = new RecordItem();

                    record.setDeviceId(XmlUtil.getText(itemRecord, "DeviceID"));

                    record.setName(XmlUtil.getText(itemRecord, "Name"));

                    record.setFilePath(XmlUtil.getText(itemRecord, "FilePath"));

                    record.setAddress(XmlUtil.getText(itemRecord, "Address"));

                    record.setStartTime(

                            DateUtil.ISO8601Toyyyy_MM_dd_HH_mm_ss(XmlUtil.getText(itemRecord, "StartTime")));

                    record.setEndTime(DateUtil.ISO8601Toyyyy_MM_dd_HH_mm_ss(XmlUtil.getText(itemRecord, "EndTime")));

                    record.setSecrecy(itemRecord.element("Secrecy") == null ? 0

                            : Integer.parseInt(XmlUtil.getText(itemRecord, "Secrecy")));

                    record.setType(XmlUtil.getText(itemRecord, "Type"));

                    record.setRecorderId(XmlUtil.getText(itemRecord, "RecorderID"));

                    recordList.add(record);

                    // recordList.sort(Comparator.naturalOrder());

                    recordInfo.setRecordList(recordList);

                }

                // recordList.sort(Comparator.naturalOrder());

                recordInfo.setRecordList(recordList);

            }



            // 存在录像且如果当前录像明细个数小于总条数，说明拆包返回，需要组装，暂不返回

            if (recordInfo.getSumNum() > 0 && recordList.size() > 0 && recordList.size() < recordInfo.getSumNum()) {

                // 为防止连续请求该设备的录像数据，返回数据错乱，特增加sn进行区分

                String cacheKey = CACHE_RECORDINFO_KEY + deviceId + sn;

                // TODO 暂时直接操作redis存储，后续封装专用缓存接口，改为本地内存缓存

                if (redis.hasKey(cacheKey)) {

                    List<RecordItem> previousList = (List<RecordItem>) redis.get(cacheKey);

                    if (previousList != null && previousList.size() > 0) {

                        recordList.addAll(previousList);

                    }

                    // 本分支表示录像列表被拆包，且加上之前的数据还是不够,保存缓存返回，等待下个包再处理

                    if (recordList.size() < recordInfo.getSumNum()) {

                // 存在录像且如果当前录像明细个数小于总条数，说明拆包返回，需要组装，暂不返回

                if (recordInfo.getSumNum() > 0 && recordList.size() > 0 && recordList.size() < recordInfo.getSumNum()) {

                    // 为防止连续请求该设备的录像数据，返回数据错乱，特增加sn进行区分

                    String cacheKey = CACHE_RECORDINFO_KEY + deviceId + sn;

                    // TODO 暂时直接操作redis存储，后续封装专用缓存接口，改为本地内存缓存

                    if (redis.hasKey(cacheKey)) {

                        List<RecordItem> previousList = (List<RecordItem>) redis.get(cacheKey);

                        if (previousList != null && previousList.size() > 0) {

                            recordList.addAll(previousList);

                        }

                        // 本分支表示录像列表被拆包，且加上之前的数据还是不够,保存缓存返回，等待下个包再处理

                        if (recordList.size() < recordInfo.getSumNum()) {

                            logger.info("已获取" + recordList.size() + "项录像数据，共" + recordInfo.getSumNum() + "项");

                            redis.set(cacheKey, recordList, 90);

                            return;

                        } else {

                            // 本分支表示录像被拆包，但加上之前的数据够足够，返回响应

                            // 因设备心跳有监听redis过期机制，为提高性能，此处手动删除

                            logger.info("录像数据已全部获取");

                            redis.del(cacheKey);

                        }

                    } else {

                        // 本分支有两种可能：1、录像列表被拆包，且是第一个包,直接保存缓存返回，等待下个包再处理

                        // 2、之前有包，但超时清空了，那么这次sn批次的响应数据已经不完整，等待过期时间后redis自动清空数据

                        logger.info("已获取" + recordList.size() + "项录像数据，共" + recordInfo.getSumNum() + "项");

                        logger.info("等待后续的包...");



                        redis.set(cacheKey, recordList, 90);

                        return;

                    } else {

                        // 本分支表示录像被拆包，但加上之前的数据够足够，返回响应

                        // 因设备心跳有监听redis过期机制，为提高性能，此处手动删除

                        logger.info("录像数据已全部获取");

                        redis.del(cacheKey);

                    }

                } else {

                    // 本分支有两种可能：1、录像列表被拆包，且是第一个包,直接保存缓存返回，等待下个包再处理

                    // 2、之前有包，但超时清空了，那么这次sn批次的响应数据已经不完整，等待过期时间后redis自动清空数据

                    logger.info("等待后续的包...");



                    redis.set(cacheKey, recordList, 90);

                    return;

                }



                // 自然顺序排序, 元素进行升序排列

                recordInfo.getRecordList().sort(Comparator.naturalOrder());

            }

            // 走到这里，有以下可能：1、没有录像信息,第一次收到recordinfo的消息即返回响应数据，无redis操作

            // 2、有录像数据，且第一次即收到完整数据，返回响应数据，无redis操作

@@ -386,8 +389,8 @@
            RequestMessage msg = new RequestMessage();

            msg.setDeviceId(deviceId);

            msg.setType(DeferredResultHolder.CALLBACK_CMD_RECORDINFO);

            // 自然顺序排序, 元素进行升序排列

            recordInfo.getRecordList().sort(Comparator.naturalOrder());

            // // 自然顺序排序, 元素进行升序排列

            // recordInfo.getRecordList().sort(Comparator.naturalOrder());

            msg.setData(recordInfo);

            deferredResultHolder.invokeResult(msg);

            logger.info("处理完成，返回结果");


 src/main/java/com/genersoft/iot/vmp/storager/redis/VideoManagerRedisStoragerImpl.java

@@ -288,7 +288,7 @@
                // devices.add((Device)redis.get((String)deviceIdList.get(i)));
                device =(Device)redis.get((String)deviceIdList.get(i));
                if (redis.scan(VideoManagerConstants.KEEPLIVEKEY_PREFIX+device.getDeviceId()).size() == 0){
                    outline(device.getDeviceId());
                    // outline(device.getDeviceId());
                }
                devices.add(device);
            }
@@ -297,7 +297,7 @@
                // devices.add((Device)redis.get(VideoManagerConstants.DEVICE_PREFIX+deviceIds[i]));
                device = (Device)redis.get(VideoManagerConstants.DEVICE_PREFIX+deviceIds[i]);
                if (redis.scan(VideoManagerConstants.KEEPLIVEKEY_PREFIX+device.getDeviceId()).size() == 0){
                    outline(device.getDeviceId());
                    // outline(device.getDeviceId());
                }
                devices.add(device);
            }

 web_src/src/components/control.vue

@@ -1,346 +1,353 @@
<template>
    <div id="app">
        <el-container>
            <el-header>
                <uiHeader></uiHeader>
            </el-header>
            <el-main>
                <div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;">
                    <span style="font-size: 1rem; font-weight: bold;">控制台</span>
                    <div style="position: absolute; right: 1rem; top: 0.3rem;">
                        <el-popover placement="bottom" width="750" height="300" trigger="click">
                            <div style="height: 600px;overflow:auto;">
                                <table class="table-c" cellspacing="0">
                                    <tr v-for="(value, key, index) in serverConfig">
                                        <td style="width: 18rem; text-align: right;">{{ key }}</td>
                                        <td style="width: 33rem; text-align:left">{{ value }}</td>
                                    </tr>
                                </table>
                            </div>
                            <el-button type="primary" slot="reference" size="mini" @click="getServerConfig()">查看服务器配置</el-button>
                        </el-popover>
                        <el-button style="margin-left: 1rem;" type="danger" size="mini" @click="reStartServer()">重启服务器</el-button>
                    </div>
                </div>
                <el-row :gutter="30">
                    <el-col :span="12"><div class="control-table" id="ThreadsLoad">table1</div></el-col>
                    <el-col :span="12"><div class="control-table" id="WorkThreadsLoad">table2</div></el-col>
                </el-row>
                <el-table :data="allSessionData" style="margin-top: 1rem;">
                    <el-table-column prop="peer_ip" label="远端"></el-table-column>
                    <el-table-column prop="local_ip" label="本地"></el-table-column>
                    <el-table-column prop="typeid" label="类型"></el-table-column>
                    <el-table-column align="right">
                        <template slot="header" slot-scope="scope">
                            <el-button icon="el-icon-refresh-right" circle @click="getAllSession()"></el-button>
                        </template>
                        <template slot-scope="scope">
                            <el-button @click.native.prevent="deleteRow(scope.$index, allSessionData)" type="text" size="small">移除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
<div id="app">
    <el-container>
        <el-header>
            <uiHeader></uiHeader>
        </el-header>
        <el-main>
            <div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;">
                <span style="font-size: 1rem; font-weight: bold;">控制台</span>
                <div style="position: absolute; right: 1rem; top: 0.3rem;">
                    <el-popover placement="bottom" width="750" height="300" trigger="click">
                        <div style="height: 600px;overflow:auto;">
                            <table class="table-c" cellspacing="0">
                                <tr v-for="(value, key, index) in serverConfig">
                                    <td style="width: 18rem; text-align: right;">{{ key }}</td>
                                    <td style="width: 33rem; text-align:left">{{ value }}</td>
                                </tr>
                            </table>
                        </div>
                        <el-button type="primary" slot="reference" size="mini" @click="getServerConfig()">查看服务器配置</el-button>
                    </el-popover>
                    <el-button style="margin-left: 1rem;" type="danger" size="mini" @click="reStartServer()">重启服务器</el-button>
                </div>
            </div>
            <el-row :gutter="30">
                <el-col :span="12">
                    <div class="control-table" id="ThreadsLoad">table1</div>
                </el-col>
                <el-col :span="12">
                    <div class="control-table" id="WorkThreadsLoad">table2</div>
                </el-col>
            </el-row>
            <el-table :data="allSessionData" style="margin-top: 1rem;">
                <el-table-column prop="peer_ip" label="远端"></el-table-column>
                <el-table-column prop="local_ip" label="本地"></el-table-column>
                <el-table-column prop="typeid" label="类型"></el-table-column>
                <el-table-column align="right">
                    <template slot="header" slot-scope="scope">
                        <el-button icon="el-icon-refresh-right" circle @click="getAllSession()"></el-button>
                    </template>
                    <template slot-scope="scope">
                        <el-button @click.native.prevent="deleteRow(scope.$index, allSessionData)" type="text" size="small">移除</el-button>
                    </template>
                </el-table-column>
            </el-table>

            </el-main>
            <!-- <el-footer style="position: absolute; bottom: 0; width: 100%;">ZLMediaKit-VUE_UI v1</el-footer> -->
        </el-container>
        </el-main>
        <!-- <el-footer style="position: absolute; bottom: 0; width: 100%;">ZLMediaKit-VUE_UI v1</el-footer> -->
    </el-container>

    </div>
</div>
</template>

<script>

import uiHeader from './UiHeader.vue'

import echarts from 'echarts';
export default {
    name: 'app',
    components: {
        echarts,
        uiHeader
    },
    data() {
        return {
            tableOption: {
                // legend: {},
                xAxis: {},
                yAxis: {},
                label: {},
                tooltip: {},
                dataZoom: [],
                series: []
            },
            table1Option: {
                // legend: {},
                xAxis: {},
                yAxis: {},
                label: {},
                tooltip: {},
                series: []
            },
            mChart: null,
            mChart1: null,
            charZoomStart: 0,
            charZoomEnd: 100,
            chartInterval: 0, //更新图表统计图定时任务标识
            allSessionData: [],
            visible: false,
            serverConfig: {}
        };
    },
    mounted() {
        this.getAllSession();
        this.initTable();
        this.updateData();
        this.chartInterval = setInterval(this.updateData, 3000);
    },
    destroyed() {
        clearInterval(this.chartInterval); //释放定时任务
    },
    methods: {
        updateData: function() {
            this.getThreadsLoad();
        },
        /**
         * 获取线程状态
         */
        getThreadsLoad: function() {
            let that = this;
            this.$axios({
                method: 'get',
                url: '/zlm/index/api/getThreadsLoad'
            }).then(function(res) {
                if (res.data.code == 0) {
                    that.tableOption.xAxis.data.push(new Date().toLocaleTimeString());
                    that.table1Option.xAxis.data.push(new Date().toLocaleTimeString());
    name: 'app',
    components: {
        echarts,
        uiHeader
    },
    data() {
        return {
            tableOption: {
                // legend: {},
                xAxis: {},
                yAxis: {},
                label: {},
                tooltip: {},
                dataZoom: [],
                series: []
            },
            table1Option: {
                // legend: {},
                xAxis: {},
                yAxis: {},
                label: {},
                tooltip: {},
                series: []
            },
            mChart: null,
            mChart1: null,
            charZoomStart: 0,
            charZoomEnd: 100,
            chartInterval: 0, //更新图表统计图定时任务标识
            allSessionData: [],
            visible: false,
            serverConfig: {}
        };
    },
    mounted() {
        this.getAllSession();
        this.initTable();
        this.updateData();
        this.chartInterval = setInterval(this.updateData, 3000);
    },
    destroyed() {
        clearInterval(this.chartInterval); //释放定时任务
    },
    methods: {
        updateData: function () {
            this.getThreadsLoad();
        },
        /**
         * 获取线程状态
         */
        getThreadsLoad: function () {
            let that = this;
            this.$axios({
                method: 'get',
                url: '/zlm/index/api/getThreadsLoad'
            }).then(function (res) {
                if (res.data.code == 0) {
                    that.tableOption.xAxis.data.push(new Date().toLocaleTimeString('chinese', {
                        hour12: false
                    }));
                    that.table1Option.xAxis.data.push(new Date().toLocaleTimeString('chinese', {
                        hour12: false
                    }));

                    for (var i = 0; i < res.data.data.length; i++) {
                        if (that.tableOption.series[i] === undefined) {
                            let data = {
                                data: [],
                                type: 'line'
                            };
                            let data1 = {
                                data: [],
                                type: 'line'
                            };
                            data.data.push(res.data.data[i].delay);
                            data1.data.push(res.data.data[i].load);
                            that.tableOption.series.push(data);
                            that.table1Option.series.push(data1);
                        } else {
                            that.tableOption.series[i].data.push(res.data.data[i].delay);
                            that.table1Option.series[i].data.push(res.data.data[i].load);
                        }
                    }
                    that.tableOption.dataZoom[0].start = that.charZoomStart;
                    that.tableOption.dataZoom[0].end = that.charZoomEnd;
                    that.table1Option.dataZoom[0].start = that.charZoomStart;
                    that.table1Option.dataZoom[0].end = that.charZoomEnd;
                    //that.myChart = echarts.init(document.getElementById('ThreadsLoad'));
                    that.myChart.setOption(that.tableOption, true);
                    // that.myChart1 = echarts.init(document.getElementById('WorkThreadsLoad'));
                    that.myChart1.setOption(that.table1Option, true);
                }
            });
        },
        initTable: function() {
            let that = this;
            this.tableOption.xAxis = {
                type: 'category',
                data: [], // x轴数据
                name: '时间', // x轴名称
                // x轴名称样式
                nameTextStyle: {
                    fontWeight: 300,
                    fontSize: 15
                }
            };
            this.tableOption.yAxis = {
                type: 'value',
                name: '延迟率', // y轴名称
                boundaryGap: [0, '100%'],
                max: 100,
                axisLabel: {
                    show: true,
                    interval: 'auto',
                    formatter: '{value} %'
                },
                // y轴名称样式
                nameTextStyle: {
                    fontWeight: 300,
                    fontSize: 15
                }
            };
            this.tableOption.dataZoom = [
                {
                    show: true,
                    start: this.charZoomStart,
                    end: this.charZoomEnd
                }
            ];
            this.myChart = echarts.init(document.getElementById('ThreadsLoad'));
            this.myChart.setOption(this.tableOption);
            this.myChart.on('dataZoom', function(event) {
                if (event.batch) {
                    that.charZoomStart = event.batch[0].start;
                    that.charZoomEnd = event.batch[0].end;
                } else {
                    that.charZoomStart = event.start;
                    that.charZoomEnd = event.end;
                }
            });
                    for (var i = 0; i < res.data.data.length; i++) {
                        if (that.tableOption.series[i] === undefined) {
                            let data = {
                                data: [],
                                type: 'line'
                            };
                            let data1 = {
                                data: [],
                                type: 'line'
                            };
                            data.data.push(res.data.data[i].delay);
                            data1.data.push(res.data.data[i].load);
                            that.tableOption.series.push(data);
                            that.table1Option.series.push(data1);
                        } else {
                            that.tableOption.series[i].data.push(res.data.data[i].delay);
                            that.table1Option.series[i].data.push(res.data.data[i].load);
                        }
                    }
                    that.tableOption.dataZoom[0].start = that.charZoomStart;
                    that.tableOption.dataZoom[0].end = that.charZoomEnd;
                    that.table1Option.dataZoom[0].start = that.charZoomStart;
                    that.table1Option.dataZoom[0].end = that.charZoomEnd;
                    //that.myChart = echarts.init(document.getElementById('ThreadsLoad'));
                    that.myChart.setOption(that.tableOption, true);
                    // that.myChart1 = echarts.init(document.getElementById('WorkThreadsLoad'));
                    that.myChart1.setOption(that.table1Option, true);
                }
            });
        },
        initTable: function () {
            let that = this;
            this.tableOption.xAxis = {
                type: 'category',
                data: [], // x轴数据
                name: '时间', // x轴名称
                // x轴名称样式
                nameTextStyle: {
                    fontWeight: 300,
                    fontSize: 15
                }
            };
            this.tableOption.yAxis = {
                type: 'value',
                name: '延迟率', // y轴名称
                boundaryGap: [0, '100%'],
                max: 100,
                axisLabel: {
                    show: true,
                    interval: 'auto',
                    formatter: '{value} %'
                },
                // y轴名称样式
                nameTextStyle: {
                    fontWeight: 300,
                    fontSize: 15
                }
            };
            this.tableOption.dataZoom = [{
                show: true,
                start: this.charZoomStart,
                end: this.charZoomEnd
            }];
            this.myChart = echarts.init(document.getElementById('ThreadsLoad'));
            this.myChart.setOption(this.tableOption);
            this.myChart.on('dataZoom', function (event) {
                if (event.batch) {
                    that.charZoomStart = event.batch[0].start;
                    that.charZoomEnd = event.batch[0].end;
                } else {
                    that.charZoomStart = event.start;
                    that.charZoomEnd = event.end;
                }
            });

            this.table1Option.xAxis = {
                type: 'category',
                data: [], // x轴数据
                name: '时间', // x轴名称
                // x轴名称样式
                nameTextStyle: {
                    fontWeight: 300,
                    fontSize: 15
                }
            };
            this.table1Option.yAxis = {
                type: 'value',
                name: '负载率', // y轴名称
                boundaryGap: [0, '100%'],
                max: 100,
                axisLabel: {
                    show: true,
                    interval: 'auto',
                    formatter: '{value} %'
                },
                // y轴名称样式
                nameTextStyle: {
                    fontWeight: 300,
                    fontSize: 15
                }
            };
            this.table1Option.dataZoom = [
                {
                    show: true,
                    start: this.charZoomStart,
                    end: this.charZoomEnd
                }
            ];
            this.myChart1 = echarts.init(document.getElementById('WorkThreadsLoad'));
            this.myChart1.setOption(this.table1Option);
            this.myChart1.on('dataZoom', function(event) {
                if (event.batch) {
                    that.charZoomStart = event.batch[0].start;
                    that.charZoomEnd = event.batch[0].end;
                } else {
                    that.charZoomStart = event.start;
                    that.charZoomEnd = event.end;
                }
            });
        },
            this.table1Option.xAxis = {
                type: 'category',
                data: [], // x轴数据
                name: '时间', // x轴名称
                // x轴名称样式
                nameTextStyle: {
                    fontWeight: 300,
                    fontSize: 15
                }
            };
            this.table1Option.yAxis = {
                type: 'value',
                name: '负载率', // y轴名称
                boundaryGap: [0, '100%'],
                max: 100,
                axisLabel: {
                    show: true,
                    interval: 'auto',
                    formatter: '{value} %'
                },
                // y轴名称样式
                nameTextStyle: {
                    fontWeight: 300,
                    fontSize: 15
                }
            };
            this.table1Option.dataZoom = [{
                show: true,
                start: this.charZoomStart,
                end: this.charZoomEnd
            }];
            this.myChart1 = echarts.init(document.getElementById('WorkThreadsLoad'));
            this.myChart1.setOption(this.table1Option);
            this.myChart1.on('dataZoom', function (event) {
                if (event.batch) {
                    that.charZoomStart = event.batch[0].start;
                    that.charZoomEnd = event.batch[0].end;
                } else {
                    that.charZoomStart = event.start;
                    that.charZoomEnd = event.end;
                }
            });
        },

        getAllSession: function() {
            let that = this;
            that.allSessionData = [];
            console.log("地址："+'/zlm/index/api/getAllSession');
            this.$axios({
                method: 'get',
                url: '/zlm/index/api/getAllSession'
            }).then(function(res) {
                res.data.data.forEach(item => {
                    let data = {
                        peer_ip: item.peer_ip,
                        local_ip: item.local_ip,
                        typeid: item.typeid,
                        id: item.id
                    };
                    that.allSessionData.push(data);
                });
            });
        },
        getServerConfig: function() {
            let that = this;
            this.$axios({
                method: 'get',
                url: '/zlm/index/api/getServerConfig'
            }).then(function(res) {
                that.serverConfig = res.data.data[0];
                that.visible = true;
            });
        },
        reStartServer: function() {
            let that = this;
            this.$confirm('此操作将重启媒体服务器, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                let that = this;
                this.$axios({
                    method: 'get',
                    url: '/zlm/index/api/restartServer'
                }).then(function(res) {
                    that.getAllSession();
                    if (res.data.code == 0) {
                        that.$message({
                            type: 'success',
                            message: '操作完成'
                        });
                    }
                });
            });
        },
        deleteRow: function(index, tabledata) {
            let that = this;
            this.$confirm('此操作将断开该通信链路, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            })
                .then(() => {
                    that.deleteSession(tabledata[index].id);
                })
                .catch(() => {
                    console.log('id：' + JSON.stringify(tabledata[index]));
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            console.log(JSON.stringify(tabledata[index]));
        },
        deleteSession: function(id) {
            let that = this;
            this.$axios({
                method: 'get',
                url: '/zlm/index/api/kick_session&id=' + id
            }).then(function(res) {
                that.getAllSession();
                that.$message({
                    type: 'success',
                    message: '删除成功!'
                });
            });
        }
    }
        getAllSession: function () {
            let that = this;
            that.allSessionData = [];
            console.log("地址：" + '/zlm/index/api/getAllSession');
            this.$axios({
                method: 'get',
                url: '/zlm/index/api/getAllSession'
            }).then(function (res) {
                res.data.data.forEach(item => {
                    let data = {
                        peer_ip: item.peer_ip,
                        local_ip: item.local_ip,
                        typeid: item.typeid,
                        id: item.id
                    };
                    that.allSessionData.push(data);
                });
            });
        },
        getServerConfig: function () {
            let that = this;
            this.$axios({
                method: 'get',
                url: '/zlm/index/api/getServerConfig'
            }).then(function (res) {
                that.serverConfig = res.data.data[0];
                that.visible = true;
            });
        },
        reStartServer: function () {
            let that = this;
            this.$confirm('此操作将重启媒体服务器, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                let that = this;
                this.$axios({
                    method: 'get',
                    url: '/zlm/index/api/restartServer'
                }).then(function (res) {
                    that.getAllSession();
                    if (res.data.code == 0) {
                        that.$message({
                            type: 'success',
                            message: '操作完成'
                        });
                    }
                });
            });
        },
        deleteRow: function (index, tabledata) {
            let that = this;
            this.$confirm('此操作将断开该通信链路, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                })
                .then(() => {
                    that.deleteSession(tabledata[index].id);
                })
                .catch(() => {
                    console.log('id：' + JSON.stringify(tabledata[index]));
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            console.log(JSON.stringify(tabledata[index]));
        },
        deleteSession: function (id) {
            let that = this;
            this.$axios({
                method: 'get',
                url: '/zlm/index/api/kick_session&id=' + id
            }).then(function (res) {
                that.getAllSession();
                that.$message({
                    type: 'success',
                    message: '删除成功!'
                });
            });
        }
    }
};
</script>

<style>
#app {
    height: 100%;
    height: 100%;
}

.control-table {
    background-color: #ffffff;
    height: 25rem;
    background-color: #ffffff;
    height: 25rem;
}

.table-c {
    border-right: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
    border-right: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
}

.table-c td {
    border-left: 1px solid #dcdcdc;
    border-top: 1px solid #dcdcdc;
    padding: 0.2rem;
    border-left: 1px solid #dcdcdc;
    border-top: 1px solid #dcdcdc;
    padding: 0.2rem;
}

.el-table {
    width: 99.9% !important;
    width: 99.9% !important;
}
</style>

 web_src/src/components/gb28181/devicePlayer.vue

@@ -223,15 +223,15 @@
        play: function (streamInfo, hasAudio) {
            this.hasaudio = hasAudio;
            // 根据媒体流信息二次判断
            var realHasAudio = false;
            if (!!streamInfo.tracks && streamInfo.tracks.length > 0 && hasAudio) {
                var realHasAudio = false;
                for (let i = 0; i < streamInfo.tracks.length; i++) {
                    if (streamInfo.tracks[i].codec_type == 1 && streamInfo.tracks[i].codec_id_name == "CodecAAC") { // 判断为AAC音频
                        realHasAudio = true;
                    }
                }
                this.hasaudio = realHasAudio && this.hasaudio;
            }
            this.hasaudio = realHasAudio && this.hasaudio;
            this.ssrc = streamInfo.ssrc;
            // this.$refs.videoPlayer.hasaudio = hasAudio;
            // this.videoUrl = streamInfo.flv + "?" + new Date().getTime();