var slsqxx;
// 材料标识吗
var bsmCl;
// 领证方式
var lzfs = 1;
// 共有方式
var gyfsmc = 1;
layui.use('element', function () {
    let element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
});
$(function () {
    addTabs('#wssq');
    //设置步骤条信息
    setAcceptFlow(GetQueryString('bsm_slsq'), GetQueryString('businessno'));
    //获取申请记录详细
    slsqxx = getApplyRecord(GetQueryString('bsm_slsq'), GetQueryString('businessno'));
    //加载材料信息
    LoadClxxDiv();
    //config的设置是全局的
    layui.config({
        base: '../../staticJs/'
    }).extend({ //设定模块别名
        common: 'cityCommon'
    });
    layui.use(['form', 'common'], function () {
        var common = layui.common,
            form = layui.form;
        //三级地址联动
        common.showCity('province', 'city', 'district');
        //区域选择
        form.on('select(selectCity)', function (data) {
            return false;
        });
    });
    //读取受理信息
    loadAcceptDetail()
    //获取房屋信息
    loadHouseDetail();
    //读取申请人信息
    loadSqrDetail()
    //读取邮寄信息
    loadMailDetail();
    // 读取权利人
    authorityPerson();
    applicationMethod();
});
// 区分单方申请和双方申请
function applicationMethod() {
    // 在这里页面显示进行处理
    if (slsqxx.sqrlb == '1') {
        $('.obtaining_license').show();
        $('#obligeeInformation').text('权利人信息');
    } else {
        $('.obtaining_license').hide();
        $('#obligeeInformation').text('义务人信息');
        $('.nextSubmitButton').empty();
        $('.nextSubmitButton').append('<div class="next_button">'+
        '<button type="button" lay-submit="" lay-filter="submit1" class="layui-btn layui-btn-normal">'+
            '<a onclick="skipClick()">下一步</a></button></div>')
    }
    if (slsqxx.sqfs == '1' && slsqxx.sqrlb == '1') {
        $('.folkObligee').show();
    }
    // 动态设置样式
    for(var i=0;i<$('.conImageUpdate').length;i++) {
        $('.conImageUpdate').eq(i).find('.imageUpdateTitle').css('height', $('.conImageUpdate').eq(i).height()-60);
    }
}

//读取受理信息
function loadAcceptDetail() {
    $('#wwsqbh p').text(slsqxx.wwsqbh);
    $('#sqrq p').text(slsqxx.sqrq);
    //$('#sqrmc p').text(slsqxx.sqrmc);
    $('#qllxmc p').text(slsqxx.qllxmc);
    $('#djlxmc p').text(slsqxx.djlxmc);
    $('#sldjqx p').text(slsqxx.sldjqx);
    $('#shortname p').text(slsqxx.shortname);
    //$('#bdcqzh p').text(slsqxx.bdcqzh);
}
//读取房屋明细
function loadHouseDetail() {
    let houseInfo = getFDCQ2(GetQueryString('bsm_slsq'));
    $('#unitNumber p').text(houseInfo.bdcdyh);
    $('#titleCertificate p').text(houseInfo.bdcqzh);
    $('#beLocated p').text(houseInfo.fdzl);
    $('#area p').text(houseInfo.jzmj);
}

// 读取申请人信息
function loadSqrDetail() {
    // 买方信息
    if (slsqxx.sqrList && slsqxx.sqrList.length > 0) {
        $('#userName').text(slsqxx.sqrList[0].sqrmc);
        $('#idCard').text(slsqxx.sqrList[0].zjhm);
        $('#phone').text(slsqxx.sqrList[0].dhhm);
        if (slsqxx.sqrList[0].sqrzj == '1') {
            $('#documentType p').text('身份证');
        }
        let li;
        for (var i = 1; i < slsqxx.sqrList.length; i++) {
            li = '<div class="layui-form-item">'
            li += '<div class="layui-inline">'
            li += '<label class="layui-form-label">姓名</label>'
            li += '<div class="layui-input-block">'
            li += '<input type="text" name="name" value="' + slsqxx.sqrList[i].sqrmc + '" required lay-verify="name" placeholder="请输权利人" class="layui-input">'
            li += '</div>'
            li += '</div>'
            li += '<div class="layui-inline idCard">'
            li += '<label class="layui-form-label">身份证类型</label>'
            li += '<div class="layui-input-block">'
            li += '<select lay-filter="typeId">'
            li += '<option value="' + slsqxx.sqrList[i].sqrzj + '">身份证</option>'
            li += '</select>'
            li += '</div>'
            li += '</div>'
            li += '<div class="layui-inline">'
            li += '<label class="layui-form-label">证件号码</label>'
            li += '<div class="layui-input-block">'
            li += '<input type="tel" name="card" value="' + slsqxx.sqrList[i].zjhm + '" maxlength="18" required lay-verify="card" placeholder="请输证件号码" class="layui-input">'
            li += '</div>'
            li += '</div>'
            li += '<div class="layui-inline">'
            li += '<label class="layui-form-label">联系方式</label>'
            li += '<div class="layui-input-block">'
            li += '<input type="tel" name="phone" value="' + slsqxx.sqrList[i].dhhm + '" maxlength="11" required lay-verify="phone" placeholder="请输联系方式" class="layui-input">'
            li += '</div>'
            li += '</div>'
            li += '<i class="layui-icon layui-icon-reduce-circle"></i>'
            li += '</div>'
            $('#layui-form').append(li)
        }

    } else {
        let userInfo = getCookie('myCookie');
        $('#userName').text(userInfo.username);
        $('#idCard').text(userInfo.zjhm);
        $('#phone').text(userInfo.phone);
        if (userInfo.zjzl == '1') {
            $('#documentType p').text('身份证');
        }
    }
}

//读取邮寄信息
function loadMailDetail() {
    // 领证方式
    lzfs = slsqxx.lzfs;
    if (lzfs == '2') {
        $('.shipping_method').show();
        $('.submitButton').hide();
    } else {
        $('.shipping_method').hide();
        $('.submitButton').show();
    }
    // 邮寄地址
    if (slsqxx.mailRecordDetail) {
        $('#consignee').val(slsqxx.mailRecordDetail.consignee);
        $('#consigneePhone').val(slsqxx.mailRecordDetail.consigneePhone);
        $('#province').attr('data-area', slsqxx.mailRecordDetail.province);
        $('#city').attr('data-area', slsqxx.mailRecordDetail.city);
        $('#district').attr('data-area', slsqxx.mailRecordDetail.district);
        $('#consigneeAddress').val(slsqxx.mailRecordDetail.consigneeAddress);
    }
}

// 权利人添加
function authorityPerson() {
    $('.radioInfo').click(function () {
        let index = $(this).attr("value");
        gyfsmc = index;
        if ($('#layui-form .layui-form-item').length > 1) {
            return false
        } else {
            if (index == 2 || index == 3) {
                $('.add_form').show()
            } else {
                $('.add_form').hide()
            }
        }
    })
    // form 添加
    $('.add_form').click(function () {
        $('#layui-form').append(
            '<div class="layui-form-item">' +
            '<div class="layui-inline">' +
            '<label class="layui-form-label">姓名</label>' +
            '<div class="layui-input-block">' +
            '<input type="text" name="name" required lay-verify="name" placeholder="请输权利人" class="layui-input">' +
            '</div>' +
            '</div>' +
            '<div class="layui-inline idCard">' +
            '<label class="layui-form-label">身份证类型</label>' +
            '<div class="layui-input-block">' +
            '<select lay-filter="typeId">' +
            '<option value="1">身份证</option>' +
            '<option value="2">军官证</option>' +
            '</select>' +
            '</div>' +
            '</div>' +
            '<div class="layui-inline">' +
            '<label class="layui-form-label">证件号码</label>' +
            '<div class="layui-input-block">' +
            '<input type="tel" name="card" maxlength="18" required lay-verify="card" placeholder="请输证件号码" class="layui-input">' +
            '</div>' +
            '</div>' +
            '<div class="layui-inline">' +
            '<label class="layui-form-label">联系方式</label>' +
            '<div class="layui-input-block">' +
            '<input type="tel" name="phone" maxlength="11" required lay-verify="phone" placeholder="请输联系方式" class="layui-input">' +
            '</div>' +
            '</div>' +
            '<i class="layui-icon layui-icon-reduce-circle"></i>' +
            '</div>'
        )
    
        layui.use('form', function () {
            var form = layui.form;
            form.render('select');
            form.on('select(typeId)', function (data) {
                console.log(data.value);
            });
        })
        // 编辑
        $(document).on("click", ".layui-icon-reduce-circle", function (e) {
            $(this).parent().remove()
        })
    })
}
// 图片上传
// 领证方式
$('.formRadio').click(function () {
    let value = $(this).attr('value');
    lzfs = value;
    if (value == 2) {
        $('.shipping_method').show()
        $('.submitButton').hide()
    } else {
        $('.shipping_method').hide()
        $('.submitButton').show()
    }
})
//下一步事件
function skipClick() {
    if (_saveSQR()) {
        skipNextPage(GetQueryString('bsm_slsq'), GetQueryString('businessno'));
    } else {
        layer.msg('保存信息出错！');
    }
}

//加载材料信息
function LoadClxxDiv() {
    let clxxDic = $("#clxx");
    let clxxContent;
    $.each(slsqxx.slclList, function (index, item) {
        clxxContent = '<div id="' + item.bsmCl + '" class="conImageUpdate">';
        clxxContent += '<h5 class="imageUpdateTitle">' + item.clmc + '</h5>';
        for (i = 0; i < item.fs; i++) {
            if (item.slclmxDetailList.length > i) {
                clxxContent += '<div style="float: left;" id="' + item.slclmxDetailList[i].bsmSlclmx + '" class="itemImageUpdate">';
                clxxContent += '<img class="pic" src="' + item.slclmxDetailList[i].preViewUrl + '">';
                clxxContent += '<div class="mask mask1"><p><img class="enlarge" src="../../staticImages/fangda.png"><img class="delete" src="../../staticImages/shanchu.png"></p></div>';
            } else {
                clxxContent += '<div style="float: left;" class="itemImageUpdate">';
                clxxContent += '<img class="pic" src="../../staticImages/update.png">';
                clxxContent += '<div class="mask"><p><img class="enlarge" src="../../staticImages/fangda.png"><img class="delete" src="../../staticImages/shanchu.png"></p></div>';
            }
            clxxContent += '<input name="file" accept="image/*" type="file" style="display: none" />';
            clxxContent += '<div class="certificate">';
            clxxContent += '<span>' + slsqxx.slclList[index].clmc + '【' + slsqxx.slclList[index].wjlxmc + '】（' + slsqxx.slclList[index].fs + '-' + (i + 1) + '）</span>';
            clxxContent += '</div>';
            clxxContent += '</div>';
        }

        clxxContent += '</div>';
        clxxDic.append(clxxContent);
    });
    AddCLxxClick();
}

//添加材料列表点击事件
function AddCLxxClick() {
    //上传事件
    $(".pic").click(function () {
        $(this).next().next().click(); //隐藏了input:file样式后，点击头像就可以本地上传
        $(this).next().next().on("change", function () {
            var objUrl = getObjectURL(this.files[0]); //获取图片的路径，该路径不是图片在本地的路径
            var file = this.files[0].type;
            if (file == '') {
                layer.msg('请上传，jpg,png,jpeg,gif格式文件');
                return false;
            }
            if (objUrl) {
                let imageData = UploadPicture(this.files[0], $(this).parent().parent().prop("id"));
                if (imageData.bsmSlclmx == "") {
                    layer.msg('图片上传失败，请稍后上传！');
                }
                else {
                    layer.msg('图片上传成功');
                    $(this).prev().prev().attr("src", imageData.preViewUrl);//将图片路径存入src中，显示出图片  
                    $(this).parent().attr("id", imageData.bsmSlclmx);
                    $(this).parent().find('.mask').show();
                }
            }
        });
    });
    //del
    $(document).on("click", ".delete", function (e) {
        let imgObj = $(this).parent().parent().siblings(".pic");
        let mask = $(this).parent().parent();
        let file = $(this).parent().parent().siblings("input[type='file']");
        let slclmxObj = $(this).parent().parent().parent();
        layer.confirm('此操作将删除图片是否继续', {
            btn: ['是', '否'] //按钮
        }, function () {
            $.ajax({
                type: "post",  //提交方式  
                url: portal.api_url + "/portal/FillInformation/deleteSlcl",//路径  
                dataType: "json",
                data: {
                    'bsmSlclmx': slclmxObj.prop("id")
                },
                //数据，这里使用的是Json格式进行传输  
                success: function (result) {//返回数据根据结果进行相应的处理           
                    if (result.code == 200) {
                        layer.msg(result.message);
                        mask.hide();
                        imgObj.attr("src", "../../staticImages/update.png");
                        file.after(file.clone().val(""));
                        file.remove();
                        slclmxObj.attr("id", "");
                    } else {
                        layer.msg('删除失败！');
                    }
                }
            });
        }, function () {
            layer.msg('已取消删除');
        });
    })
    // 放大
    $(document).on("click", ".enlarge", function (e) {
        let src = $(this).parent().parent().siblings(".pic").attr('src')
        console.log($(this).parent().parent().siblings(".pic").attr('src'))
        var imgHtml = "<img style='width:1000px;height:600px' src='" + src + "' />";
        layer.open({
            type: 1,
            title: false,
            closeBtn: 0,
            area: ['auto'],
            skin: 'layui-layer-nobg', //没有背景色
            shadeClose: true,
            content: imgHtml
        });
    })
}

// 图片上传
function UploadPicture(flie, bsmCl) {
    let imageData;
    let formData = new FormData();
    formData.append('bsmCl', bsmCl);
    formData.append('files', flie);
    $.ajax({
        type: "post",  //提交方式  
        url: portal.api_url + "/portal/FillInformation/uploadSlcl",//路径  
        dataType: "json",
        cache: false, //上传文件不需要缓存
        processData: false, // 告诉jQuery不要去处理发送的数据
        contentType: false, // 告诉jQuery不要去设置Content-Type请求头
        async: false,
        data: formData,
        //数据，这里使用的是Json格式进行传输  
        success: function (result) {//返回数据根据结果进行相应的处理           
            if (result.code == 200) {
                imageData = result.data[0];
            }
        }
    });
    return imageData;
}


// // 图片上传
function _uploadSlcl(flieList, bsmCl, fileul, sizeNum) {
    var formData = new FormData();
    formData.append('bsmCl', bsmCl);
    formData.append('files', flieList);
    $.ajax({
        type: "post",  //提交方式  
        url: portal.api_url + "/portal/FillInformation/uploadSlcl",//路径  
        dataType: "json",
        cache: false, //上传文件不需要缓存
        processData: false, // 告诉jQuery不要去处理发送的数据
        contentType: false, // 告诉jQuery不要去设置Content-Type请求头
        data: formData,
        //数据，这里使用的是Json格式进行传输  
        success: function (result) {//返回数据根据结果进行相应的处理           
            if (result.code == 200) {
                fileul.parent().find('.fileListName .fileName').eq(fileul.find("li").length - 1).find('.operation').attr('bsmSlclmx', result.data[0].bsmSlclmx)
                if (fileul.find('.fileName').length === sizeNum) {
                    fileul.parent().find('.pictureUpload').show()
                    layer.msg('上传成功,并且以上传最大限度!');
                    fileul.parent().find('.file_name').css("z-index", "15");
                    fileul.parent().find('.updatetext').hide()
                    fileul.parent().find('.update').attr('src', '../../staticImages/Yes.png')
                } else {
                    layer.msg('上传成功!');
                }
            }
        }
    });
}

// 填报信息保存申请人信息和邮寄信息
function _saveSQR() {
    var isSave = false;
    // 申请人信息
    var d = {}, sqrList = [];
    var t = $('.sqrList').serializeArray();
    $.each(t, function () {
        d[this.name] = this.value;
    });
    d.userid = getCookie('myCookie').userid;
    sqrList.push(d);
    for (var i = 0; i < sqrList.length; i++) {
        sqrList[i].sqrlx = 1;
    }
    // 领证方式-邮寄地址
    var addMailRecordRequest = {};
    if (lzfs == 2) {
        var addressList = $('.addressForm').serializeArray();
        $.each(addressList, function () {
            addMailRecordRequest[this.name] = this.value;
        });
    }
    $.ajax({
        type: "post",  //提交方式  
        url: portal.api_url + "/portal/FillInformation/saveSQR",//路径  
        dataType: "json",
        async: false,
        contentType: 'application/json',
        data: JSON.stringify({
            'bsmSlsq': slsqxx.bsmSlsq,
            'gyfsbm': gyfsmc,
            'sqrlb': slsqxx.sqrlb,
            'lzfs': lzfs,
            'sqrList': sqrList,
            'addMailRecordRequest': addMailRecordRequest
        }),
        success: function (result) {//返回数据根据结果进行相应的处理           
            if (result.code == 200) {
                isSave = true
            } else {
                isSave = false
            }
        }
    });
    return isSave
}
//建立一個可存取到該file的url
function getObjectURL(file) {
    var url = null;
    if (window.createObjectURL != undefined) { // basic
        url = window.createObjectURL(file);
    } else if (window.URL != undefined) { // mozilla(firefox)
        url = window.URL.createObjectURL(file);
    } else if (window.webkitURL != undefined) { // webkit or chrome
        url = window.webkitURL.createObjectURL(file);
    }
    return url;
}