@{

    Layout = "~/Views/Shared/_LayoutTable.cshtml";
}
<div class="wrapper wrapper-content">
    <div class="ibox float-e-margins">
        <div class="ibox-content">
            <button id="btnSet" class="btn btn-default" ><i class="glyphicon glyphicon-cog"></i> 设置</button>
            <table id="businessTable"></table>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(function () {
        $('#businessTable').bootstrapTable({
            url: '../WorkBench/GetTableSet',         //请求后台的URL（*）
            method: 'post',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            pagination: false,                   //是否显示分页（*）
            sortOrder: "asc",                   //排序方式
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            minimumCountColumns: 2,  //最少允许的列数
            height:$(window).height()-50,               //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "btypeid",            //每一行的唯一标识，一般为主键列
            clickToSelect: true,              //是否启用点击选中行
            sortable: true,                     //是否启用排序
            silentSort: true,
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
            strictSearch: false,
            showColumns: false,            //是否显示所有的列
            showRefresh: false,              //是否显示刷新按钮
            showToggle: false,                     //是否显示详细视图和列表视图的切换按钮
             cardView: false,                    //是否显示详细视图
            detailView: false,                   //是否显示父子表
            columns: [
                 {
                     field: "", title: "序号", align: "center", width: 50, formatter: function (value, row, index) {
                         return index + 1;
                     }
                 },
                {
                    field: "Sort", title: "序号", align: "center", width: 50, visible: false
                },
                { field: 'FullName', title: '业务流程' },
                {
                    field: "edit", title: "操作", width: 200, formatter: function (value, row, index) {
                        if (row["Sort"] == 1) {
                            var strHtml = '<a  onclick="up(' + index + ')"  class="btn btn-default btn-sm"><i class="glyphicon glyphicon-arrow-up"></i>上移</a>&nbsp;&nbsp<a  onclick="down(' + index + ')" class="btn btn-default btn-sm"><i class="glyphicon glyphicon-arrow-down"></i>下移</a>';
                            return strHtml;
                        } else {
                            var strHtml = '<a  onclick="up(' + index + ')"  class="btn btn-default btn-sm"><i class="glyphicon glyphicon-arrow-up"></i>上移</a>&nbsp;&nbsp;<a  onclick="down(' + index + ')" class="btn btn-default btn-sm"><i class="glyphicon glyphicon-arrow-down"></i>下移</a>';
                            return strHtml;
                        }
                    }
                }]
        });
        $(window).resize(function () {$('#businessTable').bootstrapTable('resetView');});
        //设置工作台
        $("#btnSet").on("click", function () {
            layer.open({
                type: 2,
                title: '@ViewBag.Title 信息',
                shadeClose: false,
                shade: 0.5,
                area: ['60%', '70%'],
                content: '../WorkBench/SetTabSetting',
                cancel: function (index) {
                    $('#businessTable').bootstrapTable('refresh');
                }
            });
        });
    });
    //上移
    function up(index) {
        if (index == 0) {
            layer.msg("已到最上行", { icon: 2, time: 2000 });
            return;
        }
        var data = $('#businessTable').bootstrapTable('getData');
        var updata = data[index];  //需要上移行       2  2
        var ondata = data[index - 1]; //需要下移行    1  1
        $.ajax({
            url: '../WorkBench/TabSetMove',
            data: {
                Num: updata["Num"],
                Sort: updata["Sort"],
                Numon: ondata["Num"],
                Sorton: ondata["Sort"]
            },
            dataType: 'text',
            type: 'post',
            success: function (data) {
                if (data == "ok") {
                    var upsort = updata["FullName"];
                    updata["FullName"] = ondata["FullName"];
                    ondata["FullName"] = upsort;
                    var upNum = updata["Num"];
                    updata["Num"] = ondata["Num"];
                    ondata["Num"] = upNum;
                    $('#businessTable').bootstrapTable('updateRow', { index: index - 1, row: ondata });
                    $('#businessTable').bootstrapTable('updateRow', { index: index, row: updata });
                } else {
                    layer.msg("操作失败！", { icon: 2, time: 2000 });
                }
            }, error: function () {
                layer.msg("连接超时！", { icon: 2, time: 2000 });
            }
        });
    }
    //下移
    function down(index) {
        var data = $('#businessTable').bootstrapTable('getData');
        if (data.length == index + 1) {
            layer.msg("已到最下行", { icon: 2, time: 2000 });
            return;
        }
        var updata = data[index];  //需要下移行       1    1
        var ondata = data[index + 1]; //需要上移行    2    2
        $.ajax({
            url: '../WorkBench/TabSetMove',
            data: {
                Numon: updata["Num"],
                Sorton: updata["Sort"],
                Num: ondata["Num"],
                Sort: ondata["Sort"]
            },
            dataType: 'text',
            type: 'post',
            success: function (data) {
                if (data == "ok") {
                    var upsort = updata["FullName"];
                    updata["FullName"] = ondata["FullName"];
                    ondata["FullName"] = upsort;
                    var upNum = updata["Num"];
                    updata["Num"] = ondata["Num"];
                    ondata["Num"] = upNum;
                    $('#businessTable').bootstrapTable('updateRow', { index: index + 1, row: ondata });
                    $('#businessTable').bootstrapTable('updateRow', { index: index, row: updata });
                } else {
                    layer.msg("操作失败！", { icon: 2, time: 2000 });
                }
            }, error: function () {
                layer.msg("连接超时！", { icon: 2, time: 2000 });
            }
        });

    }
</script>