<template>
	<view>
		<view class="addall" v-if="show">
			<view>温馨提示</view>
			<view>
				<image src="https://www.focusnu.com/media/directive/ddj.png" mode="aspectFill"></image>
			</view>
			<view>
				<slot name="font"></slot>
			</view>
			<view>
				<view @click="$emit('back')">{{closetext}}</view>
				<view class="qd" @click="$emit('right')">{{righttext}}</view>
			</view>
		</view>
		<view class="mengban" v-if="show" @click="$emit('back')"></view>
	</view>
</template>

<script>
	export default {
		props: {
			show: {
				type: Boolean,
				default: false
			},
			closetext: {
				type: String,
				default: '取消'
			},
			righttext: {
				type: String,
				default: '确认'
			},
			close: true
		},

		methods: {

		}
	}
</script>

<style scoped lang="less">
	.addall {
		width: 80%;
		// min-height: 43%;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 1.3vw 0rpx rgba(163, 167, 182, 0.16);
		border-radius: 50rpx;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		// padding: 2.8vw;
		padding: 2.8vw 55rpx;
		z-index: 9999;

		>view {
			&:nth-child(4) {
				height: 170rpx;
				width: 100%;
				display: flex;
				justify-content: center;
				align-items: center;

				view {
					width: 200rpx;
					height: 80rpx;
					background: #E2EFFA;
					border-radius: 30rpx;
					font-weight: 400;
					font-size: 40rpx;
					color: #5F676F;
					display: flex;
					justify-content: center;
					align-items: center;
					margin: 0 15rpx;
				}

				.qd {
					background: #57A8FA;

					color: #FFFFFF;
				}
			}

			&:nth-child(3) {}

			&:nth-child(2) {
				width: 150rpx;
				height: 150rpx;
				margin: 2vw auto 0;
				margin-bottom: 20rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			&:nth-child(1) {
				font-weight: 600;
				font-size: 38rpx;
				color: #333333;
				text-align: center;
				margin-top: 40rpx;
			}
		}
	}

	.mengban {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9100;
		background: rgba(93, 94, 95, 0.5);
	}
</style>