{extend name="public:base" /}
{block name="body"}
<div class="layui-row">
    <div class="layui-col-md12">
        <div class="layui-card">
            <form class="layui-form">
                <!--添加缴费凭证-->
                <div class="layui-form-box">
                    <div class="layui-form-body">
                        <div class="layui-row">
                            <input type="hidden" name="balance" value="{$balance}">
                            <input type="hidden" name="payment_id" value="{$payment_id}">
                            <div class="layui-col-md5">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">
                                        缴费方式:
                                    </label>
                                    <div class="layui-input-inline">
                                       <select name="type">
                                            {foreach $types as $item}
                                                <option value="{$item.id}">{$item.title}</option>
                                            {/foreach}
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-md5">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">
                                        缴费金额:
                                    </label>
                                    <div class="layui-input-inline">
                                       <input type="text" name="amount" id="amount" autocomplete="off"  class="layui-input" >
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-md5">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">
                                        缴费凭证号:
                                    </label>
                                    <div class="layui-input-inline">
                                       <input type="text" name="numb" id="numb" autocomplete="off"  class="layui-input" >
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-md5">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">
                                        缴费日期:
                                    </label>
                                    <div class="layui-input-inline">
                                       <input type="text" name="pay_date" id="pay_date" autocomplete="off"  class="layui-input" >
                                    </div>
                                </div>
                            </div>

                            <div class="layui-col-md5">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">
                                        凭证附件:
                                    </label>
                                    <div class="layui-input-inline">
                                        <button type="button" class="layui-btn" id="up_photo">
                                            <i class="layui-icon"></i>上传
                                        </button>
                                        <input type="hidden" name="file_id" id="file_id">
                                        <a href="#" target="_blank" class="layui-btn layui-hide">
                                            <i class="layui-icon">&#xe64a;</i>预览
                                        </a>
                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="layui-form-item layui-col-md-offset4">
                            <button class="layui-btn" lay-filter="payment" lay-submit="">
                                保存
                            </button>
                        </div>
                        
                    </div>
                </div>
                <!--缴费结束-->
            </form>
        </div>
    </div>
</div>
{/block}

{block name="js"}
<script type="text/javascript">
    //初始化Layui控件
    layui.use(['form', 'layer', 'laydate', 'upload'],
        function () {
            $ = layui.jquery;
            var form = layui.form,
                layer = layui.layer,
                laydate = layui.laydate,
                upload = layui.upload;

 
            laydate.render({
                elem:'#pay_date',
                trigger:'click',

            })
            //消息提示
            function layMsg(msg,type=6,time=1000){
                layer.msg(msg,{
                  icon: type,
                  time: time,
                });
            }


            //生成缴费单
            form.on('submit(payment)',
                function (data) {
                    $.ajax({
                        url: '/cert/save',
                        method: "POST",
                        data: data.field,
                        dataType: "json",
                        success: function (data) {
                            if (data.status == 1) {
                                layer.msg(data.message,{icon: 6,time: 1000 },function(){
                                     xadmin.close();
                                    // 可以对父窗口进行刷新
                                    xadmin.father_reload();
                                })
                            } else {
                                layer.msg(data.message,{icon: 5,time: 1000 })
                            }
                        }
                    });
                return false;
            });


            //上传附件
            var upPhoto = upload.render({
                elem: '#up_photo' , 
                url: '/up_photo',
                field: 'cp_photo',
                done: function (res) {
                    if(res.status == 1){
                        layMsg(res.message)
                        //将电表照片的ID填写
                        var $photoId = $("input[name='file_id']")
                        $photoId.val(res.data.id)
                        var $a = $photoId.next('a');
                            $a.removeClass('layui-hide')
                            $a.attr('href',res.data.src);
                    }
                    else {
                        layMsg(res.message,5)
                        return;
                    }                  
                }
            });   
        });
</script>
{/block}