<template>
	<view class="content">
		<view class="alert">
			<view class="text local-title">
				{{text}}
			</view>
			<view class="only-certain-btn" @click="$emit('clickCertain')">确定</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"Alert",
		data() {
			return {
				
			};
		},
		props: {
			alertOneLine:{
				type:Boolean,
				default:true
			},
			text:{
				type:String,
				default:''
			},
			showButtonNum:{
				type:Number,
				default:1
			} 
		}
	}
</script>

<style lang="scss" scoped>
.content {
	position: fixed;
	z-index: 9999999;
	top: 0;
	left: 0;
	bottom: 0;
	height: 100%;
	width: 100%;
	background-color: rgba($color: #000000, $alpha: 0.6);
	.alert {
		margin: auto;
		margin-top: 70%;
		width: 600rpx;
		background-color: #FFFFFF;
		border-radius: 24rpx;
		opacity: 1;
		padding-bottom: 48rpx;
		.title {
			padding: 48rpx 48rpx 64rpx;
			text-align: center;
			font-size: 28rpx;
			color: #686868;
			line-height: 50rpx;
			width: 504rpx;
		}
		.local-title {
			padding: 78rpx 40rpx;
			color: #252525;
			font-size: 32rpx;
			text-align: center;
			line-height: 48rpx;
		}
		.only-certain-btn {
			margin: 0 60rpx;
			border-radius: 40rpx;
			height: 80rpx;
			width: 480rpx;
			background-color: #FF0520;
			color: #FFFFFF;
			line-height: 82rpx;
			font-size: 32rpx;
			text-align: center;
		}
		.bottom-two-btn {
			display: flex;
			padding: 0 40rpx;
			justify-content: space-between;
			align-items: center;
			.left {
				height: 76rpx;
				width: 240rpx;
				border-radius: 40rpx;
				border: 2rpx solid #C9C9C9;
				font-size: 32rpx;
				color: #848689;
				line-height: 78rpx;
				text-align: center;
			}
			.right {
				height: 80rpx;
				width: 240rpx;
				border-radius: 40rpx;
				background-color: #FF0520;
				font-size: 32rpx;
				color: #FFFFFF;
				line-height: 82rpx;
				text-align: center;
			}
		}
	}
}
</style>
