You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
674 lines
20 KiB
674 lines
20 KiB
<template> |
|
<div class="entry-wrapper"> |
|
<div class="entry-content"> |
|
<div class="enrty-content__header"> |
|
<p class="entry-title">区块链金融交易所实训系统</p> |
|
<div class="centerNav"> |
|
<el-button type="success" @click="submitExam">提交</el-button> |
|
<el-button type="danger" @click="reStartTest">重新开始</el-button> |
|
</div> |
|
</div> |
|
<div class="usdList paylist"> |
|
<div class="usdItem wechat"> |
|
<!-- 跳转到交易中心,携带交易对 --> |
|
<a href="javascript:;"> |
|
<p>初始资金：{{ userTimeMoneyDto.wxPayInit }} CNY</p> |
|
<p>可用资金：{{ userTimeMoneyDto.wxPay }} CNY</p> |
|
<!--<p>全部资金：{{ tatolPrice }} CNY</p>--> |
|
</a> |
|
</div> |
|
<div class="usdItem alipay"> |
|
<!-- 跳转到交易中心,携带交易对 --> |
|
<a href="javascript:;"> |
|
<p>初始资金：{{ userTimeMoneyDto.aliPayInit }} CNY</p> |
|
<p>可用资金：{{ userTimeMoneyDto.aliPay }} CNY</p> |
|
<!-- <p>全部资金：{{ tatolPrice }} CNY</p>--> |
|
</a> |
|
</div> |
|
<div class="usdItem bank"> |
|
<!-- 跳转到交易中心,携带交易对 --> |
|
<a href="javascript:;"> |
|
<p>初始资金：{{ userTimeMoneyDto.bankCardInit }}CNY</p> |
|
<p>可用资金：{{ userTimeMoneyDto.bankCard }} CNY</p> |
|
<!--<p>全部资金：{{ tatolPrice }} CNY</p>--> |
|
</a> |
|
</div> |
|
</div> |
|
<div class="usdList tabs"> |
|
<el-tabs v-model="activeName"> |
|
<el-tab-pane label="BTC" name="BTC"> |
|
<div class="tabs-flex"> |
|
<div class="flex-1"> |
|
<p>总资产: {{ userTimeMoneyDto.btc }}</p> |
|
<p>≈{{ btcRMBCount }} CNY</p> |
|
<p>提币地址：{{ userTimeMoneyDto.assessUserId }}</p> |
|
</div> |
|
<!-- <div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div> |
|
<div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div> |
|
<div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div>--> |
|
</div> |
|
</el-tab-pane> |
|
<el-tab-pane label="USDT" name="USDT"> |
|
<div class="tabs-flex"> |
|
<div class="flex-1"> |
|
<p>总资产: {{ userTimeMoneyDto.usdt }}</p> |
|
<p>≈{{ usdtRMBCount }} CNY</p> |
|
<p>提币地址：{{ userTimeMoneyDto.assessUserId }}</p> |
|
</div> |
|
<!-- <div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div> |
|
<div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div> |
|
<div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div>--> |
|
</div> |
|
</el-tab-pane> |
|
<el-tab-pane label="EOS" name="EOS"> |
|
<div class="tabs-flex"> |
|
<div class="flex-1"> |
|
<p>总资产: {{ userTimeMoneyDto.eos }}</p> |
|
<p>≈{{ eosRMBCount }} CNY</p> |
|
<p>提币地址：{{ userTimeMoneyDto.assessUserId }}</p> |
|
</div> |
|
<!-- <div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div> |
|
<div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div> |
|
<div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div>--> |
|
</div> |
|
</el-tab-pane> |
|
<el-tab-pane label="ETH" name="ETH"> |
|
<div class="tabs-flex"> |
|
<div class="flex-1"> |
|
<p>总资产: {{ userTimeMoneyDto.eth }}</p> |
|
<p>≈{{ ethRMBCount }} CNY</p> |
|
<p>提币地址：{{ userTimeMoneyDto.assessUserId }}</p> |
|
</div> |
|
<!-- <div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div> |
|
<div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div> |
|
<div class="flex-1"> |
|
<p>总资产: 0</p> |
|
<p>≈0 CNY</p> |
|
</div>--> |
|
</div> |
|
</el-tab-pane> |
|
</el-tabs> |
|
</div> |
|
<a href="javascript:;" class="entry-btn" @click="goIndex"> |
|
<img src="../images/entry/btn.png" /> |
|
</a> |
|
<!-- <div class="usdList"> |
|
<div class="usdItem" element-loading-background="rgba(0, 0, 0, 0.2)"> |
|
<!– 跳转到交易中心,携带交易对 --/> |
|
<a href="javascript:;"> |
|
<p>微信 <i class="el-icon-star-off"></i></p> |
|
<p>初始资金：{{ userTimeMoneyDto.wxPayInit}} CNY</p> |
|
<p>可用资金：{{ userTimeMoneyDto.wxPay }} CNY</p> |
|
</a> |
|
</div> |
|
<div class="usdItem" element-loading-background="rgba(0, 0, 0, 0.2)"> |
|
<!– 跳转到交易中心,携带交易对 --/> |
|
<a href="javascript:;"> |
|
<p>支付宝 <i class="el-icon-star-off"></i></p> |
|
<p>初始资金：{{ userTimeMoneyDto.aliPayInit}} CNY</p> |
|
<p>可用资金：{{ userTimeMoneyDto.aliPay }} CNY</p> |
|
</a> |
|
</div> |
|
<div class="usdItem" element-loading-background="rgba(0, 0, 0, 0.2)"> |
|
<!– 跳转到交易中心,携带交易对 --/> |
|
<a href="javascript:;"> |
|
<p>银行卡 <i class="el-icon-star-off"></i></p> |
|
<p>初始资金：{{ userTimeMoneyDto.bankCardInit}} CNY</p> |
|
<p>可用资金：{{ userTimeMoneyDto.bankCard }} CNY</p> |
|
</a> |
|
</div> |
|
</div> |
|
|
|
<div class="usdList tabs"> |
|
<el-tabs v-model="activeName"> |
|
<el-tab-pane label="BTC" name="BTC" |
|
>可用资金：{{ userTimeMoneyDto.btc }} <br/><br/> 总额≈：{{tatolPrice}} CNY <br/><br/> 地址：{{userTimeMoneyDto.assessUserId}}</el-tab-pane |
|
> |
|
<el-tab-pane label="USDT" name="USDT" |
|
>可用资金：{{ userTimeMoneyDto.usdt }} <br/><br/> 总额≈：{{tatolPrice}} CNY <br/><br/> 地址：{{userTimeMoneyDto.assessUserId}}</el-tab-pane |
|
> |
|
<el-tab-pane label="EOS" name="EOS" |
|
>可用资金：{{ userTimeMoneyDto.eos }} <br/><br/> 总额≈：{{tatolPrice}} CNY <br/><br/> 地址：{{userTimeMoneyDto.assessUserId}}</el-tab-pane |
|
> |
|
<el-tab-pane label="ETH" name="ETH" |
|
>可用资金：{{ userTimeMoneyDto.eth }} <br/><br/> 总额≈：{{tatolPrice}} CNY <br/><br/> 地址：{{userTimeMoneyDto.assessUserId}}</el-tab-pane |
|
> |
|
</el-tabs> |
|
</div>--> |
|
</div> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import NavHeader from '@/components/common/header'; |
|
import Footer from '@/components/common/footer'; |
|
import {getUserTimeMoneyDto} from '@/api/yyyf'; |
|
import {getLeftPrice} from '@/api/currency.js'; |
|
import {submit, reStart} from '@/api/yyyf'; |
|
import {logOut} from '@/api/user'; |
|
import {signUp, signIn} from '@/api/user'; |
|
import {yyyfUrl} from '@/api/app.js'; |
|
|
|
export default { |
|
name: 'entry', |
|
data() { |
|
return { |
|
activeName: 'BTC', |
|
userTimeMoneyDto: {}, |
|
tatolPrice: 0, |
|
//0 考试 1 练习 2 不计分 |
|
reqType: 2, |
|
//剩余时间 |
|
remainingTime: 0, |
|
//防止重复提交 |
|
isSubmit: false, |
|
newwin: undefined, |
|
btcRMBCount: 0, |
|
usdtRMBCount: 0, |
|
eosRMBCount: 0, |
|
ethRMBCount: 0, |
|
}; |
|
}, |
|
components: { |
|
NavHeader, |
|
Footer, |
|
}, |
|
methods: { |
|
getUserTimeMoneyDtoMethod() { |
|
let ths = this; |
|
getUserTimeMoneyDto().then(res => { |
|
if (res.data.code === 200) { |
|
ths.userTimeMoneyDto = res.data.data; |
|
this.getUSDTPrie(); |
|
} else { |
|
ths.$message.warning({ |
|
message: res.data.msg, |
|
onClose: function() { |
|
ths.closeWindow(); |
|
}, |
|
}); |
|
} |
|
}); |
|
}, |
|
login(params) { |
|
signIn(params).then(res => { |
|
// console.log(res); |
|
if (res.data.code === 200) { |
|
//判断是否保存自动登录 |
|
// if( this.checked === true ){ |
|
// Cookie.set('phoneNum',num) |
|
// Cookie.set('password',pass) |
|
// } |
|
//保存登录的token到cookie |
|
// Cookie.set('token', res.data.data.token); |
|
localStorage.setItem('token', res.data.data.token); |
|
//重复提交标识 |
|
localStorage.setItem('isSubmit', JSON.stringify(false)); |
|
//保存登录的用户信息到cookie |
|
// Cookie.set('userData', res.data.data); |
|
localStorage.setItem('userData', JSON.stringify(res.data.data)); |
|
// console.log(JSON.parse(localStorage.getItem('userData'))); |
|
|
|
// 保存userID的信息到cookie |
|
// Cookie.set('userID', res.data.data.id); |
|
localStorage.setItem('userID', res.data.data.id); |
|
|
|
// 保存邀请码信息 |
|
localStorage.setItem('invitationCode', res.data.data.invitationCode); |
|
this.isSubmit = false; |
|
location.href = '/entry'; |
|
} else { |
|
this.$message.warning(res.data.msg); |
|
this.isSubmit = false; |
|
} |
|
}); |
|
}, |
|
winOpen: function() { |
|
if (this.newwin != undefined) { |
|
if ( |
|
navigator.userAgent.indexOf('Firefox') != -1 || |
|
navigator.userAgent.indexOf('Chrome') != -1 |
|
) { |
|
this.newwin.location.href = 'about:blank'; |
|
this.newwin.close(); |
|
} else { |
|
this.newwin.opener = null; |
|
this.newwin.open('', '_self'); |
|
this.newwin.close(); |
|
} |
|
} |
|
this.newwin = window.open( |
|
'/', |
|
'onlywin', |
|
'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, copyhistory=yes, height=600,width=1100,left=180,top=100' |
|
); |
|
}, |
|
closeWindow: function() { |
|
if ( |
|
navigator.userAgent.indexOf('Firefox') != -1 || |
|
navigator.userAgent.indexOf('Chrome') != -1 |
|
) { |
|
window.location.href = 'about:blank'; |
|
window.close(); |
|
} else { |
|
window.opener = null; |
|
window.open('', '_self'); |
|
window.close(); |
|
} |
|
}, |
|
sign(params) { |
|
signUp(params).then(res => { |
|
if (res.data.code === 200) { |
|
this.login({ |
|
tel: params.tel, |
|
password: params.password, |
|
}); |
|
} else { |
|
this.$message.warning(res.data.msg); |
|
this.isSubmit = false; |
|
} |
|
}); |
|
}, |
|
exit(params) { |
|
logOut().then(res => { |
|
if (res.data.code === 200 || res.data.code === 202) { |
|
// Cookie.set('userData', ''); |
|
localStorage.setItem('userData', ''); |
|
localStorage.removeItem('userpass'); |
|
localStorage.removeItem('userdate'); |
|
localStorage.removeItem('nowPassNOValue'); |
|
if (params == undefined) { |
|
//window.location.href = '/'; |
|
this.closeWindow(); |
|
} |
|
|
|
// let pathName = window.location.pathname.split('/')[1]; |
|
// console.log(pathName); |
|
//判断是否从个人中心页面退出登录 |
|
// if (pathName === 'personal') { |
|
// window.location.href = '/login'; |
|
// } else { |
|
// window.location.href = this.perUrl; |
|
// } |
|
} else { |
|
this.$message.warning(res.data.msg); |
|
} |
|
}); |
|
}, |
|
goIndex() { |
|
this.winOpen(); |
|
}, |
|
submitExam: function() { |
|
let self = this; |
|
//防止重复提交 |
|
if (!self.isSubmit) { |
|
self.isSubmit = true; |
|
} else { |
|
return false; |
|
} |
|
|
|
submit().then(res => { |
|
if (res.data.code === 200) { |
|
this.$message.success({ |
|
message: '提交成功', |
|
onClose: function() { |
|
if (self.reqType == 0) { |
|
self.closeWindow(); |
|
} else { |
|
localStorage.setItem('isSubmit', JSON.stringify(true)); |
|
self.isSubmit = false; |
|
} |
|
self.getUserTimeMoneyDtoMethod(); |
|
}, |
|
}); |
|
} else { |
|
this.$message.warning({ |
|
message: res.data.msg, |
|
onClose: function() { |
|
self.closeWindow(); |
|
}, |
|
}); |
|
} |
|
}); |
|
}, |
|
reStartTest: function() { |
|
let self = this; |
|
//防止重复提交 |
|
if (!self.isSubmit) { |
|
this.isSubmit = true; |
|
} else { |
|
return false; |
|
} |
|
//退出当前用户 |
|
this.exit(1); |
|
reStart().then(res => { |
|
if (res.data.code === 200) { |
|
this.$message.success({ |
|
message: '重新开始成功', |
|
onClose: function() { |
|
let signParams = { |
|
tel: res.data.data.tel, |
|
nickName: res.data.data.nickName, |
|
code: res.data.data.code, |
|
password: res.data.data.password, |
|
internationalCode: null, |
|
invitationCode: '', |
|
}; |
|
self.sign(signParams); |
|
}, |
|
}); |
|
} else { |
|
this.$message.warning({ |
|
message: res.data.msg, |
|
onClose: function() { |
|
self.closeWindow(); |
|
}, |
|
}); |
|
} |
|
}); |
|
}, |
|
getUSDTPrie() { |
|
let ths = this; |
|
getLeftPrice().then(res => { |
|
ths.USDTPrie = res.data.data; |
|
// console.log(this.USDTPrie); |
|
|
|
// 获取币种汇率 |
|
let cnyAmount = this.USDTPrie[0].cnyAmount; |
|
let btcCount = 0; |
|
let usdtCount = this.userTimeMoneyDto.usdt; |
|
let eosCount = 0; |
|
let ethCount = 0; |
|
|
|
for (let i = 0; i < this.USDTPrie.length; i++) { |
|
// 获取btc转usdt资产 |
|
if (ths.USDTPrie[i].currencyPair == 'BTC-USDT') { |
|
// console.log(this.USDTPrie[i].amount); |
|
// |
|
btcCount = ths.userTimeMoneyDto.btc * ths.USDTPrie[i].amount; |
|
// console.log('btc'+this.btcPrice); |
|
} |
|
// return this.btcPrice; |
|
} |
|
for (let i = 0; i < this.USDTPrie.length; i++) { |
|
// 获取btc转usdt资产 |
|
if (ths.USDTPrie[i].currencyPair == 'EOS-USDT') { |
|
// console.log(this.USDTPrie[i].amount); |
|
// |
|
eosCount = ths.userTimeMoneyDto.eos * ths.USDTPrie[i].amount; |
|
// console.log('btc'+this.btcPrice); |
|
} |
|
// return this.btcPrice; |
|
} |
|
|
|
for (let i = 0; i < this.USDTPrie.length; i++) { |
|
// 获取btc转usdt资产 |
|
if (ths.USDTPrie[i].currencyPair == 'ETH-USDT') { |
|
// console.log(this.USDTPrie[i].amount); |
|
// |
|
ethCount = ths.userTimeMoneyDto.eth * ths.USDTPrie[i].amount; |
|
// console.log('btc'+this.btcPrice); |
|
} |
|
// return this.btcPrice; |
|
} |
|
|
|
ths.btcRMBCount = btcCount * cnyAmount; |
|
ths.usdtRMBCount = usdtCount * cnyAmount; |
|
ths.eosRMBCount = eosCount * cnyAmount; |
|
ths.ethRMBCount = ethCount * cnyAmount; |
|
|
|
let digitWallet = |
|
ths.btcRMBCount + |
|
ths.usdtRMBCount + |
|
ths.eosRMBCount + |
|
ths.ethRMBCount; |
|
|
|
let total = |
|
digitWallet + |
|
ths.userTimeMoneyDto.aliPay + |
|
ths.userTimeMoneyDto.wxPay + |
|
ths.userTimeMoneyDto.bankCard; |
|
// 获取总资产 |
|
ths.tatolPrice = Math.floor(total * 10) / 10; |
|
|
|
// console.log(this.tatolPrice); |
|
}); |
|
}, |
|
}, |
|
created() { |
|
let ths = this; |
|
ths.getUserTimeMoneyDtoMethod(); |
|
let yyyfToken = localStorage.getItem('yyyfToken'); |
|
this.isSubmit = localStorage.getItem('isSubmit') == 'true' ? true : false; |
|
if (yyyfToken == '' || yyyfToken == undefined) { |
|
this.$alert('未从以渔有方登录，点击确定返回登录', '提示', { |
|
type: 'error', |
|
showClose: false, |
|
confirmButtonText: '确定', |
|
confirmButtonClass: 'btn-self-style', |
|
callback: () => { |
|
window.location.href = yyyfUrl; |
|
}, |
|
}); |
|
} else { |
|
ths.reqType = localStorage.getItem('reqType'); |
|
} |
|
}, |
|
}; |
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
.entry-wrapper { |
|
.entry-content { |
|
background: url(../images/entry/bg.jpg); |
|
background-size: cover; |
|
|
|
.enrty-content__header { |
|
display: flex; |
|
justify-content: space-between; |
|
align-items: center; |
|
|
|
.centerNav { |
|
margin-right: 24px; |
|
} |
|
} |
|
|
|
.entry-btn { |
|
width: 265px; |
|
height: 30px; |
|
display: block; |
|
padding-bottom: 32px; |
|
margin: 0 auto 0 auto; |
|
cursor: pointer; |
|
|
|
img { |
|
width: 100%; |
|
height: 100%; |
|
display: block; |
|
cursor: pointer; |
|
} |
|
} |
|
} |
|
|
|
.entry-title { |
|
font-family: NotoSansHans-Regular; |
|
font-size: 20px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
line-height: 21px; |
|
letter-spacing: 0px; |
|
color: #00f5ff; |
|
padding: 24px; |
|
margin: 0; |
|
} |
|
} |
|
|
|
.paylist { |
|
position: relative; |
|
|
|
&::before { |
|
content: ''; |
|
display: block; |
|
background-image: url(../images/entry/line1.png); |
|
width: 730px; |
|
position: absolute; |
|
height: 105px; |
|
top: -118px; |
|
left: 40px; |
|
background-size: cover; |
|
} |
|
} |
|
|
|
.usdList { |
|
margin: 0 auto; |
|
width: 815px; |
|
margin-top: 110px; |
|
display: flex; |
|
justify-content: space-between; |
|
|
|
.usdItem { |
|
width: 166px; |
|
height: 158px; |
|
position: relative; |
|
background-size: cover; |
|
|
|
&.wechat { |
|
background-image: url(../images/entry/wechat.png); |
|
} |
|
|
|
&.bank { |
|
background-image: url(../images/entry/bank.png); |
|
} |
|
|
|
&.alipay { |
|
background-image: url(../images/entry/alipay.png); |
|
} |
|
|
|
a { |
|
display: block; |
|
margin-top: 85px; |
|
} |
|
|
|
p { |
|
font-family: NotoSansHans-DemiLight; |
|
font-size: 10px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 0px; |
|
color: #08c7cf; |
|
margin: 6px 8px; |
|
|
|
&:first-child { |
|
margin-top: 88px; |
|
} |
|
} |
|
} |
|
|
|
&.tabs { |
|
color: #fff; |
|
background: url(../images/entry/wallet1.png); |
|
background-size: cover; |
|
margin-top: -85px; |
|
height: 315px; |
|
width: 965px; |
|
padding-top: 145px; |
|
|
|
.el-tabs { |
|
width: 755px; |
|
margin: 60px auto 14px auto; |
|
|
|
/deep/ .el-tabs__header { |
|
margin-bottom: 8px; |
|
} |
|
} |
|
|
|
/DEEP/ .el-tabs__nav { |
|
/DEEP/ .el-tabs__item { |
|
font-family: NotoSansHans-Regular; |
|
font-size: 15px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
line-height: 40px; |
|
letter-spacing: 0px; |
|
color: #00f5ff; |
|
|
|
&.is-active { |
|
color: #00f5ff; |
|
font-size: 20px; |
|
font-weight: bold; |
|
} |
|
} |
|
|
|
/DEEP/ .el-tabs__active-bar { |
|
width: 0 !important; |
|
height: 0 !important; |
|
border-left: 8px solid transparent; |
|
border-right: 8px solid transparent; |
|
border-bottom: 6px solid #00f5ff; |
|
background: none; |
|
margin-left: 5%; |
|
} |
|
} |
|
|
|
/DEEP/ .el-tabs__nav-wrap::after { |
|
background-color: #00f5ff; |
|
} |
|
|
|
.el-tab-pane { |
|
width: 100%; |
|
} |
|
} |
|
|
|
.tabs-flex { |
|
display: flex; |
|
justify-content: space-between; |
|
|
|
.flex-1 { |
|
flex: 1; |
|
|
|
p { |
|
font-family: NotoSansHans-DemiLight; |
|
font-size: 10px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
line-height: 6px; |
|
letter-spacing: 0px; |
|
color: #08c7cf; |
|
} |
|
} |
|
} |
|
} |
|
</style>
|
|
|