sgj
11 小时以前 e9a9dcebfb754d39270945261e43736c798f4c47
fzzy-igdss-web/src/main/resources/templates/group/video.html
@@ -47,7 +47,7 @@
            background-color: #333;
            text-align: center;
            line-height: 826px;
            /*line-height: 826px;*/
            color: #FFF;
            font-size: 20px;
        }
@@ -59,7 +59,7 @@
            background-color: #333;
            text-align: center;
            line-height: 413px;
            /*line-height: 413px;*/
            color: #FFF;
            font-size: 20px;
        }
@@ -71,7 +71,7 @@
            background-color: #333;
            text-align: center;
            line-height: 275.4px;
            /*line-height: 275.4px;*/
            color: #FFF;
            font-size: 20px;
        }
@@ -83,7 +83,7 @@
            background-color: #333;
            text-align: center;
            line-height: 206.5px;
            /*line-height: 206.5px;*/
            color: #FFF;
            font-size: 20px;
        }
@@ -108,26 +108,73 @@
            width: unset;
        }
        .right-videoWrap {
             height: unset;
            height: unset;
        }
        .left-m2 .panel-content .panel-content-body .panel-content-body-tr {
             padding-top: unset;
            height: 40px;
        /* ========== 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: 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>
@@ -139,7 +186,7 @@
        <p ondblclick="changeScreen()" class="i-top-p" id="sloganText">新疆伊宁农村商业银行股份有限公司——智慧监管平台</p>
        <div class="i-navBar">
            <a href="javaScript:;" onclick="changePage('index')" class="i-nav3">首页</a>
            <a href="javaScript:;" onclick="changePage('gis')" class="i-nav4">GIS监管</a>
            <a href="javaScript:;" onclick="changePage('gis_modeling')" class="i-nav4">GIS监管</a>
            <a href="javaScript:;" onclick="changePage('video')" class="i-nav5 active">视频监管</a>
            <a href="javaScript:;" onclick="changePage('sys')" class="i-nav6">后台管理</a>
            <a href="javaScript:;" onclick="changePage('logout')" class="i-nav7">退出系统</a>
@@ -176,15 +223,15 @@
                    </div>
                    <div class="panel-box1-item">
                        <p><i><img th:src="@{/img/web/group/icon-user.png}"/></i>
                            <span id="deptContact">
                                张三
                            <span id="yxcr">
                                0
                            </span>
                        </p>
                    </div>
                    <div class="panel-box1-item">
                        <p><i><img th:src="@{/img/web/group/icon-phone.png}"/></i>
                            <span id="deptPhone">
                                18638530750
                            <span id="cfs">
                                0
                            </span>
                        </p>
                    </div>
@@ -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>
@@ -276,21 +345,21 @@
                <div>
                    <div class="panel-title" id="pieCharTitle">视频监控</div>
                    <div class="fenping_icon">
                        <img onclick="fenping(1)" id="f_1" style="width: 30px" th:src="@{/img/web/group/fp_1_active.png}"/>
                        <img onclick="fenping(4)" id="f_4" style="width: 30px" th:src="@{/img/web/group/fp_4.png}"/>
                        <img onclick="fenping(1)" id="f_1" style="width: 30px" th:src="@{/img/web/group/fp_1.png}"/>
                        <img onclick="fenping(4)" id="f_4" style="width: 30px" th:src="@{/img/web/group/fp_4_active.png}"/>
                        <img onclick="fenping(9)" id="f_9" style="width: 30px" th:src="@{/img/web/group/fp_9.png}"/>
                        <img onclick="fenping(16)" id="f_16" style="width: 30px" th:src="@{/img/web/group/fp_16.png}"/>
                    </div>
                </div>
                <!--一分屏 默认显示-->
                <div id="video_1" class="right-videoWrap">
                <div id="video_1" class="right-videoWrap" style="display: none;">
                    <div id="f1_d1" class="div_v1 bor_t_l bor_b bor_r">
                        <video class="video" id="video1_1" autoplay="" muted="" playsinline=""></video>
                    </div>
                </div>
                <!--四分屏 默认显示-->
                <div id="video_4" class="right-videoWrap" style="display: none;">
                <div id="video_4" class="right-videoWrap">
                    <div id="f4_d1" class="div_v4 bor_t_l">
                        <video class="video" id="video4_1" autoplay="" muted="" playsinline=""></video>
                    </div>
@@ -395,8 +464,8 @@
    </div>
</div>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/ajax/libs/layui/layui.js}"></script>
<script th:src="@{/ajax/libs/layer/layer.js}"></script>
<script th:src="@{/ajax/libs/layui/layui.js}"></script>
<script th:src="@{/common/constant.js}"></script>
<script th:src="@{/common/igds-common.js}"></script>
<script th:src="@{/group/video.js}"></script>
@@ -405,10 +474,10 @@
    var companyId = [[${loginUser.companyId}]];
    var bizType = [[${bizType}]];
    var bizTag = [[${bizTag}]];
    var deptCur = [[${deptInfo}]]
    var deptId = [[${deptId}]];
    var dicSlogan = [[${dicSlogan}]];
    var cameraList = [[${cameraList}]];
    var deptList = [[${deptList}]];
    //设置定时刷新页面,主要为了防止掉线
    var timer2;
@@ -418,8 +487,8 @@
        }
        timer2 = setInterval(function () {
            window.location.href = window.location.href;
        }, 60 * 60 * 1000);
        }, 24*60 * 60 * 1000);
    };
</script>
</body>
</html>
</html>