forked from Gitlink/forgeplus-react
users
This commit is contained in:
parent
cf088c30ad
commit
0bfcd40fb3
|
|
@ -1,12 +1,17 @@
|
|||
import React, { Component } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import { Avatar, Tag, Button, Pagination, Spin, Dropdown, Menu } from "antd";
|
||||
import FocusButton from "../UsersList/focus_button";
|
||||
|
||||
import axios from "axios";
|
||||
import { getImageUrl } from "educoder";
|
||||
import { Route, Switch } from "react-router-dom";
|
||||
import { withRouter } from "react-router";
|
||||
|
||||
import { SnackbarHOC } from "educoder";
|
||||
import { CNotificationHOC } from "../../modules/courses/common/CNotificationHOC";
|
||||
import { TPMIndexHOC } from "../../modules/tpm/TPMIndexHOC";
|
||||
|
||||
import "./new_user.css";
|
||||
import "../css/index.css";
|
||||
|
||||
import Loadable from "react-loadable";
|
||||
|
|
@ -19,17 +24,161 @@ const InfosIndex = Loadable({
|
|||
});
|
||||
|
||||
class Infos extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
isSpin: false,
|
||||
user: undefined,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount = () => {
|
||||
this.fetchUser();
|
||||
};
|
||||
|
||||
fetchUser = () => {
|
||||
let url = `/users/${this.props.match.params.username}.json`;
|
||||
axios
|
||||
.get(url)
|
||||
.then((result) => {
|
||||
this.setState({
|
||||
user: result.data,
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
this.setState({
|
||||
isSpin: false,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { current_user, mygetHelmetapi } = this.props;
|
||||
const { user } = this.state;
|
||||
return (
|
||||
<div className="newMain clearfix">
|
||||
<Switch {...this.props}>
|
||||
<Route
|
||||
path="/users/:username"
|
||||
render={(props) => {
|
||||
return <InfosIndex {...this.props} {...props} {...this.state} />;
|
||||
}}
|
||||
></Route>
|
||||
</Switch>
|
||||
<div className="new-content-flex">
|
||||
<div className="list-left">
|
||||
<div className="bgcF">
|
||||
<div className="list-l-Menu text-center pd20 ">
|
||||
<Avatar
|
||||
size={110}
|
||||
src={getImageUrl(`images/${user && user.image_url}`)}
|
||||
/>
|
||||
{user && user.user_identity && (
|
||||
<div className="mt-n15 position-relative">
|
||||
<Tag color="#FF6E21">{user && user.user_identity}</Tag>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div>
|
||||
{user && current_user && user.login === current_user.login && (
|
||||
<div className="user-info-star-button ">
|
||||
<Button
|
||||
block
|
||||
className="text-button-grey"
|
||||
href={`${
|
||||
mygetHelmetapi && mygetHelmetapi.new_course.edit_account
|
||||
}`}
|
||||
target="_blank"
|
||||
>
|
||||
{" "}
|
||||
<i className="iconfont icon-shezhi4 font-15 mr5"></i>
|
||||
修改资料
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
{current_user && user && user.login !== current_user.login && (
|
||||
<div className="user-info-star-button ">
|
||||
<FocusButton
|
||||
is_block={true}
|
||||
is_watch={user.is_watch}
|
||||
id={user.login}
|
||||
fontClass={"font-14 ml5"}
|
||||
starText={"关注TA"}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="width100 inline-block mt20">
|
||||
<Link
|
||||
to={`/users/${user && user.login}/watchings`}
|
||||
className="with50 text-center pull-left"
|
||||
>
|
||||
<div>我关注的</div>
|
||||
<span>{user && user.watching_count}</span>
|
||||
</Link>
|
||||
<Link
|
||||
to={`/users/${user && user.login}/watched`}
|
||||
className="with50 text-center pull-left"
|
||||
>
|
||||
<div>关注我的</div>
|
||||
<span>{user && user.watched_count}</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{current_user && user && current_user.id === user.id && (
|
||||
<div className="bgcF">
|
||||
<div className="list-l-Menu">
|
||||
<p className="list-l-p pd20">
|
||||
<span className="font-16 fwb">
|
||||
<i className="iconfont icon-dahuizhongzuo3x font-15 mr5"></i>
|
||||
待办事项
|
||||
</span>
|
||||
<span className="text-yellow font-16">
|
||||
{user.undo_events}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<div className="bgcF">
|
||||
<ul class="list-l-Menu">
|
||||
<li class="MenuTitle fwb">
|
||||
<i class="iconfont icon-xiangmuleixing font-15 mr5"></i>
|
||||
项目类型
|
||||
</li>
|
||||
<li class="active">
|
||||
<p>
|
||||
<span class="font-16">托管项目</span>
|
||||
<span class="color-blue">3773</span>
|
||||
</p>
|
||||
</li>
|
||||
<li class="">
|
||||
<p>
|
||||
<span class="font-16">镜像项目</span>
|
||||
<span class="color-blue">3</span>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="bgcF">
|
||||
<div className="list-l-Menu">
|
||||
<p className="list-l-p pd20">
|
||||
<span className="font-16 fwb">
|
||||
<i className="iconfont icon-itsm-liuchengguanli font-15 mr5"></i>
|
||||
组织
|
||||
</span>
|
||||
<span className="color-blue font-16">
|
||||
{user && user.undo_events}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="list-right">
|
||||
<Switch {...this.props}>
|
||||
<Route
|
||||
path="/users/:username/projects"
|
||||
render={(props) => {
|
||||
return <InfosIndex {...this.props} {...this.state} />;
|
||||
}}
|
||||
></Route>
|
||||
</Switch>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,9 +5,10 @@ import { Avatar, Tag, Button, Pagination, Spin, Dropdown, Menu } from "antd";
|
|||
import FocusButton from "../UsersList/focus_button";
|
||||
|
||||
import axios from "axios";
|
||||
import NoneData from "../Nodata";
|
||||
import { getImageUrl } from "educoder";
|
||||
import "./new_user.css";
|
||||
import NoneData from "../Nodata";
|
||||
|
||||
// import "./new_user.css";
|
||||
import "../css/index.css";
|
||||
|
||||
class InfosUser extends Component {
|
||||
|
|
@ -23,79 +24,14 @@ class InfosUser extends Component {
|
|||
totalCount: undefined,
|
||||
data: undefined,
|
||||
isSpin: false,
|
||||
user: undefined,
|
||||
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount = () => {
|
||||
this.fetchUser();
|
||||
// this.setState({
|
||||
// isSpin:true
|
||||
// })
|
||||
// let {category, status, page, sort_by, sort_direction} = this.state;
|
||||
// this.getCourses(category, status, page, sort_by, sort_direction);
|
||||
};
|
||||
|
||||
fetchUser = () => {
|
||||
let url = `/users/${this.props.match.params.username}.json`;
|
||||
axios
|
||||
.get(url)
|
||||
.then((result) => {
|
||||
this.setState({
|
||||
user: result.data,
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
this.setState({
|
||||
isSpin: false,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
getCourses = (category, status, page, sort_by, sort_direction) => {
|
||||
let url = `/users/${this.props.match.params.username}/projects.json`;
|
||||
axios
|
||||
.get(url, {
|
||||
params: {
|
||||
category,
|
||||
status,
|
||||
page,
|
||||
sort_by,
|
||||
sort_direction,
|
||||
per_page: this.props.is_current && category && page == 1 ? 17 : 16,
|
||||
},
|
||||
})
|
||||
.then((result) => {
|
||||
if (result) {
|
||||
if (
|
||||
result.data.status === 403 ||
|
||||
result.data.status === 401 ||
|
||||
result.data.status === 500 ||
|
||||
result.data.status === 404
|
||||
) {
|
||||
this.setState({
|
||||
isSpin: false,
|
||||
totalCount: 0,
|
||||
});
|
||||
} else {
|
||||
this.setState({
|
||||
totalCount: result.data.count,
|
||||
data: result.data,
|
||||
sort_by: sort_by,
|
||||
sort_direction: sort_direction,
|
||||
isSpin: false,
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
this.setState({
|
||||
isSpin: false,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
//切换种类
|
||||
changeCategory = (cate) => {
|
||||
|
|
@ -158,134 +94,10 @@ class InfosUser extends Component {
|
|||
}
|
||||
|
||||
render() {
|
||||
// let{
|
||||
// category,
|
||||
// status,
|
||||
// page,
|
||||
// data,
|
||||
// totalCount,
|
||||
// isSpin,
|
||||
// sort_by,
|
||||
// sort_direction
|
||||
// } = this.state;
|
||||
// let isStudent = this.props.isStudent();
|
||||
// let is_current=this.props.is_current;
|
||||
const { current_user, mygetHelmetapi } = this.props;
|
||||
const { user } = this.state;
|
||||
|
||||
console.log(this.props);
|
||||
|
||||
return (
|
||||
<div className="new-content-flex">
|
||||
<div className="list-left">
|
||||
<div className="bgcF">
|
||||
<div className="list-l-Menu text-center pd20 ">
|
||||
<Avatar
|
||||
size={110}
|
||||
src={getImageUrl(`images/${user && user.image_url}`)}
|
||||
/>
|
||||
{user && user.user_identity && (
|
||||
<div className="mt-n15 position-relative">
|
||||
<Tag color="#FF6E21">{user && user.user_identity}</Tag>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div>
|
||||
{user && current_user && user.login === current_user.login && (
|
||||
<div className="user-info-star-button ">
|
||||
<Button
|
||||
block
|
||||
className="text-button-grey"
|
||||
href={`${
|
||||
mygetHelmetapi && mygetHelmetapi.new_course.edit_account
|
||||
}`}
|
||||
target="_blank"
|
||||
>
|
||||
{" "}
|
||||
<i className="iconfont icon-shezhi4 font-15 mr5"></i>
|
||||
修改资料
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
{current_user && user && user.login !== current_user.login && (
|
||||
<div className="user-info-star-button ">
|
||||
<FocusButton
|
||||
is_block={true}
|
||||
is_watch={user.is_watch}
|
||||
id={user.login}
|
||||
fontClass={"font-14 ml5"}
|
||||
starText={"关注TA"}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="width100 inline-block mt20">
|
||||
<Link
|
||||
to={`/users/${user && user.login}/watchings`}
|
||||
className="with50 text-center pull-left"
|
||||
>
|
||||
<div>我关注的</div>
|
||||
<span>{user && user.watching_count}</span>
|
||||
</Link>
|
||||
<Link
|
||||
to={`/users/${user && user.login}/watched`}
|
||||
className="with50 text-center pull-left"
|
||||
>
|
||||
<div>关注我的</div>
|
||||
<span>{user && user.watched_count}</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{current_user && user && current_user.id === user.id && (
|
||||
<div className="bgcF">
|
||||
<div className="list-l-Menu">
|
||||
<p className="list-l-p pd20">
|
||||
<span className="font-16 fwb">
|
||||
<i className="iconfont icon-dahuizhongzuo3x font-15 mr5"></i>
|
||||
待办事项
|
||||
</span>
|
||||
<span className="text-yellow font-16">
|
||||
{user.undo_events}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<div className="bgcF">
|
||||
<ul class="list-l-Menu">
|
||||
<li class="MenuTitle fwb">
|
||||
<i class="iconfont icon-xiangmuleixing font-15 mr5"></i>
|
||||
项目类型
|
||||
</li>
|
||||
<li class="active">
|
||||
<p>
|
||||
<span class="font-16">托管项目</span>
|
||||
<span class="color-blue">3773</span>
|
||||
</p>
|
||||
</li>
|
||||
<li class="">
|
||||
<p>
|
||||
<span class="font-16">镜像项目</span>
|
||||
<span class="color-blue">3</span>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="bgcF">
|
||||
<div className="list-l-Menu">
|
||||
<p className="list-l-p pd20">
|
||||
<span className="font-16 fwb">
|
||||
<i className="iconfont icon-itsm-liuchengguanli font-15 mr5"></i>
|
||||
组织
|
||||
</span>
|
||||
<span className="color-blue font-16">
|
||||
{user && user.undo_events}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
ddddd
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue