Skip to content

Commit c68ab51

Browse files
lh_wanglh_wang
lh_wang
authored and
lh_wang
committed
完成nearby功能
1 parent 7de5632 commit c68ab51

File tree

10 files changed

+200
-168
lines changed

10 files changed

+200
-168
lines changed

‎nearby/.gitignore‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,5 +24,7 @@ project.xcworkspace
2424

2525
# node.js
2626
#
27+
28+
nearby/Info.plist
2729
node_modules/
2830
npm-debug.log

‎nearby/Nearby/index.js‎

Lines changed: 51 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ var Bank = require('./views/bank');
33
var Film = require('./views/film');
44
var Food = require('./views/food');
55
var Toilet = require('./views/toilet');
6+
var Map = require('./views/map');
67

78
var {
89
AppRegistry,
@@ -15,6 +16,11 @@ var {
1516
TabBarIOS
1617
} = React;
1718

19+
//是否开启真实的定位；如果开启了_GEO_OPEN，_GEO_TEST_POS则会失效
20+
_GEO_OPEN = true;
21+
//模拟定位数据
22+
_GEO_TEST_POS = '121.390686,31.213976';
23+
1824
//高亮
1925
StatusBarIOS.setStyle('light-content');
2026
//开启网络状态
@@ -24,7 +30,6 @@ var Nearby = React.createClass({
2430
getInitialState: function(){
2531
return{
2632
selected: '美食'
27-
2833
};
2934
},
3035
render: function() {
@@ -40,11 +45,21 @@ var Nearby = React.createClass({
4045
barTintColor='#007AFF'
4146
titleTextColor="#fff"
4247
tintColor="#fff"
48+
ref="nav_food"
4349
style={styles.container}
4450
initialRoute={{
4551
component: Food,
4652
title: '美食',
47-
rightButtonTitle:'地图',
53+
rightButtonTitle: '地图',
54+
onRightButtonPress: ()=>{
55+
this.refs.nav_food.navigator.push({
56+
title: '地图',
57+
component: Map,
58+
passProps:{
59+
type:'餐饮'
60+
}
61+
});
62+
}
4863
}}
4964
/>
5065
</TabBarIOS.Item>
@@ -59,10 +74,20 @@ var Nearby = React.createClass({
5974
barTintColor='#007AFF'
6075
titleTextColor="#fff"
6176
tintColor="#fff"
77+
ref="nav_film"
6278
initialRoute={{
6379
component: Film,
6480
title: '电影',
65-
rightButtonTitle:'地图',
81+
rightButtonTitle: '地图',
82+
onRightButtonPress: ()=>{
83+
this.refs.nav_film.navigator.push({
84+
title: '地图',
85+
component: Map,
86+
passProps:{
87+
type:'电影院'
88+
}
89+
});
90+
}
6691
}}
6792
/>
6893
</TabBarIOS.Item>
@@ -77,10 +102,21 @@ var Nearby = React.createClass({
77102
barTintColor='#007AFF'
78103
titleTextColor="#fff"
79104
tintColor="#fff"
105+
ref="nav_bank"
80106
initialRoute={{
81107
component: Bank,
82108
title: '银行',
83-
rightButtonTitle:'地图',
109+
rightButtonTitle: '地图',
110+
onRightButtonPress: ()=>{
111+
this.refs.nav_bank.navigator.push({
112+
title: '地图',
113+
component: Map,
114+
passProps:{
115+
type:'银行'
116+
}
117+
});
118+
}
119+
84120
}}
85121
/>
86122
</TabBarIOS.Item>
@@ -95,11 +131,20 @@ var Nearby = React.createClass({
95131
barTintColor='#007AFF'
96132
titleTextColor="#fff"
97133
tintColor="#fff"
134+
ref="nav_toilet"
98135
initialRoute={{
99136
component: Toilet,
100137
title: '卫生间',
101-
rightButtonTitle:'地图',
102-
onRightButtonPress: function(){alert(0)}
138+
rightButtonTitle: '地图',
139+
onRightButtonPress: ()=>{
140+
this.refs.nav_toilet.navigator.push({
141+
title: '地图',
142+
component: Map,
143+
passProps:{
144+
type:'厕所'
145+
}
146+
});
147+
}
103148
}}
104149
/>
105150
</TabBarIOS.Item>

‎nearby/Nearby/views/detail.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -23,10 +23,6 @@ var FoodDetail = React.createClass({
2323
{this.state.data?
2424
<View style={styles.content}>
2525
<Text style={styles.name}>{this.state.data.name}</Text>
26-
<Text style={styles.tag}>
27-
菜品：
28-
{this.state.data.tag}
29-
</Text>
3026
<Text style={styles.types}>
3127
类型：
3228
{this.state.data.type}
@@ -35,6 +31,10 @@ var FoodDetail = React.createClass({
3531
地址：
3632
{this.state.data.address}
3733
</Text>
34+
<Text style={styles.tag}>
35+
标签：
36+
{this.state.data.tag}
37+
</Text>
3838
<Text style={styles.server}>
3939
服务：
4040
{this.state.data.server}

‎nearby/Nearby/views/list.js‎

Lines changed: 48 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
var React = require('react-native');
2+
var Geolocation = require('Geolocation');
23
var Util = require('./util');
34
var Detail = require('./detail');
45

@@ -11,7 +12,9 @@ var {
1112
ActivityIndicatorIOS,
1213
TouchableOpacity,
1314
LinkingIOS,
14-
ActionSheetIOS
15+
ActionSheetIOS,
16+
WebView,
17+
AsyncStorage
1518
} = React;
1619

1720
var List = React.createClass({
@@ -54,10 +57,11 @@ var List = React.createClass({
5457
);
5558
}
5659
}
60+
var placeholder = '搜索' + this.props.type;
5761
return (
5862
<ScrollView style={styles.container}>
5963
<View style={styles.searchBg}>
60-
<TextInput style={styles.input} placeholder="搜索美食"
64+
<TextInput style={styles.input} placeholder={placeholder}
6165
onChangeText={this._onChangeText}
6266
onEndEditing={this._onEndEditing}/>
6367
<View>
@@ -75,12 +79,30 @@ var List = React.createClass({
7579
);
7680
},
7781
componentDidMount: function(){
78-
var url = Util.searchURL + 'key=' + Util.amapKey + '&keywords='
79-
+ this.props.type + '&location=121.390686,31.213976&extensions=base';
82+
var that = this;
83+
Geolocation.getCurrentPosition(function(data){
84+
var lnglat = data.coords.longitude + ',' + data.coords.latitude;
85+
AsyncStorage.setItem('pos', lnglat);
86+
var url = Util.searchURL + 'key=' + Util.amapKey + '&keywords='
87+
+ that.props.type + '&extensions=base';
88+
if(_GEO_OPEN){
89+
url += '&location=' + lnglat;
90+
that._doGetData(url);
91+
}else{
92+
url += '&location=' + _GEO_TEST_POS;
93+
that._doGetData(url);
94+
}
95+
}, function(err){
96+
alert('定位失败，请重新开启应用定位');
97+
});
98+
},
99+
100+
_doGetData: function(url){
80101
var that = this;
81102
Util.getJSON(url, function(data){
82103
if(data.status && data.info === 'OK'){
83104
var count = data.pois.length > 10? 10: data.pois.length;
105+
that._addStorage(data);
84106
that.setState({
85107
list: data.pois,
86108
count: count
@@ -110,27 +132,37 @@ var List = React.createClass({
110132
_onEndEditing: function(){
111133
var that = this;
112134
var keywords = this.state.keywords;
113-
114135
var url = Util.searchURL + 'key=' + Util.amapKey + '&keywords='
115-
+ keywords + '&types=' + that.props.type
116-
+ '&location=121.390686,31.213976&extensions=base';
117-
console.log(url);
136+
+ keywords + '&types=' + that.props.type + '&extensions=base';
118137
that.setState({
119138
list: null
120139
});
121-
Util.getJSON(url, function(data){
122-
if(data.status && data.info === 'OK' && data.pois.length){
123-
var count = data.pois.length > 10? 10: data.pois.length;
124-
that.setState({
125-
list: data.pois,
126-
count: count
127-
});
140+
AsyncStorage.getItem('pos', function(err, result){
141+
if(_GEO_OPEN){
142+
if(!err){
143+
url += '&location=' + result;
144+
that._doGetData(url);
145+
}else{
146+
alert('定位失败');
147+
}
128148
}else{
129-
alert('没有查询到相应的数据');
149+
url += '&location=' + _GEO_TEST_POS;
150+
that._doGetData(url);
130151
}
131152
});
132153
},
133154

155+
//添加到本地存储
156+
_addStorage: function(data){
157+
var posArr = [];
158+
var len = data.pois.length > 10? 10: data.pois.length;
159+
for(var i = 0; i < len; i++){
160+
posArr.push(data.pois[i].location);
161+
}
162+
var posStr = posArr.join(',');
163+
AsyncStorage.setItem('_' + this.props.type , posStr);
164+
},
165+
134166
//拨打电话
135167
_call: function(tel){
136168
if(tel.length){

‎nearby/Nearby/views/map.js‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
2+
var React = require('react-native');
3+
var {
4+
View,
5+
Text,
6+
WebView,
7+
AsyncStorage
8+
} = React;
9+
10+
var Map = React.createClass({
11+
getInitialState: function(){
12+
return{
13+
url: null
14+
};
15+
},
16+
render: function(){
17+
var webView = null;
18+
if(this.state.url){
19+
webView = <WebView url={this.state.url}/>
20+
}
21+
return(
22+
<View style={{flex:1}}>
23+
{webView}
24+
</View>
25+
);
26+
},
27+
componentDidMount: function(){
28+
var that = this;
29+
AsyncStorage.multiGet(['_' + that.props.type, 'pos'], function(err, result){
30+
if(!err){
31+
var pos = result[1][1];
32+
var markers = result[0][1];
33+
var url = 'http://vczero.github.io/webview/index.html?';
34+
if(_GEO_OPEN){
35+
url += 'pos=' + pos + '&markers=' + markers;
36+
}else{
37+
url += 'pos=' + _GEO_TEST_POS + '6&markers=' + markers;
38+
}
39+
that.setState({
40+
url: url
41+
});
42+
}else{
43+
alert('定位失败');
44+
}
45+
});
46+
}
47+
});
48+
49+
50+
module.exports = Map;

‎nearby/Nearby/views/toilet.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ var List = require('./list');
44
var Toilet = React.createClass({
55
render: function(){
66
return(
7-
<List type="卫生间" nav={this.props.navigator}/>
7+
<List type="厕所" nav={this.props.navigator}/>
88
);
99
}
1010
});

‎nearby/ios/main.jsbundle‎

Lines changed: 19 additions & 8 deletions
Large diffs are not rendered by default.

0 commit comments

Comments
 (0)