我有2个模型一个用于客户,一个用于供应商,我正在尝试制作一个网站,当客户登录时,他们可以使用他们的IP地址搜索并搜索附近的位置,结果将是一些供应商与附近的地址。到目前为止,我计划使用geocoder和gmap4rails gem。我仍然不确定如何使用地理编码器存储供应商地址,以便在客户搜索时,将显示正确的结果。有人可以就如何设计此功能提出建议吗?
答案 0 :(得分:0)
因为你只是在寻找一个" design"而不是代码,我可以概述一下大致的步骤:
ip form submitted =>
查找本地商家的地理数据=>
将地理数据存储在"供应商" model =>
唯一的非标准rails部分是地理查找。
有多种方法可以做到这一点,大多数情况下使用一些外部API。我不认为geocoder
或gmap4rails
宝石具有此功能。
虽然您可能正在使用gmap4rails
作为视图图层,但如果您使用的是geocoder
宝石,我不确定您是否需要session
宝石用于执行供应商查找的服务。这种外部服务可能会完成同样的事情。
至于使用哪种外部服务:我会查看Yelp或Google的一种API。
回应你的评论:
当用户登录时,您可能希望为他们设置import React from 'react';
import ReactDOM from 'react-dom';
var fields = "";
var options = ['one','two','three','four','five','six','seven','eight','nine','Ten','eleven','twelve'];
var SelectOptions = React.createClass({
render:function(){
var options = this.props.options;
return (
<select>
{options.map(function(col,index){
return (
<option key={index} value ={col}> {col} </option>
);
})}
</select>
);
}
});
var PriceMultiply = React.createClass({
render:function(){
return (
<tr>
<td>
Adjust Price Multiply
</td>
<td>
Multiply <SelectOptions options={options} />
</td>
<td>
by <input type="text" name="" />
</td>
<td>
<button className="btn btn-danger" onClick={this.props.removeOperation} > Remove </button>
</td>
</tr>
);
}
});
var PriceAdd = React.createClass({
render:function(){
return (
<tr>
<td>
Adjust Price (Add)
</td>
<td>
Add <input type="text" name="" />
</td>
<td>
to <SelectOptions options={options} />
</td>
<td>
<button className="btn btn-danger" onClick={this.props.removeOperation} > Remove </button>
</td>
</tr>
);
}
});
var ExcludeProducts = React.createClass({
render:function(){
return (
<tr>
<td>
Filter Products (Includes)
</td>
<td>
Exclude Products Where <SelectOptions options={options} />
</td>
<td>
Includes <input type="text" name="" />
</td>
<td>
<button className="btn btn-danger" onClick={this.props.removeOperation} > Remove </button>
</td>
</tr>
);
}
});
var IncludeProducts = React.createClass({
render:function(){
return (
<tr>
<td>
Filter Products (Includes)
</td>
<td>
Exclude Products Where <SelectOptions options={options} />
</td>
<td>
does not equals <input type="text" name="" />
</td>
<td>
<button className="btn btn-danger" onClick={this.props.removeOperation} > Remove </button>
</td>
</tr>
);
}
});
var DynamicFields = React.createClass({
getInitialState:function(){
return {
operations:[]
}
},
removeOperation:function(index){
var operations = this.state.operations;
operations.splice(index,1);
this.setState({operations:operations});
},
addOperation:function(){
var value = this.refs.operationsDropDown.value;
this.setState({operations:this.state.operations.concat([value])});
},
renderAdjustmentRows:function(){
fields = this.state.operations.map((operation,index) =>{
if(operation == "adjust-price-multiply"){
return (<PriceMultiply key={index} removeOperation={this.removeOperation} />);
}else if(operation == "adjust-price-add"){
return (<PriceAdd key={index} removeOperation={this.removeOperation} />);
}else if(operation == "filter-products-includes"){
return (<IncludeProducts key={index} removeOperation={this.removeOperation} />);
}else if(operation == "filter-products-excludes"){
return (<ExcludeProducts key={index} removeOperation={this.removeOperation} />);
}
});
return (
<table>
<tbody>
{fields}
</tbody>
</table>
);
},
render:function(){
return (
<div>
<select className="browser-default" ref="operationsDropDown" id="operations-drop-down">
<option value="adjust-price-multiply"> Adjust Price (Multiply) </option>
<option value="adjust-price-add"> Adjust Price (Add) </option>
<option value="filter-products-includes"> Filter products (Includes) </option>
<option value="filter-products-excludes"> Filter products excludes </option>
</select>
<button onClick={this.addOperation} > Add Operation </button>
<div id="adjust-import-data-rows">
{this.renderAdjustmentRows()}
</div>
</div>
);
}
});
ReactDOM.render(<DynamicFields />,document.getElementById('container'));
Cookie。
没有理由让ip形式&#34;属于&#34;任何用户。提交表单后,您可以从提交表单时遇到的控制器操作中查找当前登录的用户。
如果将供应商数据存储在数据库中,则可以在视图中显示数据。
如果这些概念对您而言是新的,我建议您阅读Rails的详细教程。