From 5f8c3f69b7b278e22b26fd3e2d3f3f0931dd49ee Mon Sep 17 00:00:00 2001 From: 15620693528 <2363140194@qq.com> Date: Wed, 10 Aug 2016 15:22:18 +0800 Subject: [PATCH] =?UTF-8?q?=E7=94=A8=E6=88=B7=E5=88=97=E8=A1=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/scripts/actions/userAction.js | 54 +++++++++++++ .../components/UserDetail/UserDetail.jsx | 2 +- app/scripts/components/UserList/UserList.jsx | 78 +++++++++++++++++++ app/scripts/components/UserList/index.js | 20 +++++ app/scripts/reducers/userReducer.js | 13 ++++ app/scripts/routes.js | 5 +- app/scripts/store.js | 2 + 7 files changed, 171 insertions(+), 3 deletions(-) create mode 100644 app/scripts/actions/userAction.js create mode 100644 app/scripts/components/UserList/UserList.jsx create mode 100644 app/scripts/components/UserList/index.js create mode 100644 app/scripts/reducers/userReducer.js diff --git a/app/scripts/actions/userAction.js b/app/scripts/actions/userAction.js new file mode 100644 index 0000000..495ff98 --- /dev/null +++ b/app/scripts/actions/userAction.js @@ -0,0 +1,54 @@ +import Request from 'superagent' + +export const RECEIVE_USER = 'RECEIVE_USER' +export const RECEIVE_USER_NEW = 'RECEIVE_USER_NEW' + +function receiveUser(res) { + return { + type: RECEIVE_USER, + res + } +} +function receiveUserNew(res) { + return { + type: RECEIVE_USER_NEW, + res + } +} +const status = { + filter: '', + page:0, + overload: false, +} +export function fetchUser(filter) { + if (filter !== status.filter) { + status.filter = filter + status.page = 0 + status.overload = true + } else { + status.overload = false + } + let params = {} + params.page = status.page + if (status.filter !== '') { + params.filter = status.filter + } + return (dispatch) => { + return Request + .get(`/api/users`) + .query(params) + .end(function(err,res){ + status.page++ + status.overload ? dispatch(receiveUserNew(res.body.users)) : dispatch(receiveUser(res.body.users)) + }) + } +} + +export function recommendUser(id) { + return (dispatch) => { + return Request + .post(`/api/recommend/home/${id}?type=user`) + .end((err,res) => { + }) + } +} \ No newline at end of file diff --git a/app/scripts/components/UserDetail/UserDetail.jsx b/app/scripts/components/UserDetail/UserDetail.jsx index 022f23f..29fa497 100644 --- a/app/scripts/components/UserDetail/UserDetail.jsx +++ b/app/scripts/components/UserDetail/UserDetail.jsx @@ -88,7 +88,7 @@ export default class UserDetail extends Component{ ) } - if (this.props.user.id && this.props.posts.length) { + if (this.props.user.id ) { const user = this.props.user const posts = this.props.posts return ( diff --git a/app/scripts/components/UserList/UserList.jsx b/app/scripts/components/UserList/UserList.jsx new file mode 100644 index 0000000..7f6f6c3 --- /dev/null +++ b/app/scripts/components/UserList/UserList.jsx @@ -0,0 +1,78 @@ +import React, { Component } from 'react' +import { + Row, Form, FormGroup, FormControl, Button, InputGroup, +} from 'react-bootstrap' +import { Link } from 'react-router' +import Moment from 'moment' + +export default class UserList extends Component{ + constructor(props) { + super(props) + + this.state = { + query:'' + } + this.search = () => this.props.fetchUser(this.state.query) + this.onChangeQuery = (e) => this.setState({query:e.target.value}) + this.recommend = (id) => this.props.recommendUser(id) + // this.fetchMoreUsers = () => this.props.fetchUser(this.state.query) + } + componentWillMount() { + this.search() + } + renderAccounts(accounts) { + return ( + + {accounts.map(function (acc) { + if (acc.providerID === "weibo") { + return (); + } else if (acc.providerID === "mobile") { + return (); + }}) + } + + ) + } + render() { + return( +
+
+
+ + + + + + + + +
+
+
+ + + + {this.props.users.map((user) => { + return ( + + + + + + + + + ); + })} + + +
用户名照片数绑定账号最近登陆
{user.nickname}{user.counts.posts}{this.renderAccounts(user.accounts)}{Moment.unix(user.lastSeen / 1000).fromNow()}
+
+ +
Load More
+ +
+ + ) + } +} \ No newline at end of file diff --git a/app/scripts/components/UserList/index.js b/app/scripts/components/UserList/index.js new file mode 100644 index 0000000..3add92f --- /dev/null +++ b/app/scripts/components/UserList/index.js @@ -0,0 +1,20 @@ +import { connect } from 'react-redux' +import UserList from './UserList' + +import { + fetchUser, recommendUser +} from '../../actions/userAction' + +const mapActionCreators = { + fetchUser, + recommendUser +} + +const mapStateToProps = (state) => { + const { users } = state.userReducer.toJS() + return { + users + } +} + +export default connect(mapStateToProps, mapActionCreators)(UserList) \ No newline at end of file diff --git a/app/scripts/reducers/userReducer.js b/app/scripts/reducers/userReducer.js new file mode 100644 index 0000000..fe8fe83 --- /dev/null +++ b/app/scripts/reducers/userReducer.js @@ -0,0 +1,13 @@ +import Immutable from 'immutable' +import { RECEIVE_USER, RECEIVE_USER_NEW } from '../actions/userAction' + +export default (state = Immutable.fromJS({ users: [] }),action)=>{ + switch (action.type) { + case RECEIVE_USER: + return state.updateIn(['users'], (users) => users.concat(Immutable.fromJS(action.res))) + case RECEIVE_USER_NEW: + return state.updateIn(['users'], (users) => users.clear().concat(Immutable.fromJS(action.res))) + default: + return state + } +} \ No newline at end of file diff --git a/app/scripts/routes.js b/app/scripts/routes.js index 0d08832..16bc382 100644 --- a/app/scripts/routes.js +++ b/app/scripts/routes.js @@ -8,14 +8,15 @@ import Home from './components/Home/index' import RecommendHome from './components/RecommendHome/index' import TagList from './components/TagList/index' import ExplorePage from './components/ExplorePage/index' +import UserList from './components/UserList/index' //old // import UserDetail from './components/userdetail' // import Home from './components/home'; // import RecommendHome from './components/recommendhome'; // import ExplorePage from './components/explorepage'; -import UserList from './components/userlist'; -import SkuList from './components/skulist'; // import TagList from './components/taglist'; +// import UserList from './components/userlist'; +import SkuList from './components/skulist'; import StickerList from './components/stickerlist'; import ArticleList from './components/articlelist'; diff --git a/app/scripts/store.js b/app/scripts/store.js index cbede0e..f76c245 100644 --- a/app/scripts/store.js +++ b/app/scripts/store.js @@ -9,6 +9,7 @@ import statsReducer from './reducers/statsReducer' import recommendHomeReducer from './reducers/recommendHomeReducer' import tagReducer from './reducers/tagReducer' import exploreReducer from './reducers/exploreReducer' +import userReducer from './reducers/userReducer' export const makeRootReducer = (asyncReducers) => { return combineReducers({ // Add sync reducers here @@ -19,6 +20,7 @@ export const makeRootReducer = (asyncReducers) => { recommendHomeReducer, tagReducer, exploreReducer, + userReducer, router, ...asyncReducers })