视频监管添加库区AI事件展示

sgj

10 小时以前 ca18c1315a7dcab0238893bcf68cd34f0ef5fe35

 fzzy-igdss-web/src/main/resources/templates/group/video.html

@@ -110,24 +110,71 @@
        .right-videoWrap {
             height: unset;
        }
        /* ========== AI事件列表核心样式 ========== */
        .left-m2 .panel-content .panel-content-head {
            line-height: 40px;
            font-size: 18px;
            display: flex; /* 表头flex布局，精准分配列宽 */
            width: 100%;
        }
        /* 表头列宽精准分配：所属库点占比最高，近七天数量预留足够宽度防换行 */
        .left-m2 .panel-content .panel-content-head .head-item:nth-child(1) {
            flex: 2; /* 所属库点：宽列，适配长名称 */
            white-space: nowrap; /* 强制不换行 */
            text-align: center;
        }
        .left-m2 .panel-content .panel-content-head .head-item:nth-child(2) {
            flex: 1.2; /* 当日分析：中等宽度 */
            white-space: nowrap; /* 强制不换行 */
            text-align: center;
        }
        .left-m2 .panel-content .panel-content-head .head-item:nth-child(3) {
            flex: 1.2; /* 近七天数量：加宽列宽，强制不换行 */
            white-space: nowrap; /* 核心：禁止表头换行 */
            text-align: center;
        }
        /* 列表项样式：完整展示文字，自适应行高 */
        .left-m2 .panel-content .panel-content-body .panel-content-body-tr {
             padding-top: unset;
            height: 40px;
            line-height: 40px;
            height: auto; /* 自适应行高 */
            line-height: 22px; /* 适配换行后的行间距 */
            padding: 8px 2px;
            display: flex; /* 和表头列宽对齐 */
            width: 100%;
            box-sizing: border-box;
        }
        .left-m2 .panel-content .panel-content-body .panel-content-body-tr .body-item {
            font-size: 18px;
            font-size: 16px;
            padding: 0 8px;
            white-space: normal; /* 列表项允许换行，完整展示内容 */
            word-wrap: break-word; /* 长文本强制换行 */
            text-align: center;
            box-sizing: border-box;
        }
        .left-m2 .panel-content .panel-content-head {
            line-height: unset;
            font-size: 18px;
        /* 列表项列宽和表头严格对齐 */
        .left-m2 .panel-content .panel-content-body .panel-content-body-tr .body-item:nth-child(1) {
            flex: 2;
        }
        .left-m2 .panel-content .panel-content-body .panel-content-body-tr .body-item:nth-child(2) {
            flex: 1.2;
        }
        .left-m2 .panel-content .panel-content-body .panel-content-body-tr .body-item:nth-child(3) {
            flex: 1.2;
        }
        /* ========== 核心样式结束 ========== */
        .text_select_play {
            font-size: 16px;
        }
        .video {
            width: 100%;
            height: 100%;
        }
        /* 列表容器：内容过多时滚动，不挤压布局 */
        #inventoryInfoBox {
            width: 100%;
            box-sizing: border-box;
            overflow-y: auto;
            max-height: 300px;
        }
    </style>
</head>
@@ -192,7 +239,29 @@
            </div><!-- i-m1 end -->
            <div class="left-m2">
                <div>
                    <div class="panel-title" id="panel-title">监控点信息</div>
                    <div class="panel-title" id="panel-title">库区AI事件信息</div>
                </div>
                <div class="panel-content">
                    <div class="panel-content-head">
                        <span class="head-item">所属库点</span>
                        <span class="head-item">当日分析</span>
                        <span class="head-item">近七天数量</span> <!-- 修正表头文字，取消换行 -->
                    </div>

                    <div class="panel-content-body" id="inventoryInfoBox">
                        <div id="inventoryInfo">
                            <!--                            <div class="panel-content-body-tr">-->
                            <!--                                <span class="body-item">安防-北围墙1</span>-->
                            <!--                                <span class="body-item">枪机</span>-->
                            <!--                                <span class="body-item">12</span>-->
                            <!--                            </div>-->
                        </div>
                    </div>
                </div>
            </div>
            <div class="left-m3">
                <div>
                    <div class="panel-title" id="panel-title1">监控点信息</div>
                </div>
                <div class="panel-content">
                    <div class="panel-content-head">
@@ -200,8 +269,8 @@
                        <span class="head-item" style="flex: 0.6">监控类型</span>
                    </div>

                    <div class="panel-content-body" id="inventoryInfoBox">
                        <div id="inventoryInfo">
                    <div class="panel-content-body" id="inventoryInfoBox1">
                        <div id="inventoryInfo1">
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙1</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
@@ -409,6 +478,7 @@
    var dicSlogan = [[${dicSlogan}]];
    var deptList = [[${deptList}]];


    //设置定时刷新页面，主要为了防止掉线
    var timer2;
    window.onload = function () {