debug
This commit is contained in:
make
196
code/public/template/shikong/huiyuan/js/member/charge.js
Normal file
196
code/public/template/shikong/huiyuan/js/member/charge.js
Normal file
@@ -0,0 +1,196 @@
|
||||
|
||||
import { getValFromBrowserAddress, checkIsLoginFn, getPublictUserInfo ,layerPopup} from '../public/commonFun.js';
|
||||
import { apiPayChannele,apiPayOrderCreate } from '../public/api/index.js';
|
||||
import { fetchApi,onError,strSite} from '../public/api/fetch.js';
|
||||
import { getLoginStatus }from '../public/localstorage.js';
|
||||
|
||||
$(document).ready(function() {
|
||||
// 登录状态
|
||||
if (getLoginStatus()) {
|
||||
//getUserInfo()
|
||||
}else{
|
||||
location.href="/login.html"
|
||||
}
|
||||
let intVpId = getValFromBrowserAddress('id')
|
||||
let intActiveCgId = null
|
||||
//支付金额
|
||||
$('.sc-payment-amount').text('￥'+getValFromBrowserAddress('val'))
|
||||
getChannelList()
|
||||
let paymentData = [
|
||||
// {
|
||||
// method: { id: 'alipay', name: '支付宝88', img: '/assets/huiyuan/images/zhifubao.png' },
|
||||
// channels: [
|
||||
// {id: '1', name: '支付宝1', img: '/assets/huiyuan/images/zhifubao.png'},
|
||||
// {id: '2', name: '支付宝2', img: '/assets/huiyuan/images/zhifubao.png'},
|
||||
// {id: '3', name: '支付宝3', img: 'v/images/zhifubao.png'},
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// method: { id: 'wechat', name: '微信88', img: '/assets/huiyuan/images/wechat.png' },
|
||||
// channels: [
|
||||
// {id: '11', name: '微信1', img: '/assets/huiyuan/images/zhifubao.png'},
|
||||
// {id: '12', name: '微信2', img: '/assets/huiyuan/images/zhifubao.png'},
|
||||
// {id: '13', name: '微信3', img: '/assets/huiyuan/images/zhifubao.png'},
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// method: { id: 'test', name: '测试', img: '/assets/huiyuan/images/wechat.png' },
|
||||
// channels: [
|
||||
// {id: '21', name: '测试1', img: '/assets/huiyuan/images/zhifubao.png'},
|
||||
// {id: '22', name: '测试2', img: '/assets/huiyuan/images/zhifubao.png'},
|
||||
// {id: '23', name: '测试3', img: '/assets/huiyuan/images/zhifubao.png'},
|
||||
// ]
|
||||
// }
|
||||
];
|
||||
|
||||
const paymentMethodsContainer = document.getElementById('payment-methods-container');
|
||||
const paymentChannelsContainer = document.getElementById('payment-channels-container');
|
||||
|
||||
function renderPaymentMethods() {
|
||||
let html = `<div class="fl"><div>支付方式</div></div><div class="mt10"><div class="fl gap5 align_center fl_wrap">`;
|
||||
paymentData.forEach((data, index) => {
|
||||
const method = data.method;
|
||||
html += `
|
||||
<div id="${method.id}" class="e21f3fa97e point relative ${index === 0 ? 'selected _71a3d26126' : ''}" onclick="selectPaymentMethod(${index})">
|
||||
<img sizes="100vh" class="point fill undefined" height="33" width="33" alt="${method.name}" src="${method.icon}">
|
||||
<div class="mt3 ${index === 0 ? 'c63892b6d2' : ''}">${method.name}</div>
|
||||
<div class="abs eb2a18721c" style="display:${index === 0 ? 'block' : 'none'};"><img sizes="100vh" class="point fill undefined" height="25" width="25" alt="" src="/assets/huiyuan/images/user-center/charge/h.png"></div>
|
||||
</div>`;
|
||||
});
|
||||
html += `</div></div>`;
|
||||
paymentMethodsContainer.innerHTML = html;
|
||||
}
|
||||
|
||||
function renderPaymentChannels(index) {
|
||||
|
||||
const channels = paymentData[index].channels;
|
||||
intActiveCgId = paymentData[index].channels[0].id
|
||||
let html = `<div class="fl"><div>渠道选择</div></div><div class="mt10"><div class="fl gap5 align_center fl_wrap">`;
|
||||
channels.forEach((channel, idx) => {
|
||||
html += `
|
||||
<div id="channel-${idx}" class="e21f3fa97e point relative ${idx === 0 ? 'selected _71a3d26126' : ''}" style="height: 25px; display: flex; align-items: center; justify-content: center;" onclick="selectPaymentChannel(${idx}, ${index})">
|
||||
<div class="mt3 ${idx === 0 ? 'c63892b6d2' : ''} b36fec8841">${channel.name}</div>
|
||||
<div class="abs eb2a18721c" style="display:${idx === 0 ? 'block' : 'none'};"><img sizes="100vh" class="point fill undefined" height="25" width="25" alt="" src="/assets/huiyuan/images/user-center/charge/h.png"></div>
|
||||
</div>`;
|
||||
});
|
||||
html += `</div></div>`;
|
||||
paymentChannelsContainer.innerHTML = html;
|
||||
}
|
||||
|
||||
window.selectPaymentMethod = function(index) {
|
||||
document.querySelectorAll('#payment-methods-container .e21f3fa97e').forEach(el => {
|
||||
el.classList.remove('selected', '_71a3d26126');
|
||||
el.querySelector('.mt3').classList.remove('c63892b6d2');
|
||||
});
|
||||
paymentData.forEach((data) => {
|
||||
document.querySelector(`#${data.method.id} .eb2a18721c`).style.display = 'none';
|
||||
});
|
||||
const selectedMethod = document.getElementById(paymentData[index].method.id);
|
||||
intActiveCgId = paymentData[index].channels[0].id
|
||||
|
||||
selectedMethod.classList.add('selected', '_71a3d26126');
|
||||
selectedMethod.querySelector('.mt3').classList.add('c63892b6d2');
|
||||
selectedMethod.querySelector('.eb2a18721c').style.display = 'block';
|
||||
renderPaymentChannels(index);
|
||||
}
|
||||
|
||||
window.selectPaymentChannel = function(channelIdx, methodIdx) {
|
||||
document.querySelectorAll('#payment-channels-container .e21f3fa97e').forEach(el => {
|
||||
el.classList.remove('selected', '_71a3d26126');
|
||||
el.querySelector('.mt3').classList.remove('c63892b6d2');
|
||||
});
|
||||
paymentData[methodIdx].channels.forEach((channel, idx) => {
|
||||
document.querySelector(`#channel-${idx} .eb2a18721c`).style.display = 'none';
|
||||
});
|
||||
const selectedChannel = document.getElementById(`channel-${channelIdx}`);
|
||||
selectedChannel.classList.add('selected', '_71a3d26126');
|
||||
selectedChannel.querySelector('.mt3').classList.add('c63892b6d2');
|
||||
selectedChannel.querySelector('.eb2a18721c').style.display = 'block';
|
||||
|
||||
// 获取点击渠道的 id
|
||||
intActiveCgId = paymentData[methodIdx].channels[channelIdx].id;
|
||||
}
|
||||
/**
|
||||
* 获取支付通道
|
||||
*/
|
||||
function getChannelList() {
|
||||
let strApiUrl = apiPayChannele + "?vp_id="+intVpId
|
||||
fetchApi(strApiUrl, null,successFn, onError,'拼命加载中。。。')
|
||||
function successFn(res) {
|
||||
if (res.code == '000') {
|
||||
let arrPayChannel = res.data.item
|
||||
if(arrPayChannel.length <=0){
|
||||
layerPopup('暂无支付渠道,请稍后再试！', 3)
|
||||
return false
|
||||
}
|
||||
arrPayChannel.forEach((item)=>{
|
||||
item.id = item.cg_id
|
||||
item.name = item.pg_channel_name
|
||||
if(item.pg_channel_code == 'ZFB'){
|
||||
item.icon = '/assets/huiyuan/images/zhifubao.png'
|
||||
}else if(item.pg_channel_code == 'WX'){
|
||||
item.icon = '/assets/huiyuan/images/wechat.png'
|
||||
}
|
||||
})
|
||||
// 提取 pg_channel_name 和 pg_product_code 到新数组
|
||||
const extractedData = arrPayChannel.map(PayChannel => {
|
||||
const filteredElements = arrPayChannel.filter(item => item.pg_channel_code === PayChannel.pg_channel_code);
|
||||
return {
|
||||
method:{
|
||||
name: PayChannel.pg_channel_name,
|
||||
id: PayChannel.pg_channel_code,
|
||||
pg_channel_code: PayChannel.pg_channel_code,
|
||||
icon: PayChannel.icon,
|
||||
},
|
||||
channels:filteredElements
|
||||
|
||||
};
|
||||
});
|
||||
paymentData = extractedData
|
||||
renderPaymentMethods();
|
||||
renderPaymentChannels(0); // Show channels for the first payment method by default
|
||||
} else {
|
||||
layerPopup(res.msg, 3)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 确认支付
|
||||
$(".sc-pay-btn").on('click', function () {
|
||||
getCreateV(intVpId, intActiveCgId)
|
||||
});
|
||||
/**
|
||||
* 创建支付订单
|
||||
* @param {number} vp_id // 套餐id
|
||||
* @param {number} intCgId // 通道id
|
||||
*/
|
||||
function getCreateV(intVpId, intCgId) {
|
||||
|
||||
let postData = {
|
||||
'vp_id':intVpId,
|
||||
'cg_id':intCgId,
|
||||
'si_id':strSite,
|
||||
}
|
||||
if(postData.cg_id == null || postData.cg_id.length ==0 ){
|
||||
layerPopup('暂无支付渠道,请稍后再试！', 3)
|
||||
return false
|
||||
}
|
||||
fetchApi(apiPayOrderCreate, postData,successFun, onError)
|
||||
function successFun(res) {
|
||||
if (res.code == '000') {
|
||||
let time = setTimeout(()=>{
|
||||
$(".sc-pay-jump-popup").show()
|
||||
clearTimeout(time)
|
||||
},3000)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//立即跳转
|
||||
$(".sc-Jump-immediately-btn").on('click', function () {
|
||||
$(".sc-pay-jump-popup").hide()
|
||||
window.open('https://render.alipay.com/p/yuyan/180020040001212700/?cid=wap_dc', '_blank');
|
||||
});
|
||||
|
||||
|
||||
})
|
||||
Reference in New Issue
Block a user