import React from 'react';
import { TPMIndexHOC } from '../../modules/tpm/TPMIndexHOC';
import head from './image/head.png';
import img1 from './image/img1.png';
import img2 from './image/img2.png';
import img3 from './image/img3.png';
import img4 from './image/img4.png';
import img5 from './image/img5.png';
import img6 from './image/img6.png';
import img7 from './image/img7.png';
import img8 from './image/img8.png';
import img9 from './image/img9.png';
import img10 from './image/img10.png';
import img15 from './image/img15.png';
import img16 from './image/img16.png';
import img17 from './image/img17.png';
import img18 from './image/img18.png';
import img19 from './image/49.png';

import './Teaching.scss';

function Teaching(){
  return(
    <div className="teaching">
      <div className="tea_head">
        <div>
          <a href="#teaching_part1"><div className='head_til1'>大规模实训课程体系</div></a>
          <a href="#teaching_part2"><div className='head_til2'>集成化班级协同空间</div></a>
          <a href="#teaching_part3"><div className='head_til3'>多联盟共建开源竞赛</div></a>
        </div>
        <img src={head} onClick={() => window.open('https://www.educoder.net', '_blank')}/>
      </div>

      {/* 大规模实训课程体系 */}
      <div className="tea_part1">
        <span id='teaching_part1'></span>
        <p className="tea_title">大规模实训课程体系</p>
        <p className="tips">谢绝纸上谈兵，精心打造教学、标注、练平一体化的实战环境</p>
        <div className="tea_small_title">
          <span>实践课程</span>
          <a href='https://www.educoder.net/paths' target='_blank'>查看更多<i className="iconfont icon-jiantou1 font-12 ml8"></i></a>
        </div>
        <div className="content">
          <div className="vertical" onClick={() => window.location.href ='https://www.educoder.net/paths/54'}>
            <img src={img1} />
            <p>Java项目开发实战入门</p>
            <div>
              <i className="iconfont icon-zhangjieicon"></i>10
              <i className="iconfont icon-chengyuan1 ml25"></i>121992
            </div>
            <p className="hover_bar"></p>
          </div>
          <div className="vertical" onClick={() => window.location.href = 'https://www.educoder.net/paths/3702'}>
            <img src={img2} />
            <p>基于TRUSTIE的软件工程实践教…</p>
            <div>
              <i className="iconfont icon-zhangjieicon"></i>11
              <i className="iconfont icon-chengyuan1 ml25"></i>2250
            </div>
            <p className="hover_bar"></p>
          </div>
          <div className="vertical" onClick={() => window.location.href = 'https://www.educoder.net/paths/85'}>
            <img src={img3} />
            <p>Python零基础到精通</p>
            <div>
              <i className="iconfont icon-zhangjieicon"></i>11
              <i className="iconfont icon-chengyuan1 ml25"></i>114131
            </div>
            <p className="hover_bar"></p>
          </div>
          <div className="vertical" onClick={() => window.location.href = 'https://www.educoder.net/paths/936'}>
            <img src={img4} />
            <p>计算机实验教学中心开放实验</p>
            <div>
              <i className="iconfont icon-zhangjieicon"></i>5
              <i className="iconfont icon-chengyuan1 ml25"></i>135381
            </div>
            <p className="hover_bar"></p>
          </div>
        </div>
        <div className="tea_small_title">
          <span>实践项目</span>
          <a href='https://www.educoder.net/shixuns' target='_blank'>查看更多<i className="iconfont icon-jiantou1 font-12 ml8"></i></a>
        </div>
        <div className="content practice">
          <div onClick={() => window.location.href = 'https://www.educoder.net/shixuns/zesqa3wi/challenges'}><img src={img5} /></div>
          <div onClick={() => window.location.href = 'https://www.educoder.net/shixuns/ie6zxg7r/challenges'}><img src={img6} /></div>
          <div onClick={() => window.location.href = 'https://www.educoder.net/shixuns/64xb9k2q/challenges'}><img src={img7} /></div>
        </div>
        <div className="content practice">
          <div onClick={() => window.location.href = 'https://www.educoder.net/shixuns/tb7hw62n/challenges'}><img src={img8} /></div>
          <div onClick={() => window.location.href = 'https://www.educoder.net/shixuns/9vhkc6jf/challenges'}><img src={img9} /></div>
          <div onClick={() => window.location.href = 'https://www.educoder.net/shixuns/5xcigsov/challenges'}><img src={img10} /></div>
        </div>
      </div>

      {/* 集成化班级协同空间 */}
      <div className="tea_part2_bg">
        <span id='teaching_part2'></span>
        <div className="tea_part2">
          <p className="tea_title">集成化班级协同空间</p>
          <p className="tips">支持实验、作业、视频、考试、毕设等十余种线上线下管理工具</p>
          <div className="tea_small_title">
            <span>教学课堂</span>
            <a href='https://www.educoder.net/classrooms' target='_blank'>查看更多<i className="iconfont icon-jiantou1 font-12 ml8"></i></a>
          </div>
          <div className="content">
            <div className="vertical classroom1" onClick={() => window.location.href = 'https://www.educoder.net/classrooms/7ckfx39w/announcement'}>
              <p>第四届中国软件开源创新大赛培训</p>
              <img src={img15} />
              <p>喻银凤</p>
              <p className='thread'></p>
              <div>
                <div className='mr45'>
                  <span className='num'>7241</span><span className='font-12 ml10'>人</span>
                  <p>成员数</p>
                </div>
                <div>
                  <span className='num'>18</span><span className='font-12 ml10'>次</span>
                  <p>作业数</p>
                </div>
              </div>
              <p className="hover_bar"></p>
            </div>
            <div className="vertical classroom2" onClick={() => window.location.href = 'https://www.educoder.net/classrooms/fwcka9or/announcement'}>
              <p>第三届全国高校绿色计算创新大赛培训</p>
              <img src={img16} />
              <p>实践教学</p>
              <p className='thread'></p>
              <div>
                <div className='mr45'>
                  <span className='num'>68824</span><span className='font-12 ml10'>人</span>
                  <p>成员数</p>
                </div>
                <div>
                  <span className='num'>9</span><span className='font-12 ml10'>次</span>
                  <p>作业数</p>
                </div>
              </div>
              <p className="hover_bar"></p>
            </div>
            <div className="vertical classroom3" onClick={() => window.location.href = 'https://www.educoder.net/classrooms/owftcsph/shixun_homework'}>
              <p>基于TRUSTIE的软件工程教学</p>
              <img src={img17} />
              <p>朱郑州</p>
              <p className='thread'></p>
              <div>
                <div className='mr45'>
                  <span className='num'>61</span><span className='font-12 ml10'>人</span>
                  <p>成员数</p>
                </div>
                <div>
                  <span className='num'>34</span><span className='font-12 ml10'>次</span>
                  <p>作业数</p>
                </div>
              </div>
              <p className="hover_bar"></p>
            </div>
            <div className="vertical classroom4" onClick={() => window.location.href = 'https://www.educoder.net/classrooms/2029/announcement'}>
              <p>计算机程序设计（C语言）</p>
              <img src={img18} />
              <p>拓明福</p>
              <p className='thread'></p>
              <div>
                <div className='mr45'>
                  <span className='num'>79753</span><span className='font-12 ml10'>人</span>
                  <p>成员数</p>
                </div>
                <div>
                  <span className='num'>105</span><span className='font-12 ml10'>次</span>
                  <p>作业数</p>
                </div>
              </div>
              <p className="hover_bar"></p>
            </div>
          </div>
        </div>
      </div>

      {/* 多联盟共建开源竞赛 */}
      <div className="tea_part3_bg">
        <span id='teaching_part3'></span>
        <div className="tea_part3">
          <p className="tea_title">多联盟共建开源竞赛</p>
          <p className="tips">聚焦开源定期开展有奖大型竞赛，让您的作品伴随您成长</p>
          <div className="tea_small_title">
            <span>在线竞赛</span>
            <a href='https://www.educoder.net/competitions' target='_blank'>查看更多<i className="iconfont icon-jiantou1 font-12 ml8"></i></a>
          </div>
          <div className="content" onClick={() => window.location.href = 'https://www.educoder.net/competitions/index/gcc_2021_projects_type1'}>
            <img src={img19}/>
            <div className='center'>
              <p className='title'>第四届中国软件开源创新大赛——开源项目创新赛命题组</p>
              <p className='tip'>开源项目创新赛聚焦发起或参与开源项目创新开发，设计了命题组和自由组两个组别，其中命题组为参赛团队参与指定开源项目进行贡献。</p>
              <p>竞赛时间：<span className='col18'>2021/03/31 — 2021/11/30</span></p>
              <p>报名截至时间：<span className='col18'>2021/11/30 00:00:00</span></p>
            </div>
            <div>
              <p className='col85'>奖金</p>
              <p className='col'>¥ 335,000</p>
            </div>
          </div>
          <div className="content" onClick={() => window.location.href = 'https://www.educoder.net/competitions/index/gcc_2021_projects_type2'}>
            <img src={img19} />
            <div className='center'>
              <p className='title'>第四届中国软件开源创新大赛——开源项目创新赛自由组</p>
              <p className='tip'>开源项目创新赛聚焦发起或参与开源项目创新开发，设计了命题和自由组两个组别，其中自由组为参赛团队将科研成果/论文算法开源到竞赛平台并进行持续创新。</p>
              <p>竞赛时间：<span className='col18'>2021/03/31 — 2021/11/30</span></p>
              <p>报名时间：<span className='col18'>2021/11/30 00:00:00</span></p>
            </div>
            <div>
              <p className='col85'>奖金</p>
              <p className='col'>¥ 235,000</p>
            </div>
          </div>
          <div className="content" onClick={() => window.location.href = 'https://www.educoder.net/competitions/index/gcc-courses-2021_type1'}>
            <img src={img19} />
            <div className='center'>
              <p className='title'>第四届中国软件开源创新大赛——开源实践教学赛命题组</p>
              <p className='tip'>开源实践教学赛聚焦基于开源技术构建在线实践教学资源开展实践教学，设计了命题组和自由组两个组别，其中命题组要求围绕指定开源技术/平台构建符合MOOP规范的实践教学资源并开展实践教学。</p>
              <p>竞赛时间：<span className='col18'>2021/03/31 — 2021/11/30</span></p>
              <p>报名时间：<span className='col18'>2021/11/30 00:00:00</span></p>
            </div>
            <div>
              <p className='col85'>奖金</p>
              <p className='col'>¥ 335,000</p>
            </div>
          </div>
          <div className="content" onClick={() => window.location.href = 'https://www.educoder.net/competitions/index/gcc-courses-2021_type2'}>
            <img src={img19} />
            <div className='center'>
              <p className='title'>第四届中国软件开源创新大赛——开源实践教学赛自由组</p>
              <p className='tip'>开源实践教学赛聚焦基于开源技术构建在线实践教学资源开展实践教学，设计了命题组和自由组两个组别，其中自由组不限技术/平台、基于实际教学需求构建符合MOOP规范的实践教学资源并开展实践教学。</p>
              <p>竞赛时间：<span className='col18'>2021/03/31 — 2021/11/30</span></p>
              <p>报名时间：<span className='col18'>2021/11/30 00:00:00</span></p>
            </div>
            <div>
              <p className='col85'>奖金</p>
              <p className='col'>¥ 335,000</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  )
}
export default TPMIndexHOC(Teaching);