feat: 越南充值页加 USDT (TRC20) 通道切换

- recharge2.vue: 银行卡/USDT 两个 tab
- submitEpay 方法调 /epay_online_order 传 pay_type='usdt'
- 防重复提交:submitting loading 状态
This commit is contained in:
li
2026-04-15 23:21:03 +08:00
parent cd64a1c073
commit d1f69e4bb9
+107 -4
View File
@@ -3,14 +3,36 @@
<div class="btn off-btn" @click="offPop"></div>
<div class="btn pay2-btn" v-if="userInfo.area_id != 3" @click="isShowPop('recharge')">{{Language.recharge_offline2}} </div>
<div class="title">{{Language.recharge_online2}}</div>
<!-- 越南 AlinPay 在线充值 -->
<!-- 越南地区银行卡 (AlinPay) / USDT (Epay) 双通道 -->
<div class="view" v-if="userInfo.area_id == 3">
<div class="alin-form">
<div class="pay-tabs">
<div class="pay-tab" :class="{active: payChannel=='alin'}" @click="payChannel='alin'">
{{Language.recharge_bank || 'Thẻ ngân hàng'}}
</div>
<div class="pay-tab" :class="{active: payChannel=='epay'}" @click="payChannel='epay'">
USDT (TRC20)
</div>
</div>
<div class="alin-form" v-if="payChannel=='alin'">
<div class="alin-item">
<label>{{Language.withdraw_page_withdrawal_amount || '充值金额'}}</label>
<input class="input" type="number" v-model="alinAmount" placeholder="Tối thiểu 1,000,000">
</div>
<button class="btn alin-submit" @click="submitAlin">{{Language.withdraw_page_confirm || '确认充值'}}</button>
<button class="btn alin-submit" @click="submitAlin" :disabled="submitting">
{{submitting ? '...' : (Language.withdraw_page_confirm || '确认充值')}}
</button>
</div>
<div class="alin-form" v-if="payChannel=='epay'">
<div class="alin-item">
<label>{{Language.withdraw_page_withdrawal_amount || '充值金额'}} (VND)</label>
<input class="input" type="number" v-model="epayAmount" placeholder="Số tiền nạp">
</div>
<div class="alin-tip">
{{Language.recharge_usdt_tip || 'Thanh toán USDT qua mạng TRC20 · Tỷ giá tính theo hệ thống'}}
</div>
<button class="btn alin-submit" @click="submitEpay" :disabled="submitting">
{{submitting ? '...' : (Language.withdraw_page_confirm || '确认充值')}}
</button>
</div>
</div>
<!-- 其他渠道 iframe -->
@@ -25,7 +47,10 @@ import { mapState } from 'vuex'
export default {
data() {
return {
payChannel: 'alin',
alinAmount: '',
epayAmount: '',
submitting: false,
ApiUrl: JSON.parse(localStorage.getItem('ApiUrl'))
}
},
@@ -49,6 +74,8 @@ export default {
this.$message({type:'warning', message:'Số tiền tối thiểu là 1,000,000'});
return;
}
if(this.submitting) return;
this.submitting = true;
var encryptstring = encrypt(JSON.stringify({
user_id: this.userInfo.uid,
price: this.alinAmount,
@@ -58,6 +85,7 @@ export default {
})).toString();
this.$axios.post(this.ApiUrl+'/alin_online_order', {encryptData:encryptstring}).then(
response=>{
this.submitting = false;
if(response.data.Success==1){
const data = JSON.parse(decrypt(response.data.Data));
if(data.status == 1 && data.url){
@@ -69,10 +97,49 @@ export default {
this.$message({type:'error', message: response.data.Msg || '充值失败'});
}
}).catch(error=>{
this.submitting = false;
console.log(error);
this.$message({type:'error', message:'充值请求失败'});
});
},
submitEpay(){
if(!this.epayAmount || this.epayAmount <= 0){
this.$message({type:'warning', message:'Vui lòng nhập số tiền!'});
return;
}
if(this.epayAmount < 1000000){
this.$message({type:'warning', message:'Số tiền tối thiểu là 1,000,000'});
return;
}
if(this.submitting) return;
this.submitting = true;
var encryptstring = encrypt(JSON.stringify({
user_id: this.userInfo.uid,
price: this.epayAmount,
client: 1,
username: this.userInfo.nickname,
pay_type: 'usdt',
api_token: this.userInfo.api_token,
})).toString();
this.$axios.post(this.ApiUrl+'/epay_online_order', {encryptData:encryptstring}).then(
response=>{
this.submitting = false;
if(response.data.Success==1){
const data = JSON.parse(decrypt(response.data.Data));
if(data.status == 1 && data.url){
window.open(data.url, '_blank');
} else {
this.$message({type:'error', message: data.message || 'Nạp thất bại'});
}
} else {
this.$message({type:'error', message: response.data.Msg || 'Nạp thất bại'});
}
}).catch(error=>{
this.submitting = false;
console.log(error);
this.$message({type:'error', message:'Yêu cầu thất bại'});
});
},
},
computed: {
...mapState(['userInfo','webconfig','Language'])
@@ -122,8 +189,44 @@ export default {
width:100%;
height: 250px;
}
.recharge2 .pay-tabs{
display: flex;
padding: 10px 40px 0;
gap: 10px;
}
.recharge2 .pay-tab{
flex: 1;
text-align: center;
padding: 8px 0;
color: #aaa;
background: rgba(0,0,0,0.3);
border: 1px solid #907545;
border-radius: 5px;
cursor: pointer;
font-size: 13px;
user-select: none;
transition: all .2s;
}
.recharge2 .pay-tab:hover{ color: #e5b932; }
.recharge2 .pay-tab.active{
background: linear-gradient(to right, #e5b932, #c5971e);
color: #161107;
font-weight: bold;
border-color: #e5b932;
}
.recharge2 .alin-tip{
color: #e5b932;
font-size: 12px;
line-height: 1.5;
margin: -5px 0 15px;
opacity: 0.85;
}
.recharge2 .alin-submit:disabled{
opacity: 0.5;
cursor: not-allowed;
}
.recharge2 .alin-form{
padding: 30px 40px;
padding: 20px 40px;
}
.recharge2 .alin-item{
margin-bottom: 15px;