pu428f3pz
/
InternshipProject
1
0
Fork 2
Code Issues Pull Requests Releases Wiki Activity

菜单对应页面

Browse Source
dev_jzx
Jzx201211 4 years ago
parent 92a21c0edd
commit 754a49fa96
7 changed files with 314 additions and 2 deletions
Show Stats Download Patch File Download Diff File

10
src/pages/center2.js
Unescape View File

@ -1,4 +1,9 @@
import React, { Component } from "react";
import Page1 from "./page1";
import Page2 from "./page2";
import Page3 from "./page3";
import Page4 from "./page4";
import Page5 from "./page5";
export default class Center2 extends Component {
state = {
@ -44,6 +49,11 @@ export default class Center2 extends Component {
</li>
))}
</ul>
{this.state.current === 0 && <Page1></Page1>}
{this.state.current === 1 && <Page2></Page2>}
{this.state.current === 2 && <Page3></Page3>}
{this.state.current === 3 && <Page4></Page4>}
{this.state.current === 4 && <Page5></Page5>}
</div>
);
}

73
src/pages/index.css
Unescape View File

@ -98,7 +98,7 @@
flex-direction: column;
justify-content: flex-start;
align-items: center;
height: 500px;
height: 987px;
}
.center2_box1{
font-size: 30px;
@ -135,4 +135,73 @@
color: #1890ff !important;
border-color: #1890ff !important;
border-radius: 50px;
}
}
.center2_page{
width: 1300px;
height: 600px;
}
.center2_page1_left{
width: 384px;
flex-shrink: 0;
padding-top: 42px;
padding-left: 50px;
float: left;
}
.center2_page1_left h3{
font-size: 18px;
color: #34495e;
margin-bottom: 16px;
}
.center2_page1_left p{
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 12px;
}
.center2_page1_left p span{
font-size: 16px;
color: #667a8d;
}
.center2_page1_left_bottom{
width: 100%;
display: flex;
justify-content: flex-start;
margin-top: 34px;
}
.center2_page1_left_bottom_box1{
width: 137px;
height: 40px;
background: #377dff;
border-radius: 5px;
font-size: 16px;
font-weight: 500;
color: #fff;
line-height: 40px;
text-align: center;
cursor: pointer;
margin-right: 20px;
}
.center2_page1_left_bottom_box2{
width: 137px;
height: 40px;
background: #dfe6ff;
border-radius: 5px;
font-size: 16px;
font-weight: 500;
color: #377dff;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
}
.center2_page1_left_bottom_box2 i{
font-size: 12px;
margin-left: 15px;
}
.center2_page1_right{
width: 915px;
position: relative;
margin-top: 41px;
height: 500px;
float: left;
}

46
src/pages/page1.js
Unescape View File

@ -0,0 +1,46 @@
import React, { Component } from "react";
export default class Page1 extends Component {
render() {
return (
<div className="center2_page">
<div className="center2_page1_left">
<h3>云端编程环境特点</h3>
<p>
<span>图文、视频、Latex</span>
</p>
<p>
<span>VS Code编程环境</span>
</p>
<p>
<span>Online Judge（OJ）模式</span>
</p>
<p>
<span>代码自动推荐</span>
</p>
<p>
<span>可定制测试集</span>
</p>
<p>
<span>自动化部署、测试、反馈</span>
</p>
<h3 style={{ marginTop: "20px" }}>可定制运行环境</h3>
<p>
<span>CentOS、Ubuntu、Python、Matplotlib</span>
</p>
<p>
<span>Pandas、Numpy、Scrapy … …</span>
</p>
<div className="center2_page1_left_bottom">
<div className="center2_page1_left_bottom_box1">社区支持</div>
<div className="center2_page1_left_bottom_box2">
立即体验
<i className="center2_page1_left_bottom_box2_box"></i>
</div>
</div>
</div>
<div className="center2_page1_right"></div>
</div>
);
}
}

49
src/pages/page2.js
Unescape View File

@ -0,0 +1,49 @@
import React, { Component } from "react";
export default class Page2 extends Component {
render() {
return (
<div className="center2_page">
<div className="center2_page1_left" style={{ float: "right" }}>
<h3>远程桌面特点</h3>
<p>
<span>图文、视频、Latex</span>
</p>
<p>
<span>图形化操作系统</span>
</p>
<p>
<span>可配置应用软件和模拟器</span>
</p>
<p>
<span>可定制测试集</span>
</p>
<p>
<span>自动化部署、测试、反馈</span>
</p>
<p>
<span>大规模并发实验</span>
</p>
<p>
<span>支持一流课程建设</span>
</p>
<h3 style={{ marginTop: "20px" }}>可定制运行环境</h3>
<p>
<span>CentOS、Ubuntu、 Windows、 Kylin OS</span>
</p>
<p>
<span>Wireshark、Vscode、GN3 … …</span>
</p>
<div className="center2_page1_left_bottom">
<div className="center2_page1_left_bottom_box1">社区支持</div>
<div className="center2_page1_left_bottom_box2">
立即体验
<i className="center2_page1_left_bottom_box2_box"></i>
</div>
</div>
</div>
<div className="center2_page1_right"></div>
</div>
);
}
}

46
src/pages/page3.js
Unescape View File

@ -0,0 +1,46 @@
import React, { Component } from "react";
export default class Page3 extends Component {
render() {
return (
<div className="center2_page">
<div className="center2_page1_left">
<h3>远程命令行环境</h3>
<p>
<span>标准Linux Shell命令</span>
</p>
<p>
<span>命令操作全程记录</span>
</p>
<p>
<span>可配置命令行应用程序</span>
</p>
<p>
<span>可配置命令行模拟器</span>
</p>
<p>
<span>自动化部署、测试、反馈</span>
</p>
<p>
<span>支持一流课程建设</span>
</p>
<h3 style={{ marginTop: "20px" }}>可定制运行环境</h3>
<p>
<span>CentOS、Ubuntu、Python、Vim、Docker</span>
</p>
<p>
<span>SSH、Git、Hadoop、Hive … …</span>
</p>
<div className="center2_page1_left_bottom">
<div className="center2_page1_left_bottom_box1">社区支持</div>
<div className="center2_page1_left_bottom_box2">
立即体验
<i className="center2_page1_left_bottom_box2_box"></i>
</div>
</div>
</div>
<div className="center2_page1_right"></div>
</div>
);
}
}

46
src/pages/page4.js
Unescape View File

@ -0,0 +1,46 @@
import React, { Component } from "react";
export default class Page4 extends Component {
render() {
return (
<div className="center2_page">
<div className="center2_page1_left" style={{ float: "right" }}>
<h3>虚拟仿真项目特点</h3>
<p>
<span>三维动画教学</span>
</p>
<p>
<span>命令操作全程记录</span>
</p>
<p>
<span>构件化、可组装虚拟场景</span>
</p>
<p>
<span>自动化评测、反馈</span>
</p>
<p>
<span>大规模并发仿真实验</span>
</p>
<p>
<span>支持虚拟仿真项目建设</span>
</p>
<h3 style={{ marginTop: "20px" }}>可定制运行环境</h3>
<p>
<span>Ubuntu、CentOS、WebGL、Python</span>
</p>
<p>
<span>Java、C#、ThreeJS、Unity … …</span>
</p>
<div className="center2_page1_left_bottom">
<div className="center2_page1_left_bottom_box1">社区支持</div>
<div className="center2_page1_left_bottom_box2">
立即体验
<i className="center2_page1_left_bottom_box2_box"></i>
</div>
</div>
</div>
<div className="center2_page1_right"></div>
</div>
);
}
}

46
src/pages/page5.js
Unescape View File

@ -0,0 +1,46 @@
import React, { Component } from "react";
export default class Page5 extends Component {
render() {
return (
<div className="center2_page">
<div className="center2_page1_left">
<h3>Jupyter NoteBook环境</h3>
<p>
<span>代码编辑与结果展示同步</span>
</p>
<p>
<span>富媒体展示计算结果</span>
</p>
<p>
<span>模块化执行</span>
</p>
<p>
<span>支持Latex、Markdown</span>
</p>
<p>
<span>200种可选运行环境</span>
</p>
<p>
<span>自动化部署、测试、反馈</span>
</p>
<h3 style={{ marginTop: "20px" }}>可定制运行环境</h3>
<p>
<span>CentOS、openEuler、TensorFlow、Python</span>
</p>
<p>
<span>MindSpore、Spark、Ubuntu … …</span>
</p>
<div className="center2_page1_left_bottom">
<div className="center2_page1_left_bottom_box1">社区支持</div>
<div className="center2_page1_left_bottom_box2">
立即体验
<i className="center2_page1_left_bottom_box2_box"></i>
</div>
</div>
</div>
<div className="center2_page1_right"></div>
</div>
);
}
}
Write Preview
Loading…
Cancel
Save