查询结果使用折线图来显示
使用折线图来显示查询结果
一、. 首先需要进行查询，先拿到数据；
废话不多说直接上代码
实体类
package com.ultrapower.life.entity;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import com.fasterxml.jackson.annotation.JsonFormat;
import com.ultrapower.life.base.model.BaseEntity;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.EqualsAndHashCode;
import lombok.NoArgsConstructor;
import lombok.experimental.Accessors;
import org.apache.ibatis.type.Alias;
import java.math.BigDecimal;
import java.time.LocalDateTime;
@Data
@AllArgsConstructor
@NoArgsConstructor
@EqualsAndHashCode(callSuper = false)
@Accessors(chain = true)
@TableName("wx_product")
@Alias(value = "WxProduct")
public class WxProduct extends BaseEntity {
private static final long serialVersionUID = 1L;
@TableId(value = "id", type = IdType.AUTO)
private Integer id;
/**
* 产品名称
*/
private String productName;
/**
* logo
*/
private String productLogo;
/**
* 产品描述信息
*/
private String productDesc;
/**
* 产品价格
*/
private BigDecimal productPrice;
/**
* 定图
*/
private String topLogo;
/**
* 缴费方式
*/
private String paymentStyle;
/**
* 缴费期限
*/
private String paymentPeriod;
/**
* 保险期限
*/
private String insurancePeriod;
/**
* 保险金额
*/
private String insuranceMoney;
/**
* 是否检查职业
*/
private String isCheckCareer;
/**
* 产品特色
*/
private String productFeature;
/**
* 保险职责
*/
private String insuranceDuty;
/**
* 公司介绍
*/
private String companyProfile;
/**
* 被保人告知信息 存储信息的Id
*/
private String informInfo;
/**
* 0 上架 1下架
*/
private String status;
private String createBy;
private String updateBy;
/**
* 险种代码
*/
private String riskCode;
/**
* 创建时间
*/
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
@TableField("CREATE_TIME")
private LocalDateTime createTime;
/**
* 更新时间
*/
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
@TableField("CREATE_TIME")
private LocalDateTime updateTime;
}
DTO
package com.ultrapower.life.admin.dto;
import lombok.Data;
/**
* @author wuyongchang
* @create 2019-10-17 15:21
*/
@Data
public class WxProductStatisticsDto {
private Integer channelId;
private int pageSize;
private int pageNum;
}
VO
package com.ultrapower.life.admin.vo;
import lombok.Data;
@Data
public class WxProductStatisticsVo {
private Long id;
//产品名称
private String productName;
//数量
private String counts;
}
查询接口
/**
* @desc 产品统计
* @param wxProductStatisticsDto
* @return
*/
PageInfo getList(WxProductStatisticsDto wxProductStatisticsDto, TimeSetting timeSetting);
/**
* @desc 产品统计折线图查询
* @param format
* @param trendType
* @return
*/
List<WxProductStatisticsVo> browseCount(String format, String trendType);
查询实现类
/**
* @param wxProductStatisticsDto
* @param timeSetting
* @return
* @desc 产品统计
*/
@Override
public PageInfo getList(WxProductStatisticsDto wxProductStatisticsDto, TimeSetting timeSetting) {
PageHelper.startPage(wxProductStatisticsDto.getPageNum(), wxProductStatisticsDto.getPageSize());
Integer channelId = wxProductStatisticsDto.getChannelId();
String starTime = timeSetting.getStartTime();
String endTime = timeSetting.getEndTime();
List<WxProductVo> list_wxproduct = new ArrayList<>();
List<WxOpBehavior> list = wxOpBehaviorMapper.getList(channelId, starTime, endTime);
Integer a=0;//浏览量
Integer b=0;//ip量
Integer c=0;//新iP
Integer d=0;//成单量
Double e=0.00;//成交总额
for(WxOpBehavior wxOpBehavior:list){
WxProductVo wxProductVo = FlowMonitoringUtil.getWxProductUtil(wxOpBehavior);
list_wxproduct.add(wxProductVo);
a+=wxOpBehavior.getShowCount();
b+=wxOpBehavior.getIpCount();
c+=wxOpBehavior.getNewIp();
d+=wxOpBehavior.getOrderCount();
e+=Double.parseDouble(wxOpBehavior.getPayMoney());
}
WxProductVo wxProductVos=new WxProductVo();
wxProductVos.setProductName("总计");
wxProductVos.setShowCount(a);
wxProductVos.setIpCount(b);
wxProductVos.setNewIp(c);
wxProductVos.setOrderCount(d);
wxProductVos.setPayMoney(e+"");
list_wxproduct.add(wxProductVos);
PageInfo pageInfo = new PageInfo(list_wxproduct);
return pageInfo;
}
/**
* @param format
* @param trendType
* @return
* @desc 产品统计折线图查询
*/
@Override
public List<WxProductStatisticsVo> browseCount(String format, String trendType) {
List<WxOpBehavior> list;
List<WxProductStatisticsVo> list_wxProduct = new ArrayList<>();
if ("1".equals(trendType)) {
list = wxOpBehaviorMapper.browseCount(format);
for (WxOpBehavior wxOpBehavior : list) {
WxProductStatisticsVo wxProductStatisticsVos = FlowMonitoringUtil.getWxProductStatisticsUtil(wxOpBehavior);
wxProductStatisticsVos.setCounts(wxOpBehavior.getShowCount()+"");
list_wxProduct.add(wxProductStatisticsVos);
}
return list_wxProduct;
} else if ("2".equals(trendType)) {
list = wxOpBehaviorMapper.newIp(format);
for (WxOpBehavior wxOpBehavior : list) {
WxProductStatisticsVo wxProductStatisticsVos = FlowMonitoringUtil.getWxProductStatisticsUtil(wxOpBehavior);
wxProductStatisticsVos.setCounts(wxOpBehavior.getIpCount()+"");
list_wxProduct.add(wxProductStatisticsVos);
}
return list_wxProduct;
} else if ("3".equals(trendType)) {
list = wxOpBehaviorMapper.newIp(format);
for (WxOpBehavior wxOpBehavior : list) {
WxProductStatisticsVo wxProductStatisticsVos = FlowMonitoringUtil.getWxProductStatisticsUtil(wxOpBehavior);
wxProductStatisticsVos.setCounts(wxOpBehavior.getNewIp()+"");
list_wxProduct.add(wxProductStatisticsVos);
}
return list_wxProduct;
} else if ("4".equals(trendType)) {
list = wxOpBehaviorMapper.orderCount(format);
for (WxOpBehavior wxOpBehavior : list) {
WxProductStatisticsVo wxProductStatisticsVos = FlowMonitoringUtil.getWxProductStatisticsUtil(wxOpBehavior);
wxProductStatisticsVos.setCounts(wxOpBehavior.getOrderCount()+"");
list_wxProduct.add(wxProductStatisticsVos);
}
return list_wxProduct;
}else if ("5".equals(trendType)){
list = wxOpBehaviorMapper.orderCount(format);
for (WxOpBehavior wxOpBehavior : list) {
WxProductStatisticsVo wxProductStatisticsVos = FlowMonitoringUtil.getWxProductStatisticsUtil(wxOpBehavior);
wxProductStatisticsVos.setCounts(wxOpBehavior.getPayMoney());
list_wxProduct.add(wxProductStatisticsVos);
}
return list_wxProduct;
}
return new ArrayList<>();
}
mapper 接口
/**
* @desc 浏览量
* @param format
* @return
*/
List browseCount(@Param("format") String format);
List newIp(@Param("format")String format);
List orderCount(@Param("format")String format);
mapper xml
<!--产品统计-->
<select id="getList" resultMap="BaseResultMap">
select
A.id,
A.product_name ,
ifnull(B.showCount,0) as showCount,
ifnull( D.ipCount,0) as ipCount,
ifnull( D.newIp,0)as newIp,
ifnull(C.orderCount,0)as orderCount,
ifnull(C.payMoney,0)as payMoney
/* B.showCount,
D.ipCount,
D.newIp,
C.orderCount,
C.payMoney*/
FROM (select id,product_name,riskCode
FROM wx_product
WHERE id in (select product_id
FROM wx_op_behavior
WHERE product_id is not NULL GROUP BY product_id))A
left join (select product_id,count(*)as showcount
from wx_op_behavior
<where>
<if test="channelId != null and channelId != ''">and channel_id =#{channelId}</if>
<if test="startTime!=null">and TO_DAYS (create_time) >=TO_DAYS(#{startTime})</if>
<if test="endTime!=null">and TO_DAYS (create_time) <=TO_DAYS(#{endTime})</if>
AND product_id is not NULL GROUP BY product_id
</where>
) B on A.id=B.product_id
left join (select product_id,count(*)as ipCount,COUNT(DISTINCT ops_ip) as newip
from wx_op_behavior
<where>
<if test="channelId != null and channelId != ''">and channel_id =#{channelId}</if>
<if test="startTime!=null">and TO_DAYS (create_time) >=TO_DAYS(#{startTime})</if>
<if test="endTime!=null">and TO_DAYS (create_time) <=TO_DAYS(#{endTime})</if>
AND product_id is not NULL and ops_ip is not null and ops_ip <>'' GROUP BY product_id
</where>
)D on A.id=D.product_id
LEFT JOIN (select riskCode,COUNT(*) ordercount,sum(pay_money) paymoney
FROM wx_order where status!=5 and user_id in(select id from wx_user
<where>
<if test="channelId != null and channelId != ''">and channel_id =#{channelId}</if>
</where>
)
<if test="startTime!=null">and TO_DAYS (create_time) >=TO_DAYS(#{startTime})</if>
<if test="endTime!=null">and TO_DAYS (create_time) <=TO_DAYS(#{endTime})</if>
GROUP BY riskCode)C
ON A.riskCode=C.riskCode
</select>
<!--浏览量-->
<select id="browseCount" resultMap="BaseResultMap">
select A.id,IFNULL(B.showCount,0) as showCount,
A.product_name
FROM (select id,product_name,riskCode
FROM wx_product
WHERE id in (select product_id
FROM wx_op_behavior
WHERE product_id is not NULL GROUP BY product_id))A
LEFT JOIN (select product_id,count(*)as showcount,COUNT(DISTINCT ops_ip) as newip
FROM wx_op_behavior
<where>
<if test="format != null and format != ''">and wx_op_behavior.create_day =#{format}</if>
and product_id is not NULL GROUP BY product_id
</where>
) B ON A.id=B.product_id
</select>
<!--ip量,新IP量-->
<select id="newIp" resultMap="BaseResultMap">
select A.id,IFNULL(B.newip,0) as newip,IFNULL(B.ipCount,0) as ipCount,
A.product_name
FROM (select id,product_name,riskCode
FROM wx_product
WHERE id in (select product_id
FROM wx_op_behavior
WHERE product_id is not NULL GROUP BY product_id))A
LEFT JOIN (select product_id,count(*)as ipCount,COUNT(DISTINCT ops_ip) as newip
FROM wx_op_behavior
<where>
<if test="format != null and format != ''">and wx_op_behavior.create_day =#{format}</if>
and product_id is not NULL and ops_ip is not NULL and ops_ip <>'' GROUP BY product_id
</where>
) B ON A.id=B.product_id
</select>
<!--成单--><!--成交总额-->
<select id="orderCount" resultMap="BaseResultMap">
select A.id, A.product_name ,IFNULL(C.orderCount,0)as orderCount,IFNULL(C.payMoney,0)AS payMoney
FROM (select id,product_name,riskCode
FROM wx_product
WHERE id in (select product_id
FROM wx_op_behavior
WHERE product_id is not NULL GROUP BY product_id))A
LEFT JOIN (select product_id,count(*)as showcount,COUNT(DISTINCT ops_ip) as newip
FROM wx_op_behavior
WHERE product_id is not NULL GROUP BY product_id ) B
ON A.id=B.product_id
LEFT JOIN (select riskCode,COUNT(*) ordercount,sum(pay_money) paymoney
FROM wx_order
<where>
<if test="format != null and format != ''">and wx_order.create_day =#{format}</if>
and status!=5 and user_id in(select id FROM wx_user) GROUP BY riskCode
</where>
)C ON A.riskCode=C.riskCode
</select>
<!--今天流量监控-->
<select id="getDayFlowMonitoring" resultMap="BaseResultMap">
select
IFNULL(ipCount,0) as ipCount,
IFNULL(showcount,0) as showcount,
IFNULL(premiumCalculatedCount,0)as premiumCalculatedCount,
IFNULL(lickToBuyCount,0)as lickToBuyCount,
IFNULL(informationSubmittedCount,0)as informationSubmittedCount,
IFNULL(healthToldCount,0)as healthToldCount,
IFNULL(paymentCount,0)as paymentCount,
IFNULL(underwritingFailedCount,0)as underwritingFailedCount,
IFNULL(dialogueSalesmanCount,0)as dialogueSalesmanCount,
IFNULL(callSalesmanCount,0)as callSalesmanCount,
IFNULL(pushSalesmanCount,0)as pushSalesmanCount
from
(select count(*)as ipCount from wx_op_behavior where ops_ip is not null and ops_ip <>'' and to_days(create_day) = to_days(now()))a
,
(select count(*)as showcount from wx_op_behavior where to_days(create_day) = to_days(now()))b
,
(select count(*) as premiumCalculatedCount from wx_op_behavior WHERE behavior=4001 and to_days(create_day) = to_days(now()))c
,
(select count(*) as lickToBuyCount from wx_op_behavior where behavior=4002 and to_days(create_day) = to_days(now()))d
,
(select count(*)as informationSubmittedCount from wx_op_behavior WHERE behavior=4004 and to_days(create_day) = to_days(now()))e
,
(select count(*)as healthToldCount from wx_op_behavior where behavior=4006 and to_days(create_day) = to_days(now()))f
,
(select count(*)as paymentCount from wx_op_behavior where behavior=4011 and to_days(create_day) = to_days(now()))j
,
(select count(*)as underwritingFailedCount from wx_op_behavior where behavior=4008 and to_days(create_day) = to_days(now()))h
,
(select count(*)as dialogueSalesmanCount from wx_op_behavior where behavior=4014 and to_days(create_day) = to_days(now()))i
,
(select count(*)as callSalesmanCount from wx_op_behavior WHERE behavior=4015 and to_days(create_day) = to_days(now()))g
,
(SELECT SUM(pushSalesmanCount) as pushSalesmanCount from ( SELECT COUNT(DISTINCT user_id) as pushSalesmanCount from wx_op_behavior o where (o.behavior=4014 or o.behavior=4015) and to_days(create_day) = to_days(now()) GROUP BY create_day)a)k
</select>
controller
package com.ultrapower.life.admin.controller;
import com.github.pagehelper.PageInfo;
import com.ultrapower.life.admin.dto.TimeSetting;
import com.ultrapower.life.admin.dto.WxProductStatisticsDto;
import com.ultrapower.life.admin.service.WxChannelService;
import com.ultrapower.life.admin.service.WxOpBehaviorService;
import com.ultrapower.life.admin.util.GetDay;
import com.ultrapower.life.admin.vo.WxProductStatisticsVo;
import com.ultrapower.life.admin.vo.WxProductVo;
import com.ultrapower.life.core.result.R;
import com.ultrapower.life.entity.WxChannel;
import com.ultrapower.life.entity.WxOpBehavior;
import lombok.extern.slf4j.Slf4j;
import org.apache.shiro.authz.annotation.RequiresPermissions;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.*;
import static com.ultrapower.life.admin.util.GetDay.findDates;
/**
* @desc 产品统计
* @author wuyongchang
* @create 2019-10-17 15:08
*/
@Slf4j
@Controller
@RequestMapping("/admin/wxProductStatistics")
public class WxProductStatisticsController {
private static final String CAR_PRIFX="sys/WxProductStatistics";
@Autowired
WxOpBehaviorService wxOpBehaviorService;
@Autowired
WxChannelService wxChannelService;
@RequiresPermissions("sys:wxProductStatistics:wxProductStatistics")
@RequestMapping()
public String wxProductStatistics(Model model){
List<WxChannel>channel=wxChannelService.queryList();
model.addAttribute("channel",channel);
return CAR_PRIFX+"/WxProductStatistics";
}
//产品统计首页
@RequiresPermissions("sys:wxProductStatistics:wxProductStatistics")
@GetMapping("/query")
@ResponseBody()
public R query(WxProductStatisticsDto wxProductStatisticsDto, TimeSetting timeSetting) {
PageInfo pageInfo=wxOpBehaviorService.getList(wxProductStatisticsDto,timeSetting);
List<WxProductVo> list=pageInfo.getList();
Map<String,Object> map=new HashMap<>();
map.put("total",pageInfo.getTotal());
map.put("rows",list);
return R.ok(map);
}
/**
* @desc 产品折线图数据查询
* @param trendType
* @return
*/
@RequestMapping("/costTrend")
@ResponseBody
public R getCostTrend(String trendType) throws ParseException {
R<List> resultUtil = R.ok();
String yz_time= (String) GetDay.getTimeInterval(new Date());//获取本周时间
String array[]=yz_time.split(",");
String start_time=array[0];//第一天
String end_time=array[1]; //最后一天
//格式化日期
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
Date dBegin = sdf.parse(start_time);
Date dEnd = sdf.parse(end_time);
List<Date> lDate = findDates(dBegin, dEnd);//获取这周所有date
List<Map<String,Object>> list=new ArrayList<>();
for (Date date : lDate)
{
Map<String,Object> map = new TreeMap<>();
List<WxProductStatisticsVo> showCount = wxOpBehaviorService.browseCount(sdf.format(date),trendType);
map.put("date",sdf.format(date));
map.put("datas",showCount);
list.add(map);
}
log.info("返回结果",list);
return R.ok(list);
}
}
前台页面
<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include::header"></head>
<link rel="stylesheet" type="text/css" href="/css/plugins/datapicker/daterangepicker.css">
<style>
.tab-content-charts{
margin-bottom: 50px;
}
</style>
<body class="gray-bg">
<div class="wrapper wrapper-content">
<a href="#">系统管理</a>-><a th:href="@{/admin/wxProductStatistics}">产品统计</a>
</div>
<div class="wrapper wrapper-content ">
<div class="col-sm-12">
<div class="columns pull-right col-md-2 nopadding">
<select class="form-control" id="trendType">
<option th:text="浏览量" th:value="1"></option>
<option th:text="Ip量" th:value="2"></option>
<option th:text="独立新Ip" th:value="3"></option>
<option th:text="成单" th:value="4"></option>
<option th:text="成交总额" th:value="5"></option>
</select>
</div>
<div class="ibox">
<div class="ibox-body">
<!--echarts-->
<div class="tab-content-charts">
<div id="costChart" style="width:100%;height:300px" ></div>
</div>
</div>
<div class="columns pull-right">
<button class="btn btn-success" onclick="reLoad()">查询</button>
</div>
<div class="columns pull-right col-md-2 nopadding">
<select class="form-control" id="channelId" name="city">
<option value="">渠道名称</option>
<option th:each="a:${channel}" th:value="${a.id}" th:text="${a.channelName}"></option>
</select>
</div>
<div class="columns pull-right col-md-2 nopadding">
<input placeholder="请选择时间" id="daterange" type="text" class="form-control">
</div>
<table id="exampleTable" data-mobile-responsive="true"></table>
</div>
</div>
</div>
</div>
</div>
<div th:include="include :: footer"></div>
<script src="/js/plugins/jquery-ui/jquery-ui.min.js"></script>
<script src="/js/plugins/fullcalendar/moment.min.js"></script>
<script src="/js/plugins/datapicker/daterangepicker.js"></script>
<script type="text/javascript" src="/js/appjs/sys/WxProductStatistics/WxproductCostChart.js"></script>
<script type="text/javascript" src="/js/appjs/sys/WxProductStatistics/WxProductStatistics.js"></script>
</body>
</html>
js代码 static/js/appjs/sys/WxProductStatistics/WxproductCostChart.js
var lineChart = echarts.init(document.getElementById('costChart'));
var chartConfig;
$(function () {
loadChart();
});
function loadChart() {
var trendType = $("#trendType option:selected").val();
$.ajax({
url:'/admin/wxProductStatistics/costTrend',
type: 'post',
data:{
trendType:trendType
},
success:function (data) {
if(data.code==0){
loadData(data.data);
lineChart.setOption(chartConfig);
}
}
})
}
$("select#trendType").change(function () {
loadChart()
});
var loadData=function(data) {
var objData = []
var nameList = []
var datesList = []
data.forEach(function(item){
datesList.push(item.date)
item.datas.forEach(function(list){
var name = list.productName
var index = nameList.indexOf(name)
if (index === -1) {
nameList.push(name)
var obj = {
name: name,
type: "line",
data: [list.counts]
}
objData.push(obj)
} else {
objData[index].data.push(list.counts)
}
})
})
chartConfig = {
tooltip: {
trigger: 'axis'
},
series: objData,
legend: {
data:nameList
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: datesList
},
yAxis: {
type: 'value'
}
}
}
static/js/appjs/sys/WxProductStatistics/WxProductStatistics.js
var prefix = "/admin/wxProductStatistics"
var startTime;
var endTime;
$(function() {
load();
});
Date.prototype.format = function(format){
var o = {
"M+" : this.getMonth()+1, //month
"d+" : this.getDate(), //day
"H+" : this.getHours(), //hour
"m+" : this.getMinutes(), //minute
"s+" : this.getSeconds(), //second
"q+" : Math.floor((this.getMonth()+3)/3), //quarter
"S" : this.getMilliseconds() //millisecond
}
if(/(y+)/.test(format)) {
format = format.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
}
for(var k in o) {
if(new RegExp("("+ k +")").test(format)) {
format = format.replace(RegExp.$1, RegExp.$1.length==1 ? o[k] : ("00"+ o[k]).substr((""+ o[k]).length));
}
}
return format;
}
function load() {
/*var userName = $('#userName').val();
var loginName = $('#loginName').val();
console.log(loginName);*/
$("#exampleTable").bootstrapTable('destroy');//先销毁
$('#exampleTable')
.bootstrapTable(
{
method : 'get',
url : prefix + "/query",//请求路径
//dataField: "data",//这是返回的json数组的key.默认好像是"rows".这里只有前后端约定好就行
// sortable: true,
dataType : "json", // 服务器返回的数据类型
iconSize: 'outline',
striped : true, //是否显示行间隔色
pageNumber : 1, //初始化加载第一页
pagination : true,//是否分页
sidePagination : 'server',//server:服务器端分页|client：前端分页
pageSize : 10,//单页记录数
pageList : [ 5, 10, 20, 30 ],//可选择单页记录数
//showRefresh : true,//刷新按钮
responseHandler:responseHandler,//请求数据成功后，渲染表格前的方法
queryParams : function(params) {
var param = {//如果是在服务器端实现分页，limit、offset这两个参数是必须的
/* userName : $('#userName').val(),
phone : $('#phone').val(),*/
channelId : $("#channelId").val(),
startTime:startTime,
endTime:endTime,
pageSize : params.limit, // 每页显示数量
pageNum : (params.offset / params.limit) + 1 //当前页码
};
return param;
},
// //请求服务器数据时，你可以通过重写参数的方式添加一些额外的参数，例如 toolbar 中的参数 如果
// queryParamsType = 'limit' ,返回参数必须包含
// limit, offset, search, sort, order 否则, 需要包含:
// pageSize, pageNumber, searchText, sortName,
// sortOrder.
// 返回false将会终止请求
columns : [
{ // 列配置项
// 数据类型，详细参数配置参见文档http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/
checkbox : true
// 列表中显示复选框
},
/*{
title : '编号',
formatter: function (value, row, index) {
return index+1;
}
},*/
{
field : 'productName', // 列字段名
title : '产品名称',
align : 'center'
},
{
field : 'showCount',
title : '浏览量',
align : 'center'
},
{
field : 'ipCount',
title : 'Ip量',
align : 'center'
},
{
field : 'newIp',
title : '独立新Ip量',
align : 'center'
},
{
field : 'orderCount',
title : '成单量',
align : 'center',
},
{
field : 'payMoney',
title : '成交总额',
align : 'center'
}]
});
}
function reLoad() {
$('#exampleTable').bootstrapTable('refresh');
}
function responseHandler(res) {
var code = res.code;//在此做了错误代码的判断
console.log(code);
if(code != 0){
parent.layer.alert('数据加载异常！', {
skin: 'layui-layer-molv' //样式类名
});
return;
}
//如果没有错误则返回数据，渲染表格
return {
total : res.data.total, //总页数,前面的key必须为"total"
rows : res.data.rows //行数据，前面的key要与之前设置的dataField的值一致.
};
}
$('#daterange').daterangepicker({
format: 'YYYY-MM-DD HH:mm:ss',
startDate: new Date(),
endDate: new Date(),
minDate: 1999 - 12 - 12,
maxDate: 2050 - 12 - 30,
timePickerIncrement: 1,
locale: {
applyLabel: "确认",
cancelLabel: "取消",
resetLabel: "重置",
daysOfWeek: ['日', '一', '二', '三', '四', '五','六'],
monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
}
}, function (start, end, label) {
console.log('选择日期范围: ' + start.format('YYYY-MM-DD HH:mm:ss') + ' 到 ' + end.format('YYYY-MM-DD HH:mm:ss'));
startTime=new Date(start).format("yyyy-MM-dd HH:mm:ss");
endTime=new Date(end).format("yyyy-MM-dd HH:mm:ss");
console.log("选择后开始的日期为"+startTime);
});
############# 效 果
浏览量和Ip量
二、独立新IP
三、成单
四、成交总额
查询设置条件
