easyUI的列名实现简单的树形结构

[样例]

<script>
  $(function(){
    $('#dataTable').datagrid({
      url: '<%=basePath%>/zyfl/SumWarningList.action',
      fitColumns: false,
      rownumbers:true,
      pagination:true,
      singleSelect:true,
      pageSize:20,
      pageList:[10,20,30],
      height:450,
      striped: true,
      remoteSort: false,
      columns:[[
        {field:'areaname',title:'区域',width:150,height:50,rowspan:2},
        {title:'红色预警',colspan:2,color:'red'},
        {title:'红色预警',colspan:2},
        {title:'红色预警',colspan:2},
        {field: 'areaid', title: '操作', width: 50, height: 50,rowspan:2,
          formatter: function(value, rowData) {
            return '<a href="javascript:void(0)"  onclick="window.location.href=\'.action?areaid='+value+'\'">查看</a> ';
          }
        }
      ],[
        {field:'htreated',title:'未处理',width:50,height:50,align: 'center'},
        {field:'htreating',title:'处理中',width:50,height:50,align: 'center'},
        {field:'ctreated',title:'未处理',width:50,height:50,align: 'center'},
        {field:'ctreating',title:'处理中',width:50,height:50,align: 'center'},
        {field:'ytreated',title:'未处理',width:50,height:50,align: 'center'},
        {field:'ytreating',title:'处理中',width:50,height:50,align: 'center'}
      ]]
    })
  })
</script>
<div class="tableClass">
    <table id="dataTable">
    </table>
</div>