如何配置前端请求和后端响应(2)
登录接口
前端:
后端控制器:
在My3Controller
@RequestMapping("/login")
public @ResponseBody RestObject login(@RequestBody UserUI userUI){
System.out.println("login方法"+userUI);
RestObject restObject = new RestObject();
restObject.setCode(1);
restObject.setMsg("登录成功!!!");
return restObject;
}
策略研究-市场表现研究-添加新策略接口
前端如何找入口
前端如何修改
后端如何搭建
JavaBean保存数据:SendSellUI
import lombok.Data;
@Data
public class SendSellUI {
private String id; //策略编号
private String name; //策略名称
private String region; //上市区域
private String[] date; //上市时间 (0 开始日期,1 结束日期)
private Double preUpper; //前复权价(最高)
private Double preLower; //前复权价(最低)
private Double chgUpper; //涨跌幅(最高)
private Double chgLower; //涨跌幅(最低)
private Double dealUpper; //成交额(最高)
private Double dealLower; //成交额(最低)
}
My3Controller
@RequestMapping("/sendSell")
public @ResponseBody RestObject sendSell(@RequestBody SendSellUI sendSellUI){
System.out.println("sendSell方法"+sendSellUI);
String randomID = UUID.randomUUID().toString().replaceAll("-", "");
sendSellUI.setId(randomID);
HashMap<String, String> map = new HashMap<>();
map.put("id",randomID);
RestObject restObject = new RestObject();
restObject.setCode(1);
restObject.setMsg("添加策略成功!!!");
restObject.setData(map);
return restObject;
}
策略研究-市场表现研究-策略列表维护
前端如何找入口
还原策略列表
如果在策略添加栏目田间了多个策略,需要删除的简单操作
前端如何修改
后端如何搭建
创建可以数据封装的JavaBean
import lombok.Data;
import java.util.List;
@Data
public class SendSellTableUI {
private String id;
private String name;
private List<SendSellTableItemUI> table;
}
import lombok.Data;
@Data
public class SendSellTableItemUI {
private String label;
private String prop;
private Boolean sortable;
}
My3Controller
//策略列表:模拟通过数据库保存了多个策略
List<SendSellTableUI> SendSellTableUIList = new ArrayList<>();
@RequestMapping("/sendList")
public @ResponseBody RestObject sendList(@RequestBody SendSellTableUI sendSellTableUI){
System.out.println("sendList方法"+sendSellTableUI);
SendSellTableUIList.add(sendSellTableUI);
System.out.println(SendSellTableUIList.size());
RestObject restObject = new RestObject();
restObject.setCode(1);
restObject.setMsg("添加策略成功!!!");
return restObject;
}
策略研究-市场表现研究-列表托管展示
前端如何找入口
前端如何修改
// 请求策略推荐左侧列表接口
export async function leftList() {
//从服务器获取策略列表
let obj = await req.post('/my3/leftList');
//如果服务器有策略列表,向服务器策略列表的头部添加乖离率
if(obj.code==1 && obj.data.length>0){
obj.data.unshift({
"id": '000000',
"name": 'BIAS乖离率推荐',
"table": [{
"label": "股票代码",
"prop": "stockCode",
"sortable": false,
}, {
"label": "股票名",
"sortable": false,
"prop": "name",
}, {
"label": "交易日期",
"sortable": true,
"prop": "date",
}, {
"label": "收盘价",
"sortable": true,
"prop": "closingPrice",
}, {
"label": "乖离率",
"sortable": true,
"prop": "bias",
}]
});
//将最新的策略列表 同步到本地
setStorage('leftList', obj.data);
}
//从浏览器本地获取策略列表的
if (!localStorage['leftList']) {
setStorage('leftList', [{
"id": '000000',
"name": 'BIAS乖离率推荐',
"table": [{
"label": "股票代码",
"prop": "stockCode",
"sortable": false,
}, {
"label": "股票名",
"sortable": false,
"prop": "name",
}, {
"label": "交易日期",
"sortable": true,
"prop": "date",
}, {
"label": "收盘价",
"sortable": true,
"prop": "closingPrice",
}, {
"label": "乖离率",
"sortable": true,
"prop": "bias",
}],
}]);
}
let arr = getStorage('leftList');
return arr;
}
后端如何搭建
@RequestMapping("/leftList")
public @ResponseBody RestObject leftList(){
System.out.println("leftList方法");
RestObject restObject = new RestObject();
restObject.setCode(1);
restObject.setMsg("查询策略列表成功!!!");
restObject.setData(SendSellTableUIList);
return restObject;
}
策略-乖离率推荐-分页
前端如何找入口
分页开始的入口部分:
前端如何修改
使用真数据接口
后端如何搭建
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
@Data
@NoArgsConstructor
@AllArgsConstructor
public class BIASUI {
private String stockCode;
private String name;
private String date;
private String closingPrice;
private String bias;
}
控制器:
//准备模拟分页的数据
private Random random = new Random();
private List<BIASUI> biasuiList = new ArrayList<>(5000);
{
//向集合中,添加5000条数据
for (int i = 0; i <5000 ; i++) {
biasuiList.add(
new BIASUI("SH"+i,"股票"+i,"2000/01/01",random.nextDouble()*10+"",random.nextDouble()+"")
);
}
}
//定义模拟分页的方法
public List<BIASUI> getBiasuiListByPage(Integer pageNum,Integer pageSize){
List<BIASUI> list = new ArrayList<>();
//专门有一个记录个数的变量count
//模拟分页
for (int i = (pageNum-1)*pageSize,count=0; count<pageSize; i++,count++) {
try {
list.add(biasuiList.get(i));
} catch (Exception e) {
//为了防止索引越界异常,出现了该异常,这里就忽略
}
}
return list;
}
@RequestMapping("/gll")
public @ResponseBody RestObject gll(@RequestBody Map<String,Object> map){
System.out.println("gll方法");
System.out.println(map);
//进行模拟分页
List<BIASUI> list = getBiasuiListByPage(Integer.parseInt(map.get("pageNum").toString()), Integer.parseInt(map.get("pageSize").toString()));
HashMap<String, Object> map2 = new HashMap<>();
map2.put("rows",biasuiList.size());
map2.put("list",list);
RestObject restObject = new RestObject();
restObject.setCode(1);
restObject.setMsg("业务成功");
restObject.setData(map2);
return restObject;
}
SpringBoot前后端分离项目之简要配置至此结束!!!