<template>
	<view class="dis_col_evenly" >
		<text class="t_2">
			本次行程需要支付(元)
		</text>
		<text class="t_1">
			1.00
		</text>
		<view class="t_2_fat" >
			<text class="t_2">
				当前费用: 1.0元
			</text>
			<text class="t_2">
				不使用用车卷
			</text>
		</view>
		<view class="t_3">
			<text class="btn_now">
				确认支付
			</text>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'
	const info = uni.getSystemInfoSync()
	const windowWidth = info.windowWidth
	const windowHeight = info.windowHeight
	
</script>

<style lang="scss" scoped>
	.dis_col_evenly {
		// width: 100%;
		height: 200px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
		padding: 10px 20px;
	}

	.t_1 {
		font-weight: 800;
		font-size: 30px;
		margin: 10px 0;
	}
	.t_2_fat {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		// padding: 0 40px;
	}

	.t_2 {
		font-size: 13px;
		color: #999999;
		// margin-top: 5px;
	}

	.t_3 {
		// width: 500px;
		padding: 10px 40px;
	}
	.btn_now {
		height: 40px;
		background: #000000;
		color: #fff;
		font-size: 14px;
		border-radius: 3px;
		line-height: 40px;
		text-align: center;
		margin-top: 10px;
	}
</style>