192 lines
6.8 KiB
Vue
Raw Normal View History

2025-06-06 03:08:19 +08:00
<template>
<view class="page">
2025-06-07 21:01:16 +08:00
<nav-bar :title="$t('toanswer.title')" bgColor="#fff"></nav-bar>
2025-06-06 03:08:19 +08:00
<view style="margin: 20rpx 3%; padding: 0rpx 10rpx 160rpx; ">
<view class="cell_list" style="padding: 0px; margin-bottom: 30rpx;">
<view class="cell_left txt">
<image src="/static/images/q1.png" style="width: 140rpx; height: 140rpx; margin-right: 20rpx;"></image>
</view>
<view style="font-weight: 600; font-size: 30rpx; width: 70%; color: #333; line-height: 50rpx; text-align: left;">{{detail.title}}</view>
</view>
<uni-forms :modelValue="answerModel" :rules="rules" ref="form">
<uni-forms-item>
<view class="cell_list">
2025-06-07 21:01:16 +08:00
<view class="cell_left txt">{{$t('toanswer.text2')}}</view>
<view class="cell_right ">{{detail.max_quantity==0? $t('toanswer.text1') :detail.max_quantity}}</view>
2025-06-06 03:08:19 +08:00
</view>
</uni-forms-item>
<uni-forms-item>
<view class="cell_list">
2025-06-07 21:01:16 +08:00
<view class="cell_left txt">>{{$t('toanswer.text3')}}</view>
2025-06-06 03:08:19 +08:00
<view class="cell_right ">
<uni-number-box :value="answerModel.num" :max="detail.max_quantity==0?Infinity:detail.max_quantity" :min="1" background="#2979FF" color="#fff" @change="changeNum" />
</view>
</view>
</uni-forms-item>
<uni-forms-item name="amount">
<view class="cell_list">
2025-06-07 21:01:16 +08:00
<view class="cell_left txt" style="width: 50%;">{{$t('toanswer.text4')}}</view>
2025-06-06 03:08:19 +08:00
<view class="cell_right ">
{{answerModel.price}}<view style="float: right; margin-left: 20rpx; font-size: 12px; margin-right: 20rpx;">USDT</view>
</view>
</view>
<view style="font-size: 14px; color: #999; font-weight: 500; line-height: 50upx; text-align: right;">
2025-06-07 21:01:16 +08:00
{{$t('toanswer.text6')}}: {{parseFloat(user.money).toFixed(2)}} USDT</view>
2025-06-06 03:08:19 +08:00
</uni-forms-item>
<uni-forms-item>
<view class="cell_list">
2025-06-07 21:01:16 +08:00
<view class="cell_left txt">{{$t('toanswer.text5')}}</view>
2025-06-06 03:08:19 +08:00
<view class="cell_right ">
<span style="font-weight: 500;font-size: 16px;color: #1D61E7;">{{answerModel.interest_rate}} USDT</span></view>
</view>
</uni-forms-item>
<uni-forms-item>
<view class="cell_list">
2025-06-07 21:01:16 +08:00
<view class="cell_left txt">{{$t('toanswer.text7')}}</view>
2025-06-06 03:08:19 +08:00
<view class="cell_right ">{{detail.billing_cycle}} DAYS</view>
</view>
</uni-forms-item>
<uni-forms-item>
<view class="cell_list">
2025-06-07 21:01:16 +08:00
<view class="cell_left txt">{{$t('toanswer.text8')}}</view>
2025-06-06 03:08:19 +08:00
<view class="cell_right ">{{answerModel.rate}}%</view>
</view>
</uni-forms-item>
</uni-forms>
</view>
<view style="bottom: 0px; position: absolute; width:100vw; height: 160rpx;">
2025-06-07 21:01:16 +08:00
<button type="primary" round style="width: 90%; margin: auto;" @click="submit">{{$t('buttonSubmit')}}</button>
2025-06-06 03:08:19 +08:00
</view>
<uni-popup ref="popup" type="dialog" :is-mask-click="true" background-color="#fff" borderRadius="40rpx">
<view style="width: 80vw; padding: 20rpx 30rpx; border-radius: 40rpx; line-height: 50rpx;">
2025-06-07 21:01:16 +08:00
<view style="font-size: 36rpx; font-weight: bold; text-align: center; margin-bottom: 30rpx;">{{$t("setPin.text1")}}</view>
<uni-easyinput type="password" :passwordIcon="true" v-model="pingcode" :placeholder="{{$t("setPin.text2")}}" />
<button style="background-color: #1D61E7; color: #fff; margin: 40rpx auto;" @click="Confirm">{{$t("buttonConfirm")}}</button>
2025-06-06 03:08:19 +08:00
</view>
</uni-popup>
</view>
</template>
<script>
import { getUserInfo } from '@/config/utils';
import {
mapState,
mapMutations
} from 'vuex';
import detailsVue from './details.vue';
export default {
data() {
return {
answerModel:{
num: 1,
price: 0.00,
interest_rate: 0.00,
rate: 0,
},
pingcode: '',
user: {},
rules:{
},
detail: {}
};
},
computed: {
...mapState(['userInfo']),
},
//第一次加载
onLoad(e) {
uni.showLoading({
2025-06-07 21:08:06 +08:00
title: this.$t('loading')
2025-06-06 03:08:19 +08:00
})
if(e.id){
getUserInfo(this.$i18n.locale).then(res => {
this.user = res;
});
this.$http.get('/api/product/detail?id='+e.id+'&lang='+this.$i18n.locale).then(res => {
if(res.code == 0){
this.detail = res.data;
this.answerModel.price = (parseFloat(this.answerModel.num) * parseFloat(this.detail.price)).toFixed(2);
this.answerModel.interest_rate = (parseFloat(this.answerModel.num) * parseFloat(this.detail.interest_rate)).toFixed(2);
this.answerModel.rate = ((parseFloat(this.answerModel.interest_rate) - parseFloat(this.answerModel.price)) * 100 / parseFloat(this.answerModel.price)).toFixed(2)
uni.hideLoading();
}
}).catch(err => {
uni.hideLoading()
});
}
},
//页面显示
onShow() {},
//方法
methods: {
submit(){
this.$refs.popup.open('dialog');
},
changeNum(e){
this.answerModel.num = e;
this.answerModel.price = (parseFloat(this.answerModel.num) * parseFloat(this.detail.price)).toFixed(2);
this.answerModel.interest_rate = (parseFloat(this.answerModel.num) * parseFloat(this.detail.interest_rate)).toFixed(2);
this.answerModel.rate = ((parseFloat(this.answerModel.interest_rate) - parseFloat(this.answerModel.price)) * 100 / parseFloat(this.answerModel.price)).toFixed(2)
},
Confirm(){
let data = {
product_id: this.detail.id,
quantity: this.answerModel.num,
trade_password: this.pingcode
}
this.$http.post('/api/productOrder/create', data).then(res => {
if(res.code == 0){
this.pingcode = '',
this.answerModel.num = 1;
this.answerModel.price = this.detail.price;
this.answerModel.interest_rate = this.detail.interest_rate;
this.$refs.popup.close();
}
}).catch(err => {
this.$refs.popup.close();
uni.showToast({
title:err,
icon:'none'
})
});
}
},
//页面隐藏
onHide() {},
//页面卸载
onUnload() {},
//页面下来刷新
onPullDownRefresh() {},
//页面上拉触底
onReachBottom() {},
//用户点击分享
onShareAppMessage(e) {
return this.wxShare();
}
};
</script>
<style lang="scss" scoped>
@import '@/style/mixin.scss';
body{background-color: #fff;}
.page{min-height: 96vh;position: relative;}
::v-deep .uni-numbox__minus{border-radius: 50%; width: 50rpx; height: 50rpx;}
::v-deep .uni-numbox__plus{border-radius: 50%; width: 50rpx; height: 50rpx;}
::v-deep .uni-numbox__value{ background-color: #fff !important; color: #000 !important}
.rechargeTitle{
font-weight: 400;font-size: 16px;color: #999999;line-height: 23px; text-align: center; margin-top: 30px;
}
.rechargeNet{
font-weight: 600;font-size: 20px;color: #333;line-height: 23px; text-align: center; margin-top: 20px;
}
.txt{
font-size: 14px; color:#999; font-weight: 500;
}
.cell_right{
font-size: 14px; color:#333; font-weight: 500;
}
.s{
border-radius: 10px; border: 1px solid #1D61E7; padding: 2px 8px; color: #1D61E7; font-size: 28rpx; font-weight: 600;
}
</style>