苹果CMS会员积分提现页面模板制作代码教程

文件存放路径

积分提现模板文件放置目录：html/user/cash.html，属于用户中心前端模板文件，覆盖后即可在会员中心展示提现申请功能。

模板功能说明

该提现模板可自动读取网站后台积分兑换比例、最低提现额度、用户可用积分、冻结积分等数据，前端实时换算对应金额，搭配完整表单验证与AJAX异步提交，无需刷新页面即可完成积分提现申请。列表数据可通过 volist 标签遍历 $list 数组输出提现记录。

完整前端模板代码

<form id="fm" name="fm" method="post" action="" >
<p>1元等于{$GLOBALS['config']['user']['cash_ratio']}积分，最低提现金额：{$GLOBALS['config']['user']['cash_min']}元</p>
<p>剩余{$GLOBALS['user']['user_points']}积分，相当于{$GLOBALS['user']['user_points']/$GLOBALS['config']['user']['cash_ratio']}元；冻结{$GLOBALS['user']['user_points_froze']}积分，相当于{$GLOBALS['user']['user_points_froze']/$GLOBALS['config']['user']['cash_ratio']}元；</p>
银行名称：<input type="text" name="cash_bank_name"  placeholder="请输入开户行名称或支付宝微信" value="">
银行账号：<input type="text" name="cash_bank_no" placeholder="请输入银行卡号或支付宝微信账号"  value="">
收款姓名：<input type="text" name="cash_payee_name"  placeholder="请输入收款人姓名与上方账户对应"  value="">提现金额：<input type="text" name="cash_money"  placeholder="请输入提现金额"  value="">
<input type="button" id="btn_submit"  value="提交" style="margin: 5px;"></form>
<script>$("#btn_submit").click(function() {
var cash_bank_name = $('input[name="cash_bank_name"]').val();
if(cash_bank_name==''){
alert('请输入银行名称');
return;
}
var cash_bank_no = $('input[name="cash_bank_no"]').val();
if(cash_bank_no==''){
alert('请输入银行账户');
return;
}
var cash_payee_name = $('input[name="cash_payee_name"]').val();
if(cash_payee_name==''){
alert('请输入收款人姓名');
return;
}
var cash_money = $('input[name="cash_money"]').val();
if(cash_money==''){
alert('请输入提现金额');
return;
}
var data = $("#fm").serialize();
$.ajax({
url: "{:url('user/cash')}",
type: "post",
dataType: "json",
data: data,
beforeSend: function () {
//开启loading
//$(".loading_box").css("display","block");
$("#btn_submit").css("background","#fd6a6a").val("loading...");
},
success: function (r) {
alert(r.msg);
if(r.code==1){
location.href="{:url('user/cash')}";
}
},
complete: function () {
//结束loading
//$(".loading_box").css("display","none");
$("#btn_submit").css("background","#fa4646").val("提交");
}
});});</script>

核心变量释义

• cash_ratio：后台设置的积分兑换比例，自动读取并展示积分与现金换算规则

• cash_min：站点最低提现额度，限制用户最小提现金额

• user_points：当前登录用户可用积分，自动换算为可提现金额

• user_points_froze：用户冻结积分，展示不可提现锁定积分数额

前端交互逻辑

表单包含开户行、收款账号、收款人姓名、提现金额四项必填参数，点击提交按钮后会先执行前端空值校验，规避无效提交。通过AJAX异步请求提交至 user/cash 接口，提交过程中按钮状态变更提示加载中，提交成功后自动刷新页面，弹窗提示操作结果，交互体验简洁流畅。