Skip to content

Commit 0c1289a

Browse files
breitningbreitning
committed
add search page
1 parent 74dcdd5 commit 0c1289a

File tree

16 files changed

+277
-153
lines changed

16 files changed

+277
-153
lines changed

‎source/action/search.js

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { createAction } from 'redux-actions';
2+
import * as types from '../constant/actiontype';
3+
import * as searchService from '../service/searchService';
4+
5+
export const searchByKey = createAction(
6+
types.SEARCH_BY_KEY,
7+
async(category, key)=> {
8+
return await searchService.searchByKey(category, key);
9+
},
10+
(category, key)=> {
11+
return {
12+
pending: true,
13+
category,
14+
key
15+
}
16+
}
17+
);
18+
19+
export const clearSearchResult = createAction(
20+
types.CLEAR_SEARCH_RESULT
21+
);

‎source/component/button/single.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ class SingleButton extends Component {
1616
}
1717

1818
renderButtonIcon(){
19-
let { icon = 'ios-return-left-outline' } = this.props;
19+
let { icon = 'ios-arrow-round-back' } = this.props;
2020
return (
2121
<Icon
2222
name={ icon }

‎source/component/navbar.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ class Navbar extends Component {
6666
}
6767

6868
renderLeftContentIcon(){
69-
const { leftIconName = 'ios-return-left-outline' } = this.props;
69+
const { leftIconName = 'ios-arrow-round-back' } = this.props;
7070
if(leftIconName){
7171
if(typeof(leftIconName) === 'string'){
7272
return (

‎source/component/plugin.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ class Plugin extends Component {
2222
if (this.props.common.message.id !== nextProps.common.message.id) {
2323
let message = nextProps.common.message.text;
2424
if (message && typeof message === "string") {
25-
//this.refs.toast.show({message: message});
25+
this.refs.toast.show({message: message});
2626
}
2727
}
2828
}

‎source/component/searchBar.js

Lines changed: 85 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ import {
1010
import Icon from 'react-native-vector-icons/Ionicons';
1111
import PureRenderMixin from 'react-addons-pure-render-mixin';
1212
import { ComponentStyles, CommonStyles, StyleConfig } from '../style';
13-
1413
import { getImageSource } from '../common';
1514

1615
class SearchBar extends Component {
@@ -41,68 +40,112 @@ class SearchBar extends Component {
4140
}
4241
return (
4342
<Image
44-
style={ ComponentStyles.backgroundImage }
45-
source={ {uri: this.backgroundImage} } />
43+
style={[ ComponentStyles.pos_absolute, styles.background]}
44+
source={ this.backgroundImage } />
45+
)
46+
}
47+
48+
renderBackdrop(){
49+
return (
50+
<View style={ [ ComponentStyles.pos_absolute, styles.backdrop] }>
51+
</View>
52+
)
53+
}
54+
55+
renderLeftIcon(){
56+
return (
57+
<TouchableOpacity
58+
style = { [ CommonStyles.p_r_2 ] }
59+
activeOpacity={ StyleConfig.touchable_press_opacity }
60+
onPress={ ()=>{ this.props.router.pop() } }>
61+
<Icon
62+
name={ "ios-arrow-round-back" }
63+
color={ StyleConfig.color_white }
64+
size= { StyleConfig.icon_size } />
65+
</TouchableOpacity>
4666
)
4767
}
4868

49-
renderLeftContent(){
69+
renderSearchInput(){
5070
let { placeholder = '请输入博主名称' } = this.props;
5171
return (
52-
<View style={ ComponentStyles.leftContent }>
53-
<TouchableOpacity
54-
style = { ComponentStyles.iconContainer }
55-
onPress={ ()=>{ this.props.router.pop() } }>
56-
<Icon
57-
name={ "ios-arrow-round-back" }
58-
color={ StyleConfig.foregroundColor }
59-
size= { 22 }
60-
style = { ComponentStyles.icon } />
61-
</TouchableOpacity>
62-
63-
<TextInput
64-
ref="txtSearch"
65-
blurOnSubmit ={true}
66-
onSubmitEditing = { ()=> this.onSearchPress() }
67-
style={ CommonStyles.searchInput }
68-
placeholder ={ placeholder }
69-
placeholderTextColor = { StyleConfig.foregroundColor }
70-
maxLength = { 20 }
71-
underlineColorAndroid = { 'transparent' }
72-
onChangeText={(key) => this.setState({key})}
73-
value={this.state.key} />
74-
</View>
72+
<TextInput
73+
ref="txtSearch"
74+
blurOnSubmit ={true}
75+
onSubmitEditing = { ()=> this.onSearchPress() }
76+
style={ styles.searchInput }
77+
placeholder ={ placeholder }
78+
placeholderTextColor = { StyleConfig.color_light }
79+
maxLength = { 20 }
80+
underlineColorAndroid = { 'transparent' }
81+
onChangeText={(key) => this.setState({key})}
82+
value={this.state.key} />
7583
);
7684
}
7785

78-
renderRightContent(){
86+
renderRightIcon(){
7987
return (
80-
<View style={ ComponentStyles.rightContent }>
81-
<TouchableOpacity
82-
style = { ComponentStyles.iconContainer }
83-
onPress={()=> this.onSearchPress() }>
84-
<Icon
85-
name={ "ios-search-outline" }
86-
color={ StyleConfig.foregroundColor }
87-
size= { 22 }
88-
style={ ComponentStyles.icon }/>
89-
</TouchableOpacity>
90-
</View>
88+
<TouchableOpacity
89+
style = { [ CommonStyles.p_l_2 ] }
90+
activeOpacity={ StyleConfig.touchable_press_opacity }
91+
onPress={()=> this.onSearchPress() }>
92+
<Icon
93+
name={ "ios-search-outline" }
94+
color={ StyleConfig.color_white }
95+
size= { StyleConfig.icon_size }/>
96+
</TouchableOpacity>
9197
);
9298
}
9399

100+
renderContent(){
101+
return (
102+
<View style={[CommonStyles.flexRow, CommonStyles.flexItemsMiddle, CommonStyles.flexItemsBetween, styles.container]}>
103+
{ this.renderLeftIcon() }
104+
{ this.renderSearchInput() }
105+
{ this.renderRightIcon() }
106+
</View>
107+
)
108+
}
109+
94110

95111
render() {
96112
return (
97-
<View style={ ComponentStyles.container }>
113+
<View>
98114
{ this.renderBackground() }
99-
{ this.renderLeftContent() }
100-
{ this.renderRightContent() }
115+
{ this.renderBackdrop() }
116+
{ this.renderContent() }
101117
</View>
102118
)
103119
}
104120
}
105121

122+
const styles = StyleSheet.create({
123+
container: {
124+
flex:1,
125+
height: StyleConfig.navbar_height,
126+
width: StyleConfig.screen_width,
127+
paddingHorizontal: StyleConfig.space_3,
128+
paddingTop: 25
129+
},
130+
background: {
131+
width: StyleConfig.screen_width,
132+
height: StyleConfig.navbar_height,
133+
top:0
134+
},
135+
backdrop:{
136+
top:0,
137+
height: StyleConfig.navbar_height,
138+
width: StyleConfig.screen_width,
139+
backgroundColor: StyleConfig.color_black
140+
},
141+
searchInput: {
142+
flex: 1,
143+
fontSize: StyleConfig.font_sm,
144+
color: StyleConfig.color_white
145+
}
146+
147+
})
148+
106149
export default SearchBar;
107150

108151

‎source/config/api.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,5 +54,10 @@ export default {
5454
author: {
5555
detail: "api/blogs/<%=blogger%>",
5656
posts: "api/blogs/<%=blogger%>/posts?pageIndex=<%=pageIndex%>"
57+
},
58+
search: {
59+
blog: "api/ZzkDocuments/Blog?keyWords=<%=key%>&pageIndex=20",
60+
news: "api/ZzkDocuments/News?keyWords=<%=key%>&pageIndex=20",
61+
kb: "api/ZzkDocuments/KB?keyWords=<%=key%>&pageIndex=20",
5762
}
5863
}

‎source/constant/actiontype.js

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,6 @@ export const FETCH_AUTHOR_DETAIL = 'FETCH_AUTHOR_DETAIL';
1414
export const FETCH_AUTHOR_POSTS_WITHPAGE = 'FETCH_AUTHOR_POSTS_WITHPAGE';
1515
export const FETCH_AUTHOR_POSTS = 'FETCH_AUTHOR_POSTS';
1616

17-
//common
18-
export const SHOW_MESSAGE = 'SHOW_MESSAGE';
19-
2017
//user
2118
export const LOGIN = 'LOGIN';
2219
export const REFRESH_TOKEN = 'REFRESH_TOKEN';
@@ -34,4 +31,11 @@ export const OFFLINE_POST_TO_STORAGE = 'OFFLINE_POST_TO_STORAGE';
3431
export const GET_POSTS_FROM_STORAGE = 'GET_POSTS_FROM_STORAGE';
3532
export const REMOVE_POSTS_IN_STORAGE = 'REMOVE_POSTS_IN_STORAGE';
3633
export const REMOVE_POST_IN_STORAGE = 'REMOVE_POST_IN_STORAGE';
37-
export const GET_POST_FROM_STORAGE = 'GET_POST_FROM_STORAGE';
34+
export const GET_POST_FROM_STORAGE = 'GET_POST_FROM_STORAGE';
35+
36+
//common
37+
export const SHOW_MESSAGE = 'SHOW_MESSAGE';
38+
39+
//search
40+
export const SEARCH_BY_KEY = 'SEARCH_BY_KEY';
41+
export const CLEAR_SEARCH_RESULT = 'CLEAR_SEARCH_RESULT';

‎source/reducer/author.js

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -31,11 +31,6 @@ export default function (state = {}, action) {
3131
posts: state[blogger].posts.concat(payload)
3232
}
3333
};
34-
case types.CLEAR_AUTHOR_SEARCH_RESULT:
35-
return {
36-
...state,
37-
searchs: []
38-
};
3934
default:
4035
return state;
4136
}

‎source/reducer/index.js

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
11
export { default as post } from './post';
22
export { default as postListUI } from './postListUI';
33
export { default as postDetailUI } from './postDetailUI';
4-
54
export { default as author } from './author';
65
export { default as authorUI } from './authorUI';
7-
86
export { default as comment } from './comment';
97
export { default as commentListUI } from './commentListUI';
10-
118
export { default as user } from './user';
129
export { default as userListUI } from './userListUI';
1310
export { default as offline } from './offline';
1411
export { default as common } from './common';
15-
export { default as config } from './config';
12+
export { default as config } from './config';
13+
export { default as search } from './search';
14+
export { default as searchUI } from './searchUI';

‎source/reducer/search.js

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import * as types from '../constant/actiontype';
2+
3+
export default function (state = {}, action) {
4+
5+
const { payload, meta = {}, type, error } = action;
6+
const { sequence = {}, category, key } = meta;
7+
8+
if (sequence.type === 'start' || error) {
9+
return state;
10+
}
11+
12+
switch (type) {
13+
14+
case types.SEARCH_BY_KEY:
15+
return {
16+
...state,
17+
[category]: payload
18+
};
19+
case types.CLEAR_AUTHOR_SEARCH_RESULT:
20+
return {
21+
...state,
22+
[category]: []
23+
};
24+
default:
25+
return state;
26+
}
27+
}

‎source/reducer/searchUI.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import * as types from '../constant/actiontype';
2+
3+
let initialState = {};
4+
5+
["blog", "news", "kb"].map((item)=> {
6+
initialState[item] = {
7+
searchPending: false
8+
}
9+
});
10+
11+
export default function (state = initialState, action) {
12+
13+
const { payload = [], meta={}, type, error } = action;
14+
const { sequence = {}, category, authorId } = meta;
15+
const pendingStatus = sequence.type === 'start';
16+
17+
switch (type) {
18+
case types.SEARCH_BY_KEY:
19+
return {
20+
...state,
21+
[category]: {
22+
...state[category],
23+
searchPending: pendingStatus
24+
}
25+
};
26+
default:
27+
return state;
28+
}
29+
}

‎source/service/searchService.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import _ from 'lodash';
2+
3+
import * as requestService from './request';
4+
import * as Util from '../common';
5+
import { Base64 } from '../common/base64';
6+
import * as storageService from './storage';
7+
import { authData, storageKey, pageSize } from '../config';
8+
import dataApi from '../config/api';
9+
10+
export function searchByKey(category, key){
11+
let params = { key };
12+
let fetchApi = dataApi.search[category];
13+
14+
let strCompiled = _.template(fetchApi);
15+
fetchApi = strCompiled(params);
16+
17+
return requestService.get(fetchApi);
18+
}

‎source/view/question.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -209,9 +209,9 @@ class QuestionPage extends Component {
209209
<Icon
210210
name={ 'ios-return-right' }
211211
size= { StyleConfig.icon_size - 4 }
212-
color={ StyleConfig.color_primary }
212+
color={ StyleConfig.color_danger }
213213
style= {[CommonStyles.m_r_1]}/>
214-
<Text style={[CommonStyles.font_xs, CommonStyles.text_primary]}>
214+
<Text style={[CommonStyles.font_xs, CommonStyles.text_danger]}>
215215
有{answer.CommentCounts}条追问
216216
</Text>
217217
</View>

‎source/view/questionAnswerComment.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ class QuestionAnswerCommentPage extends Component {
9292
renderAnswer(){
9393
let { answer } = this.props;
9494
return (
95-
<View style={[ ComponentStyles.list, CommonStyles.p_b_0 ]}>
95+
<View style={[ ComponentStyles.list, CommonStyles.p_b_0, ComponentStyles.panel_bg ]}>
9696
{ this.renderAnswerHeader(answer) }
9797
{ this.renderAnswerContent(answer) }
9898
</View>
@@ -176,6 +176,12 @@ class QuestionAnswerCommentPage extends Component {
176176
{ this.renderAnswer() }
177177
{ this.renderComments() }
178178
</ScrollView>
179+
180+
<SingleButton
181+
icon = {'ios-text-outline'}
182+
position="right"
183+
color={ StyleConfig.action_color_danger }
184+
onPress = { ()=>this.props.router.pop() }/>
179185

180186
<SingleButton
181187
position="left"

0 commit comments

Comments
 (0)