dev_aliyun2
harry 5 years ago
parent b48a7f4913
commit 39b575f91d

@ -1,40 +1,35 @@
import React from 'react'; import React, { Component } from 'react';
import NewHeader from './NewHeader' import NewHeader from './NewHeader'
import NewFooter from './NewFooter' import NewFooter from './NewFooter'
import SiderBar from './SiderBar' import SiderBar from './SiderBar'
import { downloadFile } from 'educoder' import { getUrl, downloadFile } from 'educoder'
import axios from 'axios'; import axios from 'axios';
import { Spin } from 'antd';
import './TPMIndex.css'; import './TPMIndex.css';
import LoginDialog from '../login/LoginDialog'; import LoginDialog from '../login/LoginDialog';
import AccountProfile from '../user/AccountProfile'; import AccountProfile from '../user/AccountProfile';
import AccountPhoneemail from '../user/AccountPhoneemail'; import AccountPhoneemail from '../user/AccountPhoneemail';
import Loading from '../../Loading';
const $ = window.$; const $ = window.$;
let _url_origin='';
let _url_origin = ''; if(window.location.port === "3007"){
if (window.location.port === "3007") { _url_origin="https://test-newweb.educoder.net";
_url_origin = "https://test-newweb.educoder.net";
} }
if (!window['indexHOCLoaded']) { if (!window['indexHOCLoaded']) {
window.indexHOCLoaded = true; window.indexHOCLoaded = true;
//解决首屏加载问题
$('head').append($('<link rel="stylesheet" type="text/css" />') $('head').append($('<link rel="stylesheet" type="text/css" />')
.attr('href', `${_url_origin}/stylesheets/css/edu-common.css?3`)); .attr('href', `${_url_origin}/stylesheets/css/edu-common.css?3`));
$('head').append($('<link rel="stylesheet" type="text/css" />') $('head').append($('<link rel="stylesheet" type="text/css" />')
.attr('href', `${_url_origin}/stylesheets/educoder/edu-main.css?3`)); .attr('href', `${_url_origin}/stylesheets/educoder/edu-main.css?3`));
// index.html有加载 // index.html有加载
$('head').append($('<link rel="stylesheet" type="text/css" />') $('head').append($('<link rel="stylesheet" type="text/css" />')
.attr('href', `${_url_origin}/stylesheets/educoder/edu-all.css?3`)); .attr('href', `${_url_origin}/stylesheets/educoder/edu-all.css?3`));
} }
// TODO css加载完成后再打开页面行为和tpm其他页面一致
export default function TPMIndexHOC(WrappedComponent) { export default function TPMIndexHOC(WrappedComponent) {
// 这里如果extends WrappedComponent 会出现 WrappedComponent mount twice的问题 // 这里如果extends WrappedComponent 会出现 WrappedComponent mount twice的问题
return class II extends React.Component { return class II extends React.Component {
@ -178,62 +173,66 @@ export default function TPMIndexHOC(WrappedComponent) {
}); });
}else{ }else{
this.setState({ this.setState({
watched: !watched dataquerys:foqus,
}) });
dataqueryss=foqus;
} }
}).catch((error) => { }catch (e) {
console.log(error)
})
}
keyupListener = (e) => {
if (e.key === "Escape") {
this.setState({ globalLoading: false })
}
}
componentWillUnmount() {
window.removeEventListener('keyup', this.keyupListener)
}
componentDidMount() {
window.addEventListener('keyup', this.keyupListener)
if (this.props.match.path === "/") {
} 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
});
//帮助后台传参数
const query = this.props.location.search;
var dataqueryss = {}
try {
var foqus = this.foo(query);
if (JSON.stringify(foqus) === "{}") {
this.setState({
dataquerys: {},
});
} else {
this.setState({ this.setState({
dataquerys: foqus, dataquerys:{},
}); })
dataqueryss = foqus;
} }
} catch (e) { this.fetchUsers(dataqueryss);
this.setState({
dataquerys: {}, let url=`/users/get_navigation_info.json`;
}) axios.get(url, {
}).then((response) => {
// console.log("开始请求/get_navigation_info.json");
// console.log(response);
if(response!=undefined){
if(response.status===200){
this.setState({
Headertop:response.data.top,
Footerdown:response.data.down
})
}
}
});
///请求定制化的信息
this.getAppdata();
}
/**
课堂权限相关方法暂时写这里了 ----------------------------------------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 # 普未登录
*/
//超管0
isSuperAdmin = () => {
// return false
return this.state.coursedata&&this.state.coursedata.course_identity === 0
}
isCourseAdmin = () => {
return this.state.coursedata&&this.state.coursedata.course_identity === 2
}
//超管、运维0-1
isClassManagement = () => {
return this.state.coursedata&&this.state.coursedata.course_identity < 2
} }
//超管、运维、课堂管理0-2 //超管、运维、课堂管理0-2
isAdminOrCreator = () => { isAdminOrCreator = () => {
@ -278,55 +277,95 @@ export default function TPMIndexHOC(WrappedComponent) {
//获取数据为空的时候 //获取数据为空的时候
gettablogourlnull = () => { gettablogourlnull = () => {
this.setState({ this.setState({
mygetHelmetapi: chromesettingArray mygetHelmetapi: undefined
}); });
if (chromesettingArray.tab_logo_url) { document.title = "EduCoder";
this.gettablogourldata(chromesettingresponseArray); var link = document.createElement('link'),
} else { oldLink = document.getElementById('dynamic-favicon');
this.gettablogourlnull(); link.id = 'dynamic-favicon';
link.rel = 'shortcut icon';
link.href = "/react/build/./favicon.ico";
if (oldLink) {
document.head.removeChild(oldLink);
}
document.head.appendChild(link);
};
//获取数据的时候
gettablogourldata = (response) => {
document.title = response.data.setting.name;
var link = document.createElement('link'),
oldLink = document.getElementById('dynamic-favicon');
link.id = 'dynamic-favicon';
link.rel = 'shortcut icon';
link.href = '/' + response.data.setting.tab_logo_url;
if (oldLink) {
document.head.removeChild(oldLink);
} }
} catch (e) { document.head.appendChild(link);
console.log("hoc获取游览器配置失败 重新请求开始读取配置");
this.getAppdatausr();
} }
//获取当前定制信息
}; getAppdata = () => {
getAppdatausr = () => { try {
let url = "/setting.json"; var chromesettingArray = JSON.parse(localStorage.getItem('chromesetting'));
axios.get(url).then((response) => { var chromesettingresponseArray = JSON.parse(localStorage.getItem('chromesettingresponse'));
// console.log("app.js开始请求/setting.json"); // console.log("TPMLNdexHOC");
// console.log("获取当前定制信息"); // console.log(chromesettingArray);
if (response) { // console.log(chromesettingresponseArray);
if (response.data) {
this.setState({ this.setState({
mygetHelmetapi: response.data.setting mygetHelmetapi:chromesettingArray
}); });
localStorage.setItem('chromesetting', JSON.stringify(response.data.setting)); if (chromesettingArray.tab_logo_url) {
localStorage.setItem('chromesettingresponse', JSON.stringify(response)); this.gettablogourldata(chromesettingresponseArray);
try {
if (response.data.setting.tab_logo_url) {
this.gettablogourldata(response);
} else { } else {
this.gettablogourlnull(); this.gettablogourlnull();
} }
} catch (e) { }catch (e) {
console.log("hoc获取游览器配置失败 重新请求开始读取配置");
this.getAppdatausr();
}
};
getAppdatausr=()=>{
let url = "/setting.json";
axios.get(url).then((response) => {
// console.log("app.js开始请求/setting.json");
// console.log("获取当前定制信息");
if (response) {
if (response.data) {
this.setState({
mygetHelmetapi: response.data.setting
});
localStorage.setItem('chromesetting',JSON.stringify(response.data.setting));
localStorage.setItem('chromesettingresponse',JSON.stringify(response));
try {
if (response.data.setting.tab_logo_url) {
this.gettablogourldata(response);
} else {
this.gettablogourlnull();
}
} catch (e) {
this.gettablogourlnull();
}
} else {
this.gettablogourlnull(); this.gettablogourlnull();
}
}
} else { } else {
this.gettablogourlnull(); this.gettablogourlnull();
} }
} else { }).catch((error) => {
this.gettablogourlnull(); this.gettablogourlnull();
} });
}).catch((error) => { }
this.gettablogourlnull();
fetchUser = () => { fetchUser = () => {
let url = `/users/get_user_info.json` let url = `/users/get_user_info.json`
@ -401,263 +440,236 @@ export default function TPMIndexHOC(WrappedComponent) {
courseId = parseInt(type[2]) courseId = parseInt(type[2])
// url += `?course_id=${courseId}` // url += `?course_id=${courseId}`
} }
} else { var datay={};
datay = { if(JSON.stringify(yslurlobject) ==="{}"){
course_id: isNaN(courseId) ? undefined : courseId, datay={
school: 1, course_id:isNaN(courseId)?undefined:courseId,
chinaoocTimestamp: this.state.dataquerys.chinaoocTimestamp, school:1
websiteName: this.state.dataquerys.websiteName, }
chinaoocKey: this.state.dataquerys.chinaoocKey, }else{
datay={
course_id:isNaN(courseId)?undefined:courseId,
school:1,
chinaoocTimestamp:yslurlobject.chinaoocTimestamp,
websiteName:yslurlobject.websiteName,
chinaoocKey:yslurlobject.chinaoocKey,
}
} }
} axios.get(url,{params:
axios.get(url, { datay
params: },
datay
}).then((response) => {
/*
{ {
"username": "黄井泉", // withCredentials: true
"login": "Hjqreturn",
"user_id": 12,
"image_url": "avatar/User/12",
"admin": true,
"is_teacher": false,
"tidding_count": 0
} }
*/ ).then((response) => {
if (response === undefined) { /*
return {
} "username": "黄井泉",
if (response.data) { "login": "Hjqreturn",
this.initCommonState(response.data) "user_id": 12,
this.setState({ "image_url": "avatar/User/12",
tpmLoading: false, "admin": true,
coursedata: { "is_teacher": false,
course_identity: response.data.course_identity >= 0 ? response.data.course_identity : undefined, "tidding_count": 0
course_public: response.data.course_public, }
name: response.data.course_name, */
userid: response.data.user_id 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) => { }).catch((error) => {
console.log(error) console.log(error)
}) })
}; };
//截取url 数据的 //截取url 数据的
foo = (url) => { foo=(url)=> {
var json = {}; var json = {};
var regExp = /[\?\&](\w+)(=?)(\w*)/g; var regExp = /[\?\&](\w+)(=?)(\w*)/g;
var arr; var arr;
do { do {
arr = regExp.exec(url); arr = regExp.exec(url);
if (arr) { // console.log(arr); // arr = [完整的字符串, key, 等号或'', value或'']
var key = arr[1];
var value = arr[3]; if (arr) {
if (!arr[2]) var key = arr[1];
value = undefined; var value = arr[3];
// arr[2] === ''时, value = undefined
json[key] = value; if (!arr[2])
} value = undefined;
} while (arr);
json[key] = value;
return json; }
}; } while (arr);
hideLoginDialog = () => {
this.setState({ return json;
isRender: false, };
isloginCancel: undefined hideLoginDialog = () => {
}) this.setState({
} isRender: false,
showLoginDialog = () => { isloginCancel:undefined
this.setState({ })
isRender: true, }
isloginCancel: "iscancel" showLoginDialog = () => {
}) this.setState({
} isRender: true,
//验证登录是否成功方法 isloginCancel:"iscancel"
checkIfLogin = () => { })
return this.state.current_user && this.state.current_user.login != '' }
} //验证登录是否成功方法
checkIfLogin = () => {
hideAccountProfile = () => { return this.state.current_user && this.state.current_user.login != ''
this.setState({ }
AccountProfiletype: false
}) hideAccountProfile = () => {
} this.setState({
showProfileCompleteDialog = () => { AccountProfiletype: false
this.dialogObj = {} })
this.setState({ }
AccountProfiletype: true showProfileCompleteDialog = () => {
}) this.dialogObj = {}
} this.setState({
showhideAccountPhoneemailDialog = () => { AccountProfiletype: true
this.dialogObj = {} })
this.setState({ }
AccountPhoneemailtype: true showhideAccountPhoneemailDialog = () => {
}) this.dialogObj = {}
} this.setState({
hideAccountPhoneemailtype = () => { AccountPhoneemailtype: true
this.setState({ })
AccountPhoneemailtype: false
})
}
//验证是否完善资料
checkIfProfileCompleted = () => {
return this.state.current_user && this.state.current_user.profile_completed
}
showaccountprofileDialog = () => {
this.dialogObj = {
content: '您需要去完成您的个人资料,才能使用此功能',
okText: '立即完成',
okHref: '/account/profile'
} }
this.setState({ hideAccountPhoneemailtype=()=>{
AccountProfiletype: true, this.setState({
}) AccountPhoneemailtype:false
} })
showProfessionalCertificationDialog = () => {
this.dialogObj = {
content: '您需要去完成您的职业认证,才能使用此功能',
okText: '立即完成',
okHref: '/account/certification'
} }
this.setState({ //验证是否完善资料
AccountProfiletype: true, checkIfProfileCompleted = () => {
}) return this.state.current_user && this.state.current_user.profile_completed
} }
checkIfProfessionalCertification = () => {
return this.state.current_user && this.state.current_user.professional_certification showaccountprofileDialog = () => {
} this.dialogObj = {
content: '您需要去完成您的个人资料,才能使用此功能',
okText: '立即完成',
ShowOnlinePdf = (url) => { okHref: '/account/profile'
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;
}
slowDownload = (url, tip) => {
this._gLoadingTip = tip || '正在生成文件,请稍后...';
this.setState({ globalLoading: true })
const fileUrl = url;
downloadFile({
url: fileUrl,
successCallback: (url) => {
this.setState({ globalLoading: false })
console.log('successCallback')
},
failCallback: (responseHtml, url) => {
this.setState({ globalLoading: false })
console.log('failCallback')
} }
}) this.setState({
} AccountProfiletype: true,
yslslowCheckresults = (tip) => { })
this._gLoadingTip = tip || '成绩计算中,请稍候...'; }
this.setState({ globalLoading: true }) showProfessionalCertificationDialog = () => {
} this.dialogObj = {
yslslowCheckresultsNo = () => { content: '您需要去完成您的职业认证,才能使用此功能',
this.setState({ globalLoading: false }) okText: '立即完成',
} okHref: '/account/certification'
}
showGlobalLoading = (tip) => { this.setState({
this._gLoadingTip = tip || '加载中,请稍后...'; AccountProfiletype: true,
this.setState({ globalLoading: true }) })
} }
hideGlobalLoading = () => { checkIfProfessionalCertification = () => {
this.setState({ globalLoading: false }) return this.state.current_user && this.state.current_user.professional_certification
} }
MdifHasAnchorJustScorll = () => {
//mdhash滚动 ShowOnlinePdf = (url) => {
let anchor = decodeURI(this.props.location.hash).replace('#', ''); return axios({
// 对应id的话, 滚动到相应位置 method:'get',
if (!!anchor) { url:url,
let anchorElement = document.getElementsByName(anchor); responseType: 'arraybuffer',
if (anchorElement) { }).then((result)=>{
if (anchorElement.length > 0) { var binaryData = [];
anchorElement[anchorElement.length - 1].scrollIntoView(); 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;
}
slowDownload = (url, tip) => {
this._gLoadingTip = tip || '正在生成文件,请稍后...';
this.setState({ globalLoading: true })
const fileUrl = url;
downloadFile({
url: fileUrl,
successCallback: (url) => {
this.setState({ globalLoading: false })
console.log('successCallback')
},
failCallback: (responseHtml, url) => {
this.setState({ globalLoading: false })
console.log('failCallback')
}
})
}
yslslowCheckresults =(tip) =>{
this._gLoadingTip = tip || '成绩计算中,请稍候...';
this.setState({ globalLoading: true })
}
yslslowCheckresultsNo =() =>{
this.setState({ globalLoading: false })
}
showGlobalLoading = (tip) => {
this._gLoadingTip = tip || '加载中,请稍后...';
this.setState({ globalLoading: true })
}
hideGlobalLoading = () => {
this.setState({ globalLoading: false })
}
MdifHasAnchorJustScorll=()=>{
//mdhash滚动
let anchor = decodeURI(this.props.location.hash).replace('#', '');
// 对应id的话, 滚动到相应位置
if (!!anchor) {
let anchorElement = document.getElementsByName(anchor);
if (anchorElement) {
if (anchorElement.length>0){
anchorElement[anchorElement.length-1].scrollIntoView();
}
} }
} }
} }
}
//跳转道描点的地方
//跳转道描点的地方 scrollToAnchor = (anchorName) => {
scrollToAnchor = (anchorName) => { if (anchorName) {
if (anchorName) { // 找到锚点
// 找到锚点 let anchorElement = document.getElementById(anchorName);
let anchorElement = document.getElementById(anchorName); // 如果对应id的锚点存在就跳转到锚点
// 如果对应id的锚点存在就跳转到锚点 if (anchorElement) {
if (anchorElement) { anchorElement.scrollIntoView();
anchorElement.scrollIntoView(); }
} }
} }
}
render() {
let { Headertop, Footerdown, isRender, AccountProfiletype, AccountPhoneemailtype } = this.state;
const common = {
isSuperAdmin: this.isSuperAdmin,
isAdminOrCreator: this.isAdminOrCreator,
isClassManagement: this.isClassManagement,
isCourseAdmin: this.isCourseAdmin,
isAdmin: this.isAdmin,
isAdminOrTeacher: this.isAdminOrTeacher,
isStudent: this.isStudent,
isAdminOrStudent: this.isAdminOrStudent,
isNotMember: this.isNotMember,
isCourseEnd: this.isCourseEnd,
isUserid: this.state.coursedata && this.state.coursedata.userid,
fetchUser: this.fetchUser,
showLoginDialog: this.showLoginDialog,
checkIfLogin: this.checkIfLogin,
showProfileCompleteDialog: this.showProfileCompleteDialog,
showhideAccountPhoneemailDialog: this.showhideAccountPhoneemailDialog,
checkIfProfileCompleted: this.checkIfProfileCompleted,
showaccountprofileDialog: this.showaccountprofileDialog,
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),
slowDownload: this.slowDownload,
showGlobalLoading: this.showGlobalLoading,
hideGlobalLoading: this.hideGlobalLoading,
yslslowCheckresults: this.yslslowCheckresults,
yslslowCheckresultsNo: this.yslslowCheckresultsNo,
MdifHasAnchorJustScorll: this.MdifHasAnchorJustScorll,
scrollToAnchor: this.scrollToAnchor
render() { render() {
let{Headertop,Footerdown, isRender, AccountProfiletype,AccountPhoneemailtype}=this.state; let{Headertop,Footerdown, isRender, AccountProfiletype,AccountPhoneemailtype}=this.state;
@ -738,17 +750,18 @@ export default function TPMIndexHOC(WrappedComponent) {
} }
{/* 注释掉了1440 影响到了手机屏幕的展示 */} {/* 注释掉了1440 影响到了手机屏幕的展示 */}
<style>{ <style>{
` `
.newContainers{ .newContainers{
min-width: 1200px; min-width: 1200px;
max-width: unset; max-width: unset;
margin: 0 auto; height: 100%;
min-height: 100%;
overflow: hidden; overflow: hidden;
position: realtive;
} }
.newHeaders{ .newHeaders{
// position: fixed;
max-width: unset; max-width: unset;
background: #24292D !important; background: #24292D !important;
width: 100%; width: 100%;
@ -764,6 +777,7 @@ export default function TPMIndexHOC(WrappedComponent) {
} }
.indexHOC > .ant-spin-nested-loading { .indexHOC > .ant-spin-nested-loading {
background: #000; background: #000;
height: 100%;
} }
.indexHOC > .ant-spin-nested-loading > div > .ant-spin .ant-spin-dot { .indexHOC > .ant-spin-nested-loading > div > .ant-spin .ant-spin-dot {
top: 50% !important; top: 50% !important;
@ -777,31 +791,33 @@ export default function TPMIndexHOC(WrappedComponent) {
background-color: #fff; background-color: #fff;
} }
` `
}</style> }</style>
{this.state.globalLoading ? <Loading /> : <NewHeader {...this.state} {...this.props}></NewHeader>
<React.Fragment> <Spin spinning={this.state.globalLoading} delay={0} className="globalSpin"
<NewHeader {...this.state} {...this.props}></NewHeader> size="large"
<div className="newContainers"> tip= {this._gLoadingTip || "加载中..."}
<WrappedComponent initCommonState={(user) => this.initCommonState(user)} >
<div className="newContainer newContainers">
<WrappedComponent initCommonState={(user)=>this.initCommonState(user)}
{...this.props} {...this.state} {...this.props} {...this.state}
showShixun={this.showShixun} aboutFocus={this.aboutFocus} showShixun={this.showShixun} aboutFocus={this.aboutFocus}
{...common} {...common}
> >
</WrappedComponent> </WrappedComponent>
</div>
</div> </Spin>
<NewFooter
{...this.state} {...this.props} <NewFooter
{...this.state} {...this.props}
Footerdown={Footerdown} Footerdown={Footerdown}
/> />
</React.Fragment>
}
</div> </div>
); );
} }
} }
} }

Loading…
Cancel
Save