|
|
|
@ -1,9 +1,10 @@ |
|
|
|
<template> |
|
|
|
<div class="subscride-page"> |
|
|
|
<!-- 表单 --> |
|
|
|
<div class="container panel my-4 p-5 rounded shadow-sm bg-panel-n"> |
|
|
|
<div class="row"> |
|
|
|
<div class="col-6"> |
|
|
|
<div class="container panel my-4 p-5 rounded purchase-bg"> |
|
|
|
<div style="display: flex;justify-content: center;"> |
|
|
|
<img src="../../assets/img/img-buy-hold-lg.png" alt="" style="margin-right: 100px;margin-left: -50px;height: 240px;"> |
|
|
|
<div class="col-3"> |
|
|
|
<div class="h3 mb-3">{{ detail.coin_name }}</div> |
|
|
|
<div class>{{ $t("purchase.sendPrice") }}</div> |
|
|
|
<div class="price fn-20 yellow-a"> |
|
|
|
@ -12,109 +13,113 @@ |
|
|
|
USDT |
|
|
|
</div> |
|
|
|
<ul> |
|
|
|
<li class="mt-3"> |
|
|
|
<li class="mt-3 d-flex justify-content-between"> |
|
|
|
<div class="label text-secondary"> |
|
|
|
{{ $t("purchase.subscriptionCurrency") }} |
|
|
|
</div> |
|
|
|
<div class="txt">{{ detail.subscribe_currency }}</div> |
|
|
|
<div class="txt">{{ detail.subscribe_currency || '---' }}</div> |
|
|
|
</li> |
|
|
|
<li class="mt-3"> |
|
|
|
<li class="mt-3 d-flex justify-content-between"> |
|
|
|
<div class="label text-secondary"> |
|
|
|
{{ $t("purchase.expected") }} |
|
|
|
</div> |
|
|
|
<div class="txt"> |
|
|
|
{{ parseTime(detail.expected_time_online) }} |
|
|
|
{{ parseTime(detail.expected_time_online) || '---' }} |
|
|
|
</div> |
|
|
|
</li> |
|
|
|
<li class="mt-3"> |
|
|
|
<li class="mt-3 d-flex justify-content-between"> |
|
|
|
<div class="label text-secondary"> |
|
|
|
{{ $t("purchase.startTime") }} |
|
|
|
</div> |
|
|
|
<div class="txt"> |
|
|
|
{{ parseTime(detail.start_subscription_time) }} |
|
|
|
{{ parseTime(detail.start_subscription_time) || '---' }} |
|
|
|
</div> |
|
|
|
</li> |
|
|
|
<li class="mt-3"> |
|
|
|
<li class="mt-3 d-flex justify-content-between"> |
|
|
|
<div class="label text-secondary"> |
|
|
|
{{ $t("purchase.applyForPurchase") }} |
|
|
|
</div> |
|
|
|
<div class="txt"> |
|
|
|
{{ parseTime(detail.end_subscription_time) }} |
|
|
|
{{ parseTime(detail.end_subscription_time) || '---' }} |
|
|
|
</div> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
class="col-6 d-flex flex-column justify-content-end align-items-start" |
|
|
|
> |
|
|
|
<div class="input-group mb-3"> |
|
|
|
<div class="input-group-prepend"> |
|
|
|
<el-dropdown> |
|
|
|
<span class="input-group-text"> |
|
|
|
{{ activeCoin.coin_name }} |
|
|
|
<i class="el-icon-caret-bottom"></i> |
|
|
|
</span> |
|
|
|
<el-dropdown-menu slot="dropdown"> |
|
|
|
<el-dropdown-item |
|
|
|
v-for="item in coinList" |
|
|
|
@click.native="activeCoin = item" |
|
|
|
:key="item.coin_name" |
|
|
|
>{{ item.coin_name }}</el-dropdown-item |
|
|
|
> |
|
|
|
</el-dropdown-menu> |
|
|
|
</el-dropdown> |
|
|
|
</div> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
:placeholder="$t('purchase.enterNum')" |
|
|
|
min="0" |
|
|
|
step="0.0000000001" |
|
|
|
:data-message="$t('nav.b9',{num:10})" |
|
|
|
required |
|
|
|
aria-label="Username" |
|
|
|
v-model="num" |
|
|
|
aria-describedby="basic-addon1" |
|
|
|
/> |
|
|
|
<div class="input-group-append"> |
|
|
|
<button |
|
|
|
class="btn btn-outline-yellow" |
|
|
|
type="button" |
|
|
|
@click="num = activeCoin.usable_balance" |
|
|
|
> |
|
|
|
{{ $t("purchase.all") }} |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style="font-size: 20px;font-weight: bold;text-align: center;color: #000;padding-top: 1rem;">{{ $t("purchase.subscribe") }}</div> |
|
|
|
<div class="container panel my-4 px-4 pt-4 pb-5 rounded shadow-sm" |
|
|
|
style="display: flex;justify-content: center;width: 35%;"> |
|
|
|
<div class="col-12 d-flex flex-column justify-content-end align-items-start"> |
|
|
|
<div class="input-group mb-3"> |
|
|
|
<div class="input-group-prepend"> |
|
|
|
<el-dropdown> |
|
|
|
<span class="input-group-text"> |
|
|
|
{{ activeCoin.coin_name }} |
|
|
|
<i class="el-icon-caret-bottom"></i> |
|
|
|
</span> |
|
|
|
<el-dropdown-menu slot="dropdown"> |
|
|
|
<el-dropdown-item |
|
|
|
v-for="item in coinList" |
|
|
|
@click.native="activeCoin = item" |
|
|
|
:key="item.coin_name" |
|
|
|
>{{ item.coin_name }}</el-dropdown-item |
|
|
|
> |
|
|
|
</el-dropdown-menu> |
|
|
|
</el-dropdown> |
|
|
|
</div> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
:placeholder="$t('purchase.enterNum')" |
|
|
|
min="0" |
|
|
|
step="0.0000000001" |
|
|
|
:data-message="$t('nav.b9',{num:10})" |
|
|
|
required |
|
|
|
aria-label="Username" |
|
|
|
v-model="num" |
|
|
|
aria-describedby="basic-addon1" |
|
|
|
/> |
|
|
|
<div class="input-group-append"> |
|
|
|
<button |
|
|
|
class="btn btn-outline-yellow" |
|
|
|
type="button" |
|
|
|
@click="num = activeCoin.usable_balance" |
|
|
|
> |
|
|
|
{{ $t("purchase.all") }} |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
<!-- v-if="activeCoin.usable_balance" --> |
|
|
|
<p > |
|
|
|
{{ $t("wallet.availableBalance") }}：{{ activeCoin.usable_balance }} |
|
|
|
</p> |
|
|
|
<p> |
|
|
|
1 |
|
|
|
<!-- {{ activeCoin.coin_name }} --> |
|
|
|
USDT |
|
|
|
≈ |
|
|
|
{{ 1 / detail.issue_price | omitTo(4)}} |
|
|
|
<!-- {{ activeCoin.proportion_amount | omitTo(5) }} --> |
|
|
|
{{ detail.coin_name }} |
|
|
|
</p> |
|
|
|
<p> |
|
|
|
{{ num || 0 }} {{ activeCoin.coin_name }} ≈ |
|
|
|
{{(activeCoin.CurrentPrice/ detail.issue_price)*num | omitTo(4)}} |
|
|
|
<!-- {{ total }} --> |
|
|
|
{{ detail.coin_name }} |
|
|
|
</p> |
|
|
|
<button |
|
|
|
type="submit" |
|
|
|
class="btn rounded-pill bg-yellow-a" |
|
|
|
@click="ifSubscribeNow" |
|
|
|
> |
|
|
|
{{ $t("purchase.subscribeNow") }} |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
<!-- v-if="activeCoin.usable_balance" --> |
|
|
|
<p > |
|
|
|
{{ $t("wallet.availableBalance") }}：{{ activeCoin.usable_balance }} |
|
|
|
</p> |
|
|
|
<p> |
|
|
|
1 |
|
|
|
<!-- {{ activeCoin.coin_name }} --> |
|
|
|
USDT |
|
|
|
≈ |
|
|
|
{{ 1 / detail.issue_price | omitTo(4)}} |
|
|
|
<!-- {{ activeCoin.proportion_amount | omitTo(5) }} --> |
|
|
|
{{ detail.coin_name }} |
|
|
|
</p> |
|
|
|
<p> |
|
|
|
{{ num || 0 }} {{ activeCoin.coin_name }} ≈ |
|
|
|
{{(activeCoin.CurrentPrice/ detail.issue_price)*num | omitTo(4)}} |
|
|
|
<!-- {{ total }} --> |
|
|
|
{{ detail.coin_name }} |
|
|
|
</p> |
|
|
|
<button |
|
|
|
type="submit" |
|
|
|
class="btn rounded-pill bg-yellow-a" |
|
|
|
@click="ifSubscribeNow" |
|
|
|
> |
|
|
|
{{ $t("purchase.subscribeNow") }} |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 进度 --> |
|
|
|
<div v-if="activityList[0].amount" class="container panel my-4 px-4 pt-4 pb-5 rounded shadow-sm bg-panel-n"> |
|
|
|
<div class="row"> |
|
|
|
@ -477,4 +482,9 @@ export default { |
|
|
|
margin-top: 0; |
|
|
|
} |
|
|
|
} |
|
|
|
.purchase-bg{ |
|
|
|
background: url('../../assets/img/purchase-bg.jpg'); |
|
|
|
background-size: 100% 100%; |
|
|
|
max-width: none; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
