gongjijin/fund_h5/js/fund_h5_api.js

var token = '';
var tid = '';
var returnUrl = '';
var cityInfo = '';
var retrievePwd = '';
var qs = parseQueryString(window.location.href);

var httpStr=location.href.substr(0,location.href.indexOf("?") + 1); //str得到?之前的字符串

$().ready(function() {
    if (qs.returnUrl) {
        returnUrl = qs.returnUrl;
    }

    if (qs.token) {
        token = qs.token;
    } else {
        showMsg('未提供token!')
    }

    if (qs.name && qs.code) {
        $('.city-name').text(qs.name).attr('data-code', qs.code);
    }
	httpStr += "returnUrl=" + returnUrl;
    httpStr = encodeURIComponent(httpStr)
 console.log(httpStr)
    getLoginInfo();
    //头部切换公积金类型
    switchingType();
});

//头部切换公积金类型
function switchingType() {
	var btn = $("nav p");
	btn.click(function () {
		console.log(cityInfo)
		if(cityInfo !='' && cityInfo){
			window.location.href = './typeChoice.html?name=' + cityInfo.region + '&code=' + cityInfo.regionCode + (token ? ('&token=' + token) : '') + '&httpStr=' + httpStr;
		}else{
			showMsg('获取城市信息失败:' + cityInfo.region + '公积金查询');
		}
	})
}
/**
 * [showMsg 提示各种错误信息,3s后消失]
 */
function showMsg(msg) {
    var msgBox = $('.alert-info');
    msgBox.children('p').text(msg);
    msgBox.show();

    setTimeout(function() {
        msgBox.hide();
    }, 3000);
}

/**
 * [showDialog 弹窗提示,传不同的参数提示不同的内容以及按钮的内容和点击之后的作用]
 * failed 任务失败,点击关闭弹窗
 * maintain 当前城市维护中,点击关闭弹窗
 * timeout token过期,点击关闭页面
 */
function showDialog(type) {
    var mask = $('.mask');
    mask.show();
    $('.dialog-wrapper input').val('确定');
    $('.dialog-wrapper div').hide();
    if (type === 'failed') {
        $('.dialog-failed').show();
        $('.mask').addClass('bg-white').siblings().hide();
    } else if (type === 'maintain') {
        $('.dialog-maintain').show();
    } else if (type === 'timeout') {
        $('.dialog-timeout').show();
        $('.dialog-wrapper input').val('关闭').click(function() {
            redirectToFailedReturnUrl(tid, 'failed', 1020, '无效的token, 会话不存在或已过期');
        })
    } else if (type === 'forget') {
    	var html = '如果您忘记密码，需前往' + qs.name+ '公积金官网<br>重置密码'
        $('.dialog-forget').show();
        $('.dialog-forget').find('p').html(html)
        $('.dialog-wrapper input').val('立即前往').click(function() {
			tips.find(function(item, index) {
				if(item.region == cityInfo.region){
					if(item.URL.password){
						retrievePwd = item.URL.password;
						window.location.href=retrievePwd;
					}else{
						retrievePwd = item.URL.web;
						window.location.href=retrievePwd;
					}
				}
			})
        })
    }
}

/**
 * [enableCommitButton 启用/禁用提交按钮]
 * @param  {Boolean} isEnableButton [是否启用提交按钮]
 */
function enableCommitButton(isEnableButton) {
    var commitButton = $('#submitButton');
    if (isEnableButton) {
        commitButton.attr('disabled', false).removeClass('disable-commit').addClass('enable-commit');
    } else {
        commitButton.attr('disabled', true).removeClass('enable-commit').addClass('disable-commit');
    }
}

/**
 * [isInputReady 检查参数是否输入完毕]
 * @return {Boolean} [参数是否输入完毕]
 */
function isInputReady() {
    var isInputReady = true;
    var activeID = $('.tab-tab-active').attr('data-id');

    $('.tab-content [data-id="' + activeID + '"]')
        .find('input')
        .each(
            function(index, item) {
                if ($(item).val().trim() === '') {
                    isInputReady = false;
                }
                if (!$('.check').hasClass('check-active')) {
                    isInputReady = false;
                }
            })

    return isInputReady;
}

/**
 * [initEvent 初始化各种事件]
 */
function initEvent() {
    var tabs = $('.tab-tab');
    var activeID = $('.tab-tab-active').attr('data-id');

    // tab页切换
    tabs.click(function(event) {
        var currItem = $(this);
        var currId = currItem.attr('data-id');
        $('.tab-tab[data-id="' + currId + '"]').addClass('tab-tab-active').siblings().removeClass('tab-tab-active');
        $('.tab-content div[data-id=' + currId + ']').show().siblings().hide();
        enableCommitButton(isInputReady());
    })

    // 监测用户输入来设置提交按钮的状态
    $('.tab-content').on('keyup', function() {
        enableCommitButton(isInputReady());
    })

    // 确定按钮点击事件
    $('#closeMask').click(function(event) {
        $('.mask').removeClass('bg-white').hide().siblings().show();
        $('#tid').hide();
        $('.alert-info').hide();
        $('.loading-wrapper').hide();
    })

    // 解析协议checkBox选中/取消选中事件
    $('.check').click(function() {
        var currentItem = $(this);
        if (currentItem.hasClass('check-active')) {
            enableCommitButton(false);
            currentItem.removeClass('check-active');
        } else {
            currentItem.addClass('check-active');
            enableCommitButton(isInputReady());
        }
    })

    // 提交按钮点击事件
    $('#submitButton').click(function() {
        if (isInputValid()) {
            submitTask();
        }
    });
    // 导航栏左上角退出H5的点击事件
    $('#back').click(function() {
//      redirectToFailedReturnUrl(tid, 'failed', 1020, '退出公积金查询页');
//		window.history.go(-1)
    window.webkit.messageHandlers.PopRootMessageHandler.postMessage();
    })
}

/**
 * [getLoginInfo 获取城市登录信息]
 */
function getLoginInfo() {
    var regionCode = $('.city-name').attr('data-code');
    $.ajax({
        type: "GET",
        url: BASEURL + 'city_list?type=fund&token=' + token + '&regionCode=' + regionCode + '&time=' + Math.round(Date.now() / 1000),
//      url: '../../city_list?type=fund&token=' + token + '&regionCode=' + regionCode + '&time=' + Math.round(Date.now() / 1000),
        contentType: 'application/json;charset=utf-8',
        success: function(data) {
        	cityInfo = data;
        	console.log('data')
        	console.log(data)
            return renderLoginInfo(data);
        },
        error: function(err) {
//          return showMsg('获取城市信息失败:' + JSON.stringify(err));
            return showMsg('获取城市信息失败：' + qs.name + '公积金查询');
        }
    });
}

/**
 * [renderLoginInfo 渲染城市登录信息]
 * @param  {[type]} cityInfo [城市登录信息]
 */
function renderLoginInfo(cityInfo) {
    var tabWrapper = $('.tab-tab-wrapper');
    var tabConWrapper = $('.tab-content');
    var tabsHtmlStr = '';
    var tabConHtmlStr = '';

    $('.city-name').text(cityInfo.region).attr('data-code', cityInfo.regionCode);
//  $('.choose-city a').attr('href', './choose_city.html?name=' + cityInfo.region + '&code=' + cityInfo.regionCode + (token ? ('&token=' + token) : ''));
    $('nav span a').attr('href', './choose_city.html?name=' + cityInfo.region + '&code=' + cityInfo.regionCode + (token ? ('&token=' + token) : ''));
    $('.obtainPwd a').attr('href', './queryHelp.html?name=' + cityInfo.region + '&code=' + cityInfo.regionCode + (token ? ('&token=' + token) : '') + '&httpStr=' + httpStr);

    for (var index in cityInfo.loginTypes) {
        var loginType = cityInfo.loginTypes[index];
        if (index === '0') {
            tabsHtmlStr += '<div class="tab-tab tab-tab-active" data-id ="' + loginType.loginTypeId + '"><p class="tab-title">' + loginType.loginLabel + '</p><i class="hr-active"></i></div>';
            tabConHtmlStr += '<div data-id="' + loginType.loginTypeId + '" style="display:block">';
        } else {
            tabsHtmlStr += '<div class="tab-tab" data-id ="' + loginType.loginTypeId + '"><p class="tab-title">' + loginType.loginLabel + '</p><i class="hr-active"></i></div>';
            tabConHtmlStr += '<div data-id="' + loginType.loginTypeId + '" style="display:none">';
        }

        for (var loginField of loginType.loginFields) {
            var type = '';
            var placeStr = '';

            if (loginField.name.includes('联名卡')) {
                placeStr = '请输入公积金联名卡号';
            } else if (loginField.name.includes('身份证')) {
                placeStr = '首次查询请选择联名卡号';
            } else if (loginField.name.includes('密码')) {
                placeStr = '请输入密码';
                type = 'password';
            }
			if(loginField.name.includes('密码')){
				tabConHtmlStr += '<div class="input-wrapper inputForget" ><label for="">' + loginField.name + ':</label><input id="' + loginField.code + '" type="' + type + '" placeholder="' + placeStr + '"><div class="forget" onclick="forgetEvent()">忘记密码</div></div>';
			}else{
				tabConHtmlStr += '<div class="input-wrapper" ><label for="">' + loginField.name + ':</label><input id="' + loginField.code + '" type="' + type + '" placeholder="' + placeStr + '"></div>';
			}
        }
        tabConHtmlStr += '</div>';
    }
    tabWrapper.html(tabsHtmlStr);
    tabConWrapper.html(tabConHtmlStr);

    renderTips($('.city-name').text());
    initEvent(); // 各种事件绑定
    checkToken();
}

//点击忘记密码按钮
function forgetEvent () {
	showDialog('forget')
}
/**
 * [isInputValid 校验输入信息是否合法]
 * @return {Boolean} [输入信息是否合法]
 */
function isInputValid() {
    var isInputValid = true;
    var activeID = $('.tab-tab-active').attr('data-id');

    $('.tab-content [data-id="' + activeID + '"]')
        .find('input')
        .each(
            function(index, item) {
                var currentEle = $(item);
                // 通过label标签里面的文本来判断输入项的类型
                // 例如：
                // 身份证号:
                var labelText = currentEle.parent().find('label').text().replace(':', '');
                var value = currentEle.val();
                var reg = null;
                if (labelText && labelText.includes('身份证')) {
                    reg = /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/;
                    if (!reg.test(value)) {
                        showMsg('身份证输入格式不正确');
                        isInputValid = false;
                        return false;
                    }
                }

                if (labelText && (labelText.includes('电话') || labelText.includes('手机'))) {
                    reg = /^1[3456879]\d{9}$/;
                    if (!reg.test(value)) {
                        showMsg('电话(手机)号码输入格式不正确')
                        isInputValid = false;
                        return false;
                    }
                }

                if (labelText && labelText.includes('公积金')) {
                    reg = /^\d+$/;
                    if (!reg.test(value)) {
                        showMsg('公积金账号输入格式不正确')
                        isInputValid = false;
                        return false;
                    }
                }

                if (labelText && labelText.includes('联名卡')) {
                    reg = /^\d+$/;
                    if (!reg.test(value)) {
                        showMsg('联名卡输入格式不正确')
                        isInputValid = false;
                        return false;
                    }
                }

            })

    return isInputValid;
}

/**
 * [checkToken 校验token信息]
 */
function checkToken() {
    var getTokenInfo = $.ajax({
        type: 'GET',
        url: BASEURL + 'token?token=' + token + '&time=' + Math.round(Date.now() / 1000),
//      url: '../../token?token=' + token + '&time=' + Math.round(Date.now() / 1000),
        timeout: 30000,
        contentType: 'application/json;charset=utf-8'
    });

    getTokenInfo.done(function(data) {
        if (data.returnUrl && !returnUrl) {
            window.sessionStorage.isTokenValid = true;
            returnUrl = data.returnUrl;
        }

        if (data.appName) {
            var agreementLink = $('.agreement-wrapper a');
            agreementLink.attr('href', agreementLink.attr('href') + '?appName=' + data.appName);
        }

        if (data.region && data.loginLabel && data.inputData) {
            // 防止每次刷新都提交任务
            if (!window.sessionStorage.tid) {
                var task = {
                    type: 'fund',
                    region: data.region,
                    loginLabel: data.loginLabel,
                    inputData: JSON.parse(data.inputData),
                }
                return submitTask(task);
            }
        }

        if (data.tid) {
            $("#tid").val(data.tid);
            tid = data.tid;
            autoInputTaskInfo();
            checkTaskStatus(data.tid);
        }
    });

    getTokenInfo.fail(function(error) {
        window.sessionStorage.isTokenValid = false;
        enableCommitButton(false);

        if (error.responseJSON.code === 1020) {
            showDialog('timeout');
        } else {
            showMsg(error.responseJSON.error);
        }
    });
}

/**
 * [submitTask 提交查询任务]
 * @param  {[type]} data [查询任务相关参数]
 */
function submitTask(data) {
    showLoading(true);

    var url = BASEURL + "task?token=" + token + "&time=" + Math.round(Date.now() / 1000);
//  var url = "../../task?token=" + token + "&time=" + Math.round(Date.now() / 1000);
    var task = data || getTaskInfo();

    data ? null : saveTaskInfo();

    var posting = $.ajax({
        type: "POST",
        url: url,
        data: JSON.stringify(task),
        timeout: 30000,
        contentType: 'application/json;charset=utf-8'
    });

    posting.done(function(task) {
        tid = task.tid;
        $("#tid").val(task.tid); // for next submit
        window.sessionStorage.tid = tid;
        checkTaskStatus(task.tid);
    });

    posting.fail(function(error) {
        showLoading(false);

        if (error.responseJSON.code === 1029) {
            showDialog('maintain');
        } else if (error.responseJSON.code === 1011) {
            showMsg('身份证输入不正确');
        } else if (error.responseJSON.code === 1020) {
            showDialog('timeout');
        } else {
            showDialog('failed');
        }
    });
}

/**
 * [getTaskInfo 获取提交任务所需参数]
 * @return {[Object]} [提交任务所需参数]
 */
function getTaskInfo() {
    var task = {};
    var activeID = $('.tab-tab-active').attr('data-id');

    task.region = $('.city-name').attr('data-code');
    task.loginLabel = $(".tab-tab-active").text().trim();
    task.inputData = []; // 完整记录用户输入信息

    $("div[data-id='" + activeID + "'] input").each(function(index, item) {
        var currEle = $(item);
        task.inputData.push({
            key: currEle.attr('id'),
            value: currEle.val()
        })
    })

    if ($("#tid").val()) {
        task.tid = $("#tid").val();
    } else {
        task.type = 'fund';
    }

    return task;
}

/**
 * [saveTaskInfo 保存提交用户输入的信息在sessionStorage中,用于用户刷新后数据回填]
 */
function saveTaskInfo() {
    var ss = window.sessionStorage;
    var activeID = $('.tab-tab-active').attr('data-id');

    ss.activeID = activeID;

    var inputList = $('div [data-id="' + activeID + '"] input');

    inputList.each(function(index, item) {
        var currentEle = $(item);
        ss[currentEle.attr('id')] = currentEle.val();
    })
}

/**
 * [autoInputTaskInfo 用于用户刷新后从sessionStorage中拿到数据数据回填]
 */
function autoInputTaskInfo() {
    var ss = window.sessionStorage;
    var activeID = $('.tab-tab-active').attr('data-id');

    if (ss.activeID && (activeID !== ss.activeID)) {
        $('.tab-tab[data-id="' + ss.activeID + '"]').addClass('tab-tab-active').siblings().removeClass('tab-tab-active');
        $('.tab-content div[data-id=' + ss.activeID + ']').show().siblings().hide();
    }

    $("#tid").val(ss.tid);
    tid = ss.tid;

    for (var key in ss) {
        var currentEle = $("div [data-id='" + ss.activeID + "'] #" + key);
        currentEle.length > 0 ? currentEle.val(ss[key]) : null;
    }

    enableCommitButton(isInputReady());
}

/**
 * [checkTaskStatus 轮询任务状态]
 * @param  {[type]} tid [tid]
 */
function checkTaskStatus(tid) {
    var url = BASEURL + 'task?tid=' + tid + '&token=' + token + '&time=' + Math.round(Date.now() / 1000);
//  var url = '../../task?tid=' + tid + '&token=' + token + '&time=' + Math.round(Date.now() / 1000);
    var getting = $.get(url);

    getting.fail(function(error) {
        showMsg(error.responseJSON.error);
    });

    getting.done(function(task) {
        if (task.status === 'done') {
            process.stop(100);
            $("#tid").val('');
            showLoading(false);
            redirectToSucsessReturnUrl(task.tid, 'success');
            return;
        }

        if (task.status === "processing") {
            if ($('.loading-wrapper').css('display') === 'none') {
                showLoading(true);
            }

            setTimeout(function() {
                checkTaskStatus(tid);
            }, 1000);
            return;
        }

        if (task.status === "failed") {
            process.stop(100);
            tid = '';
            $("#tid").val('');
            showLoading(false);
            window.sessionStorage.clear();

            if (task.failCode === 1029) {
                showDialog('maintain');
            } else {
                showDialog('failed');
            }
            return;
        }

        if (task.status == "suspended") {
            process.stop(0);
            showLoading(false);
            enableCommitButton(false);

            switch (task.need) {
                case 'changeLoginType': // 无记录，请尝试切换登录类型
                case 'regionOrLogintype': // 请选择地区信息 | 请选择登录类型 | 请选择补充地区信息 | 该地区不支持公积金 | 发送的fundId或loginTypeId错误 
                                          // 你不是本地用户，请选择所属地区进行登录 | 所选的城市暂不支持，请选择其它城市登录
                    showMsg('你不是本地用户，请选择所属地区进行登录');
                    break;
                case 'accountOrpassword':
                    showMsg('账号或密码输入错误');
                    break;
                case 'parameterError':
                    showMsg('输入的信息有误');
                    break;
                default:
                    showMsg(task.need);
                    break;
            }
        }
    });
}

/**
 * [showLoading 显示loading界面]
 * @param  {Boolean} isShow [description]
 */
function showLoading(isShow) {
    if (isShow) {
        // 防止页面刷新之后进度从0开始
        if (window.sessionStorage.processRate) {
            process.start(parseInt(window.sessionStorage.processRate));
        } else {
            process.start(0);
        }

        $('.loading-wrapper').show().siblings().hide();
        $('html').addClass('bg-white');
    } else {
        process.stop(0);
        $('html').removeClass('bg-white');
        $('.loading-wrapper').hide().siblings().show();
    }
}

/**
 * [redirectToFailedReturnUrl 跳到redirectURL]
 */
function redirectToFailedReturnUrl(tid, result, failCode, reason) {
    if (returnUrl.indexOf('?') < 0) {
        returnUrl += "?result=" + result + "&tid=" + tid + "&token=" + token + "&failCode=" + failCode + "&reason=" + reason;
    } else {
        returnUrl += "&result=" + result + "&tid=" + tid + "&token=" + token + "&failCode=" + failCode + "&reason=" + reason;
    }

    window.sessionStorage.clear();
    window.location.href = returnUrl;
}

/**
 * [redirectToSucsessReturnUrl 跳到redirectURL]
 */
function redirectToSucsessReturnUrl(tid, result) {
    if (returnUrl.indexOf('?') < 0) {
        returnUrl += "?result=" + result + "&tid=" + tid + "&token=" + token;
    } else {
        returnUrl += "&result=" + result + "&tid=" + tid + "&token=" + token;
    }

    window.sessionStorage.clear();
    window.location.href = returnUrl;
}

/**
 * [renderTips 渲染常见问题]
 * @param  {[type]} region [description]
 */
function renderTips(region) {
    var tipStr = "<p>常见问题</p>";
    var defaultTip = null;
    var defaultRegion = '北京';

    var tipContent = tips.find(function(item, index) {
        if (item.region === defaultRegion) {
            defaultTip = item;
        }
        return item.region === region;
    });

    if (!tipContent) {
        tipContent = defaultTip; // 默认北京
    }

    tipContent = tipContent.tip;

    for (var list of tipContent) {
        tipStr += "<p>" + list.title + "</p>";
        if (list.content) {
            for (var tip of list.content) {
                tipStr += "<p>" + tip + "</p>"
            }
        }
    }

    $('.tips').html(tipStr);
}

/**
 * [Process 任务进度显示]
 */
function Process(opt) {
    this.ele = opt.ele;
    this.rate = 0;
    this.afterStart = opt.afterStart;
    this.afterStop = opt.afterStop;
    this.timer = null;
    this.step = null;
    this._getInterval = function() {
        return Math.round((Math.random() * 100) + 300);
    };
    this._getStep = function() {
        return Math.round(Math.random() * 3);
    };
}

Process.prototype.start = function(rate) {
    this.rate = rate == undefined ? this.rate : rate;
    let _this = this;
    let interval = this._getInterval();
    this.timer = setInterval(function() {
        interval = _this._getInterval();
        _this.step = _this._getStep();
        _this.afterStart && _this.afterStart.call(_this);
    }, interval);
}

Process.prototype.stop = function(rate) {
    this.rate = rate == undefined ? this.rate : rate;
    clearInterval(this.timer);
    this.afterStop && this.afterStop();
}

var process = new Process({
    ele: $('.process'),
    interval: 1000,
    afterStart: function() {
        this.rate += this.step;

        if (this.rate >= 97) {
            this.rate = 99;
            this.stop(this.rate);
        }

        this.ele.text(this.rate + '%');
        window.sessionStorage.processRate = this.rate;
    },
    afterStop: function() {
        this.ele.text(this.rate + '%');
        window.sessionStorage.processRate = this.rate;
    }
})