siyu_app/components/float-btn/float-btn.vue

<template>
	<view class="botView" >
	     <view class="floatBox" @tap="clickAddCustomer">
			 <image src="@/static/images/customer/add_customer.png"  class="bicon"></image>
			  <view class="text" >添加用户</view>
		 </view>
	</view>
</template>

<script>
	export default{
		props:{
			isShowMsgPop:{
				type:Boolean,
				default:false
			}
		},
		data(){
			return{
				
			}
		},
		methods:{
			clickAddCustomer(){
				console.log("clickAddCustomer");
				return this.$emit('clickAddCustomer');
			}
		}
	}
</script>


<style lang="scss" scoped>
	
	.botView{
		position: fixed;
		right: 31rpx;
		z-index: 999;
		display: flex;
		width:204rpx;
		height:98rpx ;
		
		align-items: center;
		// top:var(--window-top);
		bottom:calc(var(--window-bottom) + 32rpx);
	}

	
	.floatBox{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		flex: 1;
		justify-content: center;
		
		height: 80rpx;
		align-items: center;
		margin:0 0;
		.bicon{
			width: 100%;
			height: 100%;
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
			z-index: 10;
		}
		.text{
			color: #fff;
			font-size: 28rpx;
			text-align: center;
			margin-left: 34rpx;
			z-index: 11;
			margin-bottom: 8rpx;
			
		}
	}
	
	
</style>