layui.use(['element', 'upload', 'jquery', 'form', 'util'], function () {

    var element = layui.element;
    var upload = layui.upload;
    var $ = layui.jquery;
    var form = layui.form;
    var util = layui.util;

    var demoListView = $('#demoList')
        , uploadListIns = upload.render({
        elem: '#selectPhoto'
        , url: '/nav/uploadHonor' //改成您自己的上传接口
        , accept: 'image'
        , acceptMime: 'image/*'
        , multiple: true
        , auto: false
        , bindAction: '#startUpload'
        , before: function (obj) {
            layer.msg('正在上传，请稍候...', {time: 0});
        }
        , choose: function (obj) {
            var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
            //读取本地文件
            obj.preview(function (index, file, result) {
                var tr = $(['<tr id="upload-' + index + '">'
                    , '<td>' + file.name + '</td>'
                    , '<td>' + (file.size / 1024).toFixed(1) + 'kb</td>'
                    , '<td>等待上传</td>'
                    , '<td>'
                    , '<button class="layui-btn layui-btn-xs reload layui-hide">重传</button>'
                    , '<button class="layui-btn layui-btn-xs layui-btn-danger delete">删除</button>'
                    , '</td>'
                    , '</tr>'].join(''));

                //删除
                tr.find('.delete').on('click', function () {
                    delete files[index]; //删除对应的文件
                    tr.remove();
                    uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                });

                demoListView.append(tr);
            });
        }
        , done: function (res, index, upload) {
            layer.closeAll();
            if (res.state == 'ok') { //上传成功
                var tr = demoListView.find('tr#upload-' + index)
                    , tds = tr.children();
                tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
                tds.eq(3).html(''); //清空操作
                $(".honor-div").append('<div class="layui-col-md4">' +
                    '                <div class="center pd-5 photo" >' +
                    '                    <img src="' + res.honorUrl + '" alt="' + res.honorName + '" style="max-width: 100%; max-height: 200px;">' +
                    '                </div>' +
                    '                <p class="center">' + res.honorName + '</p>' +
                    '            </div>');
                return delete this.files[index]; //删除文件队列已经上传成功的文件
            } else {
                var tr = demoListView.find('tr#upload-' + index),
                    tds = tr.children();
                tds.eq(2).html('<span style="color: #FF5722;">' + res.msg + '</span>');
            }
        }
        , error: function (index, msg) {
            var tr = demoListView.find('tr#upload-' + index),
                tds = tr.children();
            tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
        }
    });

    $(document).on('click', '.deleteHonor', function () {
        var $this = $(this);
        var photoid = $(this).data("photoid");
        var honorname = $(this).data("honorname");
        $.ajax({
            url: '/nav/deleteHonor',
            type: 'post',
            data: {
                photoId: photoid,
                honorName: honorname
            },
            dataType: 'json',
            beforeSend: function () {
                layer.load(2);
            },
            success: function (res) {
                layer.closeAll('loading');
                if (res.state == 'ok') {
                    showOkMsg(res.msg);
                    $this.parents(".layui-col-md4:first").remove();
                } else if (res.state == 'fail') {
                    showFailMsg(res.msg);
                } else if (res.state == 'over') {
                    jumpToUrl(res.url);
                }
            }
        });
    });

    $(document).on('click', '#reapply', function () {
        $(this).attr("disabled", "disabled").css("background-color", "#CCC").text("刷新后再试");
        layer.confirm("请确定再次申请到我校复读吗？", {icon: 3, title: '提示'}, function (index) {
            $.ajax({
                url: '/info/reapply',
                type: 'post',
                data: {},
                dataType: 'json',
                beforeSend: function () {
                    layer.load(2);
                },
                success: function (res) {
                    layer.closeAll('loading');
                    if (res.state == 'ok') {
                        showAlertAndJump(res.msg, res.url);
                    } else if (res.state == 'fail') {
                        showFailMsg(res.msg);
                    } else if (res.state == 'over') {
                        jumpToUrl(res.url);
                    }
                }
            });
            layer.close(index);
        });
    });

    $(document).on('click', '#returnFee', function () {
        $(this).attr("disabled", "disabled").css("background-color", "#CCC").text("刷新后再试");

        if((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
            layer.open({
                type: 2,
                area: ['90%', '80%'],
                title: '<i class="layui-icon layui-icon-rmb"></i> 申请退费',
                content: '/info/applyReturnFee'
            });
        }else {
            layer.open({
                type: 2,
                area: ['500px', '700px'],
                title: '<i class="layui-icon layui-icon-rmb"></i> 申请退费',
                content: '/info/applyReturnFee'
            });
        }

    });
    $(document).on('click', '#returnFee_m', function () {
        $(this).attr("disabled", "disabled").css("background-color", "#CCC").text("刷新后再试");
        layer.open({
            type: 2,
            area: ['95%', '80%'],
            title: '<i class="layui-icon layui-icon-rmb"></i> 申请退费',
            content: '/info/applyReturnFee'
        });
    });

    // 监听获取账单
    form.on('submit(applyQrCode)', function (data) {
        let payType = data.field.payType;
        if (!payType) {
            showAlert("请选择支付方式");
            return false;
        }
        $('#applyQrCode').addClass("layui-hide");
        $("#payQrCode").html("");
        $(".pay-item input").attr('disabled', true);

        $.ajax({
            url: '/nav/applyQrCode',
            type: 'post',
            dataType: 'json',
            data: {
                payType: payType
            },
            beforeSend: function () {
                layer.msg('正在生成账单...', {
                    icon: 16,
                    shade: 0.2,
                    time: 0
                });
            },
            success: function (res) {
                console.log(res.data);
                layer.closeAll("dialog");
                if (res.state == 'OK') {
                    var d = res.data;
                    // 设置缴费方式
                    if (d.payType == 'W01') {
                        $('.pay-detail .payType').removeClass("layui-hide");
                        $('.pay-detail .payType b').text("微信");
                    } else if (d.payType == 'A01') {
                        $('.pay-detail .payType').removeClass("layui-hide");
                        $('.pay-detail .payType b').text("支付宝");
                    } else if (d.payType == 'U01') {
                        $('.pay-detail .payType').removeClass("layui-hide");
                        $('.pay-detail .payType b').text("银联");
                    }
                    $('.pay-detail .items').text(d.items);  // 设置缴费详情
                    $('.pay-detail .amount').text(d.amount);    // 设置缴费金额
                    // 生成二维码
                    new QRCode("payQrCode", {
                        text: d.qrCode,
                        width: d.qrCode.length > 100 ? 200 : 120,
                        height: d.qrCode.length > 100 ? 200 : 120,
                        colorDark: "#000000",
                        colorLight: "#ffffff",
                        correctLevel: QRCode.CorrectLevel.H
                    });
                    // 设置剩余时间
                    $('.validTime').html("");
                    TimeDown($('.validTime'), d.validTime);
                    // 显示区域
                    $(".pay-detail").slideDown(500);
                } else if (res.state == 'FAIL') {
                    $(".pay-detail").addClass("layui-hide");
                    $('#applyQrCode').removeClass("layui-hide");
                    $(".pay-item input").attr('disabled', false);
                    showAlert(res.msg);
                } else if (res.state == 'over') {
                    jumpToUrl(res.url);
                }
            }, error: function () {
                layer.closeAll("dialog");
                $(".pay-detail").addClass("layui-hide");
                $('#applyQrCode').removeClass("layui-hide");
                $(".pay-item input").attr('disabled', false);
                showAlert("服务器开小差了，生成账单失败。")
            }
        });

        return false;
    });

    // 倒计时
    function TimeDown(dom, validTime) {
        //倒计时的总秒数
        var totalSeconds = parseInt(validTime / 1000);

        //小时数
        var hours = Math.floor(totalSeconds / (60 * 60));
        totalSeconds = totalSeconds % (60 * 60);
        //分钟
        var minutes = Math.floor(totalSeconds / 60);
        //秒
        var seconds = totalSeconds % 60;

        hours = hours.toString().length === 1 ? '0' + hours : hours;
        minutes = minutes.toString().length === 1 ? '0' + minutes : minutes;
        seconds = seconds.toString().length === 1 ? '0' + seconds : seconds;

        //输出到页面
        dom.html(hours + ":" + minutes + ":" + seconds);

        // 每5秒查询一次缴费状态
        if (parseInt(seconds) % 5 == 0) {
            $.ajax({
                url: '/nav/hasPaid',
                type: 'post',
                data: {},
                dataType: 'json',
                success: function (res) {
                    if (res.state == 'ok') {
                        layer.alert('恭喜您，支付成功！', {
                            icon: 1, title: '提示', time: 0, end: function () {
                                location.href = res.url;
                            }
                        });
                    } else if (res.state == 'fail') {
                        //延迟一秒执行自己
                        if (hours == "00" && minutes == "00" && parseInt(seconds) - 1 < 0) {
                            $('#applyQrCode').removeClass("layui-hide");
                            $(".pay-item input").attr('disabled', false);
                            $("#payQrCode").html("");
                            dom.html('账单已过期，请重新获取');
                        } else {
                            setTimeout(function () {
                                TimeDown(dom, validTime - 1000);
                            }, 1000);
                        }
                    } else if (res.state == 'over') {
                        jumpToUrl(res.url);
                    }
                }
            });
        } else {
            //延迟一秒执行自己
            if (hours == "00" && minutes == "00" && parseInt(seconds) - 1 < 0) {
                $('#applyQrCode').removeClass("layui-hide");
                $(".pay-item input").attr('disabled', false);
                $("#payQrCode").html("");
                dom.html('账单已过期，请重新获取');
            } else {
                setTimeout(function () {
                    TimeDown(dom, validTime - 1000);
                }, 1000);
            }
        }

    }
    
    

    util.event('lay-active', {
        /*revocationReturnFee: function () {
            $(this).attr("disabled", "disabled").css("background-color", "#CCC").text("刷新后再试");
            layer.confirm('确定要取消退费申请吗？', {icon: 3, title: '提示'}, function (index) {
                $.ajax({
                    url: '/info/revocationReturnFee',
                    type: 'post',
                    data: {},
                    dataType: 'json',
                    beforeSend: function () {
                        layer.msg("正在处理，请稍后……", {time: 0});
                    },
                    success: function (res) {
                        layer.closeAll();
                        if (res.state == 'ok') {
                            showAlertAndJump(res.msg, res.url);
                        } else if (res.state == 'fail') {
                            showFailMsg(res.msg);
                        } else if (res.state == 'over') {
                            jumpToUrl(res.url);
                        }
                    },
                    error: function () {
                        layer.closeAll();
                        showFailMsg('网络异常，请稍后重试');
                    }
                });
                layer.close(index);
            });
        }*/
    })
    
    /** 查看收据 */
	$(document).on('click', '#viewBillNo', function() {
		$.ajax({
		    url: '/pay/getBillNo',
		    type: 'post',
		    dataType: 'json',
		    success: function (data) {
		        if (data.state == 'ok' || data.state == 'OK') {
					layer.open({
						title: '',
						content: '<img style="height:500px;" src="' + data.data +'">',
						cancel: function(){ 
							//右上角关闭回调
							console.log("您取消了该操作");
							//return false 开启该代码可禁止点击该按钮关闭
						}
					});
		        } else if (data.state == 'over') {
					showFailMsg(data.msg);
		        } else {
					showFailMsg(data.msg);
				}
		    }
		});
	});
    /** 查看收据 */
	$(document).on('click', '#viewBillNo_m', function() {
		$.ajax({
		    url: '/pay/getBillNo',
		    type: 'post',
		    dataType: 'json',
		    success: function (data) {
		        if (data.state == 'ok' || data.state == 'OK') {
					layer.open({
						title: '',
						content: '<img style="width:300px;" src="' + data.data +'">',
						cancel: function(){ 
							//右上角关闭回调
							console.log("您取消了该操作");
							//return false 开启该代码可禁止点击该按钮关闭
						}
					});
		        } else if (data.state == 'over') {
					showFailMsg(data.msg);
		        } else {
					showFailMsg(data.msg);
				}
		    }
		});
	});

});