<template>
	<view>
		<u-navbar title="账单详情" :border-bottom="false" :background="bgc" title-color='#2E4975' title-size='36'
			height='36'></u-navbar>
			<view class="cont">
				<view class="order_card">
					<view class="cardtop">
						<view class="text">
							到账金额
						</view>
						<view class="num">
							12,000.00
						</view>
						<view class="text">
							账户余额12365.23
						</view>
					</view>
					<view class="card_bot">
						<view class="info_li">
							<view class="text">
								到账日期
							</view>
							<view class="text">
								2023-12-11 15:30
							</view>
						</view>
						<view class="info_li">
							<view class="text">
								充值设备
							</view>
							<view class="text">
								2501号电表
							</view>
						</view>
						<view class="info_li">
							<view class="text">
								充值类型
							</view>
							<view class="text">
								电费充值
							</view>
						</view>
						<view class="info_li">
							<view class="text">
								充值用户
							</view>
							<view class="text">
								aliyou
							</view>
						</view>
					</view>
				</view>
				
			</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				bgc: {
					backgroundColor: "#F7FAFE",
				},
				
			}
		},
		methods: {
			tobd(){
				uni.navigateTo({
					url:''
				})
			}
		}
	}
</script>

<style lang="scss" >
	page{
		background: #F7FAFE;
	}
.cont{
	display: flex;
	// justify-content: center;
	flex-wrap: wrap;
	
	// width: 594rpx;
	.order_card{
		margin: 0 auto;
		width: 700rpx;
		height: 638rpx;
		background-image: url('@/static/order_bg.png');
		background-size: 100% 100%;
		 background-repeat: no-repeat;
		.cardtop{
			margin-top: 48rpx;
			// display: flex;
			// flex-wrap: wrap;
			// justify-content: center;
			.text{
				text-align: center;
				width: 100%;
				font-weight: 400;
				font-size: 28rpx;
				color: #808080;
			}
			.num{
				text-align: center;
				margin-top: 18rpx;
				font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
				font-weight: 400;
				font-size: 60rpx;
				color: #8883F0;
			}
			
		}
		.card_bot{
			margin: 0 auto;
			margin-top: 20rpx;
			width: 560rpx;
			text-align: center;
			.info_li{
				margin-top: 35rpx;
				width: 560rpx;
				display: flex;
				flex-wrap: nowrap;
				justify-content: space-between;
				.text{
					
					
					font-weight: 400;
					font-size: 28rpx;
					color: #808080;
				}
			}
		}
	}
}
</style>
