layui打开新窗口，form表单提交之后的跳转(top.layui.index.openTabsPage)

需求

FORM表单新增页面，提交成功后，自动跳转到list页面

//带参数跳转
top.layui.index.openTabsPage('{:Url("admin/AutoComparedBill/showList")}?page=1&limit=10&id=' + data.id, '自动化对账');

新增页面

就是一个简单的表单提交

<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-header">这是一个FORM表单新增页面</div>
        <div class="layui-card-body" style="padding: 15px;">
            <form class="layui-form" action="" lay-filter="component-form-group">
                <!--模板基础信息 面板-->
                <div class="layui-card">
                    <div class="layui-card-header layui-card-header-child">基础信息</div>
                    <div class="layui-card-body">

                        <div class="layui-col-sm12 layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label input-label-inline">调账单编号：</label>
                                <div class="layui-input-block">
                                    <input  value="（系统自动生成）" autocomplete="off" class="layui-input" type="text" disabled>
                                </div>
                            </div>
                        </div>

                        <div class="layui-col-sm12 layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label input-label-inline">调账单名称：</label>
                                <div class="layui-input-block">
                                    <input name="billAdjustName" autocomplete="off" class="layui-input" type="text" placeholder="请输入" lay-verify="required">
                                </div>
                            </div>
                        </div>

                        <div class="layui-col-sm12 layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label input-label-inline">调账类别：</label>
                                <div class="layui-input-block">
                                    <select name="billAdjustType" lay-verify="required">
                                        <option value="">请选择</option>
                                        {volist name="bill_type" id="vo"}
                                        <option value="{$vo.id}">{$vo.name}</option>
                                        {/volist}
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="layui-col-sm12 layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label input-label-inline">调账台账：</label>
                                <div class="layui-input-block">
                                    <select name="billTotalId"  lay-filter="billTotalId" id="billTotalId" lay-verify="required" lay-search>
                                        <option value="">请选择</option>
                                        {volist name="bill_list" id="bill_list"}
                                        <option value="{$bill_list.id}" >{$bill_list.billCode}（{$bill_list.billName}）</option>
                                        {/volist}
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="layui-col-sm12 layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label input-label-inline">运营商：</label>
                                <div class="layui-input-block">
                                    <select name="operatorName" id="operatorName" disabled>
                                        <option value="">请选择</option>
                                        {volist name="operator_list" id="operator_list"}
                                        <option value="{$operator_list.operatorName}">{$operator_list.operatorName}</option>
                                        {/volist}
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="layui-col-sm12 layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label input-label-inline">所属地：</label>
                                <div class="layui-input-block">
                                    <select name="operatorCity" id="operatorCity" disabled>
                                        <option value="">请选择</option>
                                        {volist name="operator_area_list" id="operator_area_list"}
                                        <option value="{$operator_area_list.operatorCity}" >{$operator_area_list.operatorCity}</option>
                                        {/volist}
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div style="clear: both"></div>
                    </div>
                </div>
                <!--模板内容 面板-->
                <div class="layui-card">
                    <div class="layui-card-header layui-card-header-child">佣金调整</div>
                    <div class="layui-card-body">

                        <div class="layui-col-sm12 layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label input-label-inline" style="width: 124px">本月佣金总收入(元)</label>
                                <div class="layui-input-block" style="margin-left: 130px;">
                                    <input name="adjustCommission" autocomplete="off" class="layui-input" type="text" lay-verify="required">
                                </div>
                            </div>
                        </div>
                        <div style="clear: both"></div>
                    </div>
                </div>
                <div class="layui-form-item layui-layout-admin">
                    <div class="layui-input-block">
                        <div class="layui-footer" style="left: 0;">
                            <button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">启动调账</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<style>
    .layui-card>.layui-card-header-child{
        background-color:#f2f2f2;
        font-weight: bold;
    }
    .layui-form>.layui-card{
        border: 1px solid #ebebeb;
        border-radius: 5px 5px 0 0;
    }
    .input-label-inline{
        padding: 9px 0;
        width: 98px;
    }
    .required-verify-label>span{
        color: #ff0000;
    }
    .field-flex>div{
        padding:0 150px
    }
</style>
<script src="__STATIC__/layuiadmin/layui/layui.js"></script>
<script>
    layui.config({
        base: '__STATIC__/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'laydate'], function () {
        var $ = layui.$,
            admin = layui.admin,
            element = layui.element,
            layer = layui.layer,
            laydate = layui.laydate,
            form = layui.form;

        form.render(null, 'component-form-group');

        form.on('select(billTotalId)', function(data){
            //data.value 得到被选中的值
            $.post('{:Url("getoperatorInfo")}'
                ,{ id: data.value }
                ,function(data){
                    $("#operatorCity").val(data.operatorCity);
                    $("#operatorName").val(data.operatorName);
                    form.render("select");
                });

        });

        /* 监听提交 */
        form.on('submit(component-form-demo1)', function (data) {
            layer.close();
            layer.load(0,{shade: [0.7, '#393D49']}, {shadeClose: true});
            $.ajax({
                'url':'{:Url("addBill")}',
                'data':data.field,
                'success':function(data){
                    if (data.status === 0) {
                        parent.layer.msg('成功');
                        //提交成功后，自动跳转页面
                        top.layui.index.openTabsPage('{:Url("admin/DebugBillMeau/showList")}', '调账单');
                        location.reload()
                    } else {
                        parent.layer.msg('失败');
                        layer.closeAll();
                    }
                },
                'dataType':'json',//返回的格式
                'type':'post',//发送的格式
            });
            return false;
        });

    });
</script>

解析:

//格式
top.layui.index.openTabsPage(url, title);
实例:
top.layui.index.openTabsPage('{:Url("admin/DebugBillMeau/showList")}', '调账单');

效果: