{extend name='public/base' /}
{block name='content'}
{include file='public/content_header' /}
<section class="content">
    <div class="row">
        <div class="col-md-12">
            <div class="box box-primary">
                <!-- 表单头部 -->
                <div class="box-header with-border">
                    <div class="btn-group">
                        <a class="btn flat btn-sm btn-default BackButton">
                            <i class="fa fa-arrow-left"></i>
                            返回
                        </a>
                    </div>
                </div>
                <!-- 表单 -->
                <form id="dataForm" class="form-horizontal dataForm" action="" method="post"
                      enctype="multipart/form-data">
                    <!-- 表单字段区域 -->
                    <div class="box-body">
                        
                        <div class="form-group">
                            <div class="col-sm-10 col-md-12">
                                <table id="dataList" class="table table-hover table-bordered datatable" width="100%">
                                    <thead>
                                    <tr class="input-type">
                                        <th>操作</th>
                                        <th>设备产品</th>
                                        <th>数量</th>
                                        <th>到期时间</th>
                                    </tr>
                                    </thead>
                                    <tbody id="dataBody"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <!-- 表单底部 -->
                    <div class="box-footer">
                        {:token()}
                        <div class="col-sm-2">
                        </div>
                        <div class="col-sm-10 col-md-4">
                            {if !isset($data)}
                            <div class="btn-group pull-right">
                                <label class="createContinue">
                                    <input type="checkbox" value="1" id="_create" name="_create"
                                           title="继续添加数据">继续分配</label>
                            </div>
                            {/if}
                            <div class="btn-group">
                                <button type="submit" class="btn flat btn-info dataFormSubmit">
                                    保存
                                </button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
<table>
    <tbody id="data-template" style="display: none">
    <tr>
        <td>
            <a class="btn btn-xs btn-success" onclick="addNewField(this,2)">追加</a>
            <a class="btn btn-xs btn-danger" onclick="delThisField(this,1)">删除</a>
        </td>

        <td>
            <label>
                <select name="goods_idFORM_INDEX[]" style="min-width: 380px;width: 420px;" class="form-control field-select select2" data-placeholder="请选择设备商品">
                    <option value=""></option>
                    {foreach name='goods_list' id='item'}
                    <option value="{$item.id}">
                        {$item.name}
                    </option>
                    {/foreach}
                </select>
            </label>
        </td>
        <td>
            <label>
                <input class="form-control field-type" value="" name="numberFORM_INDEX[]" placeholder="请输入数量">
            </label>
        </td>
        <td>
            <label>
                <input class="form-control field-type" id="end_timeINDEX_ID" value="" name="end_timeFORM_INDEX[]" placeholder="请输入到期时间">
            </label>
        </td>
    </tr>
    </tbody>
</table>
</section>
<script>
/** 表单验证 **/
$('#dataForm').validate();
//表单索引
var formIndex =0;
addNewField(null, 1);
//添加新的字段
function addNewField(obj, type) {
    formIndex++;
    let template = $("#data-template").html().replace(/FORM_INDEX/g, '[' + formIndex + ']').replace(/INDEX_ID/g, formIndex);
    if (obj == null) {
        $("#dataBody").append(template);
    } else {
        if (type === 1) {
            $(obj).parent().parent().before(template);
        } else {
            $(obj).parent().parent().after(template);
        }
    }
    laydate.render({ 
      elem: '#end_time'+formIndex
      ,type: 'datetime'
    });
    //刷新 dataBody DOM后的操作
    dataBodyRefreshed();
}
$(function () {
    dataBodyRefreshed();
});

//删除当前字段
function delThisField(obj) {
    layer.confirm('您确认删除本行吗？', {title: '删除确认', closeBtn: 1, icon: 3}, function () {
        $(obj).parent().parent().remove();
        layer.closeAll();
    });
}

//列表刷新后的操作
function dataBodyRefreshed() {
    $('[data-toggle="tooltip"]').tooltip();
    $('#dataBody .select2').select2();
}
</script>
{/block}