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.
 
 
 

201 lines
6.4 KiB

<template>
<v-page>
<v-header>
<template #title>
<view v-if="type=='draw'">
<!-- {{ $t("assets.c8") }} -->
{{ $t("common.c27") }}
</view>
<view v-if="type=='recharge'">
{{ $t('assets.f4') }}
</view>
</template>
</v-header>
<view class="layout-main">
<view class="bg-panel-3" style="height: 100%;">
<view class="rounded-md m-b-lg" v-if="list.length" style="padding-bottom: 100px !important;">
<view class="">
<table class="w-max">
<thead class="p-x-md">
<tr class="fn-sm p-x-md" style="display: flex;align-items: center;">
<view class="p-b-md fn-left p-l-md" style="width: 30%;">{{ $t("assets.c9") }}</view>
<view class="p-b-md fn-left" style="width: 20%;">{{ $t("assets.d0") }}</view>
<view class="p-b-md fn-right p-r-md" style="width: 30%;">{{ $t("assets.c0") }}</view>
<view class="p-b-md fn-right p-r-md" style="width: 10%;">{{ $t("exchange.g3") }}</view>
</tr>
</thead>
<tbody>
<tr class="color-light trChange p-x-md rounded-md" v-for="item in list" :key="item.id">
<view style="display: flex;align-items: center;">
<view class="p-y-xs p-l-md rounded-tl-sm rounded-bl-sm fn-sm" style="width: 30%;">
{{ item.datetime | parseTime }}
</view>
<view v-if="type=='draw'" style="width: 20%;">
<view :class="item.status==0?'status_text':item.status==2?'status_text1':''">{{ item.status_text }}</view>
<view v-if="item.status==0">{{updateTimer(item)}}</view>
</view>
<view v-if="type=='recharge'">
<view v-if="item.status==0">{{$t('assets.d1')}}</view>
<view v-if="item.status==1" class="color-buy">{{$t('assets.d2')}}</view>
<view v-if="item.status==2" class="color-sell">{{$t('assets.d3')}}</view>
</view>
<view class="fn-right p-r-md rounded-tr-sm rounded-br-sm" style="width: 30%;">
{{ item.amount }}
<span class="color-default">({{ item.coin_name }})</span>
</view>
<view class="" v-if="item.status==0" style="width: 10%;">
<span style="color: #4381F6;width: 60px;height: 30px;font-size: 12px;"
@click="cancelWithdraw(item)">{{$t('exchange.g4')}}</span>
</view>
</view>
<view class="p-l-md" v-if="item.remark" style="color:red;word-wrap: break-word;width:680rpx;">
<view>{{$t('common.rejection')}}:{{item.remark}}</view>
<!-- <view style="display: flex;">
<view class="updated" v-if="!remarktext(item.updated_at)" @click="onservice">{{$t('common.c20')}}</view>
</view> -->
</view>
</tr>
<!-- <tr v-if="loadMore">
<td colspan="3" class="fn-center p-xs link-active" @click="more">
{{ $t("assets.d4") }}
</td>
</tr> -->
</tbody>
</table>
</view>
</view>
</view>
</view>
</v-page>
</template>
<script>
import Wallet from "@/api/wallet";
import formData from "@/utils/class/date";
export default {
data() {
return {
type: '',
list: [],
page: 1,
loadMore: true,
timer: null,
}
},
filters: {
parseTime(val) {
return formData.parseTime(val);
},
},
methods: {
// 获取提币记录
getWithdrawRecords() {
let data = {
page: this.page,
};
Wallet.withdrawalRecord(data).then((res) => {
if (res.data.current_page == 1) this.list = [];
let list = [...this.list, ...res.data.data];//无法响应
this.list.splice(0,this.list.length,...list);
// this.list.push(...list);
// console.log('length---------------',this.list.length, '页数:',res.data.current_page);
if (res.data.data.length < res.data.per_page) this.loadMore = false;
});
},
// 获取充值记录
depositHistory() {
let data = {
page: this.page,
};
Wallet.depositHistory(data).then((res) => {
if (res.data.current_page == 1) this.list = [];
this.list = [...this.list, ...res.data.data];
if (res.data.data.length < res.data.per_page) this.loadMore = false;
});
},
more() {
this.page++;
if(this.type=='draw'){
this.getWithdrawRecords();
}else if(this.type=='recharge'){
this.depositHistory();
}
},
cancelWithdraw(item) {
Wallet.cancelWithdraw({ withdraw_id: item.id }).then(res => {
this.$toast(this.$t('otc.d4'));
this.getWithdrawRecords()
})
},
onservice(){
this._router.push("/pages/oncs/onservice");
},
updateTimer(val){
const nowInMilliseconds = Date.now(); // 当前时间的毫秒级时间戳
const twelveHoursInSeconds = 43200; // 12小时的秒数
const nowInSeconds = Math.floor(nowInMilliseconds / 1000); // 当前时间的秒级时间戳
const adjustedNowInSeconds = nowInSeconds - twelveHoursInSeconds; // 调整后的当前时间的秒级时间戳
// 如果你需要一个毫秒级的时间戳,可以再将秒级时间戳转换回毫秒级
const adjustedNowInMilliseconds = adjustedNowInSeconds * 1000;
const timer = val.newdatetime * 1000
const diff = timer - adjustedNowInMilliseconds;
if (diff <= 0) {
return '00:00:00';
}
const hours = Math.floor(diff / 3600000)
const minutes = Math.floor((diff % 3600000) / 60000)
const seconds = Math.floor((diff % 60000) / 1000)
return `${hours < 10 ? '0'+hours: hours}:${minutes < 10 ? '0'+minutes: minutes}:${seconds < 10 ? '0'+seconds: seconds}`;
},
remarktext(val){
const now = new Date()
const target = new Date(Date.parseTime(Date.parse(val)))
const diff = now.getTime() - target.getTime()
return diff > 12 * 60 * 60 * 1000
}
},
onLoad(e) {
// console.log('---------',e);
this.type = e.type;
if(e.type=='draw'){
this.getWithdrawRecords();
}else if(e.type=='recharge'){
this.depositHistory();
}
this.timer = setInterval(() => {
this.list.forEach((item) => {
if (item.status === 0) {
// 手动触发 Vue 的响应式更新
this.$forceUpdate();
}
});
}, 1000);
}
}
</script>
<style scoped lang="scss">
.status_text{
font-size: 14px;
color: #53b987;
text-shadow: 1px 1px rgba(83, 185, 135, 0.8);
}
.status_text1{
font-size: 14px;
color: #D31027;
}
.updated{
color: #fff;
display: flex;
padding: 5px;
cursor: pointer;
border-radius: 5px;
background-color: #0089ff;
text-align: center;
}
</style>