li
5f40e4e1b5
- 移除秒合约页面及UI - 合约页Tab改为Position Held/Transaction Record - 存款/提款/转账页增加BTC/ETH - 资产页重构(用户信息+盈亏+多语言) - 注册页改版(匹配新设计稿) - 日文全面翻译+首页菜单多语言 - 代理专属注册链接支持(?code=) - 10个locale文件同步更新
275 lines
8.1 KiB
Vue
275 lines
8.1 KiB
Vue
<template>
|
|
<view :style="'background-color: '+theme.bg+';color: '+theme.text" style="height: 100vh;">
|
|
<!-- 头部 -->
|
|
<view class="width-750 relative flex align-center justify-center"
|
|
:style="{height: `calc(${statusBar}px + 220rpx)`}">
|
|
<view class="width-750 fixed1 bj-0165EE"
|
|
:style="{paddingTop: statusBar + 'px', height: `calc(${statusBar}px + 220rpx)`}">
|
|
<view class="width-750 height-110 padding-w-30 flex align-center justify-center">
|
|
<view @click="_goback" class="cuIcon-back font-40 color-white"
|
|
style="position: absolute;left: 30rpx;"></view>
|
|
<text class="font-36 color-white weight-bold">{{i18n.fastBuy.title1}}</text>
|
|
<view class="flex align-center" style="position: absolute;right: 30rpx;">
|
|
<view @click="show=true" class="switchbox">
|
|
<text class="nummedium-font">{{faby.curr_name}}</text>
|
|
<image class="width-34 height-34 margin-l-13" src="/static/imgs/index/change@2x.png"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="height-110 flex align-center padding-w-30">
|
|
<view class="flex-10 flex align-center">
|
|
<view @click="changeType(1)" class="flex-1" :class="currtype==1?'onfont':'offfont'">{{i18n.fastBuy.text1}}</view>
|
|
<view @click="changeType(2)" class="flex-1" :class="currtype==2?'onfont':'offfont'">{{i18n.fastBuy.text2}}</view>
|
|
</view>
|
|
<view class="flex-2 flex align-center justify-end">
|
|
<image @click="router.push('/pages/index/fastDetails')" class="width-54 height-54" src="/static/imgs/index/jilu@2x.png"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 身体 -->
|
|
<view class="width-750 padding-b-40" :style="'background-color: '+theme.bg+';color: '+theme.text">
|
|
<!-- 价格 -->
|
|
<view class="height-148 bj-0061E8">
|
|
<view class="pricebox" :style="'background-color: '+theme.bg+';color: '+theme.text">
|
|
<text class="font-30">{{i18n.fastBuy.text3}}</text>
|
|
<text class="font-36 numbold-font">1 USDT ≈ {{faby.usdt_price}} {{faby.curr_name}}</text>
|
|
</view>
|
|
</view>
|
|
<!-- 按金额 -->
|
|
<view v-if="currtype==1">
|
|
<!-- 金额 -->
|
|
<view class="height-192 margin-t-45 padding-w-30">
|
|
<view class="height-96 flex align-center font-32">{{i18n.fastBuy.text4}}</view>
|
|
<view class="height-96 flex align-center">
|
|
<text class="font-28">{{faby.symbol}}</text>
|
|
<input class="padding-l-20 font-32" :placeholder="i18n.fastBuy.tos1" type="number" v-model="price" />
|
|
</view>
|
|
</view>
|
|
<!-- 数量 -->
|
|
<view class="flex align-center justify-between margin-t-27 padding-w-30">
|
|
<text class="font-32">{{i18n.fastBuy.text5}}</text>
|
|
<text class="font-42 color-0165EE numbold-font">{{price==''?'0':(price/faby.usdt_price).toFixed(8)}}</text>
|
|
</view>
|
|
</view>
|
|
<!-- 按数量 -->
|
|
<view v-if="currtype==2">
|
|
<!-- 购买数量 -->
|
|
<view class="height-192 margin-t-45 padding-w-30">
|
|
<view class="height-96 flex align-center font-32">{{i18n.fastBuy.text6}}</view>
|
|
<view class="height-96 flex align-center justify-between">
|
|
<input class="font-32" :placeholder="i18n.fastBuy.tos2" type="number" v-model="number" />
|
|
<view class="flex align-center">
|
|
<text class="font-32 nummedium-font">USDT</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 实付款 -->
|
|
<view class="flex align-center justify-between margin-t-27 padding-w-30">
|
|
<text class="font-32">{{i18n.fastBuy.text7}}</text>
|
|
<text class="font-42 color-0165EE numbold-font">{{faby.symbol}} {{number==''?'0':(number*faby.usdt_price).toFixed(2)}}</text>
|
|
</view>
|
|
</view>
|
|
<!-- 交易方式 -->
|
|
<view class="height-96 padding-w-30 flex align-center justify-between">
|
|
<text class="font-32">{{i18n.fastBuy.text8}}</text>
|
|
<text class="font-32 color-C3C3C3">{{faby.pay_name}}</text>
|
|
</view>
|
|
<view @click="router.push('/pages/my/aboutUs/agreement?title=tuikuan')" class="height-96 padding-w-30 flex align-center">
|
|
<text class="font-28">{{i18n.recharge.text18}}</text>
|
|
<i class="cuIcon-question"></i>
|
|
</view>
|
|
|
|
<!-- 按钮 -->
|
|
<view @click="getbuy" class="buybtn">
|
|
<image class="width-32 height-32 margin-r-10" src="/static/imgs/index/kjbtn.png" mode=""></image>
|
|
<text>{{i18n.fastBuy.text9}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 法币弹窗 -->
|
|
<u-popup v-model="show" mode="bottom" border-radius="20">
|
|
<view class="padding-w-30 padding-b-36"
|
|
:style="'background-color: '+theme.bg+';color: '+theme.text">
|
|
<view class="height-96 line-height-96 text-center relative">
|
|
<text class="font-32 weight-bold">{{i18n.fastBuy.text10}}</text>
|
|
<text @click.stop="show=false" class="font-26 color-C3C3C3 absolute" style="right: 0;">{{i18n.fastBuy.text11}}</text>
|
|
</view>
|
|
<scroll-view scroll-y="true" class="height-450">
|
|
<view @click="selectfaby(item)" v-for="(item,index) in fabylist"
|
|
class="height-96 flex align-center justify-between">
|
|
<view class="flex align-center">
|
|
<image class="width-48 height-48 radiu-24" :src="item.pay_image" mode=""></image>
|
|
<text class="font-30 margin-l-16">{{item.curr_name}}</text>
|
|
</view>
|
|
<image class="width-36 height-36" :src="faby.id==item.id?XZ:WX" mode=""></image>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
statusBar: uni.getSystemInfoSync().statusBarHeight,
|
|
currtype: 1,
|
|
show: false,
|
|
fabylist: [],
|
|
faby: '',
|
|
WX: '/static/imgs/quantify/weixuanzhong@2x.png',
|
|
XZ: '/static/imgs/quantify/xuanzhong@2x.png',
|
|
price: '',
|
|
number: '',
|
|
flag: true,
|
|
|
|
theme: '',
|
|
}
|
|
},
|
|
computed: {
|
|
i18n() {
|
|
return this.$t('message');
|
|
}
|
|
},
|
|
onShow() {
|
|
if (uni.getStorageSync("theme") == "dark") {
|
|
this.theme = this.$store.state.darkTheme
|
|
} else {
|
|
this.theme = this.$store.state.lightTheme
|
|
}
|
|
this.getFabylist()
|
|
},
|
|
methods: {
|
|
// 购买
|
|
getbuy() {
|
|
if (!this.flag) {
|
|
return
|
|
} else {
|
|
if (this.currtype == 1) {
|
|
if (this.price == '') return this.tos(this.i18n.fastBuy.tos1)
|
|
var obj = {
|
|
id: this.faby.id,
|
|
type: this.currtype,
|
|
number: this.price
|
|
}
|
|
}
|
|
if (this.currtype == 2) {
|
|
if (this.number == '') return this.tos(this.i18n.fastBuy.tos2)
|
|
var obj = {
|
|
id: this.faby.id,
|
|
type: this.currtype,
|
|
number: this.number
|
|
}
|
|
}
|
|
this.flag = false
|
|
console.log(obj)
|
|
this.post('/Marketpay/add_order', obj).then(res => {
|
|
this.flag = true
|
|
this.number = ''
|
|
this.price = ''
|
|
console.log(res)
|
|
if (res.code == 1) {
|
|
|
|
}
|
|
})
|
|
}
|
|
},
|
|
// 获取法币列表
|
|
getFabylist() {
|
|
this.post('/Marketpay/get_country').then(res => {
|
|
console.log(res)
|
|
if (res.code == 1) {
|
|
this.fabylist = res.data
|
|
this.faby = res.data[0]
|
|
}
|
|
})
|
|
},
|
|
selectfaby(item) {
|
|
if (this.faby.id != item.id) {
|
|
this.faby = item
|
|
this.show = false
|
|
}
|
|
},
|
|
changeType(i) {
|
|
if (this.currtype != i) {
|
|
this.currtype = i
|
|
this.number = ''
|
|
this.price = ''
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.fixed1 {
|
|
position: fixed;
|
|
top: 0;
|
|
z-index: 1000;
|
|
// background-color: #FFFFFF;
|
|
}
|
|
|
|
.fabubox {
|
|
width: 180rpx;
|
|
height: 56rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 28rpx 0rpx 0rpx 28rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 30rpx;
|
|
color: #0165EE;
|
|
}
|
|
|
|
.onfont {
|
|
font-size: 42rpx;
|
|
font-weight: bold;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.offfont {
|
|
font-size: 32rpx;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
opacity: 0.5;
|
|
}
|
|
|
|
.pricebox {
|
|
width: 750rpx;
|
|
height: 148rpx;
|
|
// background: #FFFFFF;
|
|
opacity: 1;
|
|
border-radius: 20rpx 20rpx 0 0;
|
|
padding: 20rpx 30rpx 15rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.buybtn {
|
|
width: 690rpx;
|
|
height: 96rpx;
|
|
background: #0165EE;
|
|
opacity: 1;
|
|
border-radius: 10rpx;
|
|
margin: 220rpx auto 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 32rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.searchbox {
|
|
width: 610rpx;
|
|
height: 60rpx;
|
|
background: #F6F8FC;
|
|
border: 1rpx solid rgba(191, 195, 199, 0.2);
|
|
opacity: 1;
|
|
border-radius: 30rpx;
|
|
}
|
|
</style>
|