<script setup>
import { ref } from 'vue'
const props = defineProps(['bgcolor','type','showType','invalid'])
// const type = ref(1) // 1-底部大按钮;2-局部按钮
</script>
<template>
	<view class="buttonBox">
		<view class="add-btn-part" :class="{normalCss:type==2,plainCss:showType=='plain'}">
			<view class="add-btn" :style="{ background: bgcolor?bgcolor:'#7cc4e8'}" :class="{plainCss:showType=='plain',invalidCssBtn:invalid}">
				<slot></slot>
			</view>
		</view>
	</view>
</template>
<style scoped lang="scss">
	
.normalCss{
	position: unset !important;
	bottom: unset !important; 
	width: 100%;
}
.plainCss{
	background: white !important;
	color: #7cc4e8 !important;
}
.invalidCssBtn{
		color: white !important;
		background-color: #d7d7d7 !important;
		border: 2rpx solid #d7d7d7 !important;
	}
.add-btn-part{
	position: fixed;
	bottom: 40rpx;
	width: 100%;
	.add-btn{
			margin: 0 auto;
			width: 80%;
			text-align: center;
			background: #7cc4e8;
			border: 1px solid #7cc4e8;
			color: white;
			padding: 10px 0;
			border-radius: 40rpx;
	}
}
</style>