bellezhuo
6 years ago
31 changed files with 865 additions and 382 deletions
-
22src/assets/css/element.css
-
20src/assets/css/other.css
-
30src/assets/data/en.js
-
30src/assets/data/zh.js
-
31src/components/footer.vue
-
4src/main.js
-
8src/router.js
-
2src/views/assets/carryout.vue
-
2src/views/assets/charge.vue
-
102src/views/assets/coincoin_assets.vue
-
2src/views/assets/coincoin_records.vue
-
95src/views/assets/currency_assets.vue
-
2src/views/assets/currency_records.vue
-
2src/views/assets/exchange.vue
-
12src/views/assets/transfer.vue
-
193src/views/assets/transfer_in.vue
-
2src/views/assets/withdraw.vue
-
2src/views/assets/withdraw_address.vue
-
12src/views/coincoin/components/trade_data_update.vue
-
66src/views/coincoin/components/trade_pair_list.vue
-
2src/views/currency/currency_ads.vue
-
2src/views/currency/currency_deal.vue
-
2src/views/currency/currency_order_details.vue
-
18src/views/currency/currency_release.vue
-
47src/views/index/components/banner.vue
-
43src/views/index/components/price.vue
-
242src/views/index/components/trend.vue
-
168src/views/index/index.vue
-
16src/views/login/findpw.vue
-
10src/views/release/components/release_data_update.vue
-
58src/views/release/components/release_pair_list.vue
@ -0,0 +1,193 @@ |
|||
<template> |
|||
<div class="global-width"> |
|||
<div class="container"> |
|||
<!--当前位置--> |
|||
<div class="hc-breadcrumb"> |
|||
<span class="hc-color4" @click="$router.push('/assets/coincoin')">{{$t('币币账户')}}</span> |
|||
<i class="hc-breadcrumb-icon"></i> |
|||
<span class="margin0">{{$t('转入')}}</span> |
|||
</div> |
|||
|
|||
<div class="hc-breadcrumb second-position"> |
|||
<span class="hc-color1"> |
|||
<img src="../../assets/images/icon-money.png" />{{transferCoin}} {{$t('转入')}} |
|||
</span> |
|||
</div> |
|||
|
|||
<div class="recharge-warp"> |
|||
<div class="withdrawmoney-box"> |
|||
<div class="form-box"> |
|||
<div class="form-group"> |
|||
<label class="form-label">{{$t('选择转入币种')}}</label> |
|||
|
|||
<div class="form-control"> |
|||
<div class="hc-form-warp" @click="showCoin = !showCoin" v-if="transferCoin"> |
|||
<img class="hc-select-img" :src="'data:img/jpg;base64,' + transferCoinImg" v-if="transferCoinImg"> |
|||
<span class="hc-select-span1">{{transferCoin}}</span> |
|||
|
|||
<span class="hc-form-down-icon"> |
|||
<i class="fa-caret-down"></i> |
|||
</span> |
|||
</div> |
|||
<div class="hc-form-warp" @click="showCoin = !showCoin" v-else> |
|||
<span class="hc-select-span1">{{$t('选择转入币种')}}</span> |
|||
|
|||
<span class="hc-form-down-icon"> |
|||
<i class="fa-caret-down"></i> |
|||
</span> |
|||
</div> |
|||
|
|||
<!-- 选择币种弹框 --> |
|||
<div class="choose-currencies" v-if="showCoin"> |
|||
<div class="hc-select-options" v-for="item of allCoinList" :key="item.id" @click="chooseCoin(item)"> |
|||
<img class="hc-select-img" :src="'data:img/jpg;base64,' + item.image" v-if="item.image"> |
|||
<span class="hc-select-span1">{{item.id}}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="form-group"> |
|||
<label class="form-label"> |
|||
{{$t('转入数量')}} |
|||
<span class="hc-color3">( {{$t('可用')}}:{{account}} )</span> |
|||
</label> |
|||
|
|||
<div class="form-control"> |
|||
<el-input class="text-input" :placeholder="$t('请输入转入数量')" v-model="amount" type="text" clearable autocomplete="off" @keyup.enter.native="submit"> |
|||
</el-input> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="form-group"> |
|||
<label class="form-label">{{$t('支付密码')}}</label> |
|||
<div class="form-control"> |
|||
<el-input class="text-input" :placeholder="$t('请输入支付密码')" v-model="password" type="password" clearable autocomplete="off" @keyup.enter.native="submit"> |
|||
</el-input> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="form-group"> |
|||
<el-button class="form-submit-btn" type="primary" :loading="true" v-if="loading">{{$t('提交中...')}}</el-button> |
|||
<el-button class="form-submit-btn" type="primary" @click="submit" v-else>{{$t('确认转入')}}</el-button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="address-line"></div> |
|||
<div class="recharge-reminder"> |
|||
<div class="recharge-r-top"> |
|||
<i class="fa-exclamation"></i> |
|||
<span>{{$t('温馨提示')}}</span> |
|||
</div> |
|||
|
|||
<p>{{$t('1. 最小兑换数量为：')}}{{minAmount}}{{transferCoin}}{{$t('，最大兑换数量为：')}}{{maxAmount}}{{transferCoin}}</p> |
|||
<p>{{$t('2. 请务必确认电脑及浏览器安全，防止信息被篡改或泄露。')}}</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState } from 'vuex' |
|||
export default { |
|||
name: 'transfer', |
|||
data() { |
|||
return { |
|||
transferCoin: '', //转入币种 |
|||
showCoin: false, //选择币种弹窗 |
|||
|
|||
account: 0, //余额 |
|||
maxAmount: 0, //最大转入数 |
|||
minAmount: 0, //最小转入数 |
|||
amount: '', //转入数量 |
|||
password: '', //支付密码 |
|||
|
|||
loading: false, |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapState('trend', ['allCoinList']), |
|||
|
|||
transferCoinImg() { //币种的图片 |
|||
let img; |
|||
this.allCoinList.forEach(item => { |
|||
if (item.id == this.transferCoin) { |
|||
img = item.image; |
|||
} |
|||
}) |
|||
return img; |
|||
}, |
|||
}, |
|||
methods: { |
|||
getBalance() { //获取余额 |
|||
this.getAxios('/api/user/assets/list?type=' + this.assetsCaseCode) |
|||
.then(data => { |
|||
let list = data.data; |
|||
list.forEach(item => { |
|||
if(item.coinId == this.transferCoin) { |
|||
this.account = item.normalAmount; |
|||
} |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
chooseCoin(item) { //选择币种 |
|||
this.transferCoin = item.id; |
|||
this.showCoin = false; |
|||
|
|||
this.getBalance(); |
|||
}, |
|||
|
|||
submit() { |
|||
if(this.loading) { |
|||
return; |
|||
} |
|||
if(!this.amount) { |
|||
this.$message.error(this.$t('请输入转入数量！')); |
|||
return; |
|||
} |
|||
if(!this.password) { |
|||
this.$message.error(this.$t('请输入支付密码！')); |
|||
return; |
|||
} |
|||
|
|||
this.loading = true; |
|||
|
|||
let params = { |
|||
coinId: this.transferCoin, |
|||
amount: this.amount, |
|||
paymentPassword: this.password |
|||
} |
|||
this.postAxios('/api/unblock/lock/up/into', params) |
|||
.then(() => { |
|||
this.$message.success(this.$t('转入提交成功！')); |
|||
|
|||
this.loading = false; |
|||
this.getBalance(); |
|||
this.clearData(); |
|||
}) |
|||
.catch(() => { |
|||
this.loading = false; |
|||
}) |
|||
}, |
|||
clearData() { |
|||
this.amount = ''; |
|||
this.password = ''; |
|||
} |
|||
}, |
|||
created() { |
|||
this.transferCoin = this.$route.params.id; |
|||
this.getBalance(); |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.address-form-div4 { |
|||
width: 32px; |
|||
display: inline-block; |
|||
margin: 0 9px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,47 @@ |
|||
<template> |
|||
<div class="swiper-box"> |
|||
<el-carousel height="200px" :autoplay="false"> |
|||
<el-carousel-item v-for="(item, index) of bannerList" :key="index"> |
|||
<ul class="banner-img-warp" v-html="item"> |
|||
|
|||
</ul> |
|||
</el-carousel-item> |
|||
</el-carousel> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'indexBanner', |
|||
data() { |
|||
return { |
|||
bannerList: [] |
|||
} |
|||
}, |
|||
methods: { |
|||
getBanner() { |
|||
this.getAxios('/api/adv/list') |
|||
.then(data => { |
|||
let list = data.data; |
|||
let all = data.data.length; |
|||
|
|||
let str = ''; |
|||
list.forEach((item, index) => { |
|||
str = str + `<li><img src="${item.imgUrl}"></li>`; |
|||
|
|||
if((index+1) % 4 == 0 || (index+1) == all) { //4个一组循环 |
|||
this.bannerList.push(str); |
|||
str = ''; |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
}, |
|||
created() { |
|||
this.getBanner(); |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
@ -0,0 +1,43 @@ |
|||
<template> |
|||
<div class="trade-block"> |
|||
<ul class="market-ticker"> |
|||
<li v-for="item of priceList" :key="item.symbolId"> |
|||
<dl class="btcusdt"> |
|||
<dt> |
|||
<strong>{{item.dealCoin}}/{{item.convertType}}</strong> |
|||
</dt> |
|||
<dd class="price"> |
|||
{{item.price}} <em> {{item.price * 7 | Decimal(2)}} CNY</em> |
|||
</dd> |
|||
<dd class="vol">24H {{item.quoteVolume}} </dd> |
|||
<dd class="rate up" v-if="item.changes > 0">+{{item.changes}}%</dd> |
|||
<dd class="rate down" v-if="item.changes <= 0">{{item.changes}}%</dd> |
|||
</dl> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState } from 'vuex' |
|||
export default { |
|||
name: 'indexPrice', |
|||
computed: { |
|||
...mapState('trend', ['allPairList', 'allTrendList']), |
|||
|
|||
priceList() { |
|||
let list = []; |
|||
this.allTrendList.forEach((item, index) => { |
|||
if(index < 6) { |
|||
list.push(item) |
|||
} |
|||
}); |
|||
return list; |
|||
} |
|||
} |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
@ -0,0 +1,242 @@ |
|||
<template> |
|||
<div class="quotation-main"> |
|||
<div class="quotation-main-soso"> |
|||
<div class="soso-box"> |
|||
<input placeholder="搜索币种"> |
|||
<i class="icon-search"></i> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="quotation-tab"> |
|||
<div class="tab-title"> |
|||
<ul> |
|||
<li :class="{'active': caseIndex == item.caseCode}" v-for="item of caseList" :key="item.caseCode" @click="chooseCase(item)"> |
|||
<span>{{item.caseName}}</span> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
|
|||
<div class="tab-container"> |
|||
<div class="tab-box"> |
|||
<div class="table-quotation-wrapper"> |
|||
<table class="table"> |
|||
<thead> |
|||
<tr> |
|||
<th class="is-center"> |
|||
<div class="cell"></div> |
|||
</th> |
|||
<th> |
|||
<div class="cell">{{$t('交易对')}}</div> |
|||
</th> |
|||
<th> |
|||
<div class="cell"> |
|||
{{$t('最新价')}}(USDT) |
|||
<span class="caret-wrapper"> |
|||
<i class="sort-caret ascending active"></i> |
|||
<i class="sort-caret descending"></i> |
|||
</span> |
|||
</div> |
|||
</th> |
|||
<th> |
|||
<div class="cell"> |
|||
24H {{$t('涨跌')}} |
|||
<span class="caret-wrapper"> |
|||
<i class="sort-caret ascending"></i> |
|||
<i class="sort-caret descending"></i> |
|||
</span> |
|||
</div> |
|||
</th> |
|||
<th> |
|||
<div class="cell">24H {{$t('最高')}}(USDT)</div> |
|||
</th> |
|||
<th> |
|||
<div class="cell">24H {{$t('最低')}}(USDT)</div> |
|||
</th> |
|||
<th> |
|||
<div class="cell"> |
|||
24H {{$t('量')}} |
|||
<span class="caret-wrapper"> |
|||
<i class="sort-caret ascending"></i> |
|||
<i class="sort-caret descending"></i> |
|||
</span> |
|||
</div> |
|||
</th> |
|||
<th class="is-center"> |
|||
<div class="cell">{{$t('现货交易')}}</div> |
|||
</th> |
|||
</tr> |
|||
</thead> |
|||
</table> |
|||
</div> |
|||
|
|||
<div class="table-responsive"> |
|||
<table class="table"> |
|||
<tbody> |
|||
<tr v-for="item of tradePairList" :key="item.symbolId"> |
|||
<td class="is-center"> |
|||
<div class="cell"> |
|||
<i class="optional fa-star-0" :class="{'fa-star': item.collected}" @click="handleCollect(item)"></i> |
|||
</div> |
|||
</td> |
|||
<td> |
|||
<div class="cell"> |
|||
<!-- <img class="quotation-table-img" src="../../assets/images/bi/btc.png" /> --> |
|||
<div class="quotation-table-text"> |
|||
{{item.dealCoin}}<span class="hc-color"> / {{item.convertType}}</span> |
|||
</div> |
|||
</div> |
|||
</td> |
|||
<td> |
|||
<div class="cell"> |
|||
{{item.price}} |
|||
<div class="hc-color"> ≈ {{item.price * 7 | Decimal(2)}} CNY</div> |
|||
</div> |
|||
</td> |
|||
<td> |
|||
<div class="cell"> |
|||
<div class="green-text" v-if="item.changes > 0"> |
|||
+{{item.changes * 100 | Decimal(2)}}<i class="icon-arrow"></i> |
|||
</div> |
|||
|
|||
<div class="red-text" v-else> |
|||
{{item.changes * 100 | Decimal(2)}}<i class="icon-arrow"></i> |
|||
</div> |
|||
</div> |
|||
</td> |
|||
<td> |
|||
<div class="cell"> |
|||
0 |
|||
<div class="hc-color">≈ 0 CNY</div> |
|||
</div> |
|||
</td> |
|||
<td> |
|||
<div class="cell"> |
|||
0 |
|||
<div class="hc-color">≈ 0 CNY</div> |
|||
</div> |
|||
</td> |
|||
<td> |
|||
<div class="cell"> |
|||
{{item.quoteVolume}} |
|||
<div class="hc-color"> ≈ 0(USDT)</div> |
|||
</div> |
|||
</td> |
|||
<td class="is-center"> |
|||
<div class="cell"> |
|||
<img src="@/assets/images/icon-transaction-2.png" /> |
|||
</div> |
|||
</td> |
|||
</tr> |
|||
</tbody> |
|||
</table> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState } from 'vuex' |
|||
export default { |
|||
name: 'indexTrend', |
|||
data() { |
|||
return { |
|||
caseIndex: 1, //选择主板 |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapState('trend', ['allPairList', 'myCollectList']), |
|||
|
|||
caseList() { //板块列表 |
|||
let list = []; |
|||
this.allPairList.forEach(item => { |
|||
if(item.status == 'C_C_S_NORMAL') { |
|||
list.push({ |
|||
caseCode: item.caseCode, |
|||
caseName: item.caseName, |
|||
status: item.status, |
|||
}) |
|||
} |
|||
}); |
|||
return list; |
|||
}, |
|||
tradePairList() { //交易对列表 |
|||
let list = []; |
|||
this.allPairList.forEach(item => { |
|||
if(item.caseCode == this.caseIndex) { |
|||
item.childen.forEach(item2 => { |
|||
item2.prices.forEach(item3 => { |
|||
list.push(item3); |
|||
}) |
|||
}) |
|||
} |
|||
}); |
|||
list.forEach(item => { |
|||
if(this.checkCollected(item.symbolId)) { |
|||
this.$set(item, 'collected', true); |
|||
} else { |
|||
this.$set(item, 'collected', false); |
|||
} |
|||
}) |
|||
return list; |
|||
} |
|||
}, |
|||
methods: { |
|||
checkCollected(id) { //验证是否收藏 |
|||
let val = false; |
|||
this.myCollectList.forEach(data => { |
|||
if (data == id) { |
|||
val = true; |
|||
} |
|||
}); |
|||
return val; |
|||
}, |
|||
|
|||
handleCollect(item) { |
|||
if(item.collected) { //已收藏 |
|||
this.cancleCollect(item); //去删除 |
|||
} else { |
|||
this.addCollect(item); |
|||
} |
|||
}, |
|||
addCollect(item) { //添加收藏 |
|||
let params = [item.symbolId]; |
|||
params = params.concat(this.myCollectList); //加上旧数据 |
|||
|
|||
this.putAxios('/api/user/config/update/or/save', { |
|||
key: 'U_COLLECTION', |
|||
newValue: JSON.stringify(params), |
|||
}) |
|||
.then(() => { |
|||
this.$message.success(this.$t('添加自选成功！')); |
|||
setTimeout(() => { |
|||
this.$store.dispatch('trend/getCollect'); |
|||
}, 500) |
|||
}) |
|||
}, |
|||
cancleCollect(item) { //删除自选 |
|||
let choiceArray = [item.symbolId]; |
|||
let delArray = this.myCollectList.filter(item => choiceArray.indexOf(item) == -1); |
|||
|
|||
this.putAxios('/api/user/config/update/or/save', { |
|||
key: 'U_COLLECTION', |
|||
newValue: JSON.stringify(delArray), |
|||
}) |
|||
.then(() => { |
|||
this.$message.success(this.$t('自选取消成功！')); |
|||
setTimeout(() => { |
|||
this.$store.dispatch('trend/getCollect'); |
|||
}, 500) |
|||
}) |
|||
}, |
|||
|
|||
chooseCase(item) { // 选择主板 |
|||
this.caseIndex = item.caseCode; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue