shebao-baidu-MiniProgram/page/homepage/pages/s-payback/s-payback.js

var businessT = require('../../../../tool/business-tool.js')
var sysT = require('../../../../tool/sys-tool.js')
var url = require('../../../../constant/url.js')
import Net from '../../../../tool/net.js'
var net = new Net()
var app = getApp()
var wxyj = require('../../../../public/wxyj.js')
Page({

    // 页面的初始数据
    data: {
        ui: [
            { p1: "299", p2: "￥299.00" },
            ['本地城镇', '本地农村', '外地城镇', '外地农村'],
            [
                { c: '重要说明(必读)', d: ['补缴必须与正常月份一起操作，所以下补缴单前请先下一个月正常单（点击首页-缴社保）', '补缴不能跨月操作。例如，现在可以下10月份订单，那么补缴必须从9月开始往前连续购买，不可从8月份或者其他月份开始（若9月份已缴费就不能操作补缴了）', '本平台仅支持代缴服务，不支持生育津贴、住房补贴等申领，不支持住院等大额医疗报销，且不出具任何相关证明。'] }
            ],
            ['购买流程', '平台优势', '常见问题', '温馨提示'],
            ['覆盖城市最广，且每个城市提供专职客服服务', '百万用户点赞过，再也不担心收钱不买'],
            [{ c: '专业团队操作', p: 'advantage_professional' }, { c: '百万用户点赞', p: 'advantage_like' }, { c: '品质有保证', p: 'advantage_quality' }],
            ['避免因错过了截止时间忘记下单，造成社保断缴的，建议一次性购买多个月份。若有新的工作单位，未缴费的月份可申请退款。若申请退费，请于该月份截止购买前联系客服。', '凡带有“年缴”标识的，首月会一次性收取一年费用，年费会因地区和缴费月份不同稍有变化。', '带有“预收费用”的城市，因社保局已确定调费，但上调金额未定，固将预收一定的费用。待社保局确定上调金额后，我们会统一清算，多退少补（如：杭州市一般于6月份公布，但须从当年1月份开始执行）。', '每年政府会调整社保缴费基数，我们会在第一时间通知您。若因政府调整通知滞后导致划扣金额不准确的，我们承诺多退少补，童叟无欺。', '本套餐适合于18岁至法定退休年龄之间的用户购买。']
        ],
        index: 0,
        dataset: ['city', 'type', 'hukou'],
        currentData: [{ t: '参保城市', c: '广州' }, { t: '参保方案', c: '二档(补缴)' }, { t: '户籍性质', c: '本地城镇' }],//当前选择的数据
        typeStatus: '',//参保方案是否可选
        city: [],
        lineX: 0,//蓝线的位置
        currentCity: { name: '广州', id: '1001' },
        currentType: 0,
        detailIndex: 0,
        time: '',
        haveYearPay: false,
        maxIndex: '',
        totalPrice: [{ c: '', p: '' }],
        scrollInto: '',
        scrollTop: '',
        scrollHeight: 0,
        anchor: 'anchor',
        anchorIndex: 0,
        n: 0
    },
    goNext() {
        if (app.loginStatus.isLogin) {
            if (this.data.data.addeds_num == 0) {
                swan.showToast({
                    title: '该城市不支持补缴',
                    icon: 'none',
                    mask: true
                });
                return
            }
            swan.navigateTo({
                url: '../../../../public/pages/choose-person/choose-person?type=1'
            });
        } else {
            swan.navigateTo({
                url: '../../../login/pages/shebaoLogin/shebaoLogin',
            })
        }
    },
    openModal(e) {
        var pickerData
        if (e.currentTarget.dataset.type == 'city') {
            pickerData = this.data.city.concat()
        } else if (e.currentTarget.dataset.type == 'type') {
            pickerData = [['一档(补缴)', '二档(补缴)']]
        } else if (e.currentTarget.dataset.type == 'hukou') {
            pickerData = [['本地城镇', '本地农村', '外地城镇', '外地农村']]
        }
        this.chooseCityModal = this.selectComponent("#chooseCityModal");
        this.chooseCityModal.openModal(pickerData, e.currentTarget.dataset.type)
    },
    initData() {
        swan.showLoading({
            title: '请稍后...',
            mask: true,
        });
        this.data.currentCity = wxyj.wxyjData.currentCity
        this.data.currentData[0].c = this.data.currentCity.name
        net.connect({
            url: url.app_host + url.getSupplementaryPurchaseData,
            data: { city_code: this.data.currentCity.id, type: 1 },
            method: "POST",
            success: (err, res) => {
                swan.hideLoading()
                var index
                if (wxyj.wxyjData.type == 1) {
                    index = 0
                    this.data.currentData[1].c = '二档(补缴)'
                } else {
                    index = 1
                    this.data.currentData[1].c = '一档(补缴)'
                }
                wxyj.wxyjData.data = res.data
                this.data.data = wxyj.wxyjData.data.wxyj[index]
                this.setData({ data: wxyj.wxyjData.data.wxyj[index],servicePrice: wxyj.wxyjData.data.wxyj[index].added_charge.toFixed(2) })
                if (this.data.data.shebao_type.indexOf('标准') !=-1) {
                    this.setData({ typeStatus: false })
                } else {
                    this.setData({ typeStatus: true })
                }
                this.moveLine(null, wxyj.wxyjData.detailIndex)
                this.refreshData(true)
            },
            fail: (err, res) => {
                swan.hideLoading()
                swan.showToast({
                    title: '加载数据失败！请检查网络设置！',
                    icon: 'none'
                })
            }
        }, true)

    },
    initCity() {
        net.connect({
            url: url.app_host + url.getPurchaseCity,
            data: '',
            method: "POST",
            success: (err, res) => {
                var arr1 = [], arr2 = []
                res.data.forEach(function (item) {
                    if (item.isCity) {
                        arr1.push(item)
                    } else {
                        arr2.push(item)
                    }
                })
                wxyj.wxyjData.city = [...arr1]
                wxyj.wxyjData.province = [...arr2]
            },
            fail: (err, res) => {
                swan.showToast({
                    title: '加载数据失败！请检查网络设置！',
                    icon: 'none'
                })
            }
        }, true)
    },
    refreshData(isFirst) {
        this.setData({
            currentData: this.data.currentData,
            detailIndex: wxyj.wxyjData.detailIndex,
            data: this.data.data,
            city: [wxyj.wxyjData.province, wxyj.wxyjData.city],
            sale: wxyj.wxyjData.data.sb_vol
        })
           if (typeof(this.data.data.shebao_note)=='string'&&this.data.data.shebao_note) {
                    this.data.data.shebao_note = this.data.data.shebao_note.split('\n')
                }
        this.haveYearPay(isFirst)
        this.countPrice(isFirst)
    },
    changeCurrent(e) {
        if (e.detail.type == "city") {
            wxyj.wxyjData.currentCity = e.detail.data
            wxyj.wxyjData.lastValue = e.detail.lastValue
            wxyj.wxyjData.type = 1
            this.data.currentData[1].c = '二档(补缴)'
            this.setData({ currentCity: e.detail.data })
            this.initData()
            this.refreshHeight()
        } else if (e.detail.type == "type") {
            wxyj.wxyjData.type = e.detail.index
            if (e.detail.index == 0) {
                this.data.data = wxyj.wxyjData.data.wxyj[1]
                this.data.currentData[1].c = this.data.data.shebao_type
            } else if (e.detail.index == 1) {
                this.data.data = wxyj.wxyjData.data.wxyj[0]
                this.data.currentData[1].c = this.data.data.shebao_type
            }
            this.refreshData(true)
        } else if (e.detail.type == "hukou") {
            wxyj.wxyjData.hukou = e.detail.data
            this.data.currentData[2].c = wxyj.wxyjData.hukou
            this.moveLine(null, e.detail.index)
            this.setData({
                detailIndex: e.detail.index
            })
        }
        swan.hideLoading();
        this.setData({ currentData: this.data.currentData })
    },
    moveLine(e, index) {
        if (e) {
            var n = e.currentTarget.dataset.index
            this.setData({ lineX: 190 * n, detailIndex: n })
            if (n == 0) {
                wxyj.wxyjData.hukou = '本地城镇'
            } else if (n == 1) {
                wxyj.wxyjData.hukou = '本地农村'
            } else if (n == 2) {
                wxyj.wxyjData.hukou = '外地城镇'
            } else if (n == 3) {
                wxyj.wxyjData.hukou = '外地农村'
            }
            wxyj.wxyjData.detailIndex = n
            this.setData({ currentData: this.data.currentData, detailIndex: n })
        }
        if (index || index == 0) {
            this.setData({ lineX: 190 * index, detailIndex: index })
        }
        this.refreshHeight()
        this.refreshData()
    },
    haveYearPay(isFirst) {
        if (isFirst) {
            var data = this.data.data.shebaos
            data.forEach((item, index) => {
                if (item.data.length != 0) {
                    item.data.forEach((item2, index2) => {
                        if (item2.n.indexOf('(年缴)') != -1) {
                            item2.n = item2.n.slice(0, 7)
                            item.data.splice(index2, 1)
                            this.setData({
                                haveYearPay: true,
                                yearPayData: item2
                            })
                            wxyj.wxyjData.haveYearPay = true
                            wxyj.wxyjData.yearPayData =item2
                        } else {
                            this.setData({
                                haveYearPay: false
                            })
                            wxyj.wxyjData.haveYearPay = false
                            wxyj.wxyjData.yearPayData =''
                        }
                    })
                }
            })
        }
    },
    countPrice(isFirst) {
        if (isFirst) {
            var data = this.data.data.shebaos
            var arr = []
            data.forEach(function (item) {
                item.data.sort(function sort(a, b) {
                    return a.i - b.i
                })
                item.data.forEach(function (i) {
                    i.p = Number(i.p).toFixed(2)
                })
            })
            this.setData({ data: this.data.data })
        }
        var totalPrice = 0
        if (this.data.data.shebaos[this.data.detailIndex].data.length != 0) {
            this.data.data.shebaos[this.data.detailIndex].data.forEach((item) => {
                totalPrice += Number(item.p)
            })
            totalPrice=totalPrice.toFixed(2)
            var totalPrice2=Number(totalPrice).toFixed(2)
             if (this.data.haveYearPay) {
                totalPrice = (Number(totalPrice) + this.data.yearPayData.p).toFixed(2)
            }
        }
        if (this.data.haveYearPay) {
            this.setData({
                totalPrice: [{ c: '本年首月套餐费用', p: totalPrice }, { c: '非首月套餐费用', p: totalPrice2 }]
            })
        } else {
            this.setData({
                totalPrice: [{ c: '套餐费用', p: totalPrice }]
            })
        }
    },
    anchorAction(e) {
        var moveX = Math.ceil((this.data.anchorWidth - this.data.anchorItemWidth * 4) / 3 + this.data.anchorItemWidth)
        var n = e.currentTarget.dataset.index
        this.setData({ anchorIndex: n })
        var animation = swan.createAnimation({
            duration: 300
        });
        if (n == 0) {
            animation.translateX(0).step();
            this.setData({
                scrollTop: this.data.anchorY + Math.random(),
                animationData: animation.export()
            })
        } else if (n == 1) {
            animation.translateX(moveX).step();
            this.setData({
                scrollTop: this.data.advantageY + Math.random(),
                animationData: animation.export()
            })
        } else if (n == 2) {
            animation.translateX(moveX * 2).step();
            this.setData({
                scrollTop: this.data.askY + Math.random(),
                animationData: animation.export()
            })
        } else if (n == 3) {
            animation.translateX(moveX * 3).step();
            this.setData({
                scrollTop: this.data.tipsY + Math.random(),
                animationData: animation.export()
            })
        }
    },
    countHeight() {
        swan.getSystemInfo({
            success: res => {
                this.setData({
                    scrollHeight: res.screenHeight - res.statusBarHeight - res.navigationBarHeight
                })
            }
        })
    },
    refreshHeight() {
        //页面高度变化后，重新获取每个锚点的位置
        setTimeout(() => {
            swan.createSelectorQuery().select('#wrapBox').boundingClientRect((rect) => {
                if (!rect) {
                    return
                }
                var newHeight = parseInt(rect.height)
                var disHeight = newHeight - this.data.oldHeight
                var anchorY = this.data.anchorY + disHeight
                var progressY = this.data.progressY + disHeight
                var advantageY = this.data.advantageY + disHeight
                var askY = this.data.askY + disHeight
                var tipsY = this.data.tipsY + disHeight
                this.setData({
                    oldHeight: newHeight,
                    anchorY,
                    progressY,
                    advantageY,
                    askY,
                    tipsY
                })
            }).exec()
        }, 400)
    },
    scrollAction(e) {
        var moveX = Math.ceil((this.data.anchorWidth - this.data.anchorItemWidth * 4) / 3 + this.data.anchorItemWidth)
        var scrollTop = e.detail.scrollTop
        if (scrollTop > this.data.anchorY) {
            this.setData({
                anchor: 'anchorPosition'
            })
        } else if (scrollTop < this.data.anchorY) {
            this.setData({
                anchor: 'anchor'
            })
        }
        var animation = swan.createAnimation({
            duration: 300
        });
        if (scrollTop < this.data.advantageY) {
            animation.translateX(0).step();
            this.setData({
                anchorIndex: 0,
                animationData: animation.export()
            })
        } else if (scrollTop > this.data.advantageY && scrollTop < this.data.askY) {
            animation.translateX(moveX).step();
            this.setData({
                anchorIndex: 1,
                animationData: animation.export()
            })
        } else if (scrollTop > this.data.askY && scrollTop < this.data.tipsY) {
            animation.translateX(moveX * 2).step();
            this.setData({
                anchorIndex: 2,
                animationData: animation.export(),
            })
        } else if (scrollTop > this.data.tipsY) {
            animation.translateX(moveX * 3).step();
            this.setData({
                anchorIndex: 3,
                animationData: animation.export()
            })
        }
        this.setData({ n: scrollTop })
    },
    countAnchorPosition() {
        swan.createSelectorQuery().select('#wrapBox').boundingClientRect((rect) => {
            this.setData({
                oldHeight: parseInt(rect.height)
            })
        }).exec()
        swan.createSelectorQuery().select('#anchor').boundingClientRect((rect) => {
            var top = parseInt(rect.top)
            this.setData({
                anchorY: top
            })
        }).exec()
        swan.createSelectorQuery().select('#advantage').boundingClientRect((rect) => {
            var top = parseInt(rect.top)
            this.setData({
                advantageY: top
            })

        }).exec()
        swan.createSelectorQuery().select('#ask').boundingClientRect((rect) => {
            var top = parseInt(rect.top)
            this.setData({
                askY: top
            })
        }).exec()
        var tips='#tips'+this.data.suffix
        swan.createSelectorQuery().select(tips).boundingClientRect((rect) => {
            var top = parseInt(rect.top)
            this.setData({
                tipsY: top
            })
        }).exec()
        swan.createSelectorQuery().select('#anchorWrap').boundingClientRect((rect) => {
            this.setData({
                anchorWidth: rect.width
            })
        }).exec()
        swan.createSelectorQuery().select('.anchorItem').boundingClientRect((rect) => {
            this.setData({
                anchorItemWidth: rect.width
            })
        }).exec()
    },
    hotline(e) {
        this.hot = this.selectComponent("#hotline")
        this.hot.openModal(true);
    },
    //  goKefu(e){
    //     swan.navigateTo({
    //       url: '../../../../public/pages/html/html?host=https://www.sobot.com/chat/h5/index.html&sysNum=a73ea222d7284f7c8801e60e6054e985&partnerId=2180427&tel='+ app.globalData.userInfo.phone+'&uname='+ app.globalData.userInfo.phone+'&remark=BDXCX_SHEBAO&titleFlag=3&powered=false&telShowFlag=true&telFlag=true'
    //     })
    // },
    // 页面的生命周期函数 – 监听页面加载
    onLoad(res) {
        this.countHeight()
        this.initCity()
        this.setData({ suffix: sysT.suffixOfClass() })
    },

    // 页面的生命周期函数 – 监听页面初次渲染完成
    onReady(res) {
         setTimeout(()=>{
            this.countAnchorPosition()
        },400)
    },

    // 页面的生命周期函数 – 监听页面显示
    onShow(res) {
        this.data.currentData[0].c = wxyj.wxyjData.currentCity.name
        this.data.currentData[2].c = wxyj.wxyjData.hukou
        this.setData({ currentData: this.data.currentData })
        this.initData()
        swan.setPageInfo && swan.setPageInfo({
            title: '【我的社保】官方APP-社保挂靠公积金代理全国自助缴纳查询社保公积金_主页',
            keywords: '我的社保,我的社保网,我的社保APP,社会保障,社保,社保代缴,公积金代缴,社会保险,五险一金,医保,医疗保险,公积金,养老,生育,工伤,失业,住房公积金,社保代理,代缴社保,公积金代理,查悦社保,大社保,亲亲小保,社保掌上通,招聘求职,创业,买房,贷款,计算器,人社局,摇号',
            description: '我的社保APP是为个人、企业提供社保代缴代扣、公积金代扣代缴、社保查询、公积金查询服务的名牌产品。解决个体工商户、自由职业者、待业人员、全职妈妈、创业者等的个人社保公积金断缴难题，同时解决贷款, 买房, 买车, 养老, 医疗, 生育, 医疗报销等难题。同时为企业提供全国专业社保代理和公积金代理。',
            articleTitle: '【我的社保】官方APP-社保挂靠公积金代理全国自助缴纳查询社保公积金_主页',
            release_date: '2019-02-23 20:00:00',
            success: function () {
                console.log('页面基础信息设置完成');
            },
            fail: function (res) {
                console.log('设置失败');
            },
        })
    },

    // 页面的生命周期函数 – 监听页面隐藏
    onHide(res) {

    },

    // 页面的生命周期函数 – 监听页面卸载
    onUnload(res) {

    },

    // 页面的生命周期函数 – 监听页面重启，单击重启按钮时触发
    onForceReLaunch(res) {

    },

    // 页面的事件处理函数 – 监听用户下拉动作
    onPullDownRefresh(res) {

    },

    // 页面的事件处理函数 – 上拉触底事件的处理函数
    onReachBottom(res) {

    },

    // 页面的事件处理函数 – 用户点击右上角转发
    onShareAppMessage(res) {

    },

    // 页面的事件处理函数 – 页面滚动触发事件的处理函数
    onPageScroll(res) {

    },

    // 页面的事件处理函数 – 当前是 tab 页时，点击 tab 时触发
    onTabItemTap(res) {

    }
});