loadRepoFiles

public/react/src/modules/page/VNC.css

@@ -12,5 +12,6 @@
     writing-mode: vertical-rl;
     top: 36px;
     color: #fff;
-    left: 10px;
+    left: 13px;
+    user-select: none;
 }

public/react/src/modules/page/VNCContainer.js

@@ -5,20 +5,35 @@ import SecondDrawer from './component/SecondDrawer'
 
 import './VNC.css'
 const $ = window.$;
+const firstDrawerWidth = 400;
 class VNCContainer extends Component {
 	componentDidMount() {
 		
 
 	}
-	
+	getSecondDrawerWidth = () => {
+		return $('#game_right_contents').width() - firstDrawerWidth
+	}
+	renderSecondDrawerChildren = () => {
+		return (<div>
+		
+		</div>);
+	}
   	render() {
   		const { challenge,  vnc_url } = this.props
 
+		const secondDrawerChildren = this.renderSecondDrawerChildren();
 	    return (
 	      	<React.Fragment>
                 <SecondDrawer
                     floatText={'版本库'}
-                ></SecondDrawer>
+					maskClosable={false}
+					secondDrawerChildren={secondDrawerChildren}	
+					firstDrawerWidth={firstDrawerWidth}
+					getSecondDrawerWidth={this.getSecondDrawerWidth}
+                >
+				
+				</SecondDrawer>
                 <FloatButton></FloatButton>
                 <VNCDisplay
                     {...this.props}

public/react/src/modules/page/component/SecondDrawer.js

@@ -2,8 +2,9 @@ import React from "react";
 import ReactDOM from "react-dom";
 import { Drawer } from "antd";
 import FloatButton from './FloatButton'
+import PropTypes from 'prop-types';
 
-export default class SecondDrawer extends React.Component {
+class SecondDrawer extends React.Component {
   state = { visible: false, childrenDrawer: false };
 
   showDrawer = () => {
@@ -42,76 +43,52 @@ export default class SecondDrawer extends React.Component {
     });
   }
   render() {
-    const { floatText } = this.props
+    const { floatText, maskClosable, children, secondDrawerChildren, firstDrawerWidth, getSecondDrawerWidth } = this.props
+    const secondDrawerWidth = getSecondDrawerWidth();
+    // 180  不知道为什么会偏移 180px
     return (
-      <div>
         <Drawer
-          title="Multi-level drawer"
-          width={520}
+          title="　"
+          width={this.state.childrenDrawer ? secondDrawerWidth + firstDrawerWidth - 180 : firstDrawerWidth}
           closable={false}
           onClose={this.onClose}
           visible={this.state.visible}
+          maskClosable={maskClosable}
         >
           <button type="primary" onClick={this.showChildrenDrawer}>
             Two-level drawer
           </button>
           <FloatButton onClick={this.swtichFirstDrawer}>{floatText}</FloatButton>
-          {/* <button
-            type="primary"
-            onClick={this.swtichFirstDrawer}
-            style={{
-              left: "-48px",
-              position: "absolute"
-            }}
-          >
-            Show first
-          </button> */}
+          { children }
+          
           <Drawer
             mask={false}
-            title="Two-level Drawer"
-            width={320}
+            title="　"
+            width={secondDrawerWidth}
             closable={false}
             onClose={this.onChildrenDrawerClose}
             visible={this.state.childrenDrawer}
           >
-            This is two-level drawer
-            <button
+            { secondDrawerChildren }
+            {/* <button
               style={{
                 marginRight: 8
               }}
               onClick={this.onChildrenDrawerClose}
             >
               Cancel
-            </button>
+            </button> */}
           </Drawer>
-          <div
-            style={{
-              position: "absolute",
-              bottom: 0,
-              width: "100%",
-              borderTop: "1px solid #e8e8e8",
-              padding: "10px 16px",
-              textAlign: "right",
-              left: 0,
-              background: "#fff",
-              borderRadius: "0 0 4px 4px"
-            }}
-          >
-            <button
-              style={{
-                marginRight: 8
-              }}
-              onClick={this.onClose}
-            >
-              Cancel
-            </button>
-            <button onClick={this.onClose} type="primary">
-              Submit
-            </button>
-          </div>
         </Drawer>
-      </div>
     );
   }
 }
 
+SecondDrawer.propTypes = {
+  floatText: PropTypes.string,
+  maskClosable: PropTypes.bool,
+  secondDrawerChildren: PropTypes.element,
+};
+// firstDrawerWidth={firstDrawerWidth}
+// getSecondDrawerWidth={this.getSecondDrawerWidth}
+export default SecondDrawer

public/react/src/modules/page/main/CodeRepositoryViewContainer.js

@@ -101,6 +101,11 @@ class CodeRepositoryViewContainer extends Component {
             drawerOpen: open,
         })
 	}
+	loadRepoFiles = () => {
+		if (!this.state.fileTreeData) {
+			this.fetchRepoFiles();
+		}
+	}
 
 	componentWillReceiveProps(newProps, oldProps) {
 		
@@ -274,6 +279,7 @@ class CodeRepositoryViewContainer extends Component {
 	      	<CodeRepositoryView {...this.props} 
 	      		{...this.state} 
 	      		showFilesDrawer={this.showFilesDrawer}
+				loadRepoFiles={this.loadRepoFiles}
 	      		onLoadData={this.onLoadData}
 	      		onTreeSelect={ this.onTreeSelect }
 	      		onRepositoryViewExpand={this.onRepositoryViewExpand}