Merge branch 'master' of https://bdgit.educoder.net/Hjqreturn/educoder
commit
4a63b7da23
@ -1,118 +1,118 @@
|
|||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
|
|
||||||
import { BrowserRouter as Router, Route, Link, Switch } from "react-router-dom";
|
import { BrowserRouter as Router, Route, Link, Switch } from "react-router-dom";
|
||||||
import {CNotificationHOC} from '../courses/common/CNotificationHOC'
|
import {CNotificationHOC} from '../courses/common/CNotificationHOC'
|
||||||
import Loading from '../../Loading';
|
import Loading from '../../Loading';
|
||||||
|
|
||||||
import Loadable from 'react-loadable';
|
import Loadable from 'react-loadable';
|
||||||
|
|
||||||
import { TPMIndexHOC } from '../tpm/TPMIndexHOC';
|
import { TPMIndexHOC } from '../tpm/TPMIndexHOC';
|
||||||
|
|
||||||
import { SnackbarHOC, getImageUrl } from 'educoder';
|
import { SnackbarHOC, getImageUrl } from 'educoder';
|
||||||
import AccountNav from './account/AccountNav'
|
import AccountNav from './account/AccountNav'
|
||||||
import axios from 'axios'
|
import axios from 'axios'
|
||||||
|
|
||||||
const AccountBasic= Loadable({
|
const AccountBasic= Loadable({
|
||||||
loader: () => import('./account/AccountBasic'),
|
loader: () => import('./account/AccountBasic'),
|
||||||
loading: Loading,
|
loading: Loading,
|
||||||
})
|
})
|
||||||
const AccountBasicEdit= Loadable({
|
const AccountBasicEdit= Loadable({
|
||||||
loader: () => import('./account/AccountBasicEdit'),
|
loader: () => import('./account/AccountBasicEdit'),
|
||||||
loading: Loading,
|
loading: Loading,
|
||||||
})
|
})
|
||||||
|
|
||||||
const AccountCertification= Loadable({
|
const AccountCertification= Loadable({
|
||||||
loader: () => import('./account/AccountCertification'),
|
loader: () => import('./account/AccountCertification'),
|
||||||
loading: Loading,
|
loading: Loading,
|
||||||
})
|
})
|
||||||
const AccountSecure= Loadable({
|
const AccountSecure= Loadable({
|
||||||
loader: () => import('./account/AccountSecure'),
|
loader: () => import('./account/AccountSecure'),
|
||||||
loading: Loading,
|
loading: Loading,
|
||||||
})
|
})
|
||||||
|
|
||||||
class AccountPage extends Component {
|
class AccountPage extends Component {
|
||||||
constructor (props) {
|
constructor (props) {
|
||||||
super(props)
|
super(props)
|
||||||
this.state = {
|
this.state = {
|
||||||
basicInfo:undefined
|
basicInfo:undefined
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidUpdate =(prevState)=>{
|
componentDidUpdate =(prevState)=>{
|
||||||
if(this.props.current_user && this.props.current_user != prevState.current_user){
|
if(this.props.current_user && this.props.current_user != prevState.current_user){
|
||||||
this.getBasicInfo(this.props.current_user.login);
|
this.getBasicInfo(this.props.current_user.login);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount = () =>{
|
componentDidMount = () =>{
|
||||||
if(this.props.current_user){
|
if(this.props.current_user){
|
||||||
this.getBasicInfo(this.props.current_user.login);
|
this.getBasicInfo(this.props.current_user.login);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
getBasicInfo=(login)=>{
|
getBasicInfo=(login)=>{
|
||||||
let url=`/users/accounts/${login || this.props.current_user.login}.json`;
|
let url=`/users/accounts/${login || this.props.current_user.login}.json`;
|
||||||
axios.get(url).then((result)=>{
|
axios.get(url).then((result)=>{
|
||||||
if(result.data){
|
if(result.data){
|
||||||
if(result.data && result.data.base_info_completed == false){
|
if(result.data && result.data.base_info_completed == false){
|
||||||
this.props.history.push(`/account/basic/edit`);
|
this.props.history.push(`/profile/basic/edit`);
|
||||||
}
|
}
|
||||||
this.setState({
|
this.setState({
|
||||||
basicInfo: Object.assign({}, {...result.data}, { avatar_url: `${result.data.avatar_url}?t=${new Date().getTime()}`})
|
basicInfo: Object.assign({}, {...result.data}, { avatar_url: `${result.data.avatar_url}?t=${new Date().getTime()}`})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}).catch((error)=>{
|
}).catch((error)=>{
|
||||||
console.log(error);
|
console.log(error);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
let { basicInfo }=this.state;
|
let { basicInfo }=this.state;
|
||||||
const common = { basicInfo, getBasicInfo : this.getBasicInfo }
|
const common = { basicInfo, getBasicInfo : this.getBasicInfo }
|
||||||
return (
|
return (
|
||||||
<div className="newMain clearfix">
|
<div className="newMain clearfix">
|
||||||
<div className="educontent df pt20">
|
<div className="educontent df pt20">
|
||||||
<style>{`
|
<style>{`
|
||||||
.accountPage {
|
.accountPage {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
`}</style>
|
`}</style>
|
||||||
<AccountNav {...this.props} {...common}></AccountNav>
|
<AccountNav {...this.props} {...common}></AccountNav>
|
||||||
<div className="basicFormWrap">
|
<div className="basicFormWrap">
|
||||||
<Switch {...this.props}>
|
<Switch {...this.props}>
|
||||||
<Route exact path="/account/basic"
|
<Route exact path="/profile/basic"
|
||||||
render={
|
render={
|
||||||
(props) => (<AccountBasic {...this.props} {...props} {...this.state} {...common} />)
|
(props) => (<AccountBasic {...this.props} {...props} {...this.state} {...common} />)
|
||||||
}
|
}
|
||||||
></Route>
|
></Route>
|
||||||
<Route exact path="/account/basic/edit"
|
<Route exact path="/profile/basic/edit"
|
||||||
render={
|
render={
|
||||||
(props) => (<AccountBasicEdit {...this.props} {...props} {...this.state} {...common} />)
|
(props) => (<AccountBasicEdit {...this.props} {...props} {...this.state} {...common} />)
|
||||||
}
|
}
|
||||||
></Route>
|
></Route>
|
||||||
|
|
||||||
<Route exact path="/account/certification"
|
<Route exact path="/profile/certification"
|
||||||
render={
|
render={
|
||||||
(props) => (<AccountCertification {...this.props} {...props} {...this.state} {...common} />)
|
(props) => (<AccountCertification {...this.props} {...props} {...this.state} {...common} />)
|
||||||
}
|
}
|
||||||
></Route>
|
></Route>
|
||||||
|
|
||||||
<Route exact path="/account/secure"
|
<Route exact path="/profile/secure"
|
||||||
render={
|
render={
|
||||||
(props) => (<AccountSecure {...this.props} {...props} {...this.state} {...common} />)
|
(props) => (<AccountSecure {...this.props} {...props} {...this.state} {...common} />)
|
||||||
}
|
}
|
||||||
></Route>
|
></Route>
|
||||||
|
|
||||||
<Route exact path="/account"
|
<Route exact path="/profile"
|
||||||
render={
|
render={
|
||||||
(props) => (<AccountBasic {...this.props} {...props} {...this.state} {...common} />)
|
(props) => (<AccountBasic {...this.props} {...props} {...this.state} {...common} />)
|
||||||
}
|
}
|
||||||
></Route>
|
></Route>
|
||||||
</Switch>
|
</Switch>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default CNotificationHOC()(SnackbarHOC() ( TPMIndexHOC ( AccountPage )));
|
export default CNotificationHOC()(SnackbarHOC() ( TPMIndexHOC ( AccountPage )));
|
||||||
|
|||||||
@ -1,68 +1,68 @@
|
|||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
|
|
||||||
import { SnackbarHOC, getImageUrl } from 'educoder';
|
import { SnackbarHOC, getImageUrl } from 'educoder';
|
||||||
import AccountImg from './AccountImg'
|
import AccountImg from './AccountImg'
|
||||||
class AccountNav extends Component {
|
class AccountNav extends Component {
|
||||||
toBasic = () => {
|
toBasic = () => {
|
||||||
this.props.history.push(`/account/basic`)
|
this.props.history.push(`/profile/basic`)
|
||||||
}
|
}
|
||||||
toCertification = () => {
|
toCertification = () => {
|
||||||
this.props.history.push(`/account/certification`)
|
this.props.history.push(`/profile/certification`)
|
||||||
}
|
}
|
||||||
toSecure = () => {
|
toSecure = () => {
|
||||||
this.props.history.push(`/account/secure`)
|
this.props.history.push(`/profile/secure`)
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
let { basicInfo } = this.props
|
let { basicInfo } = this.props
|
||||||
console.log(this.props);
|
console.log(this.props);
|
||||||
const path = window.location.pathname
|
const path = window.location.pathname
|
||||||
const isBasic = path.indexOf('basic') != -1 || path == "/account"
|
const isBasic = path.indexOf('basic') != -1 || path == "/profile"
|
||||||
const isCertification = path.indexOf('certification') != -1
|
const isCertification = path.indexOf('certification') != -1
|
||||||
const isSecure = path.indexOf('secure') != -1
|
const isSecure = path.indexOf('secure') != -1
|
||||||
return (
|
return (
|
||||||
<div className="accountNav fl">
|
<div className="accountNav fl">
|
||||||
{
|
{
|
||||||
basicInfo &&
|
basicInfo &&
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
<div className="accountInfo">
|
<div className="accountInfo">
|
||||||
<AccountImg src={basicInfo.avatar_url} {...this.props}></AccountImg>
|
<AccountImg src={basicInfo.avatar_url} {...this.props}></AccountImg>
|
||||||
<span className="name">{basicInfo.name}</span>
|
<span className="name">{basicInfo.name}</span>
|
||||||
<span className="role">{basicInfo.technical_title}</span>
|
<span className="role">{basicInfo.technical_title}</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="accountManagement">
|
<div className="accountManagement">
|
||||||
<div className="title">账号管理</div>
|
<div className="title">账号管理</div>
|
||||||
<ul>
|
<ul>
|
||||||
<li className={`navItem ${isBasic ? 'active' : ''}`} onClick={this.toBasic}>
|
<li className={`navItem ${isBasic ? 'active' : ''}`} onClick={this.toBasic}>
|
||||||
<i className="iconfont icon-jibenxinxi color-grey-9 font-16"></i>
|
<i className="iconfont icon-jibenxinxi color-grey-9 font-16"></i>
|
||||||
基本信息
|
基本信息
|
||||||
{
|
{
|
||||||
(basicInfo.authentication == 'uncertified' || basicInfo.authentication == 'applying') &&
|
(basicInfo.authentication == 'uncertified' || basicInfo.authentication == 'applying') &&
|
||||||
<i className="status fr iconfont icon-tishi color-red font-16"></i>
|
<i className="status fr iconfont icon-tishi color-red font-16"></i>
|
||||||
}
|
}
|
||||||
{
|
{
|
||||||
basicInfo.authentication == 'certified' &&
|
basicInfo.authentication == 'certified' &&
|
||||||
<i className="status fr iconfont icon-wancheng color-green-light font-16"></i>
|
<i className="status fr iconfont icon-wancheng color-green-light font-16"></i>
|
||||||
}
|
}
|
||||||
</li>
|
</li>
|
||||||
<li className={`navItem ${isCertification ? 'active' : ''}`} onClick={this.toCertification}>
|
<li className={`navItem ${isCertification ? 'active' : ''}`} onClick={this.toCertification}>
|
||||||
<i className="iconfont icon-renzhengxinxi color-grey-9 font-16"></i>认证信息
|
<i className="iconfont icon-renzhengxinxi color-grey-9 font-16"></i>认证信息
|
||||||
{
|
{
|
||||||
basicInfo.professional_certification == 'certified' && basicInfo.authentication == 'certified' ?
|
basicInfo.professional_certification == 'certified' && basicInfo.authentication == 'certified' ?
|
||||||
<i className="status fr iconfont icon-wancheng color-green-light font-16"></i>:
|
<i className="status fr iconfont icon-wancheng color-green-light font-16"></i>:
|
||||||
<i className="status fr iconfont icon-tishi color-red font-16"></i>
|
<i className="status fr iconfont icon-tishi color-red font-16"></i>
|
||||||
}
|
}
|
||||||
</li>
|
</li>
|
||||||
<li className={`navItem ${isSecure ? 'active' : ''}`} onClick={this.toSecure}>
|
<li className={`navItem ${isSecure ? 'active' : ''}`} onClick={this.toSecure}>
|
||||||
<i className="iconfont icon-anquanshezhi color-grey-9 font-16"></i>安全设置
|
<i className="iconfont icon-anquanshezhi color-grey-9 font-16"></i>安全设置
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default AccountNav ;
|
export default AccountNav ;
|
||||||
|
|||||||
Loading…
Reference in new issue