peko-h5/view/peko/modules/act-wishingStar/js/index.js

let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
    new VConsole();
}
// 封裝layer消息提醒框
let layerIndex
const showLoading = (content = '加載中...') => {
    layer.open({
        type: 2,
        shadeClose: false,
        content,
        success (e) {
            layerIndex = $(e).attr('index')
        }
    })
}
const hideLoading = (index) => {
    layer.close(index)
}
const toastMsg = (content = '操作完成', time = 2) => {
    layer.open({
        content,
        time,
        skin: 'msg'
    })
}
var mymagicStickNum = 0;//魔法棒数量
var getRankType = 1;//1=今日奖励榜，2=次数总榜
// 初始化函數
$(function () {
    getInfoFromClient()
    setTimeout(function () {
        // 頁面全屏
        if (browser.app) {
            if (browser.android) {
                window.androidJsObj.initShowNav(false)
            } else {
                window.webkit.messageHandlers.initShowNav.postMessage(0)
            }
        };
        // 頂部返回事件
        $('.back').click(() => {
            if (browser.android) {
                window.androidJsObj.closeWebView()
            } else {
                window.webkit.messageHandlers.closeWebView.postMessage(null)
            }
        })
        getConfig();
    }, 100)
})
// 配置接口
function getConfig () {
    // showLoading()
    networkRequest({
        type: 'get',
        url: urlPrefix + '/promiseStar/getConfig',
        success (res) {
            if (res.code === 200) {
                mymagicStickNum = res.data.userStickNum;
                $('.page1 .top .centon').text(mymagicStickNum);
                $('.wishingPop .wishingPop_in .magicSticks b').text(mymagicStickNum);
                var str = '';
                res.data.roundList.forEach(res => {
                    str += `
                    <li>
                        <div class="giftBox">
                            <img src="${res.gift.picUrl}" alt="" class="giftImg">
                        </div>
                        <div class="giftInfo">
                            <b>${res.gift.giftName}</b>
                            <img src="./images/diamond.png" alt="" class="diamond">
                            <i>${res.gift.goldPrice}</i>
                        </div>
                        <div class="inventory">庫存${res.stockNum}</div>
                        <div class="schedule">許願進度</div>
                        <div class="line">
                            <div class="line_in">
                                <img style="width: ${res.process / res.max * 100 >= 100 ? '100' : res.process / res.max * 100}%;" src="./images/line.png" alt="">
                            </div>
                            <p>${res.process}/${res.max}</p>
                        </div>
                        <div class="wishIng">已許願${res.userInputNum}次</div>
                        <img src="./images/wishIngBut.png" alt="" class="wishIngBut" configId=${res.configId} roundId=${res.gift.roundId} stockNum=${res.gift.stockNum}>
                    </li>
                    `
                });
                $('.page1 ul li').remove()
                $('.page1 ul').append(str);
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            hideLoading(layerIndex)
            toastMsg('網路錯誤，請退出重進')
        }
    })
}
// 刷新接口
$('.page1 .update').click(function () {
    getConfig();
})
// 榜单接口
function getRank (type) {
    showLoading()
    networkRequest({
        type: 'get',
        url: urlPrefix + '/promiseStar/getRank',
        data: { type },
        success (res) {
            if (res.code === 200) {
                var str = '';
                res.data.rankList.forEach((res, i) => {
                    str += `
                        <li class='li${i + 1}'>
                            <div class="num num${i + 1}">${i + 1 > 3 ? res.ranking : ''}</div>
                            <img src="${res.avatar}" alt="" class="tx">
                            <div class="name">${res.nick}</div>
                            <div class="right">
                                <p>${res.score}次</p>
                                <b>許願獲獎次數</b>
                            </div>
                        </li>
                    `
                })
                $('.page2 .listBox li').remove()
                $('.page2 .listBox').append(str);
                // 处理自己
                $('.page2 .my .num').text(res.data.meRank.ranking == 0 ? '未上榜' : res.data.meRank.ranking);
                $('.page2 .my .tx').attr('src', res.data.meRank.avatar);
                $('.page2 .my .name').text(res.data.meRank.nick);
                $('.page2 .my .right p').text(res.data.meRank.score);
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            hideLoading(layerIndex)
            toastMsg('網路錯誤，請退出重進')
        }
    })
}
// Tab切换
$('.header .tabBox').on('click', ' div', function () {
    var i = $(this).index() + 1;
    $('.header .tabBox div').removeClass('act1').removeClass('act2');
    $(this).addClass(`act${i}`);
    $('.page1,.page2').hide();
    $(`.page${i}`).show();
    if (i == 2) {
        getRank(getRankType);
    }
})
// 榜单切换
$('.page2 .listTab div').click(function () {
    var i = $(this).index() + 1;
    $(this).parent('.listTab').removeClass('tab1').removeClass('tab2');
    $(this).parent('.listTab').addClass(`tab${i}`)
    getRankType = i;
    getRank(getRankType);
})
// 打开活动规则弹窗
$('.header .rule_icon').click(function () {
    $('.rule').show();
    bodyScroolFun(true);
})
// 关闭活动规则弹窗
$('.rule').click(function () {
    $('.rule').hide();
    bodyScroolFun(false);
})
var page = 1;
var isLock = true;
// 中奖记录接口
function listLuckyRecord (page) {
    showLoading();
    networkRequest({
        type: 'get',
        url: urlPrefix + '/promiseStar/listLuckyRecord',
        data: { page, pageSize: 10 },
        success (res) {
            if (res.code === 200) {
                if (res.data.length == 0) {
                    isLock = false;
                } else {
                    var str = '';
                    res.data.forEach((res, i) => {
                        str += `
                        <li class="${i % 2 == 0 ? '' : 'liAct'}">
                            <div class="left">
                                <p>${dateFormat(res.createTime, 'hh:mm:ss')}</p>
                                <i>${dateFormat(res.createTime, 'yyyy-MM-dd')}</i>
                            </div>
                            <div class="right">
                                <p>獲得：${res.gift.giftName}</p>
                                <i>（${res.gift.goldPrice}鉆石）</i>
                            </div>
                        </li>
                    `
                    })
                    $('.record .record_in .ul1').append(str);
                    isLock = true;
                }
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            isLock = true;
            hideLoading(layerIndex)
            toastMsg('網路錯誤，請退出重進')
        }
    })
}
// 参与记录
function listRoundRecord (page) {
    showLoading();
    networkRequest({
        type: 'get',
        url: urlPrefix + '/promiseStar/listRoundRecord',
        data: { page, pageSize: 10 },
        success (res) {
            if (res.code === 200) {
                if (res.data.length == 0) {
                    isLock = false;
                } else {
                    var str = '';
                    res.data.forEach((res, i) => {
                        str += `
                        <li class="${res.luckyUser ? '' : 'liAct'}">
                            <div class="left">
                                <p>${dateFormat(res.createTime, 'hh:mm:ss')}</p>
                                <i>${dateFormat(res.createTime, 'yyyy-MM-dd')}</i>
                            </div>
                            <div class="center">
                                <p>許願：${res.gift.giftName}</p>
                                <i>${res.luckyUser ? '已结束' : '進行中'}</i>
                            </div>
                            <div class="right">
                                <p>${res.luckyUser ? res.luckyUser.nick : ''}</p>
                                <i>${res.luckyUser ? '獲得' : ''}</i>
                            </div>
                        </li>
                    `
                    })
                    $('.record .record_in .ul2').append(str);
                    isLock = true;
                }
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            isLock = true;
            hideLoading(layerIndex)
            toastMsg('網路錯誤，請退出重進')
        }
    })
}
// 打开参与记录按钮
$('.header .record_icon').click(function () {
    $('.record .record_in .ul1 li').remove();
    page = 1;
    isLock = true;
    $('.record .record_in .recordtab div').removeClass('act2').removeClass('act1');
    $('.record .record_in .recordtab div').eq(0).addClass('act1');
    $('.record .record_in .ul1,.record .record_in .ul2').hide();
    $('.record .record_in .ul1').show();
    listLuckyRecord(page);
    $('.record').show();
    bodyScroolFun(true);
})
// 切换参与记录按钮
$('.record .record_in .recordtab div').click(function () {
    var i = $(this).index() + 1;
    $('.record .record_in .recordtab div').removeClass('act1').removeClass('act2');
    $(this).addClass(`act${i}`);
    $('.record .record_in .ul2,.record .record_in .ul1').hide();
    page = 1;
    isLock = true;
    if (i == 1) {
        $('.record .record_in .ul1 li').remove();
        listLuckyRecord(page)
    } else {
        $('.record .record_in .ul2 li').remove();
        listRoundRecord(page)
    }
    $(`.record .record_in .ul${i}`).show();
    return false;
})
// 监听滚动1
$('.record .record_in .ul1').scroll(function () {
    let scrollTop = $(this).scrollTop()
    let scrollHeight = $('.record .record_in .ul1')[0].scrollHeight
    let ulHeight = $(this).innerHeight()
    if (scrollTop + ulHeight + 100 >= scrollHeight) {
        if (isLock) {
            // 请求下一页
            page = page + 1;
            listLuckyRecord(page)
            isLock = false;
        }
    }
})
// 监听滚动2
$('.record .record_in .ul2').scroll(function () {
    let scrollTop = $(this).scrollTop()
    let scrollHeight = $('.record .record_in .ul2')[0].scrollHeight
    let ulHeight = $(this).innerHeight()
    if (scrollTop + ulHeight + 100 >= scrollHeight) {
        if (isLock) {
            // 请求下一页
            page = page + 1;
            listRoundRecord(page)
            isLock = false;
        }
    }
})
// 关闭参与记录按钮
$('.record').click(function () {
    $('.record').hide();
    bodyScroolFun(false);
})
// 关闭去充值弹窗
$('.goToPay').click(function () {
    $('.goToPay').hide();
    bodyScroolFun(false);
})
// 关闭购买成功按钮
$('.buySuccess .buySuccess_in .buySuccessBut').click(function () {
    $('.buySuccess').hide();
    bodyScroolFun(false);
})
// 去充值按钮
$('.goToPay .goToPay_in .but').click(function () {
    if (browser.app) {
        if (browser.android) {
            let channel = pubInfo.deviceInfo.channel;
            console.log(pubInfo.deviceInfo);
            if (channel == "google") {
                window.androidJsObj.openChargePage(6);
            } else {
                window.androidJsObj.openChargePage(6);
                window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
            }
        } else if (browser.ios) {
            let channel = pubInfo.deviceInfo.channel;
            if (channel == "appstore") {
                window.webkit.messageHandlers.openChargePage.postMessage(null);
            } else {
                window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
                window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
            }
        }
    } else {
        toastMsg('請在app內打開')
    }
    $('.goToPay').hide();
    bodyScroolFun(false);
    return false;
})
var magicStickNum = 1;
function magicStick (type, num) {
    magicStickNum = Number($('.magicStick .magicStick_in input').val());
    if (type == 1) {
        // 加
        magicStickNum++;
    } else if (type == 2) {
        // 减
        magicStickNum--;
    } else if (type == 3) {
        // 快捷购买
        magicStickNum += num;
    } else {
    }
    magicStickNum <= 0 ? magicStickNum = 0 : magicStickNum = magicStickNum;
    magicStickNum >= 99999999 ? magicStickNum = 99999999 : magicStickNum = magicStickNum;
    $('.magicStick .magicStick_in .magicSticks b').text(magicStickNum * 100);
    $('.magicStick .magicStick_in input').val(magicStickNum);
}
// 打开购买魔法棒弹窗
$('.page1 .top .but').click(function () {
    $('.magicStick .magicStick_in h3').text('購買數量');
    $('.magicStick').show();
    bodyScroolFun(true);
})
// 魔法棒加弹窗
$('.magicStick .magicStick_in .add').click(function () {
    magicStick(1)
    return false;
})
// 魔法棒减弹窗
$('.magicStick .magicStick_in .decrease').click(function () {
    magicStick(2)
    return false;
})
// 魔法棒快捷购买弹窗
$('.magicStick .magicStick_in .quickAddition div').click(function () {
    var num = Number($(this).attr('num'));
    magicStick(3, num)
    return false;
})
// 监听输入框的变化
$('.magicStick .magicStick_in input').on('input', function () {
    magicStick();
})
// 魔法棒输入框弹窗
$('.magicStick .magicStick_in input').click(function () {
    return false;
})
// 关闭购买魔法棒弹窗
$('.magicStick').click(function () {
    $('.magicStick').hide();
    bodyScroolFun(false);
})
// 确认购买魔法棒按钮
$('.magicStick .magicStick_in .but').click(function () {
    if (magicStickNum <= 0) {
        return toastMsg('購買數量不能小於1')
    }
    buyStick(magicStickNum)
    bodyScroolFun(false);
})
// 购买魔法棒
function buyStick (num) {
    showLoading()
    networkRequest({
        type: 'get',
        url: urlPrefix + '/promiseStar/buyStick',
        data: { num },
        success (res) {
            if (res.code === 200) {
                getConfig();
                $('.buySuccess p').text(`魔法棒${num}`);
                $('.buySuccess').show();
                bodyScroolFun(true);
                magicStickNum = 1;
                $('.magicStick .magicStick_in input').val(magicStickNum);
                $('.magicStick .magicStick_in .magicSticks b').text(100);
            } else if (res.code === 31005) {
                $('.goToPay').show();
                bodyScroolFun(true);
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            hideLoading(layerIndex)
            toastMsg('網路錯誤，請退出重進')
        }
    })
}
var wishingNum = 1;
function wishing (type, num) {
    wishingNum = Number($('.wishingPop .wishingPop_in input').val());
    if (type == 1) {
        // 加
        wishingNum++;
    } else if (type == 2) {
        // 减
        wishingNum--;
    } else if (type == 3) {
        // 快捷购买
        wishingNum += num;
    } else {
    }
    wishingNum <= 0 ? wishingNum = 0 : wishingNum = wishingNum;
    wishingNum >= 99999999 ? wishingNum = 99999999 : wishingNum = wishingNum;
    $('.wishingPop .wishingPop_in input').val(wishingNum);
}
// 许愿加弹窗
$('.wishingPop .wishingPop_in .add').click(function () {
    wishing(1)
    return false;
})
// 许愿减弹窗
$('.wishingPop .wishingPop_in .decrease').click(function () {
    wishing(2)
    return false;
})
// 许愿快捷购买弹窗
$('.wishingPop .wishingPop_in .quickAddition div').click(function () {
    var num = Number($(this).attr('num'));
    wishing(3, num)
    return false;
})
// 监听输入框的变化
$('.wishingPop .wishingPop_in input').on('input', function () {
    wishing();
})
// 许愿输入框弹窗
$('.wishingPop .wishingPop_in input').click(function () {
    return false;
})
// 关闭许愿弹窗
$('.wishingPop').click(function () {
    $('.wishingPop').hide();
    bodyScroolFun(false);
})
// 许愿按钮
var roundId;
var configId;
$('.page1 ul').on('click', 'li .wishIngBut', function () {
    var stockNum = $(this).attr('stockNum');
    roundId = $(this).attr('roundId');
    configId = $(this).attr('configId');
    if (stockNum == 0) {
        toastMsg('该礼物库存不足,无法进行许愿');
        return;
    }
    $('.wishingPop').show();
})
// 确认许愿按钮
$('.wishingPop .wishingPop_in .but').click(function () {
    console.log(wishingNum < mymagicStickNum);
    if (wishingNum <= 0) {
        return toastMsg('許願數量不能小於1')
    }
    if (wishingNum > mymagicStickNum) {
        $('.magicStick .magicStick_in h3').text('可用魔法棒不足，请购买');
        $('.magicStick').show();
        bodyScroolFun(true);
    } else {
        promise(wishingNum, configId);
        bodyScroolFun(false);
    }

})
// 许愿接口
function promise (num, configId) {
    showLoading()
    networkRequest({
        type: 'post',
        url: urlPrefix + '/promiseStar/promise',
        data: { num, promiseId: configId },
        success (res) {
            if (res.code === 200) {
                wishingNum = 1;
                $('.wishingPop .wishingPop_in input').val(wishingNum)
                toastMsg('参与许愿成功')
            } else if (res.code === 5003) {
                $('.magicStick .magicStick_in h3').text('可用魔法棒不足，请购买');
                $('.magicStick').show();
            } else {
                toastMsg(res.message)
            }
            getConfig();
            hideLoading(layerIndex)
        },
        error (err) {
            hideLoading(layerIndex)
            toastMsg('網路錯誤，請退出重進')
        }
    })
}