FXB/pages/index/propDetails.vue

<template>
	<view class="container">
		<view class="topImage">
			<image :src="type==1?'/static/img/img15.png':'/static/img/img16.png'" style="width: 119rpx;height: 119rpx;"></image>
		   <view class="money">{{type==1?userInfo.USDT * 1:type==2?userInfo.NUSD*1 + userInfo.NUSD_OLY*1:userInfo.NICE * 1}}</view>
		</view>
		<view class="infoBox">
			<view class="title">{{$t("propDetails.交易记录")}}</view>
			<view class="listBox" v-if="list.length > 0">
				<view class="listTpl flex" v-for="item,index in list" :key="index">
					<view class="tplInfo flex_item">
						<image src="/static/img/img20.png" style="width: 39rpx;height: 43rpx;"></image>
						<view class="name">{{typeList[item.type]}}</view>
						<view class="time">{{item.createtime }}</view>
					</view>
					<view class="num add" v-if="item.pm == 1">+{{item.money * 1}}</view>
					<view class="num" v-else>-{{item.money * 1}}</view>
				</view>
			</view>
			<view class="noDate" v-else>
				<image src="../../static/img/noDate.png" style="width:500rpx;height: 500rpx;" mode="aspectFit"></image>
			</view>
		</view>
	</view>
</template>
<script>
	import {getTokenLog} from "@/api/index.js";
	import {getUserInfo} from '@/api/login.js';
	import{ getTime } from '@/utils/rocessor.js';
	export default {
		data () {
			return {
				type:1,
				title:'',
				list:[],
				typeList:'',
				userInfo:''
			}
		},
		onLoad (option) {
			this.type = option.type;
			if (this.type == 1) {
				this.title = 'USDT'
				uni.setNavigationBarTitle({
					title: "USDT",
				});
			}else if(this.type == 2){
				this.title = 'NUSD'
				uni.setNavigationBarTitle({
					title: "NUSD",
				});
			}else if(this.type == 3){
				this.title = 'NICE'
				uni.setNavigationBarTitle({
					title: "NICE",
				});
			}else{
				this.title = 'NUSD_OLY'
				uni.setNavigationBarTitle({
					title: "XNUSD",
				});
			}
			this.getUserInfo()
			this.loadDate()
		},
		methods: {
			getUserInfo(){
				let obj = this
				getUserInfo({}).then(({data}) => {
					obj.userInfo = data
				}).catch(e => {
					console.log(e.msg);
				});
			},
			loadDate(){
				let obj = this
				getTokenLog({
					page:1,
					limit:100000,
					token:obj.title,
					pm:''
				}).then(function(res){
					res.data.list.forEach(item => {
						item.createtime = getTime(item.createtime)
					})
					obj.list = res.data.list
					obj.typeList = res.data.type
				})
			}
		},
	}
</script>

<style lang="scss">
	page {
		width: 100%;
		.container {
			width: 100%;
			padding-top: 50rpx;
		}
	}
	.topImage{
		text-align: center;
		padding-bottom: 50rpx;
		.money{
			padding-top: 25rpx;
			color: #fff;
			font-size: 32rpx;
		}
	}
	.noDate{
		text-align: center;
		padding-top: 25rpx;
	}
	.infoBox{
		padding: 0rpx 30rpx;
		.title{
			font-size: 30rpx;
			color: #FFFFFF;
		}
		.listBox{
			color: #fff;
			.listTpl{
				background: #1A1A17;
				margin-top: 30rpx;
				padding: 25rpx 25rpx;
				.tplInfo{
					.name{
						padding: 0rpx 15rpx;
					}
					.time{
						font-size: 24rpx;
						color: #999999;
					}
				}
				.num{
					font-weight: 400;
					font-size: 36rpx;
					color: #fff;
				}
				.add{
					color: #4C5D97;
					background: linear-gradient(258deg, #FFF0CF 0%, #CBA16B 30.0048828125%, #FCE9CF 67.67578125%, #C29963 100%);
					-webkit-background-clip: text;
					-webkit-text-fill-color: transparent;
				}
			}
		}
	}
</style>