{extend name="app/shop/view/base.html"/}
{block name="resources"}
<link rel="stylesheet" href="__STATIC__/element-ui/index.css">
<style>
    #container{ width: 650px; height: 500px; }
    #container > div {z-index: 500!important}
    .empty-address{ display: none; }
    .address-content {display: inline-block;vertical-align: top;}
    .form-wrap {margin-top: 0;}
    .empty-address-text{font-size: 14px;color: #f43530;height: 34px;line-height: 34px;}
    .upload_img_square {border-radius: 0}
</style>
{/block}
{block name="main"}
<div class="layui-form form-wrap" lay-filter="editselffetch">
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="required">*</span>模板标题：</label>
        <div class="layui-input-block">
            <input type="text" name="title" autocomplete="off" lay-verify="required" class="layui-input len-long">
        </div>
        <div class="word-aux">例如：加价20%模板</div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">价格设置：</label>
        <div class="layui-input-block">
            <div class="layui-input-inline">
                <span>价格 = 1688价格 *</span>
            </div>
            <div class="layui-input-inline" style="width: 100px;">
                <input type="number" name="price_set[multiple]" placeholder="增价百分百" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid">+</div>
            <div class="layui-input-inline" style="width: 100px;">
                <input type="number" name="price_set[increase]" placeholder="递增数" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="word-aux">提示：百分百和递增数可以不填或只填一个；优先按百分百增长</div>
    </div>
    <div class="layui-form-item label-list">
        <label class="layui-form-label"><span class="required"></span>商品名称设置：</label>
        <div class="layui-input-block layui-form-pane">
            <div class="layui-inline">
                <label class="layui-form-label" style="height: 34px">添加前缀：</label>
                <div class="layui-input-inline">
                    <input type="text" name="title_set[prefix]" class="layui-input len-long" placeholder="">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label" style="height: 34px">添加后缀：</label>
                <div class="layui-input-inline">
                    <input type="text" name="title_set[suffix]" class="layui-input len-long" placeholder="">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label" style="height: 34px">删除关键字：</label>
                <div class="layui-input-inline">
                    <input type="text" name="title_set[delete_keywords]" class="layui-input len-long" placeholder="">
                </div>
            </div>
            <div class="layui-form-item title_set">
                <label class="layui-form-mid">替换关键字：</label>
                <div class="layui-input-block">
                    <div class="layui-input-inline">
                        <input type="text" name="title_set[replace_keywords][before][]" placeholder="非必填" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-form-mid">替换为</div>
                    <div class="layui-input-inline">
                        <input type="text" name="title_set[replace_keywords][after][]" placeholder="非必填" autocomplete="off" class="layui-input">
                    </div>
                    <button class="layui-btn layui-btn-warm delSet">
                        <i class="layui-icon">&#xe640;</i>
                    </button>
                </div>
            </div>
            <div class="layui-input-block" onclick="addSet('title_set')">
                <button class="layui-btn">
                    <i class="layui-icon">&#xe654;</i> 添加替换关键字
                </button>
            </div>
        </div>
    </div>

    <div class="layui-form-item label-list">
        <label class="layui-form-label"><span class="required"></span>SKU设置：</label>
        <div class="layui-input-block layui-form-pane">
            <div class="layui-inline">
                <label class="layui-form-label"  style="height: 34px">添加前缀：</label>
                <div class="layui-input-inline">
                    <input type="text" name="sku_set[prefix]" class="layui-input len-long" placeholder="">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label" style="height: 34px">添加后缀：</label>
                <div class="layui-input-inline">
                    <input type="text" name="sku_set[suffix]" class="layui-input len-long" placeholder="">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label" style="height: 34px">删除关键字：</label>
                <div class="layui-input-inline">
                    <input type="text" name="sku_set[delete_keywords]" class="layui-input len-long" placeholder="">
                </div>
            </div>
            <div class="layui-form-item sku_set">
                <label class="layui-form-mid">替换关键字：</label>
                <div class="layui-input-block">
                    <div class="layui-input-inline">
                        <input type="text" name="sku_set[replace_keywords][before][]" placeholder="非必填" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-form-mid">替换为</div>
                    <div class="layui-input-inline">
                        <input type="text" name="sku_set[replace_keywords][after][]" placeholder="非必填" autocomplete="off" class="layui-input">
                    </div>
                    <button class="layui-btn layui-btn-warm delSet">
                        <i class="layui-icon">&#xe640;</i>
                    </button>
                </div>
            </div>
            <div class="layui-input-block" onclick="addSet('sku_set')">
                <button class="layui-btn">
                    <i class="layui-icon">&#xe654;</i> 添加替换关键字
                </button>
            </div>
        </div>
    </div>
    <div class="form-row">
        <button class="layui-btn" lay-submit lay-filter="save">保存</button>
        <button class="layui-btn layui-btn-primary" onclick="back()">返回</button>
        <a id="storeImage"></a>
    </div>
</div>
{/block}
{block name="script"}
<script type="text/html" id="storeImageTpl">
    {{# if(d.list.length){ }}
    {{# for(var i=0;i<d.list.length;i++){ }}
    <div class="item upload_img_square_item" data-index="{{i}}">
        <div class="img-wrap">
            <img src="{{ns.img(d.list[i],'small')}}" layer-src>
        </div>
        <div class="operation">
            <i title="图片预览" class="iconfont iconreview js-preview"></i>
            <i title="删除图片" class="layui-icon layui-icon-delete js-delete" data-index="{{i}}"></i>
            <div class="replace_img" data-index="{{i}}">点击替换</div>
        </div>
    </div>
    {{# } }}
    {{# if(d.list.length < d.max){ }}
    <div class="item js-add-image upload_img_square">+</div>
    {{# } }}
    {{# }else{ }}
    <div class="item js-add-image upload_img_square">+</div>
    {{# } }}
</script>
<script src="SHOP_JS/category_select.js"></script>
<script src="STATIC_JS/vue.js"></script>
<!-- 引入组件库 -->
<script src="__STATIC__/element-ui/index.js"></script>

<script>
    var form, repeat_flag, map_class, laytpl;
    var saveData = null;
    var totalUploadNum = 0;
    var completeUploadNum = 0;
    var alipaycategory_id = '';
    $(document).on('click', '.delSet',function(){
        $(this).parent().remove();
    })
    layui.use(['form', 'laydate', 'laytpl'], function () {
        form = layui.form;
        repeat_flag = false;//防重复标识
        laytpl = layui.laytpl;
        form.render();
        form.on('submit(save)', function (data) {
            console.log(data)
            var url = ns.url("ali1688://shop/template/add");
            repeat_flag = true;
            $.ajax({
                url: url,
                data: data.field,
                dataType: 'JSON',
                type: 'POST',
                success: function (data) {
                    layer.msg(data.message);
                    if (data.code == 0) {
                        location.href = ns.url("ali1688://shop/template/lists");
                    } else {
                        repeat_flag = false;
                    }
                }
            });
        });
    })
    function addSet(type) {
        html = '';
        html += '<div class="layui-input-block">';
        html += '<div class="layui-input-inline">';
        html += '<input type="text" name="' + type + '[replace_keywords][before][]" placeholder="非必填" autocomplete="off" class="layui-input">';
        html += '</div>';
        html += '<div class="layui-form-mid">替换为</div>';
        html += '<div class="layui-input-inline">';
        html += '<input type="text" name="' + type + '[replace_keywords][after][]" placeholder="非必填" autocomplete="off" class="layui-input">';
        html += '</div>';
        html += '<button class="layui-btn layui-btn-warm delSet">';
        html += '<i class="layui-icon">&#xe640;</i>';
        html += '</button>';
        html += '</div>';
        console.log(html)
        $("." + type + "").append(html);
    }
    function back()
    {
        window.history.back();
    }
</script>
{/block}