$(function () { // 格式化金钱的函数 // s: 金额(number) 必传 // n: 保留小数的位数(int:0-100) function formatMoney(s, n) { if (n === undefined) { n = -1 } else { n = n > 0 && n <= 20 ? n : 2; } var intS = parseInt(s) var point = '.' var left; var right; s = parseFloat((s + '').replace(/[^\d\.-]/g, '')) // 没传n,默认(如果为整数,则不保留小数。如果为浮点数,则保留两位小数) if (n === -1) { if (s === intS) { n = 0 right = '' point = '' } else { n = 2 s = s.toFixed(n); right = s.split('.')[1]; } s = s + '' left = s.split('.')[0].split("").reverse(); } else { s = parseFloat((s + '').replace(/[^\d\.-]/g, '')).toFixed(n) + ''; left = s.split('.')[0].split('').reverse(); right = s.split('.')[1]; } t = ""; for (i = 0; i < left.length; i++) { t += left[i] + ((i + 1) % 3 == 0 && (i + 1) != left.length ? ',' : ''); } var money = t.split('').reverse().join('') + point + right; return money; } //项目匹配开关 var checkedflag = true; function setprojectmatch(index) { if (checkedflag) { checkedflag = false; $.post("/subscribepay/afterPay/setUserInfo", {pageType: "projectMatch", pmindex: index}, function (r) { if (r.flag) { checkedflag = true; reqData.projectmatch = index; sessionStorage.setItem('sub_vip_state', JSON.stringify(reqData)) } }) } } function getDataWitXHR() { $DoPost('/subscribepay/vipsubscribe/getSubBuyMsg', {}, function (res) { if (!res.success) return; res.data.oldArea = res.data.area; res.data.oldIndustry = res.data.industry; var globalStateStr = JSON.stringify(res.data); sessionStorage.setItem('sub_vip_state', globalStateStr); globalState = JSON.parse(globalStateStr); init(res.data) }) } //获取选择 function getCount(area, industry) { if (industry[0] === "全部行业") industry = []; if (area["全国"]) area = {}; //计算地区数量 var count = { "areacount": -1, //省份数量 "buyerclasscount": -1, "citys": [] //购买省份中城市数量 }; //行业 if (industry.length != 0) { count.buyerclasscount = industry.length } //地区 if (!$.isEmptyObject(area)) { count.areacount = 0; for (var i in area) { var citys = area[i]; var thisLen = citys.length; if (thisLen === 0) { count.areacount++ } else { count.citys.push(thisLen) } } } return count } // 设置已选择的区域和行业 /** * selected = { * areacount: 2, * buyerclasscount: 2, * citys: [1, 2, 3] * } */ function setSelectedAreaAndInd(selected) { // selected = { // areacount: 2, // buyerclasscount: 2, // citys: [1, 2, 3] // } // 设置已选择区域 var citySum = arrSum(selected.citys) var text = { p: selected.areacount + '个省', c: citySum + '个市', s: '分布在' + selected.citys.length + '个省内' } if (selected.areacount === -1) { $('.vip-body .area .selected-area').text('全国') } else { if (selected.areacount === 0) { $('.vip-body .area .selected-area').text(text.c + '(' + text.s + ')') } else if (selected.citys.length === 0) { $('.vip-body .area .selected-area').text(text.p) } else { $('.vip-body .area .selected-area').text(text.p + '、' + text.c + '(' + text.s + ')') } } // 设置已选择行业 if (selected.buyerclasscount === -1) { $('.vip-body .industry .selected-industry').text('全行业') } else { $('.vip-body .industry .selected-industry').text(selected.buyerclasscount + '个行业') } } // 设置已购买的区域和行业 /** * buyset = { * areacount: 2, * buyerclasscount: 2, * newcitys: [1, 2, 3] * } */ function setBuyAreaAndInd(buySet) { // 设置已购买区域 var buySetCitySum = arrSum(buySet.newcitys) var text = { p: buySet.areacount + '个省', c: buySetCitySum + '个市', s: '分布在' + buySet.newcitys.length + '个省内' } if (buySet.areacount === -1) { $('.vip-body .area .buy-set-area').text('全国') } else { if (buySet.areacount === 0) { $('.vip-body .area .buy-set-area').text(text.c + '(' + text.s + ')') } else if (buySet.newcitys.length === 0) { $('.vip-body .area .buy-set-area').text(text.p) } else { $('.vip-body .area .buy-set-area').text(text.p + '、' + text.c + '(' + text.s + ')') } } // 设置已选择行业 if (buySet.buyerclasscount === -1) { $('.vip-body .industry .buy-set-industry').text('全行业') } else { $('.vip-body .industry .buy-set-industry').text(buySet.buyerclasscount + '个行业') } } function clearSession() { sessionStorage.removeItem("vip_index_read"); sessionStorage.removeItem('sub_vip_state'); } function arrSum(arr) { var sum = 0 arr.forEach(function (item, i) { sum += item }) return sum } // picker的显示隐藏 function pickerShow(selector, f) { if (f) { // 添加进场动画,并显示 $(selector).find('.weui-mask').removeClass('weui-animate-fade-out').addClass('weui-animate-fade-in') $(selector).find('.weui-picker').removeClass('weui-animate-slide-down').addClass('weui-animate-slide-up') $(selector).show(300); } else { // 添加离场动画,并隐藏 $(selector).find('.weui-mask').removeClass('weui-animate-fade-in').addClass('weui-animate-fade-out') $(selector).find('.weui-picker').removeClass('weui-animate-slide-up').addClass('weui-animate-slide-down') $(selector).hide(300); } } // 项目匹配问号点击事件 $('.project-match .icon-bangzhu').on('click', function () { var str = '开启后,系统将根据你订阅的关键词自动匹配出相关联的项目,并将相关联项目的后续动态在VIP订阅内一并推送。' weui.alert(str, { title: '项目匹配', className: 'jy-alert', buttons: [{ label: '我知道了' }] }); }) // 计算标准点击事件 $('.billing-list-btn').on('click', function () { pickerShow('.billing-list-container', true) }) // 计算标准隐藏 $('.billing-list-container .dialog_hd__close').on('click', function () { pickerShow('.billing-list-container', false) }) $('.weui-mask').on('click', function () { pickerShow('.billing-list-container', false) }) // 阅读并接受协议前的模拟checkbox点击事件 if (sessionStorage.getItem("vip_index_read") == "1") { $('.checkbox').addClass("checked") $('.vip-footer.upgrade .confirm').prop('disabled', false); } $('.checkbox').on('click', function () { $(this).toggleClass('checked'); var state = $(this).hasClass('checked'); $('.vip-footer.upgrade .confirm').prop('disabled', !state); sessionStorage.setItem("vip_index_read", state ? "1" : "0"); }); // switch点击切换 $('.switch').on('click', function (e) { var $this = $(this); var hasChecked = $this.hasClass('checked'); if (!hasChecked) { $this.addClass('checked'); setprojectmatch(1); } else { $this.removeClass('checked'); setprojectmatch(0); weui.toast('项目匹配已关闭', { duration: 1500, className: 'jy-toast', callback: function () { console.log('close') } }); } }) //保存取消提示 module 1 修改 2升级 function cancelTip(module) { weui.dialog({ title: '提示信息', content: module == 1 ? '所选订阅设置已做修改,返回后修改的设置将不做保存。' : '所选订阅设置已超出购买范围,升级后方才生效,返回后修改的设置将不做保存。', className: 'jy-dialog', buttons: [ { label: module == 1 ? '保存修改' : '立即升级', type: 'primary', onClick: function () { doSubmit(); } }, { label: '取消', type: 'default', onClick: function () { clearSession() window.history.go(-1); } } ] }); } function initCycleSelector() { $('.vip-body .body-item.cycle').on('click', function () { pickerShow('#time_cycle', true) }) // 打开dialog $('#time_cycle .weui-mask').on('click', function () { pickerShow('#time_cycle', false) }) // 关闭dialog $('#time_cycle .box_hd .cancel').on('click', function () { pickerShow('#time_cycle', false) }) // 选择完成(确定)按钮的点击事件 $('#enter_period').on('click', function () { var checkedValue = $('#time_cycle input:radio[name="time"]:checked').val(); var result = null if (checkedValue == 'month') { result = $('#number_box_month .month_number').text() + '个月' } else if (checkedValue == 'year') { result = $('#number_box_year span.active').attr('data-id') + '年' } console.log(result) $('.vip-body .extend-cycle').show().text('延长订阅周期' + result) pickerShow('#time_cycle', false) }) // 1. 对订阅时间选择的input绑定点击事件 $('#time_cycle input:radio[name="time"]').on('click', function (e) { // 解除确认按钮的锁定 $('#time_cycle .form-btn button').removeAttr('disabled') if ($(e.target).hasClass('monthly')) { // 按月订阅 $('#number_box_month').addClass('active'); $('#number_box_year span').removeClass('active'); } else { // 按年订阅 $('#number_box_month').removeClass('active'); // $('#number_box_year span:eq(0)').addClass('active').siblings().removeClass('active'); } }) /* --------控制月份number_box的事件 点击加减号触发的事件------- */ $('#number_box_month').on('click', 'button', function (e) { // 点击加减号让input radio选中 $("#monthly").prop('checked', true); $('#yearly').prop('checked', false); $('.number_box span').removeClass('active') $('#number_box_month').addClass('active'); var $number = $('#number_box_month span.month_number'); var $monthlyInput = $('#monthly'); // 未整理的data数组,里面的值都是字符串 var preData = e.delegateTarget.dataset var currentNum = parseInt($number.text()); var data = {}; // 把字符串转换成数字 for (var i in preData) { data[i] = preData[i] - 0 } if (!$monthlyInput.prop('checked')) { return } // 判断是点击的是+ 还是- if ($(e.target).hasClass('add')) { // 点的+ // currentNum = currentNum >= 12 ? 12 : currentNum + 1; currentNum = currentNum >= data.numboxMax ? data.numboxMax : currentNum + data .numboxStep; } else { // 点的- // currentNum = currentNum <= 1 ? 1 : currentNum - 1; currentNum = currentNum <= data.numboxMin ? data.numboxMin : currentNum - data .numboxStep; } $number.text(currentNum) var price = (5.8 * currentNum).toFixed(1); $('.computed_price').html('¥' + price) var firstButton = $('#number_box_month button:first') var lastButton = $('#number_box_month button:last') if (currentNum >= 10) { $('.profit_tips').show() } else { $('.profit_tips').hide() } // 如果为操作后的结果为1,则锁定减号按钮 if (currentNum === data.numboxMin) { firstButton.attr('disabled', true) } else { firstButton.removeAttr('disabled') } // 如果为操作后的结果为12,则锁定加号按钮 if (currentNum === data.numboxMax) { lastButton.attr('disabled', true) } else { lastButton.removeAttr('disabled') } }) /* -------- 控制年份number_box的事件 点击1年 2年 3年触发的事件------- */ $('#number_box_year').on('click', 'span', function (e) { $('#number_box_month').removeClass('active'); console.log(e.target.dataset.id) var id = e.target.dataset.id; $('.profit_tips').hide() $(this).addClass('active').siblings().removeClass('active') $('#yearly').prop('checked', true); $("#monthly").prop('checked', false); // 渲染结果 保留一位小数 var result = (Number(id) * 58).toFixed(1); $('.computed_price').html('¥' + result) }) /* -------- 选择按月订阅 radio触发的事件------- */ $('#monthly').on('change', function (e) { var isChecked = $(this).is(':checked') var val = $('.month_number').text(); if (val >= 10) { $('.profit_tips').show() } if (!isChecked) { $('#number_box_month button').attr('disabled', true) } else { $('#number_box_month button').removeAttr('disabled') } if (val == 1) { $('#number_box_month button:eq(0)').prop('disabled', true) } if (val == 12) { $('#number_box_month button:eq(1)').prop('disabled', true) } var result = (Number(val) * 5.8).toFixed(1); $('.computed_price').html('¥' + result) }) /* -------- 选择按年订阅 radio触发的事件------- */ $('#yearly').on('change', function (e) { $('.profit_tips').hide() // console.log($(this).is(':checked')) var isChecked = $(this).is(':checked') // 按年订阅默认选择1年 var val = 1; $('.computed_price').html('¥' + Number(val) * 58) if (isChecked) { $('#number_box_year span:eq(0)').addClass('active').siblings().removeClass('active') } }) } // 以下数据交互 ------------------- // 定义全部变量state var globalState = {} var changeTime = []; var submitPrice = 0; function init(state) { // init 已选择的区域和行业 var selectedAreaAndInd = getCount(state.area, state.industry) setSelectedAreaAndInd(selectedAreaAndInd) // 初始化,已购买的城市和行业 setBuyAreaAndInd(state.buyset) // 初始化订阅周期 var dStart = new Date(state.startTime * 1000).pattern('yyyy年MM月dd日') var dEnd var change = sessionStorage.getItem("vip_change_time"); if (change) { var afterEndTime if (change.indexOf("月") > -1) { var monthNum = parseInt(change.replace("个月", "")); afterEndTime = getVipEndDate(2, monthNum, state.endTime) changeTime = [monthNum, 2] } else { var yearNum = parseInt(change.replace("年", "")); afterEndTime = getVipEndDate(1, yearNum, state.endTime) changeTime = [yearNum, 1] } dEnd = new Date(afterEndTime * 1000).pattern('yyyy年MM月dd日'); $(".body-item.cycle .tip").show(); } else { dEnd = new Date(state.endTime * 1000).pattern('yyyy年MM月dd日') } var sDuration = dStart + ' - ' + dEnd $('.body-item.cycle .buy-cycle').text(sDuration) // 初始化关键词 if (state.items.lenght === 0) { $('.body-item.keywords .keywords-text').text('未分类') } else { var arr = [] state.items.forEach(function (item, index) { arr.push(item['s_item']) }) $('.body-item.keywords .keywords-text').text(arr.join('、')) } // 初始化信息类型 if (state.infotype.length === 0) { $('.body-item.info-type .info-type-text').text('全部类型') } else { $('.body-item.info-type .info-type-text').text(state.infotype.join('、')) } // 推送设置初始化 var pushSettingMap = { 1: '实时推送', 2: '每日推送', 3: '每周推送', 4: '每月推送', } $('.body-item.push-setting .push-setting-text').text(pushSettingMap[state.ratemode]) // 初始化项目匹配 if (state.projectmatch) { $('.switch').addClass('checked') } else { $('.switch').removeClass('checked') } } // 给订阅周期栏目绑定点击事件(订阅周期选择框显示与隐藏等各种操作) //initCycleSelector() var subVipState = sessionStorage.getItem('sub_vip_state'); var reqData = JSON.parse(subVipState); if (subVipState) { init(reqData); //判断是否修改 var IndustryNoChange = JSON.stringify(reqData.oldIndustry.sort()) === JSON.stringify(reqData.industry.sort()); var tmp1 = getAreaClassArr(reqData.oldArea); var tmp2 = getAreaClassArr(reqData.area); var areaNoChange = (JSON.stringify(tmp1[0].sort()) === JSON.stringify(tmp2[0].sort())) && (JSON.stringify(tmp1[1].sort()) === JSON.stringify(tmp2[1].sort())); if (IndustryNoChange && areaNoChange && changeTime.length==0) { return } //判断是否需要升级 var status = getUpgradeFinalStatus(getBuySet(reqData.area, reqData.industry), { "areacount": reqData.buyset.areacount, "buyerclasscount": reqData.buyset.buyerclasscount, "citys": reqData.buyset.newcitys }, changeTime, reqData.endTime, reqData.renewList); if (status[0] === -2) { alert("出错"); return } if (status[0] === -1) { //直接修改 $(".vip-footer.modify").show(); $('.vip-footer .button-l.reset').on("click", function () { cancelTip(1); }) return } if (status[0] > 0) { //需要付钱 $(".vip-footer.upgrade").show(); //价格展示 $(".vip-footer.upgrade .billing-price").text("¥" + formatMoney(status[0])) submitPrice = status[0] * 100 } //区域需要升级 if (status[1]) { $(".body-item.area .tip-need-upgrade").show(); } //行业需要升级 if (status[2]) { $(".body-item.industry .tip-need-upgrade").show() } if (!status[1] && !status[2]) { $(".vip-footer.upgrade .confirm").text("立即续费"); } $('.vip-footer .button-l.reset').on("click", function () { cancelTip(2); }) } else { getDataWitXHR() } //提交请求 $('.vip-footer .button-r.confirm').on('click', function () { $(this).attr("disabled", "disabled"); doSubmit(); $(this).removeAttr("disabled"); }) //保存 or 升级 function doSubmit() { $DoPost('/subscribepay/vipsubscribe/saveChange', { "area": reqData.area["全国"] ? '{}' : JSON.stringify(reqData.area), "industry": reqData.industry.join(","), "payWay": "wx_js", "time": sessionStorage.getItem("vip_change_time"), "price": submitPrice }, function (res) { console.log(res) }, false); } });