<template>

	<view class="pages">

		<view class="top">
			<image src="../../static/baseIcon/orders.png" style="width: 18px;height: 18px;" mode="aspectFill"></image>
			<text class="top-name">{{info.name}}</text>
		</view>

		<view class="content">
			
			<view class="item">
			
				<text class="item-text">账户数量</text>
				<text class="item-text1">{{info.number}}</text>
			
			</view>
			

			<view class="item">

				<text class="item-text">截止时间</text>
				<text class="item-text1">{{info.date}}</text>

			</view>

			<view class="item" style="border-bottom: none;">

				<text class="item-text">账户余额</text>
				<text class="item-text1" >{{info.balance}}</text>

			</view>

		</view>


	</view>

</template>

<script>
	export default {

		data() {
			return {
				info: {
					sid: "",
					name: "",
					number: "",
					date: "",
					balance: "",
				},


			}
		},
		onLoad(option) {
			this.info = {
				sid: option.sid,
				name: option.name,
				number: option.number,
				date: option.date,
				balance: option.balance,
			}

		},
		methods: {

		}
	}
</script>

<style lang="scss">
	.pages {

		display: flex;
		flex-direction: column;
		background-color: #fff;
		width: 100%;
		height: 100%;

		.top {
			
			padding: 20px 25px;
			display: flex;
			flex-direction: row;
			align-items: center;

			.top-name {
				margin-left: 5px;
				font-size: 16px;
				color: #000;
				font-weight: 600;
				font-family: sans-serif;
			}

			.top-date {
				font-size: 13px;
				color: #717171;
			}
		}

		.content {
			display: flex;
			margin-left: 20px;
			margin-right: 20px;
			flex-direction: column;
			border-top: 2px solid #eee;

			.item {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
				padding: 15px 20px;
				border-bottom: 1px solid #eee;
				
				.item-text{
					font-size: 14px;
					color: #191919;
				}
				
				.item-text1{
					font-size: 14px;
					color: #717171;
				}

			}
		}

	}
</style>