| | |
| | | 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> |
| | |
| | | <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> |
| | |
| | | </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"> |
| | |
| | | <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> |
| | |
| | | var dicSlogan = [[${dicSlogan}]]; |
| | | var deptList = [[${deptList}]]; |
| | | |
| | | |
| | | //设置定时刷新页面,主要为了防止掉线 |
| | | var timer2; |
| | | window.onload = function () { |
| | |
| | | }; |
| | | </script> |
| | | </body> |
| | | </html> |
| | | </html> |