<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增商户')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-merchant-add">
            <input id="mercId" name="mercId" type="hidden" th:value="${mercId}">
            <div class="select-list">
                <ul>
                    <li>
                        商品名称：<input type="text" name="prodName" placeholder="商品名称">
                    </li>
                </ul>
                <ul>
                    <li>
                        <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                        <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                    </li>
                </ul>
            </div>
            <div class="btn-group-sm" id="toolbar" role="group"></div>
            <div class="col-sm-12 select-table table-striped">
                <table id="prodAttr-select-table"></table>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var prefix = ctx + "master/merchant/prod"

        $(function() {
            var options = {
                id: 'prodAttr-select-table',
                uniqueId: 'prodAttrId',
                url: ctx + "master/product/prodAttr/list",
                createUrl: prefix + "/add/{id}",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/remove",
                exportUrl: prefix + "/export",
                clickToSelect: true,
                modalName: "商品",
                columns: [
                    {
                        checkbox: true
                    },
                    {
                        field: 'prodName',
                        title: '商品名称'
                    },
                    {
                        field: 'attrName',
                        title: '属性名称'
                    }
                ]
            };
            $.table.init(options);
        });

        $("#form-merchant-add").validate({
            focusCleanup: true
        });

        function submitHandler(index, layero) {
            var rows = $.table.selectColumns("prodAttrId");
            if (rows.length === 0) {
                $.modal.alertWarning("请至少选择一条记录");
                return;
            }
            var data = {
                "mercId" : $("#mercId").val(),
                "prodAttrIds" : rows.join(),
            }
            $.ajax({
                url: prefix + "/edit",
                contentType: 'application/json',
                data: JSON.stringify(data),
                type: "post",
                processData: false,
                success: function(result) {
                    $.operate.successCallback(result);
                    $.modal.close();
                }
            });
        }
    </script>
</body>
</html>