js动态表格数据动态设置颜色

首先需求是这样的：

831331048160200 - 北京 超过2800w显示红色

831331048160198 - 天津 不限制

831290048160214 - 广州 超过2000w显示红色

数据是同一属性的不同id 以及不同的名称：

所以查出来的数据为一个属性下面不同的值：

比如：

球 球的号码 不同 设置几号几号为什么颜色 几号几号为什么颜色，然后他们的名称也不同：可能是篮球 可能是羽毛球 但他们都是属于球 ，属于同一个属性下面 的不同名称 不同号码 通俗的列子就是这样；

接下来是代码：

jsp:

<li style="text-align: center;">
<a href="#syhsicons" data-toggle="tab">
球
<button class="btn-success" onclick="reload_cupMercodeselect();">刷新</button>
</a>
(<%=str_date %>)
</li>

js

function showCupHsTotalHome_manager(){

var url = "transruning/getByHsTotalHome.do";
var table = $("#upcupMercodeselect");
//初始化表单
table.DataTable({
"autoWidth": false,
"ordering": false,
"searching": false,
"iDisplayLength":200,
"language": {
"paginate": {
"previous": "上一页",
"next": "下一页",
"last": "末页",
"first": "首页"
},
"info": "显示 _START_ 至 _END_ 条，共 _TOTAL_ 条",
"infoEmpty": "",
"lengthMenu": "每页显示 _MENU_ 条",
"search": "搜索(资源名称)",
"processing": "正在加载数据...",
"emptyTable": "没有数据"
},
"processing": true,
"serverSide": true,
"ajax": {
"url":url,
"type":"post",
"dataSrc": "data",
"data" : function(d){
var param = {};//新建参数对象
param.start = d.start;//开始的序号
param.length = d.length;//要取的数据长度
param.value = d.search.value;//搜索
return param;//自定义需要传递的参数。
}
},
"columns": [
{data: 'cup_mer_code'},
{data: 'cup_mer_name'},
{
data: 'total_amt',
render : function(data, type, row) {
//得到后台数据
var s = parseFloat(data);
var cup_mer_code = row.cup_mer_code;
//做判断
if(cup_mer_code == '831331048160200'){
if(s <= 28000000){
//变颜色
return "<span class='label label-info'><font size='2'>"+data+"</font></span>";
}else{
return "<span class='label label-danger'><font size='2'>"+data+"</font></span>";
}
}else if(cup_mer_code == '831290048160214'){
if(s <= 20000000){
return "<span class='label label-info'><font size='2'>"+data+"</font></span>";
}else{
return "<span class='label label-danger'><font size='2'>"+data+"</font></span>";
}
}
return "<font size='2'>"+data+"</font>";
}
}
]
});
$("#upcupMercodeselect_wrapper div:first").remove();

}

control:

就是查询的分页方法 这个可以根据实际情况自己写；

重要的是sql:

<select id="getCupMercodeDataInfos" parameterType="Map" resultMap="tradeJnlsResult">
select
cup_mer_code,
CASE cup_mer_code
when '号码' then '篮球'
when '号码' then '排球'
when '号码' then '网球'
end cup_mer_name,
sum(total_amt) total_amt
from trade_jnls where
create_time BETWEEN #{startdate} AND #{enddate}
and cup_channel_id = 2 and deduct_result = 2
and cup_mer_code in('号码','号码','号码')
group by cup_mer_code
<if test="start != null and length != null">
LIMIT #{start},#{length}
</if>
</select>

计算多少条：

<select id="getCupMercodeDataTotal" parameterType="Map" resultType="int">
select count(*) from (
select
cup_mer_code,
CASE cup_mer_code
when '号码' then '篮球'
when '号码' then '排球'
when '号码' then '网球'
end cup_mer_name,
sum(total_amt) total_amt
from trade_jnls where
create_time BETWEEN #{startdate} AND #{enddate}
and cup_channel_id = 2 and deduct_result = 2
and cup_mer_code in('号码','号码','号码')
group by cup_mer_code
) temp
</select>

主要是思路以及js判断 以及sql