diff --git a/src/pages/component/component2/sidbar.css b/src/pages/component/component2/sidbar.css new file mode 100644 index 00000000..8d675c82 --- /dev/null +++ b/src/pages/component/component2/sidbar.css @@ -0,0 +1,66 @@ +.sidbar{ + width: 100%; + float: left; + height: 345px; + margin-top: 30px; +} +.sidbar_main{ + border-radius: 8px ; + height: 345px; + width: 1200px; + margin: 0 auto; + position: relative; + overflow: hidden; +} +.sidbar_main_left{ + list-style: none ; + border-radius: 8px 0 0 8px; + height: 345px; + width: 160px; + padding: 10px 20px 0 20px ; + background: black ; + margin-bottom: 0px; + border-right: 0px; + position: absolute; + left: 0; + top: 0; + bottom: 0; + z-index: 2; +} +.sidbar_main_left_box{ + margin-right: 20px; + color: #fff; + width: 120px; + height: 40px; + display: flex; + justify-content: space-between; + align-items: center; + border-bottom: 1px solid #4b4b4b; + font-size: 12px; + padding: 0!important; +} +.sidbar_main_left_box .ant-menu-submenu-title{ + margin: 0; + padding: 0; + width: 100%; +} +.sidbar_main_left_box .ant-menu-submenu-arrow{ + right: 0; +} +.sidbar_picture{ + height: 345px; + width: 1200px; + line-height: 345px; + text-align: center; + float: left; + background: blue; + margin-bottom: 0px; +} +.sidbar_picture img{ + width: 100%; + height:100%; +} + +.sidbar_picture .ant-carousel .slick-list .slick-track{ + height: 345px; +} \ No newline at end of file diff --git a/src/pages/component/component2/sidbar.js b/src/pages/component/component2/sidbar.js new file mode 100644 index 00000000..56d561b2 --- /dev/null +++ b/src/pages/component/component2/sidbar.js @@ -0,0 +1,160 @@ +import React, { Component } from "react"; +import { Carousel } from "antd"; +import { Menu } from "antd"; +import "./sidbar.css"; +import { + MailOutlined, + AppstoreOutlined, + SettingOutlined, +} from "@ant-design/icons"; + +const { SubMenu } = Menu; + +export default class Sidbar extends Component { + render() { + return ( +
+
+ + + C/C++程序设计 + Java程序设计 + Python程序设计 + PHP程序设计 + Go语言程序设计 + C#程序设计 + Matlab程序设计 + 面向对象程序设计 + 其他语言 + R语言程序设计 + + + 离散数学 + 大学计算机基础 + 计算思维 + 图形图像 + 数理统计 + + + 计算机组成原理 + 操作系统 + 编译原理 + 计算机系统 + 信号与系统 + 汇编语言程序设计 + Linux编程设计 + Verilog程序设计 + 机器人 + + + 数据科学 + 数据采集 + 数据存储管理 + 数据分析处理 + 数据可视化 + 大数据应用案例 + 虚拟化 + 集群管理 + 云计算基础 + + + 人工智能基础 + 机器学习 + 深度学习 + 自然语言处理 + 语音识别 + 机器视觉 + 人工智能应用案列 + 人工智能平台 + 计算与人工智能概论 + + + 软件工程导论 + 需求分析 + 开发运维 + 测试度量 + 项目管理 + + + Web语言开发 + Web基础 + 前端框架 + 后端框架 + Web应用案列 + + + + + +
+ +
+

+ +

+
+
+

+ +

+
+
+

+ +

+
+
+

+ +

+
+ +
+

+ +

+
+
+

+ +

+
+
+

+ +

+
+
+

+ +

+
+ +
+
+
+ ); + } +} diff --git a/src/pages/component/component3/TabBar.js b/src/pages/component/component3/TabBar.js new file mode 100644 index 00000000..16139333 --- /dev/null +++ b/src/pages/component/component3/TabBar.js @@ -0,0 +1,67 @@ +import React, { Component } from "react"; +import Page1 from "./TabBar/page1"; +import Page2 from "./TabBar/page2"; +import Page3 from "./TabBar/page3"; +import Page4 from "./TabBar/page4"; +import Page5 from "./TabBar/page5"; + +export default class TabBar extends Component { + state = { + list: [ + { + id: 1, + text: "云端编程环境", + }, + { + id: 2, + text: "远程桌面", + }, + { + id: 3, + text: "远程命令行", + }, + { + id: 4, + text: "虚拟仿真", + }, + { + id: 5, + text: "交互式笔记", + }, + ], + current: 0, + availTime: 0, + }; + render() { + return ( +
+

异质架构实践运行环境

+
+ Heterogeneous Architecture Pratice Runtime Environments +
+ + {this.state.current === 0 && } + {this.state.current === 1 && } + {this.state.current === 2 && } + {this.state.current === 3 && } + {this.state.current === 4 && } +
+ ); + } + handleClick(index) { + console.log(index); + this.setState({ + current: index, + }); + } +} diff --git a/src/pages/component/component3/TabBar/page1.js b/src/pages/component/component3/TabBar/page1.js new file mode 100644 index 00000000..0239477f --- /dev/null +++ b/src/pages/component/component3/TabBar/page1.js @@ -0,0 +1,58 @@ +import React, { Component } from "react"; + +export default class Page1 extends Component { + render() { + return ( +
+
+

云端编程环境特点

+

+ + 图文、视频、Latex +

+

+ + VS Code编程环境 +

+

+ + Online Judge（OJ）模式 +

+

+ + 代码自动推荐 +

+

+ + 可定制测试集 +

+

+ + 自动化部署、测试、反馈 +

+

可定制运行环境

+

+ CentOS、Ubuntu、Python、Matplotlib +

+

+ Pandas、Numpy、Scrapy … … +

+
+
社区支持
+
+ 立即体验 + +
+
+
+
+ + +
+
+ ); + } +} diff --git a/src/pages/component/component3/TabBar/page2.js b/src/pages/component/component3/TabBar/page2.js new file mode 100644 index 00000000..8ff8b10d --- /dev/null +++ b/src/pages/component/component3/TabBar/page2.js @@ -0,0 +1,62 @@ +import React, { Component } from "react"; + +export default class Page2 extends Component { + render() { + return ( +
+
+

远程桌面特点

+

+ + 图文、视频、Latex +

+

+ + 图形化操作系统 +

+

+ + 可配置应用软件和模拟器 +

+

+ + 可定制测试集 +

+

+ + 自动化部署、测试、反馈 +

+

+ + 大规模并发实验 +

+

+ + 支持一流课程建设 +

+

可定制运行环境

+

+ CentOS、Ubuntu、 Windows、 Kylin OS +

+

+ Wireshark、Vscode、GN3 … … +

+
+
社区支持
+
+ 立即体验 + +
+
+
+
+ + +
+
+ ); + } +} diff --git a/src/pages/component/component3/TabBar/page3.js b/src/pages/component/component3/TabBar/page3.js new file mode 100644 index 00000000..402448d4 --- /dev/null +++ b/src/pages/component/component3/TabBar/page3.js @@ -0,0 +1,58 @@ +import React, { Component } from "react"; + +export default class Page3 extends Component { + render() { + return ( +
+
+

远程命令行环境

+

+ + 标准Linux Shell命令 +

+

+ + 命令操作全程记录 +

+

+ + 可配置命令行应用程序 +

+

+ + 可配置命令行模拟器 +

+

+ + 自动化部署、测试、反馈 +

+

+ + 支持一流课程建设 +

+

可定制运行环境

+

+ CentOS、Ubuntu、Python、Vim、Docker +

+

+ SSH、Git、Hadoop、Hive … … +

+
+
社区支持
+
+ 立即体验 + +
+
+
+
+ + +
+
+ ); + } +} diff --git a/src/pages/component/component3/TabBar/page4.js b/src/pages/component/component3/TabBar/page4.js new file mode 100644 index 00000000..432334d1 --- /dev/null +++ b/src/pages/component/component3/TabBar/page4.js @@ -0,0 +1,58 @@ +import React, { Component } from "react"; + +export default class Page4 extends Component { + render() { + return ( +
+
+

虚拟仿真项目特点

+

+ + 三维动画教学 +

+

+ + 命令操作全程记录 +

+

+ + 构件化、可组装虚拟场景 +

+

+ + 自动化评测、反馈 +

+

+ + 大规模并发仿真实验 +

+

+ + 支持虚拟仿真项目建设 +

+

可定制运行环境

+

+ Ubuntu、CentOS、WebGL、Python +

+

+ Java、C#、ThreeJS、Unity … … +

+
+
社区支持
+
+ 立即体验 + +
+
+
+
+ + +
+
+ ); + } +} diff --git a/src/pages/component/component3/TabBar/page5.js b/src/pages/component/component3/TabBar/page5.js new file mode 100644 index 00000000..78dfec70 --- /dev/null +++ b/src/pages/component/component3/TabBar/page5.js @@ -0,0 +1,58 @@ +import React, { Component } from "react"; + +export default class Page5 extends Component { + render() { + return ( +
+
+

Jupyter NoteBook环境

+

+ + 代码编辑与结果展示同步 +

+

+ + 富媒体展示计算结果 +

+

+ + 模块化执行 +

+

+ + 支持Latex、Markdown +

+

+ + 200种可选运行环境 +

+

+ + 自动化部署、测试、反馈 +

+

可定制运行环境

+

+ CentOS、openEuler、TensorFlow、Python +

+

+ MindSpore、Spark、Ubuntu … … +

+
+
社区支持
+
+ 立即体验 + +
+
+
+
+ + +
+
+ ); + } +} diff --git a/src/pages/component/component4/contents.js b/src/pages/component/component4/contents.js new file mode 100644 index 00000000..e6175929 --- /dev/null +++ b/src/pages/component/component4/contents.js @@ -0,0 +1,385 @@ +import React, { Component } from "react"; + +export default class Contents extends Component { + render() { + return ( +
+
+
+

程序设计与软件工程课程方向

+
Computer Programming and Software Engineering Courses
+
+
+ +
社区支持
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+
+

计算机系统能力课程方向

+
Computer System Capability Courses
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ 社区支持 +
+
+
+
+
+
+
+

电子信息专业课程方向

+
Electronic Information Courses
+
+
+ +
社区支持
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+
+

大数据专业课程方向

+
Big Data and Data Science Courses
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ 社区支持 +
+
+
+
+
+
+
+

人工智能专业课程方向

+
Artificial Intelligence Courses
+
+
+ +
社区支持
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ ); + } +} diff --git a/src/pages/component/component5/content4.js b/src/pages/component/component5/content4.js new file mode 100644 index 00000000..5a83e747 --- /dev/null +++ b/src/pages/component/component5/content4.js @@ -0,0 +1,74 @@ +import React, { Component } from "react"; + +export default class Content4 extends Component { + render() { + return ( +
+
+

课堂教学工具

+
Classroom Teaching Toolsets
+
+
加入课堂
+
创建课堂
+
+
+
+ +
+

课堂灵活组织

+
+ 头歌教学课堂是一种集成化班级协同空间，支持实验、作业、视频、考试、毕设等十余种线上线下管理工具。 +
+
+
+
+ +
+

作业自动管理

+
+ 头歌作业管理是课堂核心组件，支持普通作业、实践作业、分组作业等自动化批阅、统计和教务数据对接。 +
+
+
+
+ +
+

分组协同开发

+
+ 头歌分组作业是课堂核心组件，支持分组开展项目协同开发、代码托管、任务跟踪、CI/CD、按组评分等。 +
+
+
+
+ +
+

考试与防作弊

+
+ 头歌智能化考试系统提供了全面防作弊机制，试卷支持八种题型，支持随机拍照、查重、IP地址锁定等防作弊机制。 +
+
+
+
+ +
+

结果导向统计

+
+ 头歌支持OBE（成果导向教育）理念和机制，支持作业、实验、考试、课堂等多粒度、多维度的教学成效分析。 +
+
+
+
+ +
+

工程教育认证

+
+ 头歌的工程教育专业认证系统集成了头歌OBE体系，支持基于大数据的自动化专业达成度自动计算和实时改进。 +
+
+
+
+
+
+ ); + } +} diff --git a/src/pages/component/component6/content5.js b/src/pages/component/component6/content5.js new file mode 100644 index 00000000..2984a060 --- /dev/null +++ b/src/pages/component/component6/content5.js @@ -0,0 +1,82 @@ +import React, { Component } from "react"; + +export default class content5 extends Component { + render() { + return ( +
+
+

头歌企业版

+
Enterprise Edition of EduCoder Software and Services
+
+

+ 为3000家以上高校和企业 + 提供产品和服务 +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ + + + + + + + + + + + + + + + + + + + + +
+
试用申请
+
+
+
+ ); + } +} diff --git a/src/pages/component/component8/cssTransition.css b/src/pages/component/component8/cssTransition.css new file mode 100644 index 00000000..711bb110 --- /dev/null +++ b/src/pages/component/component8/cssTransition.css @@ -0,0 +1,21 @@ +.fade-enter { + opacity: 0; + transform: translateX(100%); + } + + .fade-enter-active { + opacity: 1; + transform: translateX(0); + transition: all 500ms; + } + + .fade-exit { + opacity: 1; + transform: translateX(0); + } + + .fade-exit-active { + opacity: 0; + transform: translateX(-100%); + transition: all 500ms; + } \ No newline at end of file diff --git a/src/pages/component/component8/cssTransition.js b/src/pages/component/component8/cssTransition.js new file mode 100644 index 00000000..cd6d617d --- /dev/null +++ b/src/pages/component/component8/cssTransition.js @@ -0,0 +1,26 @@ +import './cssTransition.css' +export default class App2 extends React.PureComponent { + + state = {show: true}; + + onToggle = () => this.setState({show: !this.state.show}); + + render() { + const {show} = this.state; + return ( +
+
+ +
+ +
+ +
+ ); + } +} \ No newline at end of file diff --git a/src/pages/component/conponent9/Fixed.js b/src/pages/component/conponent9/Fixed.js new file mode 100644 index 00000000..f161195b --- /dev/null +++ b/src/pages/component/conponent9/Fixed.js @@ -0,0 +1,12 @@ +import React, { Component } from "react"; + +export default class Fixed extends Component { + render() { + return ( +
+
联系我们
+
回到顶部
+
+ ); + } +}