From 4bf08deb6d3f974f46ffa226c36805851767eb1c Mon Sep 17 00:00:00 2001 From: 15620693528 <2363140194@qq.com> Date: Wed, 10 Aug 2016 12:42:41 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8F=91=E7=8E=B0=E9=A1=B5=E7=AE=A1=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/scripts/actions/exploreAction.js | 118 ++++++++++++++ .../components/ExplorePage/ExplorePage.jsx | 149 ++++++++++++++++++ app/scripts/components/ExplorePage/index.js | 25 +++ app/scripts/reducers/exploreReducer.js | 47 ++++++ app/scripts/routes.js | 3 +- app/scripts/store.js | 2 + 6 files changed, 343 insertions(+), 1 deletion(-) create mode 100644 app/scripts/actions/exploreAction.js create mode 100644 app/scripts/components/ExplorePage/ExplorePage.jsx create mode 100644 app/scripts/components/ExplorePage/index.js create mode 100644 app/scripts/reducers/exploreReducer.js diff --git a/app/scripts/actions/exploreAction.js b/app/scripts/actions/exploreAction.js new file mode 100644 index 0000000..dccf94b --- /dev/null +++ b/app/scripts/actions/exploreAction.js @@ -0,0 +1,118 @@ +import Request from 'superagent' + +export const RECEIVE_BANNER = 'RECEIVE_BANNER' +export const RECEIVE_THEME = 'RECEIVE_THEME' +export const RECEIVE_THEME_MORE = 'RECEIVE_THEME_MORE' + +export const EP_ADD_BANNER = 'EP_ADD_BANNER' +export const EP_DELETE_BANNER = 'EP_DELETE_BANNER' +export const EP_ADD_THEME = 'EP_ADD_THEME' +export const EP_DELETE_THEME = 'EP_DELETE_THEME' + +function receiveBanner(res) { + return { + type: RECEIVE_BANNER, + res + } +} +function receiveTheme(res) { + return { + type: RECEIVE_THEME, + res + } +} +function receiveThemeMore(res) { + return { + type: RECEIVE_THEME_MORE, + res + } +} +function _addBanner(res) { + return { + type: EP_ADD_BANNER, + res + } +} +function _deleteBanner(id) { + return { + type: EP_DELETE_BANNER, + id + } +} +function _addTheme(res) { + return { + type: EP_ADD_THEME, + res + } +} +function _deleteTheme(id) { + return { + type: EP_DELETE_THEME, + id + } +} +export function fetchBanner() { + return (dispatch) => { + return Request + .get(`/api/banners`) + .end(function(err,res){ + dispatch(receiveBanner(res.body.banners)) + }) + } +} +const status = { + page:0, +} +export function fetchTheme(more) { + more ? ++status.page : (status.page = 0) + return (dispatch) => { + return Request + .get(`/api/themes`) + .query({page:status.page}) + .end(function(err,res){ + more ? dispatch(receiveThemeMore(res.body.themes)) : dispatch(receiveTheme(res.body.themes)) + }) + } +} + +export function addBanner() { + return (dispatch) => { + return Request + .post(`/api/recommend?place=banner`) + .end((err,res) => { + dispatch(_addBanner(res.body)) + }) + } +} + +export function deleteBanner(id) { + return (dispatch) => { + return Request + .del(`/api/recommend/${id}`) + .end((err,res) => { + dispatch(_deleteBanner(id)) + }) + + } +} + +export function addTheme() { + return (dispatch) => { + return Request + .post(`/api/recommend?place=theme`) + .end((err,res) => { + dispatch(_addTheme(res.body)) + }) + } +} + +export function deleteTheme(id) { + return (dispatch) => { + return Request + .del(`/api/recommend/${id}`) + .end((err,res) => { + dispatch(_deleteTheme(id)) + }) + + } +} \ No newline at end of file diff --git a/app/scripts/components/ExplorePage/ExplorePage.jsx b/app/scripts/components/ExplorePage/ExplorePage.jsx new file mode 100644 index 0000000..df16b24 --- /dev/null +++ b/app/scripts/components/ExplorePage/ExplorePage.jsx @@ -0,0 +1,149 @@ +import React,{ Component } from 'react' +import { + Row, Col, Button, ButtonToolbar +} from 'react-bootstrap' +import { Link } from 'react-router' +import If from '../../widgets/if' + + +export default class ExplorePage extends Component{ + constructor(props) { + super(props) + this.state = {} + this.addBanner = this._addBanner.bind(this) + this.deleteBanner = this._deleteBanner.bind(this) + this.addTheme = this._addTheme.bind(this) + this.deleteTheme = this._deleteTheme.bind(this) + this.fetchMoreThemes = () => this.props.fetchTheme(true) + } + componentWillMount() { + this.props.fetchBanner() + this.props.fetchTheme() + } + _addBanner() { + if (confirm('创建一个新Banner？')) { + this.props.addBanner() + } + } + _deleteBanner(id) { + if (confirm('删除这个Banner?')) { + this.props.deleteBanner(id) + } + } + _addTheme() { + if (confirm('创建一个新主题？')) { + this.props.addTheme() + } + } + _deleteTheme(id) { + if (confirm('删除这个主题?')) { + this.props.deleteTheme(id) + } + } + render() { + return( +
+ +

+ Banner管理 { " " } + +

+ +

+ + + {this.props.bannerList.map((banner) => { + return ( + +
+
+

+ {banner.title} +

+
+ + + + + +
+
+
+ +
+
+ + ) + })} + + +

+ +

+ 主题管理 { " " } + +

+ +

+ + + {this.props.themeList.map((theme) => { + return ( + +
+
+

+ {theme.title} +

+
+ + + + + +
+
+
+ +
+
+ + ) + })} + + + +
+ Load More +
+ +
+ ) + } +} \ No newline at end of file diff --git a/app/scripts/components/ExplorePage/index.js b/app/scripts/components/ExplorePage/index.js new file mode 100644 index 0000000..15c5491 --- /dev/null +++ b/app/scripts/components/ExplorePage/index.js @@ -0,0 +1,25 @@ +import { connect } from 'react-redux' +import ExplorePage from './ExplorePage' + +import { + fetchBanner, addBanner, deleteBanner, + fetchTheme, addTheme, deleteTheme +} from '../../actions/exploreAction' +const mapActionCreators = { + fetchBanner, + addBanner, + deleteBanner, + fetchTheme, + addTheme, + deleteTheme, +} + +const mapStateToProps = (state) => { + const { bannerList, themeList } = state.exploreReducer.toJS() + return { + bannerList, + themeList + } +} + +export default connect(mapStateToProps, mapActionCreators)(ExplorePage) \ No newline at end of file diff --git a/app/scripts/reducers/exploreReducer.js b/app/scripts/reducers/exploreReducer.js new file mode 100644 index 0000000..842eb24 --- /dev/null +++ b/app/scripts/reducers/exploreReducer.js @@ -0,0 +1,47 @@ +import Immutable from 'immutable' +import { + RECEIVE_THEME, RECEIVE_THEME_MORE, RECEIVE_BANNER, + EP_ADD_BANNER, + EP_DELETE_BANNER, + EP_ADD_THEME, + EP_DELETE_THEME +} from '../actions/exploreAction' + +export default (state = Immutable.fromJS({ themeList: [],bannerList:[] }),action)=>{ + switch (action.type) { + case RECEIVE_BANNER: + return state.updateIn(['bannerList'],(bannerList) => { + return bannerList.clear().concat(Immutable.fromJS(action.res)) + }) + case EP_ADD_BANNER: + return state.updateIn(['bannerList'],(bannerList) => { + return bannerList.unshift(Immutable.fromJS(action.res)) + }) + case EP_DELETE_BANNER: + return state.updateIn(['bannerList'],(bannerList) => { + return bannerList.delete(bannerList.findKey((banner) => { + return banner.get('id') === action.id + })) + }) + case RECEIVE_THEME: + return state.updateIn(['themeList'],(themeList) => { + return themeList.clear().concat(Immutable.fromJS(action.res)) + }) + case RECEIVE_THEME_MORE: + return state.updateIn(['themeList'],(themeList) => { + return themeList.concat(Immutable.fromJS(action.res)) + }) + case EP_ADD_THEME: + return state.updateIn(['themeList'],(themeList) => { + return themeList.unshift(Immutable.fromJS(action.res)) + }) + case EP_DELETE_THEME: + return state.updateIn(['themeList'],(themeList) => { + return themeList.delete(themeList.findKey((theme) => { + return theme.get('id') === action.id + })) + }) + default: + return state + } +} \ No newline at end of file diff --git a/app/scripts/routes.js b/app/scripts/routes.js index 941653d..0d08832 100644 --- a/app/scripts/routes.js +++ b/app/scripts/routes.js @@ -7,11 +7,12 @@ import UserDetail from './components/UserDetail/index' import Home from './components/Home/index' import RecommendHome from './components/RecommendHome/index' import TagList from './components/TagList/index' +import ExplorePage from './components/ExplorePage/index' //old // import UserDetail from './components/userdetail' // import Home from './components/home'; // import RecommendHome from './components/recommendhome'; -import ExplorePage from './components/explorepage'; +// import ExplorePage from './components/explorepage'; import UserList from './components/userlist'; import SkuList from './components/skulist'; // import TagList from './components/taglist'; diff --git a/app/scripts/store.js b/app/scripts/store.js index 2c41f70..cbede0e 100644 --- a/app/scripts/store.js +++ b/app/scripts/store.js @@ -8,6 +8,7 @@ import userDetailReducer from './reducers/userDetailReducer' import statsReducer from './reducers/statsReducer' import recommendHomeReducer from './reducers/recommendHomeReducer' import tagReducer from './reducers/tagReducer' +import exploreReducer from './reducers/exploreReducer' export const makeRootReducer = (asyncReducers) => { return combineReducers({ // Add sync reducers here @@ -17,6 +18,7 @@ export const makeRootReducer = (asyncReducers) => { statsReducer, recommendHomeReducer, tagReducer, + exploreReducer, router, ...asyncReducers })