<template>
	<view class="buydetail">
		<view class="buytop">
			<text class="buytitle"> 数字货币</text>
			<view class="buybox flexA">
				<image src="../../static/logo.png" mode=""></image>
				<view class="buymiss">
					<view class="title">
						比特币20个
					</view>
					<view class="money">
						<text>¥</text>1200
					</view>
				</view>
			</view>
		</view>
		<view class="paymiss">
			<view class="paybox">
				<view class="boxtitle">
					买家信息
				</view>
				<view class="paybar">
					<view class="left">
						<text>*</text>接收账户:
					</view>
					<view class="right">
						<input type="text" placeholder="请输入手机号或钱包地址"
							placeholder-style="color: rgba(0,0,0,0.26);font-size: 28rpx;">
					</view>
				</view>
				<view class="paybar">
					<view class="left">
						<text>*</text>微信号::
					</view>
					<view class="right">
						<input type="text" placeholder="请输入"
							placeholder-style="color: rgba(0,0,0,0.26);font-size: 28rpx;">
					</view>
				</view>
				<view class="paybar">
					<view class="left">
						联系人:
					</view>
					<view class="right">
						<input type="text" placeholder="选填"
							placeholder-style="color: rgba(0,0,0,0.26);font-size: 28rpx;">
					</view>
				</view>
				<view class="paybar">
					<view class="left">
						联系电话:
					</view>
					<view class="right">
						<input type="text" placeholder="选填"
							placeholder-style="color: rgba(0,0,0,0.26);font-size: 28rpx;">
					</view>
				</view>
				<view class="paybar">
					<view class="left">
						实名认证:<text>(未通过)</text>
					</view>
					<view class="right flexA">
						<text>去认证</text>
						<image src="../../static/ic-arrow.png" mode=""></image>
					</view>
				</view>
			</view>
		</view>
		<view class="btn">
			<view class="paybtn">
				确认支付
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				String: "",
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f0f0f0;
	}

	.buydetail {

		.buytop {
			width: 100%;
			padding: 0 32rpx;
			height: 294rpx;
			background-image: url(@/static/ic_back3.png);
			background-size: 100%;
			background-repeat: no-repeat;
			padding-top: 68rpx;
			box-sizing: border-box;

			.buytitle {
				color: rgba(0, 0, 0, 1);
				font-size: 36rpx;
				font-weight: 600;
				font-family: "PingFang SC";
			}

			.buybox {
				margin-top: 24rpx;
				background-color: #ffffff;
				padding: 24rpx;
				border-radius: 16rpx;
				box-sizing: border-box;

				image {
					margin-right: 12rpx;
					width: 120rpx;
					height: 120rpx;
					border-radius: 16rpx;
				}

				.buymiss {
					.title {
						color: rgba(0, 0, 0, 0.9);
						font-size: 28rpx;
						font-weight: 400;
						font-family: "PingFang SC";
					}

					.money {
						margin-top: 32rpx;
						color: rgba(248, 83, 23, 1);
						font-size: 32rpx;
						font-weight: 700;

						text {
							font-size: 24rpx;
							font-weight: 500;
						}
					}
				}
			}
		}

		.paymiss {
			padding: 0 32rpx;
			margin-top: 24rpx;

			.paybox {
				background-color: #ffffff;
				padding: 24rpx;

				.boxtitle {
					color: rgba(0, 0, 0, 0.9);
					font-size: 30rpx;
					font-weight: 600;
					font-family: "PingFang SC";
				}

				.paybar {
					padding: 16rpx 0;
					display: flex;
					align-items: center;
					justify-content: space-between;

					.left {
						flex: 1;
						color: rgba(0, 0, 0, 0.9);
						font-size: 28rpx;
						font-weight: 400;
						font-family: "PingFang SC";

						text {
							opacity: 1;
							color: rgba(252, 67, 56, 1);
							font-size: 28rpx;
							font-weight: 400;
							font-family: "PingFang SC";
						}
					}

					.right {
						text-align: right;

						text {
							color: rgba(33, 83, 212, 1);
							font-size: 28rpx;
							font-weight: 400;
							font-family: "PingFang SC";
						}

						image {
							width: 16rpx;
							height: 32rpx;
						}
					}
				}
			}
		}

		.btn {
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 128rpx;
			padding: 16rpx 32rpx;
			box-sizing: border-box;
			opacity: 1;
			background: rgba(255, 255, 255, 1);

			.paybtn {
				width: 100%;
				height: 96rpx;
				line-height: 96rpx;
				text-align: center;
				border-radius: 28rpx;
				opacity: 1;
				color: rgba(0, 0, 0, 0.9);
				font-size: 32rpx;
				font-weight: 600;
				font-family: "PingFang SC";
				background: rgba(240,242,245,1);
			}
		}

	}
</style>