BiKing/pages/property/modules/GiftMoney/index.vue

<template>
	<view class="gift-money">
		<view class="lable-title">保证金</view>
		<uni-table class="table-box" emptyText="暂无更多数据">
			<!-- 表头行 -->
			<uni-tr>
				<uni-th align="left">可用保证金</uni-th>
				<uni-th align="center">已用保证金</uni-th>
				<uni-th align="right">冻结</uni-th>
			</uni-tr>
			<!-- 表格数据行 -->
			<uni-tr>
				<uni-td>124.8028 USDT</uni-td>
				<uni-td style="text-align: center;">100.0000 USDT</uni-td>
				<uni-td style="text-align: right;">29997.9123</uni-td>
			</uni-tr>

		</uni-table>
		<view class="account-money">
			<view class="money-item">
				赠金账户 124.8028 USDT
			</view>
			<view class="money-item">
				盈利账户 0.0000 USDT
			</view>
		</view>
		
		<gap height="8rpx"/>
		
		<view class="lable-title">盈亏</view>
		
		<view class="Profit-loss">
			<view class="Profit-loss-lable">
				浮动盈亏
			</view>
			<view class="Profit-loss-value">
				-1.8767 USDT
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'GiftMoney',
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss" scoped>
	.gift-money {
		width: 100%;

		.lable-title {
			font-size: 28rpx;
			font-family: PingFang SC, PingFang SC-Bold;
			font-weight: 700;
			color: #1a1a1a;
			padding: 30rpx $pages-padding 11rpx;
			border-bottom: 1px solid #e6e6e6;
		}

	}

	.table-box {
		padding: 0 $pages-padding;

		::v-deep .uni-table-tr {
			.uni-table-th {
				border: none;
				font-size: 22rpx;
				font-family: PingFang SC, PingFang SC-Regular;
				font-weight: 400;
				color: #1a1a1a;
			}

			.uni-table-td {
				border: none;
				font-size: 26rpx;
				font-family: PingFang SC, PingFang SC-Bold;
				font-weight: 700;
				color: #1a1a1a;

			}

			.uni-table-th { 
				padding: 20rpx 0 0;

				&:nth-child(2) {
					padding: 20rpx 20rpx 0;
				}
			}
			.uni-table-td { 
				padding: 12rpx 0 20rpx;

				&:nth-child(2) {
					padding: 12rpx 20rpx 0;
				}
			}
		}

	}

	.account-money {
		padding: 0 $pages-padding;

		font-size: 22rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #808080;
		line-height: 30rpx;
		.money-item{
		padding-bottom: 12rpx;
		&:last-child{
			padding-bottom: 30rpx;
		}
		}
		
	}
	
	.Profit-loss{
		width: 100%;
		padding: 0 $pages-padding;
		.Profit-loss-lable{
			padding: 20rpx 0 12rpx;
			font-size: 22rpx;
			font-family: PingFang SC, PingFang SC-Regular;
			font-weight: 400;
			color: #1a1a1a;
			line-height: 30rpx;
		}
		.Profit-loss-value{
 
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC-Bold;
			font-weight: 700;
			color: #1a1a1a;
			line-height: 37rpx;
		}
	}
</style>