grafana 表格数据颜色 表格颜色随数据变化

(作者：饶家俊，撰写时间：2019年7月17号)

接下来是给大家介绍的在数据表格实现的操作，就让我简单的介绍一下，这个功能是要引入layui的插件，和layui的数据表格才可以实现，我们可以根据一个字段和ID，也可以是字段里面的true和false，来改变数据表格里面的颜色，也可以改变字段的颜色，下面就让我们看看吧，如何实现这样的功能的吧。

首先我们是根据数据表格来改变行或者字体的颜色，所以我们要先把数据表格显示出来，这样我们才可以进行下一步的操作。

这样我们就要根据主键ID和外键ID，来获取到字段和数据。获取到要在数据表格里面要显示的数据，我这里是根据这个字段InventoryCount来改变行或者字体的颜色，所以这个字段一定要获取到，在下面就是给数据表格分页。

在下面我们就要在视图里面填写字段来显示数据，在把数据表格里面的连接放上去，就可以实现数据表格了,在视图这里不一要用这个字段InventoryCount，因为我们在控制器查询到了，所以有没有这个字段我们都可以改变行或者字体的颜色。

在下面就是今天的重点了，我是根据layui的done 数据渲染完的回调，无论是异步请求数据，还是直接赋值数据，都会触发该回调。你可以利用该回调做一些表格以外元素的渲染。

下面我用的for循环，循环执行下面的代码，在用if来判断，res.data[i].InventoryCount > 30，InventoryCount的是否是大于30，如果是就在执行下面的代码，不是就不管他，在根据下面的来改变行颜色background-color #393D49是选择颜色 。

$(“table tbody tr”).eq(i).css(‘background-color’, ‘#393D49’

代码写完就来看一下效果吧，只要大于30就会改变行的颜色。