<template>
|
<div class="layout-page" :style="themeStyle">
|
<v-header title="STO"></v-header>
|
<view class="m-x-md "
|
style="background-color: #fff;margin-top: 12px;padding-left: 12px;height: 40px;padding-top: 12px;border-bottom: 1px solid #f3f3f3;border-top-left-radius: 6px;border-top-right-radius: 6px;">
|
<text @click="infoclick(1)" class="m-r-lg"
|
:class="infoActive==1?'fn-bold fn-16 bor5 color-light ':''">{{ $t("exchange.a1") }}</text>
|
<text @click="infoclick(2)" class="m-l-lg"
|
:class="infoActive==2?'fn-bold fn-16 bor5 color-light ':''">{{ $t("purchases.a5") }}</text>
|
</view>
|
<view class=" " style="background-color: #f7f7f7;height: 40px;padding-top: 12px;padding: 12px 26px 0 26px;">
|
<!-- <text @click="searchindex=1" class=""
|
:class="searchindex==1?'fn-bold fn-16 color-light':''">{{ $t("purchase.c1") }}</text> -->
|
<text @click="searclick(2)" class=""
|
:class="searchindex==2?'fn-bold fn-16 color-light':''">{{ $t("purchase.c2") }}</text>
|
<text @click="searclick(3)" v-if="infoActive==1" class="m-l-lg"
|
:class="searchindex==3?'fn-bold fn-16 color-light':''">{{ $t("purchase.c3") }}</text>
|
<text @click="searclick(4)" class="m-l-lg"
|
:class="searchindex==4?'fn-bold fn-16 color-light':''">{{ $t("purchase.c4") }}</text>
|
</view>
|
<v-scroll class="layout-main" @ref="ref" @load="load">
|
<ul class="list">
|
<!-- <view class="bg-panel-4 m-x-md m-y-xs">USDT{{$t('assets.c1')}}:{{price}}</view> -->
|
<div class="item bg-panel-4 m-x-md m-y-xs rounded-sm box-shadow" v-for="item in coinList" :key="item.datetime"
|
@click="nagoto(item)">
|
<div class="head d-flex align-center border-b p-x-md p-y-xs justify-between">
|
<div class="d-flex">
|
<div>
|
<div class="color-light " v-if="infoActive==2">{{$t('purchases.a1')}}</div>
|
<div class="color-light " v-else>{{$t('purchase.a1')}}</div>
|
<!-- <div class="fn-10">item.subscription_time)}}</div> -->
|
</div>
|
</div>
|
<div class="color-buy">{{item.coin_name || item.subscription_currency_name}}</div>
|
</div>
|
<div class="p-x-md p-y-xs">
|
<div class="row d-flex m-y-xs justify-between">
|
<div class="label fn-sm" v-if="infoActive==2">{{$t('purchase.d1')}}</div>
|
<div class="label fn-sm" v-else>{{$t('purchase.c8')}}</div>
|
<div class="color-light">{{item.issue_price}}</div>
|
</div>
|
<div class="row d-flex m-y-xs justify-between" v-if="searchindex!=2">
|
<div class="label fn-sm" v-if="searchindex==4&&infoActive==2">{{$t('purchase.d2')}}</div>
|
<div class="label fn-sm" v-else>{{$t('purchase.c9')}}</div>
|
<div class="color-light" v-if="searchindex==3">{{item.subscription_currency_amount }}</div>
|
<div class="color-light" v-if="searchindex==4&&infoActive==1">
|
{{item.subscription_currency_amount }}
|
</div>
|
<div class="color-light" v-if="searchindex==4&&infoActive==2">{{item.subscription_currency_amount }}
|
</div>
|
</div>
|
<div class="row d-flex m-y-xs justify-between" v-if="searchindex!=2">
|
<div class="label fn-sm">{{$t('otc.a2')}}</div>
|
<div class="color-light">{{item.payment_currency}}</div>
|
</div>
|
<div class="row d-flex m-y-xs justify-between" v-if="searchindex!=2">
|
<div class="label fn-sm" v-if="searchindex==3">{{$t('purchase.d3')}}</div>
|
<div class="label fn-sm" v-else>{{$t('purchase.d0')}}</div>
|
<div class="color-light" v-if="searchindex==3">{{item.payment_amount }}</div>
|
<div class="color-light" v-if="searchindex==4&&infoActive==1">
|
{{item.subscription_currency_amount_after }}
|
</div>
|
<div class="color-light" v-if="searchindex==4&&infoActive==2">{{item.subscription_currency_amount }}
|
</div>
|
</div>
|
<div class="row d-flex m-y-xs justify-between" v-if="searchindex==2">
|
<div class="label fn-sm" v-if="infoActive==1">{{$t('purchase.c6')}}</div>
|
<div class="label fn-sm" v-if="infoActive==2">{{$t('purchase.d4')}}</div>
|
<div class="color-light">{{item.minimum_purchase}}</div>
|
</div>
|
<div class="row d-flex m-y-xs justify-between" v-if="searchindex==2">
|
<div class="label fn-sm" v-if="infoActive==1">{{$t('purchase.c7')}}</div>
|
<div class="label fn-sm" v-if="infoActive==2">{{$t('purchase.d5')}}</div>
|
<div class="color-light">{{item.maximum_purchase}}</div>
|
</div>
|
</div>
|
</div>
|
</ul>
|
</v-scroll>
|
</div>
|
</template>
|
<script>
|
import Wallet from "@/api/wallet";
|
import date from "@/utils/class/date.js";
|
import Subscride from "@/api/subscride";
|
import {
|
mapGetters
|
} from "vuex";
|
export default {
|
name: "bill",
|
data() {
|
return {
|
list: [],
|
coinList: [],
|
page: 0,
|
infoActive: 1, // 详情选中
|
searchindex: 2,
|
price: '',
|
accountMap: {
|
UserWallet: this.$t('transfer.a4'),
|
ContractAccount: this.$t('transfer.a5'),
|
FinancialAccount: this.$t('transfer.a7'),
|
},
|
};
|
},
|
computed: {
|
...mapGetters(['themeStyle'])
|
},
|
onLoad() {
|
this.subscribeCoinList()
|
this.fundAccount()
|
},
|
methods: {
|
parseTime: date.parseTime,
|
fundAccount() {
|
Wallet.fundAccount().then((res) => {
|
this.price = res.data.list[0].usable_balance;
|
});
|
},
|
nagoto(item) {
|
if (this.searchindex == 2) {
|
if (this.infoActive == 1) {
|
uni.navigateTo({
|
url: '/pages/purchase/index?id=' + item.id + "&type=" + this.infoActive
|
})
|
} else {
|
uni.navigateTo({
|
url: '/pages/purchases/index?id=' + item.id + "&type=" + this.infoActive
|
})
|
}
|
|
}
|
},
|
searclick(index) {
|
// searchindex 下面的下标 发行 待中签 中签
|
// infoActive 上面的下标 1申购 2配售
|
this.searchindex = index
|
if (this.searchindex == 2) {
|
this.subscribeCoinList()
|
} else {
|
//申购
|
if (this.searchindex == 4) {
|
if (this.infoActive == 2) {
|
this.placementRecords()
|
} else {
|
// this.subscribeCoinList()
|
this.ref()
|
}
|
} else {
|
this.ref()
|
}
|
}
|
},
|
infoclick(index) {
|
this.infoActive = index
|
this.searchindex = 2
|
this.subscribeCoinList()
|
},
|
ref(over) {
|
this.page = 1;
|
this.subscribeRecord(over);
|
},
|
load(over) {
|
this.page++;
|
this.subscribeCoinList()
|
// if(over){
|
// this.subscribeRecord(over);
|
// }else{
|
// }
|
},
|
subscribeRecord(over) {
|
let data = {
|
status: this.searchindex == 3 ? 0 : 1,
|
};
|
Wallet.subscribeRecords(data).then((res) => {
|
if (res.data.current_page == 1) this.list = [];
|
this.coinList = [...this.list, ...res.data.data];
|
over && over({
|
finished: res.data.data.length < res.data.per_page
|
});
|
});
|
},
|
placementRecords() {
|
var data = {
|
a: '1'
|
}
|
Wallet.placementRecords(data).then((res) => {
|
this.coinList = res.data.data;
|
});
|
},
|
subscribeCoinList() {
|
var data = {
|
sp_type: this.infoActive,
|
search_type: this.searchindex,
|
}
|
Subscride.subscribeCoinList(data).then((res) => {
|
this.coinList = [...res.data];
|
|
});
|
},
|
},
|
created() {},
|
};
|
</script>
|
<style scoped lang="scss">
|
.aa {
|
border-bottom: 4px solid #F0C947;
|
}
|
|
.bor5-active {
|
border-bottom: 5px solid $theme-2;
|
}
|
|
.bor5 {
|
position: relative;
|
}
|
|
.bor5:before {
|
position: absolute;
|
content: "";
|
bottom: -10px;
|
left: 20%;
|
width: 60%;
|
height: 4px;
|
border-radius: 10px;
|
background-color: $theme-2;
|
// border-bottom: 5px solid $border-color;
|
}
|
</style>
|
