<#include "/incloud/header.ftl"/>
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org">
<@header></@header>
 <link rel="stylesheet" href="/adminlte/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css">
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">

 <@top></@top>
 <@left></@left>

  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        Page Header  index
        <small>Optional description</small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Level</a></li>
        <li class="active">Here</li>
      </ol>
    </section>
    <!-- Main content -->
    <section class="content container-fluid">
		<a href="#" type="button" onclick="reloadTable(1);" class="btn btn-sm btn-default"><i class="fa fa-search"></i>查看</a>
                  <div class="box-body">
              <table id="dataTable" class="table table-bordered table-hover">
                <thead>
                <tr>
                  <th>id</th>
                  <th>name</th>
                  <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                  <td>Trident</td>
                  <td>Internet
                    Explorer 4.0
                  </td>
                  <td>  <a href="#" type="button" class="btn btn-sm btn-default"><i class="fa fa-search"></i>查看</a>
                  		<a href="#" type="button" class="btn btn-sm btn-primary"><i class="fa fa-edit"></i>编辑</a> 
	                    <a href="#" type="button" class="btn btn-sm btn-danger"><i class="fa fa-trash-o"></i>删除</a>
                  </td>
                	
                </tr>
                </tbody>
              </table>
            </div>

    </section>
    <!-- /.content -->
  </div>
  <!-- Main Footer -->
<@footer></@footer>
</div>
</body>
<script src="/adminlte/bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="/adminlte/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
<script src="/js/user.js"></script>
<script src="/js/app.js"></script>
<script>
	var _dataTable;
  $(function () {
	  var user_columns = [{ data: 'id' },{ data: 'name' },
	                      {data:function(row,type,val,meta){
	                    	 	 return '<a href="#" type="button" class="btn btn-sm btn-default"><i class="fa fa-search"></i>查看</a>  '+
	                    	 	 		'<a href="#" type="button" class="btn btn-sm btn-primary"><i class="fa fa-edit"></i>编辑</a>  '+
	                    	 	 		'<a href="#" type="button" class="btn btn-sm btn-danger"><i class="fa fa-trash-o"></i>删除</a>';
	                      		}
	                      }
	  					];
	 _dataTable = YANGYA_APP.initTable("/page",user_columns);
	 console.log(_dataTable);
  })
  
  //当你需要多条件查询，你可以调用此方法，动态修改参数传给服务器
	function reloadTable(name) {
	    var name = 22;//$("#seName").val();
	    var admin = 33;//$("#seAdmin").val();
	    var param = {
	        "name": name,
	        "admin": admin
	    };
	    _dataTable.settings()[0].ajax.data = param;
	    _dataTable.ajax.reload();
	}
</script>
</html>