sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1.虚拟币开发--充值开发 

2024.3.7 sws
master
sws 2024-03-07 14:26:54 +08:00
parent 63e9f3467c
commit 62f399feb5
9 changed files with 183 additions and 148 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
pages.json
View File

@ -1266,13 +1266,6 @@
{
"path": "convert/convert",
"style": {
// #ifdef MP-WEIXIN || MP-BAIDU || MP-QQ || MP-KUAISHOU || APP
"navigationStyle": "custom",
// #endif
// #ifdef MP-ALIPAY
"transparentTitle": "auto",
"titlePenetrate":"YES",
// #endif
"enablePullDownRefresh": true,
"navigationBarTitleText": "转换"
}

35
pages/plugins/coin/convert/convert.vue
View File

@ -1,41 +1,8 @@
<template>
<view :class="theme_view">
<component-nav-back></component-nav-back>
<view>
<scroll-view :scroll-y="true" class="scroll-box" lower-threshold="60" @scroll="scroll_event">
<view class="coin-title flex-col padding-lg" :style="'background-image:url(' + wallet_static_url + 'title-bg.png)'">
<view class="margin-bottom-main flex-row jc-sb align-c margin-top-xl">
<view>
<view class="cr-base text-size-md">总数量</view>
<view class="text-size-40 fw-b">{{ is_price_show ? '5410.00' : '***' }}</view>
</view>
<view @tap="price_change">
<iconfont :name="is_price_show ? 'icon-wodeqianbao-eye' : 'icon-wodeqianbao-eyeclo2'" size="44rpx"></iconfont>
</view>
</view>
<view class="flex-row jc-sb padding-bottom-main">
<view v-for="(item, index) in coin_oprate_list" class="tc text-size-xs" :key="index" :data-value="item.url" @tap="url_event">
<view class="coin-oprate-list bg-white flex-row align-c jc-c margin-bottom-main">
<iconfont :name="item.icon" size="44rpx" color="#635BFF"></iconfont>
</view>
<view>{{ item.name }}</view>
</view>
</view>
</view>
<view class="coin-content padding-lg">
<view class="bg-white radius-lg padding-lg">
<view v-for="(item, index) in coin_data" :key="index" class="flex-row jc-sb align-c" :class="coin_data.length == index + 1 ? '' : 'br-b-f5 margin-bottom-lg padding-bottom-lg'">
<view class="flex-1 flex-width flex-row align-c padding-right-main">
<image :src="item.img" mode="widthFix" class="coin-content-list-img round" />
<text class="fw-b single-text margin-left-main">{{ item.name }}</text>
</view>
<view class="flex-col">
<view class="margin-bottom-xss">{{ item.num }}</view>
<view class="cr-grey-9">{{ item.price }}</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</view>

79
pages/plugins/coin/recharge/recharge.css
View File

@ -1,7 +1,84 @@
/*
* 顶部
*/
.recharge-title {
background: radial-gradient( 60% 70% at 90% 79%, rgba(33,125,239,0.85) 0%, #A6C8F3 100%);
background: radial-gradient(60% 70% at 90% 79%, rgba(33, 125, 239, 0.85) 0%, #A6C8F3 100%);
padding-top: 130rpx;
/* #ifndef H5 */
padding-top: calc(var(--status-bar-height) + 5px + 130rpx);
/* #endif */
}
.coin-dropdown {
--height: 48rpx;
display: inline-block;
height: var(--height);
line-height: var(--height);
padding: 0 64rpx 0 32rpx;
background: rgba(255, 255, 255, 0.23);
border-radius: 12px;
}
.recharge-qrcode {
background-color: #fff;
border-radius: 40rpx;
text-align: center;
padding: 30rpx 38rpx;
}
.coin-dropdown-icon {
right: -36rpx;
top: 2rpx;
padding: 0;
}
/*
* 内容
*/
.recharge-content {
margin-top: -32rpx;
border-radius: 32rpx 32rpx 0 0;
min-height: calc(100vh - 528rpx);
/* #ifndef H5 */
min-height: calc(100vh - 528rpx - var(--status-bar-height) - 5px);
/* #endif */
}
.recharge-content-input-bg {
background-color: #fafafc;
}
.recharge-price-item {
--size: -10rpx;
margin-left: var(--size);
margin-right: var(--size);
width: calc(100% - var(--size));
}
.recharge-price-list {
background: #F5F7F9;
border: 2rpx solid #F5F7F9;
border-radius: 16rpx;
padding: 20rpx 0;
margin: 18rpx 10rpx;
width: calc((100% / 3) - 24rpx);
}
.recharge-price-img {
--size: 36rpx;
width: var(--size);
height: var(--size) !important;
}
.recharge-btn {
background: linear-gradient(107deg, #31B4FC 0%, #0842E2 100%);
}
.recharge-content-tips .item::before {
content: '';
width: 12rpx;
height: 12rpx;
border-radius: 12rpx;
background: #30B3FC;
position: absolute;
left: 0;
top: 12rpx;
}

193
pages/plugins/coin/recharge/recharge.vue
View File

@ -4,30 +4,66 @@
<view>
<scroll-view :scroll-y="true" class="scroll-box" lower-threshold="60" @scroll="scroll_event">
<view class="recharge-title flex-col padding-lg">
<view class="margin-bottom-main flex-row jc-sb align-c margin-top-xl">
<view class="margin-bottom-xxxl flex-row jc-sb margin-top-xl">
<view class="cr-white">
<view class="text-size-md">
<text>BTC</text>
<iconfont :name="is_price_show ? 'icon-wodeqianbao-eye' : 'icon-wodeqianbao-eyeclo2'" size="44rpx"></iconfont>
</view>
<picker class="coin-dropdown text-size-md pr margin-bottom-main" @change="coin_event" :value="coin_index" :range="coin_list" range-key="name">
<view class="picker pr">
<text>{{ coin_list[coin_index]['name'] }}</text>
<view class="coin-dropdown-icon pa padding-left-xxl">
<iconfont name="icon-arrow-bottom" size="24rpx" color="#fff"></iconfont>
</view>
</view>
</picker>
<view class="text-size-40 fw-b">38000</view>
</view>
<view @tap="price_change">
<iconfont :name="is_price_show ? 'icon-wodeqianbao-eye' : 'icon-wodeqianbao-eyeclo2'" size="44rpx"></iconfont>
<view class="recharge-qrcode">
<iconfont name="icon-qrcode" size="160rpx"></iconfont>
</view>
</view>
</view>
<view class="recharge-content padding-lg">
<view class="bg-white radius-lg padding-lg">
<view v-for="(item, index) in coin_data" :key="index" class="flex-row jc-sb align-c" :class="coin_data.length == index + 1 ? '' : 'br-b-f5 margin-bottom-lg padding-bottom-lg'">
<view class="flex-1 flex-width flex-row align-c padding-right-main">
<image :src="item.img" mode="widthFix" class="recharge-content-list-img round" />
<text class="fw-b single-text margin-left-main">{{ item.name }}</text>
<view class="recharge-content padding-xxl bg-white">
<view class="margin-bottom-xxxl">
<view class="margin-bottom-main">充币地址</view>
<view class="recharge-content-input-bg padding-main border-radius-sm flex-row align-c">
<view class="single-text padding-right-sm flex-1 flex-width">4gfgefg33445fghfghh4bfbfghebdfb34fgdfg44gfgefg33445fghfghh4bfbfghebdfb34fgdfg4</view>
<view @tap.stop="text_copy_event">
<iconfont name="icon-copy" size="24rpx" color="#999"></iconfont>
</view>
<view class="flex-col">
<view class="margin-bottom-xss">{{ item.num }}</view>
<view class="cr-grey-9">{{ item.price }}</view>
</view>
</view>
<view class="margin-bottom-xxxl">
<view class="margin-bottom-main">充币网络</view>
<picker class="recharge-content-input-bg padding-main border-radius-sm" @change="recharge_event" :value="recharge_web_index" :range="recharge_web_list" range-key="name">
<view class="picker arrow-bottom">
{{ recharge_web_list[recharge_web_index]['name'] }}
</view>
</picker>
</view>
<view class="margin-bottom-xxxl">
<view class="margin-bottom-xs">选择充值金额</view>
<view class="flex-row flex-warp recharge-price-item margin-bottom-xs">
<view v-for="(item, index) in recharge_price_list" :key="index" class="recharge-price-list flex-col align-c jc-c">
<view class="flex-row align-c jc-c">
<image :src="wallet_static_url + 'recharge-price.png'" mode="widthFix" class="recharge-price-img round" />
<view>{{ item.name }}</view>
</view>
<view>{{ item.price }}</view>
</view>
</view>
<view class="recharge-content-input-bg padding-main border-radius-sm flex-row align-c margin-bottom-xxl">
<text>其他数量</text>
<view class="padding-left-lg">
<input type="digit" class="" placeholder-class="text-size-sm cr-grey-9" placeholder="请输入充值数量" />
</view>
</view>
<button type="default" class="recharge-btn cr-white round" @tap="popup_goods_search_event">立即充值</button>
</view>
<view class="margin-bottom-xxxl">
<view class="margin-bottom-main">充值说明：</view>
<view class="recharge-content-tips">
<view class="item pr padding-left-xl margin-bottom-sm cr-grey-9 text-size-xs">充值只可选择以上固定档位金额</view>
<view class="item pr padding-left-xl margin-bottom-sm cr-grey-9 text-size-xs">充值只可选择以上固定档位金额</view>
<view class="item pr padding-left-xl margin-bottom-sm cr-grey-9 text-size-xs">充值只可选择以上固定档位金额</view>
</view>
</view>
</view>
@ -53,108 +89,47 @@
status_bar_height: bar_height,
// 是否显示虚拟币
is_price_show: false,
// 虚拟币操作列表
coin_oprate_list: [
is_unit_arrow: false,
coin_index: 0,
coin_list: [
{
name: '充值',
icon: 'icon-recharge',
url: '/pages/plugins/coin/recharge/recharge',
name: 'BTC',
},
{
name: '转换',
icon: 'icon-convert',
url: '/pages/plugins/coin/convert/convert',
},
{
name: '提现',
icon: 'icon-withdrawal',
url: '/pages/plugins/coin/withdrawal/withdrawal',
},
{
name: '明细',
icon: 'icon-detail',
url: '/pages/plugins/coin/detail/detail',
name: 'USDT-polygon',
},
],
coin_data: [
// 充币网络
recharge_web_index: 0,
recharge_web_list: [
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
name: 'USDT-polygon',
},
],
// 充值金额
recharge_price_list: [
{
name: '100',
price: '100',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
name: '400',
price: '400',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
name: '400',
price: '400',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
name: '400',
price: '400',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
},
{
img: wallet_static_url + 'title-bg.png',
name: 'BTC',
price: '¥20000',
num: '200000',
name: '400',
price: '400',
},
],
};
@ -204,8 +179,18 @@
// 显示隐藏虚拟币
price_change() {
this.setData({});
},
//
coin_event(e) {
this.setData({
is_price_show: !this.is_price_show,
coin_index: parseInt(e.detail.value || 0),
});
},
// 充币网络
recharge_event(e) {
this.setData({
recharge_web_index: parseInt(e.detail.value || 0),
});
},
// 页面滚动监听
@ -217,6 +202,10 @@
url_event(e) {
app.globalData.url_event(e);
},
// 复制文本
text_copy_event(e) {
app.globalData.text_copy_event(e);
},
},
};
</script>

7
pages/plugins/coin/user/user.css
View File

@ -1,3 +1,6 @@
/*
* 顶部
*/
.coin-title {
background-size: 100% auto;
padding-top: 130rpx;
@ -14,7 +17,9 @@
height: var(--size);
border-radius: 32rpx;
}
/*
* 内容
*/
.coin-content .coin-item {
max-height: calc(100vh - 688rpx);
/* #ifndef H5 */

2
pages/plugins/membershiplevelvip/user/user.vue
View File

@ -47,7 +47,7 @@
<!-- 已开通会员 -->
<view class="pa vip-btn flex-row align-c">
<navigator url="/pages/plugins/membershiplevelvip/member-code/member-code" hover-class="none">
<iconfont name="icon-wdhy-erweima" size="44rpx" color="#fff" propClass="padding-right-main pr bottom-md"></iconfont>
<iconfont name="icon-qrcode" size="44rpx" color="#fff" propClass="padding-right-main pr bottom-md"></iconfont>
</navigator>
<block v-if="(user_vip || null) != null">
<!-- 判断会员永久 -->

2
pages/plugins/wallet/user/user.vue
View File

@ -30,7 +30,7 @@
<iconfont :name="is_price_show ? 'icon-wodeqianbao-eye' : 'icon-wodeqianbao-eyeclo2'" size="44rpx"></iconfont>
</view>
<view class="margin-left-xxxl" data-value="/pages/plugins/wallet/payment-code/payment-code" @tap="url_event">
<iconfont name="icon-wdhy-erweima" size="44rpx"></iconfont>
<iconfont name="icon-qrcode" size="44rpx"></iconfont>
</view>
</view>
</view>

6
static/icon/iconfont.css
View File

@ -14,6 +14,10 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-copy:before {
content: "\e71e";
}
.icon-zhuanzhang:before {
content: "\e71b";
}
@ -154,7 +158,7 @@
content: "\e6d8";
}
.icon-wdhy-erweima:before {
.icon-qrcode:before {
content: "\e6d7";
}

BIN
static/icon/iconfont.ttf
View File

Binary file not shown.