MINIUI后台获取数据

1、jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="root" value="${pageContext.request.contextPath}" />
<%
//本地路径以及上下文
String realPath = "http://" + request.getServerName() + ":" + request.getServerPort()
+ request.getContextPath()
+ request.getServletPath().substring(0, request.getServletPath().lastIndexOf("/") + 1);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

input.mini-textbox {
height: 30px;
}
</style>
</head>
<body>
<input type="button" value="OpenChart" onclick="showChartWindow()" />
<div id="win1" class="mini-window" style="width: 100%; height: 100%;">
<div class="mini-toolbar" style="border-bottom: 0; padding: 1px;">
<span>监控场景：</span> <input id="scene" class="mini-combobox"
name="scene" style="width: 160px;" textField="text" valueField="id"
emptyText="请选择..." url="${root}/data/monitorScene.txt"
allowInput="true" showNullItem="true" nullItemText="请选择..." /> <span>时
间段:</span><input id="startDate" name="startDate" class="mini-datepicker" />
-<input id="endDate" name="endDate" class="mini-datepicker" /> <input
type="button" value="查找" onclick="search()" />
</div>
<div class="mini-fit" style="float: left;" />
<div id="listGrid" class="mini-datagrid" allowResize="true"
style="width: 100%; height: 40%;"
url="${root}/main/getMonitorScene.do" idField="id" multiSelect="true">
<div property="columns">
<div type="indexcolumn" width="10"></div>
<div field="scene" width="120" headerAlign="center"
renderer="onGenderRenderer" allowSort="true">场景描述</div>
<div field="recordNum" width="120" headerAlign="center"
allowSort="true">记录数</div>
</div>
</div>
<div id="chartContainer" style="height: 50%; width: 100%;"></div>
</div>

var listGrid = mini.get("listGrid");
listGrid.load();
function onGenderRenderer(e) {
for (var i = 0, l = Genders.length; i < l; i++) {
var g = Genders[i];
if (g.id == e.value)
return g.text;
}
return "";
}

},
{
name : '<p style="font-size:0.5">' + '提前清贷很久未返回'
+ '</p>',
data : data[2]

},
{
name : '<p style="font-size:0.5">' + '放款中很久未更新'
+ '</p>',
data : data[3]

},
{
name : '<p style="font-size:0.5">' + '复核中订单超过一笔'
+ '</p>',
data : data[4]

} ]
});
}
function showChartWindow() {
getDataForHighcharts();
var win = mini.get("win1");
win.show();
}
showChartWindow();
/**获取柱状图所需数据*/
function getDataForHighcharts() {
debugger;
var name = null;
var categories = [];
$.ajax({
async : false,
cache : false,
type : 'POST',
dataType : "json",
url : '${root}/main/getInterfaceData.do',
success : function(data) {
if (data.length != 0) {
var list1 = new Array();
var list2 = new Array();
var list3 = new Array();
var list4 = new Array();
var list5 = new Array();
var k = 0;
for (var i = 0; i < data.length; i++) {
var data1 = {};
var data2 = {};
var data3 = {};
var data4 = {};
var data5 = {};
data1.y = data[i].decisionOver2Cnt;//次数(y轴)
data2.y = data[i].phoneVerifyCnt;
data3.y = data[i].preRepayCnt;
data4.y = data[i].lendingCnt;
data5.y = data[i].over2ordersCnt;
list1.push(data1);
list2.push(data2);
list3.push(data3);
list4.push(data4);
list5.push(data5);
categories[i] = data[i].date;
}
var datas = new Array();
datas.push(list1);
datas.push(list2);
datas.push(list3);
datas.push(list4);
datas.push(list5);

}
showHighCharts(categories, datas, name);
}
});
}
</script>
</body>
</html>

2、后台代码：

/**
* 柱状图
* @param
* @return
* @throws IOException
*/
@RequestMapping("/getInterfaceData")
@ResponseBody
public List<SceneDisplayEntity> getInterfaceData()throws IOException{
String start = DateFormatUtil.dateToString(new Date());
String end = DateFormatUtil.dateToString(DateFormatUtil.addDays(start, -6));
List<SceneDisplayEntity> list = sceneMonitorService.queySceneCountByTime(start,end);
return list;
}

/**
* 获取最近七天的数据用于矩形图显示
*/
// public List<SceneDisplayEntity> queySceneCountByTime(String date)
// {
// return sceneMonitorRepository.queySceneCountByTime(date);
// }
public List<SceneDisplayEntity> queySceneCountByTime(String start,String end) {
List<SceneDisplayEntity> sceneDisplayList = new ArrayList<SceneDisplayEntity>();
sceneDisplayList = sceneMonitorRepository.queySceneCountByTime(start,end);
List<String> dates = new ArrayList<String>();
dates.add(start);
dates.add(DateFormatUtil.dateToString(DateFormatUtil.addDays(start, -1)));
dates.add(DateFormatUtil.dateToString(DateFormatUtil.addDays(start, -2)));
dates.add(DateFormatUtil.dateToString(DateFormatUtil.addDays(start, -3)));
dates.add(DateFormatUtil.dateToString(DateFormatUtil.addDays(start, -4)));
dates.add(DateFormatUtil.dateToString(DateFormatUtil.addDays(start, -5)));
dates.add(end);

//用于显示矩形的list
List<SceneDisplayEntity> result = new ArrayList<SceneDisplayEntity>();
for (String date:dates){
SceneDisplayEntity sceneDisplay = new SceneDisplayEntity();
sceneDisplay.setDate(date);
for (SceneDisplayEntity entity : sceneDisplayList) {
if(date.equals(entity.getDate())){
if (MonitorScenes.PHONE_NUMBER_VERIFY.getValue().equals(entity.getScene())){//手机认证
sceneDisplay.setPhoneVerifyCnt(entity.getCount());
}else if (MonitorScenes.PRE_REPAY.getValue().equals(entity.getScene())) {//提前清贷很久未返回
sceneDisplay.setPreRepayCnt(entity.getCount());
} else if (MonitorScenes.OVER2ORDERS.getValue().equals(entity.getScene())) {//超过2笔复核中订单
sceneDisplay.setOver2ordersCnt(entity.getCount());
} else if (MonitorScenes.LENDING.getValue().equals(entity.getScene())) {//放款中很久未更新
sceneDisplay.setLendingCnt(entity.getCount());
} else if (MonitorScenes.DECISIONOVER2.getValue().equals(entity.getScene())) {//重复交单
sceneDisplay.setDecisionOver2Cnt(entity.getCount());
}
}
}
result.add(sceneDisplay);
}
return result;
}

---实体类：

package com.vcredit.ddcash.monitor.model.entity;

public class SceneDisplayEntity {
private String scene;
//重复交单量10
private Integer decisionOver2Cnt;
//手机认证量 2
private Integer phoneVerifyCnt;
//提前清贷未返回量6
private Integer preRepayCnt;
//长期放款中 7
private Integer lendingCnt;
//复核中超过一笔订单8
private Integer over2ordersCnt;
//日期
private String date;
private Integer count;
public SceneDisplayEntity() {
// TODO Auto-generated constructor stub
}
public Integer getDecisionOver2Cnt() {
return decisionOver2Cnt;
}
public void setDecisionOver2Cnt(Integer decisionOver2Cnt) {
this.decisionOver2Cnt = decisionOver2Cnt;
}
public Integer getPhoneVerifyCnt() {
return phoneVerifyCnt;
}
public void setPhoneVerifyCnt(Integer phoneVerifyCnt) {
this.phoneVerifyCnt = phoneVerifyCnt;
}
public Integer getPreRepayCnt() {
return preRepayCnt;
}
public void setPreRepayCnt(Integer preRepayCnt) {
this.preRepayCnt = preRepayCnt;
}
public Integer getLendingCnt() {
return lendingCnt;
}
public void setLendingCnt(Integer lendingCnt) {
this.lendingCnt = lendingCnt;
}
public Integer getOver2ordersCnt() {
return over2ordersCnt;
}
public void setOver2ordersCnt(Integer over2ordersCnt) {
this.over2ordersCnt = over2ordersCnt;
}
public String getDate() {
return date;
}
public void setDate(String date) {
this.date = date;
}
public Integer getCount() {
return count;
}
public void setCount(Integer count) {
this.count = count;
}
public String getScene() {
return scene;
}
public void setScene(String scene) {
this.scene = scene;
}

}

---xml:

<select id="queySceneCountByTime" parameterType="java.util.Map" resultType="SceneDisplayEntity">
SELECT
scene,
DATE(create_date) date,
COUNT(1) count
FROM
t_ddq_business_monitor
WHERE DATE(create_date) BETWEEN #{end} AND #{start}
GROUP BY scene, DATE(create_date)
</select>

界面显示：

------生成的list的是7天的数据，所以后台代码根据查询语句做了相应处理；

MINIUI后台获取数据的更多相关文章

Swift - 后台获取数据（Background Fetch）的实现
前面讲了如何让程序申请后台短时运行.但这个额外延长的时间毕竟有限.所以从iOS7起又引入两种在后台运行任务的方式:后台获取和后台通知. 1,后台获取介绍后台获取(Background Fetch)是 ...
ligerUI---下拉菜单(menubar)动态显示(从后台获取数据)
写在前面: ligerui的下拉菜单是有点丑的,这也是没有办法的事........这里主要记录下,如何从后台获取数据进行菜单显示. 有两种方式:1.使用json数组来动态添加 2.字符串拼接. 其 ...
jsTree通过AJAX从后台获取数据
页面代码: <div id="MenuTree"></div> javascript代码: $(document).ready(function ($) { ...
Vue---从后台获取数据vue-resource的使用方法
作为前端人员,在开发过程中,我们大多数情况都需要从后台请求数据,那么在vue中怎样从后台获取数据呢?接下来,我简单介绍一下vue-resource的使用方法,希望对大家有帮助. 一.下载vue-res ...
在Vue中使用了Swiper ，动态从后台获取数据的之后，swiper滑动失效？？
在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效?? 是因为swiper提前初始化了,那时候数据还没有完全出来.这里有两种解决办法 1. 使用vue提供的$nextTic ...
一、表单和ajax中的post请求&&后台获取数据方法
一.表单和ajax中的post请求&&后台获取数据方法最近要做后台数据接收,因为前台传来的数据太过于混乱,所以总结了一下前台数据post请求方法,顺便写了下相对应的后台接收方法. 前 ...
aceAdmin fuelux tree 从后台获取数据，并设置节点ID等属性
如题,从后台封装数据,有两种方式渲染节点的数据: 1.全部节点加载 2.根据父节点加载子节点首先,先介绍下第一种渲染方式: 后台返回数据格式(所有的附加属性,都可放在additionalParame ...
MVC后台获取数据和插入数据的三种方式【二】
MVC模式下,从前端获取数据返回后台,总共有三种形式.下面的代码示例将演示如何将数据返回到后端. 一.首先我们看看表单代码,注意input标签中name的值. <html> <hea ...
vue+vuex+axios从后台获取数据存入vuex，组件之间共享数据
在vue项目中组件间相互传值或者后台获取的数据需要供多个组件使用的情况很多的话,有必要考虑引入vuex来管理这些凌乱的状态,今天这边博文用来记录这一整个的过程,后台api接口是使用webpack-se ...

随机推荐

Android性能优化-App启动优化
原文地址:https://developer.android.com/topic/performance/launch-time.html#common 通常用户期望app响应和加载速度越快越好.一个 ...
【转载】js关闭当前页面(窗口)的几种方式总结
1. 不带任何提示关闭窗口的js代码复制代码代码如下: <a href="javascript:window.opener=null;window.open('','_self'); ...
MySQL 数据的截取，数据清洗
Mysql字符串截取函数SUBSTRING的用法说明函数: 1.从左开始截取字符串 left(str, length) 说明:left(被截取字段,截取长度) 例:select left(conte ...
视频压缩和H264
一.视频压缩 1.1 为什么需要压缩视频? 假设一个2小时未压缩的高清视频,1920×1080p的电影,我们来计算一下他的存储容量.先介绍一下帧率(frame rate或者是 FPS)概念,也就是每秒 ...
ffmpeg主体架构分析
[时间:2016-07] [状态:Open] [关键词:ffmpeg,libavcodec,libavformat] FFmpeg接触几年了,用的比较多的是libavcodec和libavformat ...
[转](OS 10038)在一个非套接字上尝试了一个操作的解决办法
原文: http://blog.csdn.net/zooop/article/details/47170885 可能是安装了某些程序修改了Winsock,使用netsh winsock reset 命 ...
MySql-Binlog协议详解
Reference: https://blog.csdn.net/hj7jay/article/details/56665057?utm_source=blogxgwz7 MySql-Binlog协议 ...
sklearn linear_model,svm,tree,naive bayes,ensemble
sklearn linear_model,svm,tree,naive bayes,ensemble by iris dataset .caret, .dropup > .btn > .c ...
linux下为目录和文件设置权限
摘:linux下为目录和文件设置权限分类: Linux2012-05-09 03:18 7456人阅读评论(1) 收藏举报 linuxwordpressweb数据库serverfile linu ...
【iCore4 双核心板_ARM】例程十二：通用定时器实验——定时点亮LED
实验原理: 通过STM32的三个GPIO口来驱动LED灯的三个通道,设定GPIO为推挽输出模式,采用灌电流的方式与LED连接,输出高电平LED灭,输出低电平LED亮,通过通用定时器TIM3 实现50 ...

MINIUI后台获取数据

MINIUI后台获取数据的更多相关文章

随机推荐

热门专题