|
|
import React, { Component } from 'react';
|
|
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
|
|
import NewHeader from './NewHeader'
|
|
|
import NewFooter from './NewFooter'
|
|
|
import SiderBar from './SiderBar'
|
|
|
import { getUrl } from 'educoder'
|
|
|
import axios from 'axios';
|
|
|
|
|
|
import './TPMIndex.css'
|
|
|
import LoginDialog from '../login/LoginDialog';
|
|
|
import AccountProfile from '../user/AccountProfile';
|
|
|
|
|
|
import Trialapplication from "../login/Trialapplication";
|
|
|
// import "antd/dist/antd.css";
|
|
|
// import '../../css/educoder/edu-common.css'
|
|
|
// import '../../css/educoder/edu-all.css'
|
|
|
// import '../../css/educoder/edu-main.css'
|
|
|
|
|
|
const $ = window.$;
|
|
|
const versionNum = '0001';
|
|
|
// let _url_origin = getUrl()
|
|
|
let _url_origin='';
|
|
|
if(window.location.port === "3007"){
|
|
|
_url_origin="http://pre-newweb.educoder.net";
|
|
|
}
|
|
|
|
|
|
// let _url_origin=`https://www.educoder.net`;
|
|
|
|
|
|
if (!window['indexHOCLoaded']) {
|
|
|
window.indexHOCLoaded = true;
|
|
|
//解决首屏加载问题
|
|
|
|
|
|
// $('head').append($('<link rel="stylesheet" type="text/css" />')
|
|
|
// .attr('href', `${_url_origin}/stylesheets/educoder/antd.min.css?1525440977`));
|
|
|
$('head').append($('<link rel="stylesheet" type="text/css" />')
|
|
|
.attr('href', `${_url_origin}/stylesheets/css/edu-common.css?8`));
|
|
|
|
|
|
$('head').append($('<link rel="stylesheet" type="text/css" />')
|
|
|
.attr('href', `${_url_origin}/stylesheets/educoder/edu-main.css?8`));
|
|
|
|
|
|
// index.html有加载
|
|
|
$('head').append($('<link rel="stylesheet" type="text/css" />')
|
|
|
.attr('href', `${_url_origin}/stylesheets/educoder/edu-all.css?8`));
|
|
|
|
|
|
|
|
|
// $('head').append($('<link rel="stylesheet" type="text/css" />')
|
|
|
// .attr('href', `${_url_origin}/stylesheets/educoder/css_min_all.css?1525440977`));
|
|
|
// 加timeout 为了覆盖掉antd的样式
|
|
|
// setTimeout(() => {
|
|
|
// $('head').append( $('<link rel="stylesheet" type="text/css" />')
|
|
|
// .attr('href', `${_url_origin}/stylesheets/css/edu-common.css?1525440977`) );
|
|
|
|
|
|
// $('head').append( $('<link rel="stylesheet" type="text/css" />')
|
|
|
// .attr('href', `${_url_origin}/stylesheets/educoder/edu-all.css?1525440977`) );
|
|
|
// $('head').append( $('<link rel="stylesheet" type="text/css" />')
|
|
|
// .attr('href', `${_url_origin}/stylesheets/educoder/edu-main.css?1525440977`) );
|
|
|
// }, 1000);
|
|
|
|
|
|
$("script").append('<script></script>')
|
|
|
.attr('src', `${_url_origin}/javascripts/jquery-1.8.3-ui-1.9.2-ujs-2.0.3.js?_t=${versionNum}`);
|
|
|
|
|
|
}
|
|
|
// `${_url_origin}/javascripts/jquery-1.8.3-ui-1.9.2-ujs-2.0.3.js?_t=${versionNum}`
|
|
|
// TODO css加载完成后再打开页面，行为和tpm其他页面一致
|
|
|
export function TPMIndexHOC(WrappedComponent) {
|
|
|
// 这里如果extends WrappedComponent 会出现 WrappedComponent mount twice的问题
|
|
|
return class II extends React.Component {
|
|
|
constructor(props) {
|
|
|
super(props)
|
|
|
window.$('#root').css('position', 'relative')
|
|
|
|
|
|
this.state = {
|
|
|
tpmLoading: true,
|
|
|
resLoading: true,
|
|
|
Headertop:undefined,
|
|
|
Footerdown:undefined,
|
|
|
coursedata: {},
|
|
|
|
|
|
isRender: false,
|
|
|
AccountProfiletype: false
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// header里面需要有user
|
|
|
initCommonState(user) {
|
|
|
// 更新头像后，需要改变参数，不然会被图片缓存影响到
|
|
|
const newUser = Object.assign({}, {...user}, { image_url: `${user.image_url}?t=${new Date().getTime()}`});
|
|
|
this.setState({
|
|
|
user: newUser,
|
|
|
current_user: newUser
|
|
|
})
|
|
|
}
|
|
|
showShixun = () => {
|
|
|
const { shixunId } = this.props.match.params
|
|
|
const url = `/api/v1/shixuns/${shixunId}/show_shixun`
|
|
|
|
|
|
this.setState({ tpmLoading: true })
|
|
|
axios.get(url,
|
|
|
{
|
|
|
withCredentials: true
|
|
|
}
|
|
|
).then((response) => {
|
|
|
if (response.data && response.data.shixun) {
|
|
|
this.initCommonState(response.data.current_user)
|
|
|
response.data.tpmLoading = false;
|
|
|
this.setState(response.data);
|
|
|
}
|
|
|
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
})
|
|
|
}
|
|
|
aboutFocus = () => {
|
|
|
const { creator, watched } = this.state
|
|
|
/*http://localhost:3000/api/v1/users/155/watch?object_id=156&object_type=user*/
|
|
|
|
|
|
const focusUrl = `/api/v1/users/${creator.owner_id}/${watched ? 'unwatch' : 'watch'}?object_id=${creator.owner_id}&object_type=user`
|
|
|
|
|
|
axios.get(focusUrl,{
|
|
|
})
|
|
|
.then((response) => {
|
|
|
const status = response.data.status;
|
|
|
if(status == 1){
|
|
|
const new_author_info = Object.assign({}, creator)
|
|
|
this.setState({
|
|
|
watched: !watched
|
|
|
})
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
})
|
|
|
}
|
|
|
|
|
|
componentDidMount() {
|
|
|
if(this.props.match.path==="/"){
|
|
|
document.title="创新源于实践";
|
|
|
}else if(this.props.match.path==="/403"){
|
|
|
document.title="你没有权限访问";
|
|
|
}else if(this.props.match.path==="/nopage"){
|
|
|
document.title="没有找到该页面";
|
|
|
}else if(this.props.match.path==="/shixuns"){
|
|
|
document.title="实训项目";
|
|
|
}else if(this.props.match.path==="/paths"){
|
|
|
document.title="实践课程";
|
|
|
}else if(this.props.match.path==="/courses"){
|
|
|
document.title="翻转课堂";
|
|
|
}
|
|
|
|
|
|
|
|
|
$.ajaxSetup({
|
|
|
cache: true
|
|
|
});
|
|
|
this.fetchUser();
|
|
|
|
|
|
let url=`/users/get_navigation_info.json`;
|
|
|
axios.get(url, {
|
|
|
|
|
|
}).then((response) => {
|
|
|
if(response!=undefined){
|
|
|
if(response.status===200){
|
|
|
this.setState({
|
|
|
Headertop:response.data.top,
|
|
|
Footerdown:response.data.down
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
|
|
|
}
|
|
|
/**
|
|
|
课堂权限相关方法，暂时写这里了 ----------------------------------------START
|
|
|
ADMIN = 0 # 超级管理员
|
|
|
CREATOR = 1 # 课程创建者
|
|
|
PROFESSOR = 2 # 课程老师
|
|
|
ASSISTANT_PROFESSOR = 3 # 课程助教
|
|
|
STUDENT = 4 # 学生
|
|
|
NORMAL = 5 # 普通用户
|
|
|
|
|
|
v2
|
|
|
# 课程权限判断
|
|
|
ADMIN = 0 # 超级管理员
|
|
|
BUSINESS = 1 # 运营人员
|
|
|
CREATOR = 2 # 课程创建者
|
|
|
PROFESSOR = 3 # 课程老师
|
|
|
ASSISTANT_PROFESSOR = 4 # 课程助教
|
|
|
STUDENT = 5 # 学生
|
|
|
NORMAL = 6 # 普通用户
|
|
|
Anonymous = 7 # 普未登录
|
|
|
*/
|
|
|
//超管
|
|
|
isSuperAdmin = () => {
|
|
|
// return false
|
|
|
return this.state.coursedata&&this.state.coursedata.course_identity === 0
|
|
|
}
|
|
|
// 课堂管理等
|
|
|
isClassManagement = () => {
|
|
|
// return this.state.coursedata&&this.state.coursedata.course_identity >= 0 &&
|
|
|
return this.state.coursedata&&this.state.coursedata.course_identity < 2
|
|
|
}
|
|
|
//老师等
|
|
|
isAdminOrCreator = () => {
|
|
|
// return this.state.coursedata&&this.state.coursedata.course_identity >= 0 &&
|
|
|
return this.state.coursedata&&this.state.coursedata.course_identity < 3
|
|
|
}
|
|
|
// 助教等
|
|
|
isAdminOrTeacher = () => {
|
|
|
// return this.state.coursedata&&this.state.coursedata.course_identity >= 0 &&
|
|
|
return this.state.coursedata&&this.state.coursedata.course_identity < 4
|
|
|
}
|
|
|
// 老师、管理员等
|
|
|
isAdmin = () => {
|
|
|
// return false
|
|
|
// return this.state.coursedata&&this.state.coursedata.course_identity >= 0 &&
|
|
|
return this.state.coursedata&&this.state.coursedata.course_identity < 5
|
|
|
}
|
|
|
// 学生
|
|
|
isStudent = () => {
|
|
|
// return true
|
|
|
// return this.state.coursedata&&this.state.coursedata.course_identity >= 0 &&
|
|
|
return this.state.coursedata&&this.state.coursedata.course_identity === 5
|
|
|
}
|
|
|
isAdminOrStudent = () => {
|
|
|
// return this.state.coursedata&&this.state.coursedata.course_identity >= 0 &&
|
|
|
return this.state.coursedata&&this.state.coursedata.course_identity <= 5
|
|
|
}
|
|
|
// 非课堂成员
|
|
|
isNotMember = () => {
|
|
|
// return this.state.coursedata&&this.state.coursedata.course_identity >= 0 &&
|
|
|
return this.state.coursedata&&this.state.coursedata.course_identity >= 6
|
|
|
}
|
|
|
|
|
|
// setTrialapplication = ()=>{
|
|
|
// this.setState({
|
|
|
// isRenders:true
|
|
|
// })
|
|
|
//
|
|
|
// }
|
|
|
|
|
|
|
|
|
/**
|
|
|
课堂权限相关方法，暂时写这里了 ----------------------------------------END
|
|
|
*/
|
|
|
fetchUser = () => {
|
|
|
let url = `/users/get_user_info.json`
|
|
|
let courseId;
|
|
|
let query = this.props.location.pathname;
|
|
|
const type = query.split('/');
|
|
|
if (type[1] == 'courses' && type[2]) {
|
|
|
courseId = parseInt(type[2])
|
|
|
// url += `?course_id=${courseId}`
|
|
|
}
|
|
|
axios.get(url,{params:{
|
|
|
course_id:isNaN(courseId)?undefined:courseId,
|
|
|
school:1
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
// withCredentials: true
|
|
|
}
|
|
|
).then((response) => {
|
|
|
/*
|
|
|
{
|
|
|
"username": "黄井泉",
|
|
|
"login": "Hjqreturn",
|
|
|
"user_id": 12,
|
|
|
"image_url": "avatar/User/12",
|
|
|
"admin": true,
|
|
|
"is_teacher": false,
|
|
|
"tidding_count": 0
|
|
|
}
|
|
|
*/
|
|
|
if(response=== undefined){
|
|
|
return
|
|
|
}
|
|
|
if (response.data) {
|
|
|
this.initCommonState(response.data)
|
|
|
this.setState({
|
|
|
tpmLoading: false,
|
|
|
coursedata: {
|
|
|
course_identity: response.data.course_identity >= 0 ? response.data.course_identity : undefined,
|
|
|
course_public: response.data.course_public,
|
|
|
name: response.data.course_name,
|
|
|
userid:response.data.user_id
|
|
|
},
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
})
|
|
|
}
|
|
|
hideLoginDialog = () => {
|
|
|
this.setState({
|
|
|
isRender: false
|
|
|
})
|
|
|
}
|
|
|
showLoginDialog = () => {
|
|
|
this.setState({
|
|
|
isRender: true
|
|
|
})
|
|
|
}
|
|
|
|
|
|
checkIfLogin = () => {
|
|
|
return this.state.current_user && this.state.current_user.login != ''
|
|
|
}
|
|
|
|
|
|
hideAccountProfile = () => {
|
|
|
this.setState({
|
|
|
AccountProfiletype: false
|
|
|
})
|
|
|
}
|
|
|
showProfileCompleteDialog = () => {
|
|
|
this.dialogObj = {}
|
|
|
this.setState({
|
|
|
AccountProfiletype: true
|
|
|
})
|
|
|
}
|
|
|
checkIfProfileCompleted = () => {
|
|
|
return this.state.current_user && this.state.current_user.profile_completed
|
|
|
}
|
|
|
showProfessionalCertificationDialog = () => {
|
|
|
this.dialogObj = {
|
|
|
content: '您需要去完成您的职业认证，才能使用此功能',
|
|
|
okText: '立即完成',
|
|
|
okHref: '/account/certification'
|
|
|
}
|
|
|
this.setState({
|
|
|
AccountProfiletype: true,
|
|
|
})
|
|
|
}
|
|
|
checkIfProfessionalCertification = () => {
|
|
|
return this.state.current_user && this.state.current_user.professional_certification
|
|
|
}
|
|
|
|
|
|
|
|
|
ShowOnlinePdf = (url) => {
|
|
|
return axios({
|
|
|
method:'get',
|
|
|
url:url,
|
|
|
responseType: 'arraybuffer',
|
|
|
}).then((result)=>{
|
|
|
var binaryData = [];
|
|
|
binaryData.push(result.data);
|
|
|
this.url =window.URL.createObjectURL(new Blob(binaryData, {type:"application/pdf"}));
|
|
|
window.open(this.url);
|
|
|
})
|
|
|
}
|
|
|
DownloadFileA=(title,url)=>{
|
|
|
let link = document.createElement('a');
|
|
|
document.body.appendChild(link);
|
|
|
link.href =url;
|
|
|
link.download = title;
|
|
|
//兼容火狐浏览器
|
|
|
let evt = document.createEvent("MouseEvents");
|
|
|
evt.initEvent("click", false, false);
|
|
|
link.dispatchEvent(evt);
|
|
|
document.body.removeChild(link);
|
|
|
}
|
|
|
|
|
|
DownloadOpenPdf=(type,url)=>{
|
|
|
type===true?window.open(url):window.location.href=url;
|
|
|
}
|
|
|
render() {
|
|
|
let{Headertop,Footerdown, isRender, AccountProfiletype}=this.state;
|
|
|
const common = {
|
|
|
isSuperAdmin:this.isSuperAdmin,
|
|
|
isAdminOrCreator:this.isAdminOrCreator,
|
|
|
isClassManagement:this.isClassManagement,
|
|
|
isAdmin: this.isAdmin,
|
|
|
isAdminOrTeacher: this.isAdminOrTeacher,
|
|
|
isStudent: this.isStudent,
|
|
|
isAdminOrStudent: this.isAdminOrStudent,
|
|
|
isNotMember: this.isNotMember,
|
|
|
isUserid:this.state.coursedata&&this.state.coursedata.userid,
|
|
|
fetchUser: this.fetchUser,
|
|
|
|
|
|
showLoginDialog: this.showLoginDialog,
|
|
|
checkIfLogin: this.checkIfLogin,
|
|
|
showProfileCompleteDialog: this.showProfileCompleteDialog,
|
|
|
checkIfProfileCompleted: this.checkIfProfileCompleted,
|
|
|
checkIfProfessionalCertification: this.checkIfProfessionalCertification,
|
|
|
showProfessionalCertificationDialog: this.showProfessionalCertificationDialog,
|
|
|
|
|
|
ShowOnlinePdf:(url)=>this.ShowOnlinePdf(url),
|
|
|
DownloadFileA:(title,url)=>this.DownloadFileA(title,url),
|
|
|
DownloadOpenPdf:(type,url)=>this.DownloadOpenPdf(type,url)
|
|
|
}
|
|
|
return (
|
|
|
<div>
|
|
|
{isRender===true ? <LoginDialog
|
|
|
Modifyloginvalue={()=>this.hideLoginDialog()}
|
|
|
{...this.props}
|
|
|
{...this.state}
|
|
|
/> : ""}
|
|
|
{/* AccountProfile 也用作职业认证 */}
|
|
|
{AccountProfiletype===true ? <AccountProfile
|
|
|
hideAccountProfile={()=>this.hideAccountProfile()}
|
|
|
{...this.props}
|
|
|
{...this.state}
|
|
|
{...this.dialogObj}
|
|
|
/>:""}
|
|
|
<SiderBar Headertop={Headertop}/>
|
|
|
{/* 注释掉了1440 影响到了手机屏幕的展示 */}
|
|
|
<style>{
|
|
|
`
|
|
|
.newContainers{
|
|
|
min-width: 1200px;
|
|
|
max-width: unset;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
.newHeaders{
|
|
|
// position: fixed;
|
|
|
max-width: unset;
|
|
|
background: #24292D !important;
|
|
|
width: 100%;
|
|
|
height: 60px !important;
|
|
|
min-width: 1200px;
|
|
|
z-index: 1000;
|
|
|
-moz-box-shadow: 0px 0px 12px rgba(0,0,0,0.1);
|
|
|
box-shadow: 0px 0px 12px rgba(0,0,0,0.1);
|
|
|
}
|
|
|
`
|
|
|
}</style>
|
|
|
<NewHeader {...this.state} {...this.props}></NewHeader>
|
|
|
<div className="newContainer newContainers">
|
|
|
<WrappedComponent initCommonState={(user)=>this.initCommonState(user)}
|
|
|
{...this.props} {...this.state}
|
|
|
showShixun={this.showShixun} aboutFocus={this.aboutFocus}
|
|
|
{...common}
|
|
|
>
|
|
|
</WrappedComponent>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<NewFooter
|
|
|
Footerdown={Footerdown}
|
|
|
/>
|
|
|
</div>
|
|
|
);
|
|
|
}
|
|
|
}
|
|
|
} |
