From 170f2b1fbb699a7f81a42cf88d87de59c42dfcc4 Mon Sep 17 00:00:00 2001
From: deartibers <947466799@qq.com>
Date: Mon, 8 Aug 2022 20:40:47 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../offline/components/pushSideSheet.jsx      | 24 ++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/code/VideoAccess-VCMP/web/client/src/sections/offline/components/pushSideSheet.jsx b/code/VideoAccess-VCMP/web/client/src/sections/offline/components/pushSideSheet.jsx
index 465e79b..6ac96dd 100644
--- a/code/VideoAccess-VCMP/web/client/src/sections/offline/components/pushSideSheet.jsx
+++ b/code/VideoAccess-VCMP/web/client/src/sections/offline/components/pushSideSheet.jsx
@@ -3,7 +3,11 @@ import { connect } from "react-redux";
 import { Modal, Spin,Tag, Space,Collapse ,SideSheet,Tabs, TabPane,Popover} from "@douyinfe/semi-ui";
 import moment from "moment";
 import './pushSideSheet.less'
+import PerfectScrollbar from "perfect-scrollbar";
 import { push } from "react-router-redux";
+
+let equipmentScrollbar;
+
 function pushSideSheet (props) {
     const {
         close,
@@ -72,7 +76,18 @@ function pushSideSheet (props) {
             equipmentList.push(pushData.cameraStatusPushMonitors[i].camera.name)
         }
         setEquipmentTest(equipmentList)
+        setTimeout(() => {
+            equipmentScrollbar = new PerfectScrollbar("#collapse_test", {
+                suppressScrollX: true,
+            });
+        }, 100);
     }, []);
+    useEffect(() => {
+        const videoStreaming = document.getElementById("collapse_test");
+        if (videoStreaming && equipmentScrollbar) {
+            equipmentScrollbar.update();
+        }
+    });
     function getTimeTitle(date){
         let year = moment(date).year()+'年'
         let month = (moment(date).month()+1)>10?(moment(date).month()+1)+'月':'0'+(moment(date).month()+1)+'月'
@@ -93,10 +108,16 @@ function pushSideSheet (props) {
             <SideSheet title={pushData.name} className='sideSheet' width={670} visible={true} onCancel={sideSheetChange}>
                 <Tabs type="line">
                     <TabPane tab="推送日志" itemKey="1">
+                        <div id="collapse_test"
+                            style={{
+                                height: document.body.clientHeight - 122,
+                                position: "relative",
+                            }}
+                        >
                         <Collapse defaultActiveKey="0">
                         {logList.map((item, index) => {
                         return (
-                            <Collapse.Panel header={<div style={{width:'100%',textAlign:'center'}}>{item.title}</div>} itemKey={String(index)}  key={index} >
+                            <Collapse.Panel header={<div style={{width:'100%',textAlign:'center'}}>{item.title}</div>} itemKey={String(index)} key={index}>
                                 {item.timeList.map((itm,idx)=>{
                                     return(
                                         <div style={{display:'flex',alignItems:'center',height:46,borderBottom: '1px solid #E8E8E8',fontSize:12,color:'rgba(0,0,0,0.6500)'}} key={idx}>
@@ -122,6 +143,7 @@ function pushSideSheet (props) {
                             </Collapse.Panel>
                         )})}
                         </Collapse>
+                        </div>
                     </TabPane>
                     <TabPane tab="监听范围" itemKey="2">
                         <div style={{margin:'12px 36px',fontSize:12,color:'rgba(0,0,0,0.6500)'}}>