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.
 
 
 

231 lines
5.7 KiB

<template>
<!-- <view style="padding: 40rpx 0px;">
<scroll-view scroll-x="true" style="width: 340px;">
<view style="width: 450px;">
<table class="table">
<thead>
<tr>
<th class="color1" style="width: 100rpx;">{{ $t("common.d8") }}</th>
<th class="color1">{{ $t("common.amout") }}</th>
<th class="color1" style="width: 150rpx;">{{ $t("common.d9") }}</th>
<th class="color1" style="width: 100rpx;">{{ $t("common.d10") }}</th>
<th class="color1" style="text-align: center;width: 180rpx;">{{ $t("common.d13") }}</th>
<th class="color1" style="text-align: center;width: 180rpx;">{{ $t("common.d15") }}</th>
</tr>
</thead>
<tbody>
<tr v-for="(item,index) in recordsList" :key="index" style="border-bottom: 1px solid #ccc;height: 140rpx;">
<td style="text-align: center;">{{item.currency}}</td>
<td style="margin-right: 20rpx;">{{item.amount}}</td>
<td style="text-align: center;">{{item.rate}}%</td>
<td v-if="item.type==1" style="text-align: center;">{{$t('common.d17')}}</td>
<td v-if="item.type==2" style="text-align: center;">{{item.day}}{{$t('exchange.f0')}}</td>
<td style="text-align: center;">{{item.financial_time}}</td>
<td style="text-align: center;">{{item.redemption_time}}</td>
</tr>
</tbody>
</table>
</view>
</scroll-view>
</view> -->
<view style="background-color: #fff;height: 100%;color: #666;">
<v-header class="nav-head" :title="$t('common.d7')"></v-header>
<view class="d-flex justify-between align-center" style="padding: 0rpx 40rpx;margin: 40rpx 0rpx;">
<view class="d-flex">
<view @click="onskytype(1)">{{$t('common.today')}}</view>
<view @click="onskytype(2)" style="margin-left: 30rpx;">1{{$t('common.week')}}</view>
<view @click="onskytype(3)" style="margin-left: 30rpx;">1{{$t('common.M')}}</view>
</view>
<view><uni-datetime-picker style="width: 300rpx;" v-model="range" type="daterange" @change="pickerChange" /></view>
</view>
<scroll-view scroll-y="true" style="height: 80vh;" @scrolltolower="scrollpage">
<view style="padding: 0rpx 40rpx;">
<view v-for="(item,index) in recordsList" :key="index" class="recordsList_box">
<view style="width: 60%;">
<view>{{item.log_type_text}}</view>
<view style="margin-top: 20rpx;font-size: 28rpx;color: #aeaeae;">{{item.created_at}}</view>
</view>
<view style="width: 40%;text-align: right;font-weight: bold;">
<view>{{item.amount}}{{item.coin_name}}</view>
</view>
</view>
<van-empty v-if="!recordsList.length" description="" />
</view>
</scroll-view>
</view>
</template>
<script>
import Wallet from "@/api/wallet";
export default {
name: "finances-product",
props: {
},
components: {
},
watch: {
},
mounted() {
this.init()
},
data() {
return {
recordsList:[],
Numbertype:2,
page:1,
start_time:'',
end_time:'',
range:[],
last_page:1
};
},
methods: {
init(){
let data = {
page:this.page,
type:this.start_time?'':this.Numbertype,
start_time:this.start_time,
end_time:this.end_time,
}
Wallet.financial_wlog(data).then(res => {
if(res.code==200){
if(this.page==1){
this.last_page = res.data.last_page
this.recordsList = res.data.data;
}else{
this.last_page = res.data.last_page
this.recordsList = [...this.recordsList, ...res.data.data];
}
}
// console.log(this.recordsList);
}).catch(error => {
console.error('Promise:', error);
})
},
onskytype(type){
this.Numbertype = type;
this.page = 1;
this.recordsList = [];
this.init();
},
scrollpage(e){
if(this.page>this.last_page) return
this.page++
this.init();
},
pickerChange(e){
if(e.length!==0){
this.start_time = e[0]
this.end_time = e[1]
this.page = 1;
this.init();
}else{
this.start_time = ''
this.end_time = ''
this.page = 1;
this.init();
}
// console.log(e);
}
}
};
</script>
<style scoped lang="scss">
.color1{
color: #908F94;
}
tbody tr:hover{
background: #e9e9e9;
}
.jump_btn{
display: inline-block;
min-width: 160rpx;
height: 70rpx;
line-height: 66rpx;
text-align: center;
border: 1px solid #444444;
border-radius: 100rpx;
font-size: 30rpx;
padding: 0px 40rpx;
font-weight: 400;
color: #000;
box-sizing: border-box;
&:hover{
cursor: pointer;
color: #67e2da;
border: 1px solid #67e2da;
}
}
.jump_btn1{
display: inline-block;
min-width: 160rpx;
height: 70rpx;
line-height: 66rpx;
text-align: center;
color: #999999;
border: 1px solid #999999;
border-radius: 100rpx;
font-size: 30rpx;
padding: 0px 40rpx;
font-weight: 400;
box-sizing: border-box;
}
.tr_box{
display: flex;
margin: 0px 20rpx;
line-height: 100rpx;
}
.collapse_box{
width: 100%;
display: flex;
font-size: 30rpx;
font-weight: bold;
}
.collapse_box1{
display: flex;
font-size: 30rpx;
font-weight: bold;
line-height: 100rpx;
align-items: center;
justify-content: space-between;
}
.collapse_box2{
display: flex;
font-size: 30rpx;
line-height: 100rpx;
font-weight: bold;
align-items: center;
justify-content: space-between;
}
.currency_box{
display: flex;
align-items: center;
padding:40rpx 0rpx 40rpx;
justify-content: space-between;
border-bottom: 1px solid #bcbcbc;
}
.box1{
width: 26%;
padding-left: 5px;
}
.box2{
width: 25%;
}
.box4{
width: 20%;
text-align: right;
}
.recordsList_box{
display: flex;
flex-wrap: wrap;
// margin:40rpx 0px;
padding: 40rpx 30rpx;
border-bottom: 1px solid #ccc;
justify-content: space-between;
}
</style>