修改表格样式和点击事件

src/styles/view/monitor/table.scss

@@ -13,6 +13,92 @@
         position: relative;
         height: 100%;
 
+        .ant-table {
+          height: 100%;
+          background:linear-gradient(180deg,rgba(17,12,48,1) 0%,rgba(0,0,0,0.19) 100%);
+          border-radius: 0px 0px 0 0;
+
+         
+            height: 100%;
+            .ant-table-content {
+              height: 100%;
+              .ant-table-body table td {
+                border-color: transparent !important;
+                text-align: center;
+              }
+
+               //背景色奇数和偶数
+              .back-02 {
+                 background:transparent!important;
+                 opacity:1;
+                 }
+
+              .back-01 {
+                 background:rgba(14,127,180,0.29);   
+              } 
+
+            
+              .ant-table-scroll {
+                height: 100%;
+
+                .ant-table-header{
+                  overflow: hidden;
+                  margin-bottom: 3px !important;
+                  // padding-bottom: 0px !important;
+                  margin-top: -2px !important;
+                  margin-left: -2px !important;
+                  margin-right: -2px !important
+                }
+
+                .ant-table-body {
+                  //max-height: 91% !important ;
+                  overflow-y: auto !important; 
+                  background:transparent!important;
+
+                  //滚动条
+                  &::-webkit-scrollbar {
+                    height: 5px;
+                  }
+                  &::-webkit-scrollbar-thumb {
+                    border-radius: 5px;
+                    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+                    background-image: url('/src/assets/safetyManage/hengxian.png');
+                    background-repeat: no-repeat;
+                   
+                    background-size: 100% 100%;
+                  }
+                  &::-webkit-scrollbar-track {
+                    -webkit-box-shadow: 0;
+                    border-radius: 0;
+                    background-image: url('/src/assets/safetyManage/gdt.png');
+                    background-repeat: no-repeat;
+                    background-size: 100% 100%;
+                  }
+                
+                  &::-webkit-scrollbar-button {
+                    background-image: url('/src/assets/safetyManage/shang.png');
+                    background-repeat: no-repeat;
+                    background-size: 100% 100%;
+                  }
+
+                      table {
+                        width: 300px;
+                        border-color: transparent !important;
+
+                       td {
+                         border-color: transparent !important;
+
+                        }
+                  }
+                }
+
+            }
+
+          }
+          
+          
+        }
+
         .ant-pagination {
     
           position: absolute;
@@ -27,9 +113,31 @@
               margin: 0;
             }
           }
+
+          .mini .ant-pagination-total-text {
+            height: 20px;
+            line-height: 20px;
+            font-size:13px;
+            font-family:Microsoft YaHei UI;
+            font-weight:400;
+            line-height: 19px;
+            color:rgba(255,255,255,1);
+           
+         
+          }
+
+          .mini .ant-pagination-options {
+            margin-left: 8px;
+            display: none;
+          }
       
           .ant-pagination-total-text {
-            color: white;
+             font-size:13px;
+             font-family:Microsoft YaHei UI;
+             font-weight:400;
+             line-height: 19px;
+             color:rgba(255,255,255,1);
+             //float: right
           }
       
           .ant-pagination-prev {
@@ -49,6 +157,7 @@
                 color:rgba(0,185,255,0.3)
               }
             }
+            
           }
       
           //分页颜色调整
@@ -74,140 +183,36 @@
        }
       }
     }
-  }
 
+      //修改表头文字、背景颜色  
+      .ant-table-thead > tr >th{
+            color: white;
+            background: #3d466b !important;
+            //background: #222b51 !important;
+            border-color: transparent !important;
+            text-align: center;
+          }
 
-  .ant-table-content {
-    height: 100%;
-
-    .ant-table-body {
-      // max-height: 500px !important ;
-      overflow-y: auto !important; 
-      background:transparent!important;
-
-      table {
-        width: 300px;
-        border-color: transparent !important;
+             //鼠标悬浮行背景色修改
+            table tbody tr:hover>td { 
+            background-color:#00B9FF !important;
+         }
 
-        td {
-          border-color: transparent !important;
 
-        }
-      }
-    }
+           .ant-pagination.mini .ant-pagination-options {
+             margin-left: 8px;
+             display: none;
+           }
   }
 
-  .ant-table {
-    background:linear-gradient(180deg,rgba(17,12,48,1) 0%,rgba(0,0,0,0.19) 100%);
-    border-radius: 0px 0px 0 0;
-  }
-  .ant-pagination.mini .ant-pagination-total-text {
-    height: 20px;
-    line-height: 20px;
- 
-  }
 
   
-   //表格正文居中
-   .ant-table-content .ant-table-body table td {
-    border-color: transparent !important;
-    text-align: center;
-  }
-
-  .ant-table-fixed-header .ant-table-scroll .ant-table-header{
-    overflow: hidden;
-  }
-
-
+ 
 
-  .ant-pagination.mini .ant-pagination-total-text {
-    font-size:13px;
-    font-family:Microsoft YaHei UI;
-    font-weight:400;
-    line-height: 19px;
-    color:rgba(255,255,255,1);
-    //float: right
-   }
 
-  
-       //修改表头文字、背景颜色  
-   .ant-table-thead > tr >th{
-        color: white;
-        background: #3d466b !important;
-        //background: #222b51 !important;
-        border-color: transparent !important;
-        text-align: center;
-  }
 
-   //鼠标悬浮行背景色修改
-   table tbody tr:hover>td { 
-    background-color:#00B9FF !important;
-  }
   
-
-  .ant-table-content {
-
-    .ant-table-scroll .ant-table-header {
-      margin-bottom: 3px !important;
-      // padding-bottom: 0px !important;
-      margin-top: -2px !important;
-      margin-left: -2px !important;
-      margin-right: -2px !important
-      
-     
-    }
-
-   
-
   
-    //背景色奇数和偶数
-     .back-02 {
-      background:transparent!important;
-      opacity:1;
-     }
-
-     .back-01 {
-      background:rgba(14,127,180,0.29);
-     
-     }
-  
-    
-
-   
-  }
-
-  
- .ant-pagination.mini .ant-pagination-options {
-  margin-left: 8px;
-  display: none;
-}
- //滚动条样式
- .ant-table-body{
-  &::-webkit-scrollbar {
-    height: 5px;
-  }
-  &::-webkit-scrollbar-thumb {
-    border-radius: 5px;
-    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
-    background-image: url('/src/assets/safetyManage/hengxian.png');
-    background-repeat: no-repeat;
-   
-    background-size: 100% 100%;
-  }
-  &::-webkit-scrollbar-track {
-    -webkit-box-shadow: 0;
-    border-radius: 0;
-    background-image: url('/src/assets/safetyManage/gdt.png');
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-  }
-
-  &::-webkit-scrollbar-button {
-    background-image: url('/src/assets/safetyManage/shang.png');
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-  }
-}
 
 
 }

src/view/monitor/dailyTrain/DailyTrainLeft.js

@@ -377,24 +377,25 @@ class DailyTrainyLeft extends Component {
   }
 
   componentDidMount() {
-    const { pagination } = this.state;
-    debugger
-      var box1=document.getElementById("dailyTrain-bottom-left");
-      var box2=document.getElementById("one-div");
-      if(box1 && box2){ //此处在加一层判断，更加严密，如果box存在的情况下获取
-            console.log(box1.offsetHeight);
-            console.log(box2.offsetHeight);
-            this.setState({
-              tableHeight:(box1.offsetHeight-box2.offsetHeight)
-            })
-         
-      }
      
   }
 
-  onChange = (value, item) =>{
+  onRequestTable = (callback) => {
+    
+    this.setState({
+      data:data,
+      totalCount:data.length
+    });
+    callback && callback(data);
+
+    // electricFireListAction(current, pageSize, searchName).then(d => {
+    //   const { dataList, total } = d || {};
+      
+      
+    // });
+  }
 
-    debugger
+  onChange = (value, item) =>{
     console.log(value, item);
   
   }

src/view/monitor/dailyTrain/DailyTrainRight.js

@@ -380,24 +380,27 @@ class DailyTrainRight extends Component {
   }
 
   componentDidMount() {
-    const { pagination } = this.state;
-    debugger
-      var box1=document.getElementById("dailyTrain-bottom-left");
-      var box2=document.getElementById("one-div");
-      if(box1 && box2){ //此处在加一层判断，更加严密，如果box存在的情况下获取
-            console.log(box1.offsetHeight);
-            console.log(box2.offsetHeight);
-            this.setState({
-              tableHeight:(box1.offsetHeight-box2.offsetHeight)
-            })
-         
-      }
+   
      
   }
 
+  onEdit = (id) => {
+    // this.type = 'edit';
+    // electricFireDetailsAction(id).then(d => {
+    //   this.setState({
+    //     form: d,
+    //     title: d.name
+    //   })
+    // })
+    console.log("id:" + id)
+    this.setState({
+      data:data,
+      totalCount:data.length
+    })
+  }
+
   onChange = (value, item) =>{
 
-    debugger
     console.log(value, item);
   
   }
@@ -435,9 +438,9 @@ class DailyTrainRight extends Component {
 
 
   getAcitonData = () =>{
-        this.setState({
-          data:data
-        })
+        // this.setState({
+        //   data:data
+        // })
   }
 
   /**

src/view/monitor/dailyTrain/index.js

@@ -8,14 +8,32 @@ import DailyTrainRight from './DailyTrainRight';
  */
 export default class DailyTrain extends Component {
 
+  constructor(props) {
+    super(props);
+    this.state = {
+      activeKey: ''
+    };
+  }
+
+  componentDidMount(){
+    //右侧窗口默认显示第一个数据查询的列表
+    this.list && this.list.onRequestTable((list) => this.onEditClick(list[0]))
+  }
+
+  onEditClick = (record) => {
+    this.listTwo.onEdit(record.key)
+  }
+
+
+
   render() {
     return (
       <div className="dailyTrain-safety">
          <div className="dailyTrain-safty-content">
              <div className="dailyTrain-top"></div>
              <div className="dailyTrain-bottom">
-                 <DailyTrainyLeft />
-                 <DailyTrainRight />
+                 <DailyTrainyLeft ref={node => this.list = node}/>
+                 <DailyTrainRight ref={node => this.listTwo = node}/>
              </div>
          </div>
       </div>

src/view/monitor/equipmentMaintain/EquipmentMaintainLeft.js

@@ -378,7 +378,6 @@ class EquipmentMaintainLeft extends Component {
 
   componentDidMount() {
     const { pagination } = this.state;
-    debugger
       var box1=document.getElementById("equipmentMaintain-bottom-left");
       var box2=document.getElementById("one-div");
       if(box1 && box2){ //此处在加一层判断，更加严密，如果box存在的情况下获取
@@ -392,9 +391,24 @@ class EquipmentMaintainLeft extends Component {
      
   }
 
+  onRequestTable = (callback) => {
+    
+    this.setState({
+      data:data,
+      totalCount:data.length
+    });
+    callback && callback(data);
+
+    // electricFireListAction(current, pageSize, searchName).then(d => {
+    //   const { dataList, total } = d || {};
+      
+      
+    // });
+  }
+
+
   onChange = (value, item) =>{
 
-    debugger
     console.log(value, item);
   
   }

src/view/monitor/equipmentMaintain/EquipmentMaintainRight.js

@@ -347,7 +347,6 @@ class EquipmentMaintainRight extends Component {
 
   componentDidMount() {
     const { pagination } = this.state;
-    debugger
       var box1=document.getElementById("equipmentMaintain-bottom-left");
       var box2=document.getElementById("one-div");
       if(box1 && box2){ //此处在加一层判断，更加严密，如果box存在的情况下获取
@@ -361,9 +360,23 @@ class EquipmentMaintainRight extends Component {
      
   }
 
+  onEdit = (id) => {
+    // this.type = 'edit';
+    // electricFireDetailsAction(id).then(d => {
+    //   this.setState({
+    //     form: d,
+    //     title: d.name
+    //   })
+    // })
+    console.log("id:" + id)
+    this.setState({
+      data:data,
+      totalCount:data.length
+    })
+  }
+
   onChange = (value, item) =>{
 
-    debugger
     console.log(value, item);
   
   }
@@ -401,9 +414,9 @@ class EquipmentMaintainRight extends Component {
 
 
   getAcitonData = () =>{
-        this.setState({
-          data:data
-        })
+        // this.setState({
+        //   data:data
+        // })
   }
 
   /**

src/view/monitor/equipmentMaintain/index.js

@@ -8,14 +8,32 @@ import EquipmentMaintainRight from './EquipmentMaintainRight';
  */
 export default class EquipmentMaintainTrain extends Component {
 
+  constructor(props) {
+    super(props);
+    this.state = {
+      activeKey: ''
+    };
+  }
+
+  componentDidMount(){
+    //右侧窗口默认显示第一个数据查询的列表
+    this.list && this.list.onRequestTable((list) => this.onEditClick(list[0]))
+  }
+
+  onEditClick = (record) => {
+    this.listTwo.onEdit(record.key)
+  }
+
+
+
   render() {
     return (
       <div className="equipmentMaintain-safety">
          <div className="equipmentMaintain-safty-content">
              <div className="equipmentMaintain-top"></div>
              <div className="equipmentMaintain-bottom">
-                 <EquipmentMaintainLeft />
-                 <EquipmentMaintainRight />
+                 <EquipmentMaintainLeft ref={node => this.list = node}/>
+                 <EquipmentMaintainRight ref={node => this.listTwo = node}/>
              </div>
          </div>
       </div>

src/view/monitor/safetyInspection/SafetyInspectionLeft.js

@@ -378,24 +378,13 @@ class SafetyInspectionLeft extends Component {
   }
 
   componentDidMount() {
-    const { pagination } = this.state;
-    debugger
-      var box1=document.getElementById("safetyInspection-bottom-left");
-      var box2=document.getElementById("one-div");
-      if(box1 && box2){ //此处在加一层判断，更加严密，如果box存在的情况下获取
-            console.log(box1.offsetHeight);
-            console.log(box2.offsetHeight);
-            this.setState({
-              tableHeight:(box1.offsetHeight-box2.offsetHeight)
-            })
-         
-      }
+   
      
   }
 
   onChange = (value, item) =>{
 
-    debugger
+    
     console.log(value, item);
   
   }

src/view/monitor/safetyManage/SafteyLeft.js

@@ -377,24 +377,27 @@ class SafteyLeft extends Component {
   }
 
   componentDidMount() {
-    const { pagination } = this.state;
-    debugger
-      var box1=document.getElementById("fire-bottom-left");
-      var box2=document.getElementById("one-div");
-      if(box1 && box2){ //此处在加一层判断，更加严密，如果box存在的情况下获取
-            console.log(box1.offsetHeight);
-            console.log(box2.offsetHeight);
-            this.setState({
-              tableHeight:(box1.offsetHeight-box2.offsetHeight)
-            })
-         
-      }
+   
      
   }
 
+  onRequestTable = (callback) => {
+    
+    this.setState({
+      data:data,
+      totalCount:data.length
+    });
+    callback && callback(data);
+
+    // electricFireListAction(current, pageSize, searchName).then(d => {
+    //   const { dataList, total } = d || {};
+      
+      
+    // });
+  }
+
   onChange = (value, item) =>{
 
-    debugger
     console.log(value, item);
   
   }

src/view/monitor/safetyManage/SafteyRight.js

@@ -417,7 +417,6 @@ class SafteyRight extends Component {
 
   componentDidMount() {
     const { pagination } = this.state;
-    debugger
       var box1=document.getElementById("fire-bottom-left");
       var box2=document.getElementById("one-div");
       if(box1 && box2){ //此处在加一层判断，更加严密，如果box存在的情况下获取
@@ -431,9 +430,24 @@ class SafteyRight extends Component {
      
   }
 
+  onEdit = (id) => {
+    // this.type = 'edit';
+    // electricFireDetailsAction(id).then(d => {
+    //   this.setState({
+    //     form: d,
+    //     title: d.name
+    //   })
+    // })
+    console.log("id:" + id)
+    this.setState({
+      data:data,
+      totalCount:data.length
+    })
+  }
+
+
   onChange = (value, item) =>{
 
-    debugger
     console.log(value, item);
   
   }
@@ -471,9 +485,9 @@ class SafteyRight extends Component {
 
 
   getAcitonData = () =>{
-        this.setState({
-          data:data
-        })
+        // this.setState({
+        //   data:data
+        // })
   }
 
   /**

src/view/monitor/safetyManage/index.js

@@ -4,9 +4,25 @@ import SafteyRight from './SafteyRight';
 
 
 /**
- * 中心级2侧模块
+ * 安全培训
  */
 export default class Safety extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      activeKey: ''
+    };
+  }
+
+  componentDidMount(){
+    //右侧窗口默认显示第一个数据查询的列表
+    this.list && this.list.onRequestTable((list) => this.onEditClick(list[0]))
+  }
+
+  onEditClick = (record) => {
+    
+    this.listTwo.onEdit(record.key)
+  }
 
   render() {
     return (
@@ -14,8 +30,8 @@ export default class Safety extends Component {
          <div className="fire-safty-content">
              <div className="fire-top"></div>
              <div className="fire-bottom">
-                 <SafteyLeft />
-                 <SafteyRight />
+                 <SafteyLeft ref={node => this.list = node}/>
+                 <SafteyRight ref={node => this.listTwo = node}/>
              </div>
          </div>
       </div>