<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" 
      >
<head th:replace="admin/common/html/head :: head_Normal(~{::title},~{::link},~{::style})">

<title th:text=${title}></title>

<link rel="stylesheet" th:href="@{/static/admin/assets/js/button/ladda/ladda.min.css}">
<!-- bootstrap-table表单样式 -->
<link th:href="@{/static/admin/assets/js/bootstrap/css/bootstrap-table/bootstrap-table.min.css}" rel="stylesheet"/>

<style type="text/css">

.select-list ul li{
	list-style-type: none;
	float: left;
}

.colStyle{
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
</style>

</head>

<body id="listbody">

<!-- 右边内容 -->
<div class="wrap-fluid">
    <div class="container-fluid paper-wrap bevel tlbr">
        <!-- 内容 -->
        <div class="content-wrap">
            <!-- 结束内容 -->
            <div class="row">
                <div class="col-sm-12">
                <!-- 搜索条件 -->
                
                	 <div class="nest" id="inlineClose">
                            <div class="title-alt">
                                <h6>搜索条件</h6>
                                <div class="titleClose">
                                    <a class="gone" href="#inlineClose">
                                        <span class="entypo-cancel"></span>
                                    </a>
                                </div>
                                <div class="titleToggle">
                                    <a class="nav-toggle-alt" href="#search_div">
                                        <span class="entypo-down-open"></span>
                                    </a>
                                </div>
                            </div>

                            <div class="body-nest" id="search_div"  style="display: none">
                                <div class="form_left">
                                </div>
                            </div>
                        </div>
                	<!-- END搜索条件 -->
                    <!-- 空白页开始-->
                    <div class="nest" id="Blank_PageClose">
                        <div class="title-alt">
                            <h6>表单</h6>
                            <div class="titleClose">
                                <a class="gone" href="#Blank_PageClose">
                                    <span class="entypo-cancel"></span>
                                </a>
                            </div>
                            <div class="titleToggle">
                                <a class="nav-toggle-alt" href="#Blank_Page_Content">
                                    <span class="entypo-up-open"></span>
                                </a>
                            </div>
                        </div>
                        
                        <div class="body-nest" id="Blank_Page_Content">
                            <div class="btn-group hidden-xs" id="exampleTableEventsToolbar" role="group">
                           </div>
                            <!-- 工具条 end-->
                           <table id="dataTable" class="table-striped footable-res footable metro-blue" data-page-size="6">

                           </table>
                        </div>
                    </div>
                </div>
                <!-- 空白页结束 -->
            </div>
            <!-- 结束内容 -->
        </div>
    </div>
</div>
<!-- 结束右边内容 -->

<!-- 通用js -->
<div th:include="admin/common/html/js :: onload_js">
   
</div>
<!-- bootstarp 表格 -->
<script th:src="@{/static/admin/assets/js/bootstrap/js/bootstrap-table/bootstrap-table.min.js}" type="text/javascript"></script>
<script th:src="@{/static/admin/assets/js/bootstrap/js/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}" type="text/javascript"></script>
<script th:src="@{/static/admin/assets/js/bootstrap/js/base_list.js}" type="text/javascript"></script>
    <!-- 弹窗 -->
<script th:src="@{/static/admin/assets/js/layer/layer.js}" type="text/javascript"></script>
<!-- 遮罩层 -->
<script th:src="@{/static/admin/assets/js/blockUI/jquery.blockUI.js}" type="text/javascript"></script>

<script type="text/javascript">
var dataUrl="/changeLog/list";
var removeUrl="/changeLog/remove";
var createUrl="/changeLog/add";
var updateUrl="/changeLog/edit/{id}";
var options = {
		dataUrl: dataUrl,
        createUrl: createUrl,
        updateUrl: updateUrl,
        removeUrl:removeUrl,
        sortName: "id",
        modalName: "变更记录",
	    dataColumns: [
			{
			    checkbox: true
			},                   
			{
			    field: 'id',
			    title: '序号'
			}, 
			{
			    field: 'key',
			    title: '业务Key'
			},
			{
			    field: 'bizType',
			    title: '业务类型',
                formatter: function (value) {
			        if(value == 1){
                        return "规则变更";
                    }else if(value == 2){
                        return "worker变更";
                    }else if(value == 3){
                        return "热点变更";
                    }
                }
			},
            { field: 'createTime', title: '创建时间',
                formatter:function (val,row,index) {
                    return changeDateFormat(val);
                }
            },
            {
                field: 'from',
                title: '初始值',
                formatter: function (value, row, index) {
                    var span = document.createElement('span');
                    span.setAttribute('title', value);
                    span.innerHTML = value;
                    return span.outerHTML;
                },
                cellStyle : function() {
                    return {
                        css: {
                            'max-width':'200px',
                            'text-overflow': 'ellipsis',
                            'overflow': 'hidden',
                            'white-space': 'nowrap',
                        }
                    }
                }
            },
            {
                field: 'to',
                title: '变更值',
                formatter: function (value, row, index) {
                    var span = document.createElement('span');
                    span.setAttribute('title', value);
                    span.innerHTML = value;
                    return span.outerHTML;

                },
                cellStyle : function() {
                    return {
                        css: {
                            'max-width':'200px',
                            'text-overflow': 'ellipsis',
                            'overflow': 'hidden',
                            'white-space': 'nowrap',
                        }
                    }
                }
            },
            {
			    title: '操作',
			    formatter: function (value, row, index) {
			        var id = row.id;
			        var actions = [];
			        actions.push('<a class="btn btn-success btn-xs"  href="#" onclick="$.operate.edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>查看</a> ');
			        return actions.join('');
			    }
			}]
  };

$(function(){
	var oTab=$.table.oTableInit(options);
	oTab.Init();
})
</script>

</body>


</html>
