From 7f4989a039cf65a82b13d106acc6759c6ae470fc Mon Sep 17 00:00:00 2001
From: tangjiang <465264938@qq.com>
Date: Thu, 2 Jan 2020 12:39:35 +0800
Subject: [PATCH] update test-code style

---
 public/react/src/modules/page/VNC.css         | 27 +++++++
 public/react/src/modules/page/VNCContainer.js | 24 ++++--
 .../src/modules/page/main/ActionView.css      |  2 +
 .../src/modules/page/main/CodeEvaluateView.js | 62 ++++++++-------
 .../page/main/CodeRepositoryViewContainer.js  | 76 +++++++++++++------
 5 files changed, 130 insertions(+), 61 deletions(-)

diff --git a/public/react/src/modules/page/VNC.css b/public/react/src/modules/page/VNC.css
index 58a45d735..637cc3589 100644
--- a/public/react/src/modules/page/VNC.css
+++ b/public/react/src/modules/page/VNC.css
@@ -39,6 +39,7 @@
     user-select: none;
 }
 
+
 .btn_test_case,
 .btn_test_case_active{
     display: inline-block;
@@ -80,6 +81,32 @@
     bottom: 4px;
 }
 
+.blacktab_con_abs{
+    position: absolute !important;
+    left: 150px;
+    right: 150px;
+    top: 0;
+    height: 34px;
+    background: gold;
+}
+.code_evalute_icon{
+    position: absolute;
+    top: 0;
+    width: 56px;
+    height: 28px;
+    left: 50%;
+    margin-left: -28px;
+    background: rgba(42,58,79,1);
+    z-index: 10;
+    border-bottom-left-radius: 100px;
+    border-bottom-right-radius: 100px;
+    color: #fff;
+    text-align: center;
+    cursor: pointer;
+    opacity: .4;
+    transition: all .3s;
+}
+
 @keyframes mymove
 {
     from {right:0px;}
diff --git a/public/react/src/modules/page/VNCContainer.js b/public/react/src/modules/page/VNCContainer.js
index 30e439e8d..93da489d5 100644
--- a/public/react/src/modules/page/VNCContainer.js
+++ b/public/react/src/modules/page/VNCContainer.js
@@ -224,6 +224,10 @@ class VNCContainer extends Component {
                 >
 					<style>{`
 						/* 评测结果 */
+						.codeEvaluateDrawer{
+							// position: absolute;
+							// bottom: 84px;
+						}
 						.codeEvaluateDrawer #game_test_set_results {
 							height: 198px;
 						}					    
@@ -233,7 +237,10 @@ class VNCContainer extends Component {
 						.codeEvaluateDrawer .ant-drawer-content-wrapper, .codeEvaluateDrawer .ant-drawer-mask {
 							position: absolute;
 						}
-
+						.codeEvaluateDrawer .ant-drawer-content-wrapper .ant-drawer-content{
+							height: 100%;
+							background: rgb(5, 16, 26) !important;
+						}
 
 						.codeEvaluateFloatButton {
 							bottom: 180px !important;
@@ -345,7 +352,8 @@ class VNCContainer extends Component {
 						className={'codeEvaluateDrawer'}
 						placement="bottom"
 						getContainer={false}
-						style={{ position: 'absolute', bottom: '-25px', zIndex: 1 }}
+						// style={{ position: 'absolute', bottom: '-25px', zIndex: 1 }}
+						style={{ position: 'absolute', bottom: '50px', zIndex: 1 }}
 						afterVisibleChange={(visible) => {
 							if (visible) {
 								const canvas = $('.vncDisply canvas')[0]
@@ -356,16 +364,16 @@ class VNCContainer extends Component {
 					>
 						{ this.props.codeEvaluate }
 					</Drawer>
-					{/* <FloatButton onClick={this.swtichBottomDrawer}
+					<FloatButton onClick={this.swtichBottomDrawer}
 						className="codeEvaluateFloatButton"
-					>测试集</FloatButton> */}
-					<div 
+					>测试集</FloatButton>
+					{/* <div 
 						className={_classCtx}
 						onClick={this.swtichBottomDrawer}
-					>
+					> */}
 						{/* <span className="iconfont icon-shangjiantou btn-arrow"></span> */}
-						<span className={_classes}></span>
-					</div>
+						{/* <span className={_classes}></span> */}
+					{/* </div> */}
 				</VNCDisplay>
 
                 
diff --git a/public/react/src/modules/page/main/ActionView.css b/public/react/src/modules/page/main/ActionView.css
index 4b88a6690..88a601adf 100644
--- a/public/react/src/modules/page/main/ActionView.css
+++ b/public/react/src/modules/page/main/ActionView.css
@@ -1,9 +1,11 @@
 #actionView {
+    position: relative;
 	background:rgba(5,16,26,1);
 	min-height: 49px;
     /*box-shadow: inset 0 0 10px #27324c;*/
     z-index: 9;
     box-shadow: 0px -1px 4px 0px rgba(76,172,255,0.08);
+    z-index: 10001;
 }
     #time-consuming span {
         color: #747A7F;
diff --git a/public/react/src/modules/page/main/CodeEvaluateView.js b/public/react/src/modules/page/main/CodeEvaluateView.js
index 44a98ae77..760ccd1ad 100644
--- a/public/react/src/modules/page/main/CodeEvaluateView.js
+++ b/public/react/src/modules/page/main/CodeEvaluateView.js
@@ -1,3 +1,4 @@
+import '../VNC.css';
 import React, { Component } from 'react';
 
 import IconButton from 'material-ui/IconButton';
@@ -302,34 +303,39 @@ class CodeEvaluateView extends Component {
 	    return (
 	    	<React.Fragment>
 		    	<ul id="blacktab_nav">
-				  <li className="blacktab_con undis" >
-				  </li>
-				  { challenge.isHtml ? 
-				  <li className={`blacktab_con ${ tabIndex === 0 ? 'tab_hover' : ''}`} onClick={() => this.tabIndexChange(0)}>
-				    <a href="javascript:void(0);" className="tab_type tab_color">效果显示</a>
-				  </li> : ''}
-				  <li className={`blacktab_con ${ tabIndex === 1 ? 'tab_hover' : ''}`} onClick={() => this.tabIndexChange(1)}>
-				    <a href="javascript:void(0);" className="tab_type tab_color">测试结果</a>
-				  </li>
-				  	
-				  	{this.props.inDrawer ? <Tooltip id="tooltip-icon-expand" title={ "收起" }>
-				  		{/*TODO 按钮大小改造，css*/}
-					  	{/* icon-guanbi */}
-					  	<a className="iconButton fr mr15 mt4" onClick={this.props.hideCodeEvaluate} id="extend_and_zoom" >
-					  		<i className={  "font-18 iconfont icon-guanbi" }></i>
-					  	</a>
-					  	
-				  	</Tooltip> : <Tooltip id="tooltip-icon-expand" title={ evaluateViewExpanded ? "收起" : "展开"}>
-				  		{/*TODO 按钮大小改造，css*/}
-					  	
-					  	<a className="iconButton fr mr15" onClick={this.onEvaluateViewExpand} id="extend_and_zoom" >
-					  		<i className={ evaluateViewExpanded ? "font-18 iconfont icon-shousuo" : "iconfont icon-zhankai font-18" }></i>
-					  	</a>
-					  	
-				  	</Tooltip>}
-				  
-				  <div className="cl"></div>
-				</ul>
+						<li className="blacktab_con undis" >
+						</li>
+						{ challenge.isHtml ? 
+						<li className={`blacktab_con ${ tabIndex === 0 ? 'tab_hover' : ''}`} onClick={() => this.tabIndexChange(0)}>
+							<a href="javascript:void(0);" className="tab_type tab_color">效果显示</a>
+						</li> : ''}
+						<li className={`blacktab_con ${ tabIndex === 1 ? 'tab_hover' : ''}`} onClick={() => this.tabIndexChange(1)}>
+							<a href="javascript:void(0);" className="tab_type tab_color">测试结果</a>
+						</li>
+						{/* <li className="blacktab_con_abs">
+							<span className="code_evalute_icon">
+								<span className="iconfont icon-xiajiantou btn-arrow"></span>
+							</span>
+						</li> */}
+							
+							{this.props.inDrawer ? <Tooltip id="tooltip-icon-expand" title={ "收起" }>
+								{/*TODO 按钮大小改造，css*/}
+								{/* icon-guanbi */}
+								<a className="iconButton fr mr15 mt4" onClick={this.props.hideCodeEvaluate} id="extend_and_zoom" >
+									<i className={  "font-18 iconfont icon-guanbi" }></i>
+								</a>
+								
+							</Tooltip> : <Tooltip id="tooltip-icon-expand" title={ evaluateViewExpanded ? "收起" : "展开"}>
+								{/*TODO 按钮大小改造，css*/}
+								
+								<a className="iconButton fr mr15" onClick={this.onEvaluateViewExpand} id="extend_and_zoom" >
+									<i className={ evaluateViewExpanded ? "font-18 iconfont icon-shousuo" : "iconfont icon-zhankai font-18" }></i>
+								</a>
+								
+							</Tooltip>}
+						
+						<div className="cl"></div>
+					</ul>
 
 
 				<CircularProgress size={40} thickness={3} 
diff --git a/public/react/src/modules/page/main/CodeRepositoryViewContainer.js b/public/react/src/modules/page/main/CodeRepositoryViewContainer.js
index c30ec0386..bbb3c47a4 100644
--- a/public/react/src/modules/page/main/CodeRepositoryViewContainer.js
+++ b/public/react/src/modules/page/main/CodeRepositoryViewContainer.js
@@ -296,32 +296,58 @@ class CodeRepositoryViewContainer extends Component {
   	render() {
 		  
 	    return (
-			<React.Fragment>
-				{this.props.isOnlyContainer == true ? 
-					React.Children.map(this.props.children, child => {
-						if(!child) {
-							return ''
-						}
-						return React.cloneElement(child, Object.assign({...this.state}, { 
-							loadRepoFiles: this.loadRepoFiles,
-							onTreeSelect: this.onTreeSelect,
-							onLoadData: this.onLoadData,
-						}))
-					})
+				// <React.Fragment>
+				// 	{this.props.isOnlyContainer == true ? 
+				// 		React.Children.map(this.props.children, child => {
+				// 			if(!child) {
+				// 				return ''
+				// 			}
+				// 			return React.cloneElement(child, Object.assign({...this.state}, { 
+				// 				loadRepoFiles: this.loadRepoFiles,
+				// 				onTreeSelect: this.onTreeSelect,
+				// 				onLoadData: this.onLoadData,
+				// 			}))
+				// 		})
 
-				 : 
-			
-				<CodeRepositoryView {...this.props} 
-					{...this.state} 
-					showFilesDrawer={this.showFilesDrawer}
-					loadRepoFiles={this.loadRepoFiles}
-					onLoadData={this.onLoadData}
-					onTreeSelect={ this.onTreeSelect }
-					onRepositoryViewExpand={this.onRepositoryViewExpand}
-					tabIndexChange={this.tabIndexChange}
-					showSettingDrawer={this.showSettingDrawer}
-				></CodeRepositoryView> }
-			</React.Fragment>
+				// 	: 
+				
+				// 	<CodeRepositoryView {...this.props} 
+				// 		{...this.state} 
+				// 		showFilesDrawer={this.showFilesDrawer}
+				// 		loadRepoFiles={this.loadRepoFiles}
+				// 		onLoadData={this.onLoadData}
+				// 		onTreeSelect={ this.onTreeSelect }
+				// 		onRepositoryViewExpand={this.onRepositoryViewExpand}
+				// 		tabIndexChange={this.tabIndexChange}
+				// 		showSettingDrawer={this.showSettingDrawer}
+				// 	></CodeRepositoryView> }
+				// </React.Fragment>
+				<React.Fragment>
+					{this.props.isOnlyContainer == true ? 
+						React.Children.map(this.props.children, child => {
+							if(!child) {
+								return ''
+							}
+							return React.cloneElement(child, Object.assign({...this.state}, { 
+								loadRepoFiles: this.loadRepoFiles,
+								onTreeSelect: this.onTreeSelect,
+								onLoadData: this.onLoadData,
+							}))
+						})
+
+					: 
+				
+					<CodeRepositoryView {...this.props} 
+						{...this.state} 
+						showFilesDrawer={this.showFilesDrawer}
+						loadRepoFiles={this.loadRepoFiles}
+						onLoadData={this.onLoadData}
+						onTreeSelect={ this.onTreeSelect }
+						onRepositoryViewExpand={this.onRepositoryViewExpand}
+						tabIndexChange={this.tabIndexChange}
+						showSettingDrawer={this.showSettingDrawer}
+					></CodeRepositoryView> }
+				</React.Fragment>
 	    );
   	}
 }