├── README.md
├── component
├── detail
│ ├── author.js
│ ├── authorAboutTopics.js
│ ├── detailHeader.js
│ ├── reply.js
│ └── replyTopic.js
├── index
│ ├── cells.js
│ ├── login.js
│ ├── pagination.js
│ └── tab.js
└── public
│ ├── Breadcrumbs.js
│ ├── header.js
│ ├── load.js
│ └── messages.js
├── css
├── iconfont.css
├── img
│ └── cnodejs_light.svg
├── main.scss
├── reset.min.css
└── sweetalert.css
├── dist
├── .DS_Store
├── main.js
└── package.css
├── fonts
├── iconfont.svg
└── iconfont.ttf
├── index.html
├── js
├── detail.js
├── index.js
├── main.js
├── message.js
├── reportTopic.js
└── user.js
├── package.json
└── webpack.config.js
/README.md:
--------------------------------------------------------------------------------
1 | # CNode-By-React
2 | 项目相关
3 |
4 | - 学习react时自己搭建的cnode,断断续续在写，基本能看了。
5 | - 各种新东西，所以兼容性你懂的
6 | - 项目预览地址
7 |
8 | 相关技术链
9 |
17 |
--------------------------------------------------------------------------------
/component/detail/author.js:
--------------------------------------------------------------------------------
1 | //detail-author
2 | import React from 'react';
3 | import { Link } from 'react-router';
4 |
5 | const Author=React.createClass({
6 | getInitialState(){
7 | return {authorData: '', score:''};
8 | },
9 | componentWillMount(){
10 | if(!this.props.isAuthor && localStorage.getItem('loginname')){
11 | this.sendRequest('https://cnodejs.org/api/v1/user/'+localStorage.getItem('loginname'),this.setData);
12 | }
13 | },
14 | componentWillReceiveProps(newProps){
15 | if(this.props.isAuthor==='true' && newProps.url){
16 | this.sendRequest('https://cnodejs.org/api/v1/user/'+newProps.url,this.setData);
17 | }else if(this.props.isAuthor==='false' && localStorage.getItem('loginname')){
18 | this.sendRequest('https://cnodejs.org/api/v1/user/'+localStorage.getItem('loginname'),this.setData);
19 | }
20 | },
21 | setData(resultData){
22 | this.setState({
23 | authorData: resultData,
24 | score: resultData.score
25 | });
26 | },
27 | sendRequest(url,callback){
28 | fetch(url,{method: 'get',
29 | }).then((result)=>{
30 | return result.json().then((data)=>{
31 | const resultData=data.data;
32 | if(resultData){
33 | callback(resultData);
34 | }
35 | })
36 | });
37 | },
38 | render(){
39 | return
40 |
41 | {this.props.isAuthor==='true'?'ta的信息':'个人信息'}
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 | {this.state.authorData.loginname}
51 |
52 |
53 | 积分: {this.state.score}
54 |
55 |
56 | "斯人若彩虹，遇上方知有"
57 |
58 |
59 |
60 |
61 |
36 |
37 |
38 | 作者相关话题
39 |
40 |
41 |
42 |
43 | {
44 | this.state.authorData.map((_this,index)=>{
45 | return - 4?"display-none":''}>
46 |
47 | {_this.title}
48 |
49 |
50 | })
51 | }
52 | - 5?'more':'display-none'} onClick={this.showTopics}>
53 |
54 |
55 |
37 |
38 |
{this.props.data.title}
39 |
46 |
47 |
50 |
81 |
82 |
83 | {this.props.data.length} 回复
84 |
85 | {
86 | this.props.data.map((_this,index)=>{
87 | return
88 |
89 |
90 |
91 | 
92 |
93 |
97 |
98 |
99 |
100 | {_this.ups.length?_this.ups.length:''}
101 |
102 |
103 |
104 |
105 |
106 |
107 | })
108 | }
109 |
110 |
111 |
112 |
113 |
114 | 添加回复
115 |
116 |
117 |
118 |
119 |
120 |
121 |
122 |
30 |
31 |
32 | 添加回复
33 |
34 |
35 |
36 |
37 |
38 |
39 |
29 | {
30 | this.state.data.map((cell,index)=>{
31 | return (
32 |
33 |
34 |
35 |
36 |
=0?'count-reply-visit':'display-none'}>
37 | {cell.reply_count}
38 | /
39 | {cell.visit_count}
40 |
41 |
42 | {this.timeFormat(cell.last_reply_at)}
43 |
44 |
45 | {cell.good?this.state.tabTitle['good']:this.state.tabTitle[cell.tab]}
46 | {cell.title}
47 |
48 |
49 | )
50 | })
51 | }
52 |
59 |
60 | {
61 | this.state.paginationData.map((page,index)=>{
62 | return - {page}
63 | })
64 | }
65 |
66 |
23 | {
24 | Object.keys(tabsTitle).map((tab,index)=>{
25 | return
{tab}
26 | })
27 | }
28 |
7 |
8 | - 主页/
9 | - {this.props.active}
10 |
11 |
35 |
36 |
43 |
7 |
8 |
9 | }
10 | });
11 | module.exports=Load;
--------------------------------------------------------------------------------
/component/public/messages.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { Link } from 'react-router';
3 |
4 | const Messages=React.createClass({
5 | getInitialState(){
6 | return {data: []}
7 | },
8 | componentWillReceiveProps(newProps){
9 | if(newProps.data){
10 | this.setState({
11 | data:newProps.data
12 | })
13 | }
14 | },
15 | render(){
16 | return
17 |
暂无消息
18 | {
19 | this.state.data.map((_this)=>{
20 | return
21 |
{_this.author.loginname} {_this.type==='at'?'在话题 ':'回复了你的话题'}
{_this.topic.title} {_this.type==='at'?'中@了你':''}
22 |
23 | })
24 | }
25 |
73 |
74 |
75 |
76 |
80 |
81 |
82 |
83 |
84 |
85 |
19 | {this.props.children}
20 |
21 | }
22 | });
23 | ReactDOM.render(
24 | (
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 | ),document.querySelector('body')
35 | );
36 |
--------------------------------------------------------------------------------
/js/message.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Header from '../component/public/header.js';
3 | import Breadcrumbs from '../component/public/Breadcrumbs.js';
4 | import Messages from '../component/public/messages.js';
5 | import Author from '../component/detail/author.js';
6 |
7 | const Message=React.createClass({
8 | getInitialState(){
9 | return {isLogin: localStorage.getItem('userToken')?true:false,data: {}};
10 | },
11 | componentDidMount(){
12 | this.sendRequest(' https://cnodejs.org/api/v1/messages?accesstoken='+localStorage.getItem('userToken'));
13 | },
14 | sendRequest(url){
15 | fetch(url,{method: 'get',}).then((result)=>{
16 | return result.json().then((data)=>{
17 | const resultData=data.data;
18 | if(resultData){
19 | this.setState({
20 | data: resultData,
21 | });
22 | }
23 | })
24 | });
25 | },
26 | render(){
27 | return
28 |
29 |
30 |
33 |
34 |
35 |
36 |
37 |
38 |
42 |
43 |
54 |
55 |
56 |
59 |
60 |
76 |
77 |
78 | 最近创建的话题
79 |
80 |
81 | |
82 |
83 |
84 | 最近参与的话题
85 |
86 |
87 | |
88 |
89 |