优化fab组件

components/fs-avatar/fs-avatar.vue

@@ -155,6 +155,8 @@ const handleError = e => {
 		justify-content: center;
 		align-items: center;
 		color: #fff;
+		white-space: normal;
+		line-height: 1;
 	}
 }
 </style>

components/fs-fab/fs-fab.vue

@@ -2,25 +2,31 @@
 	<view class="fs-fab">
 		<view class="fs-fab-btn" :style="{right, bottom}">
 			<view class="fs-fab-option" :class="{'fs-fab-scale': visible}">
-				<fs-avatar
-					class="fs-fab-option-gutter"
-					v-for="(item,index) in options"
-					:key="index"
-					:size="size"
-					:bgColor="item.bgColor"
-					:bgColorType="item.bgColorType"
-					@click="handleOption(item)">
-					{{item.name}}
-				</fs-avatar>
-				<slot name="option"></slot>
+				<slot name="option">
+					<fs-avatar
+						class="fs-fab-option-gutter"
+						v-for="(item,index) in options"
+						:key="index"
+						:size="size"
+						:bgColor="item.bgColor"
+						:bgColorType="item.bgColorType"
+						@click="handleOption(item)">
+						{{item.name}}
+					</fs-avatar>
+				</slot>
 			</view>
 			
-			<fs-avatar :size="size" @click="handleToggle">
-				<fs-icon type="icon-plus" :size="iconSize" class="fs-fab-plus" :class="{'fs-fab-visible':visible}"></fs-icon>
+			<fs-avatar :size="size" bgColorType="danger" @click="handleToggle" v-if="visible">
+				<fs-icon type="icon-close" :size="iconSize"></fs-icon>
+			</fs-avatar>
+			<fs-avatar :size="size" :bgColor="bgColor" @click="handleToggle" v-else>
+				<slot name="icon">
+					<fs-icon type="icon-plus" :size="iconSize" class="fs-fab-plus" :class="{'fs-fab-visible':visible}"></fs-icon>
+				</slot>
 			</fs-avatar>
 		</view>
 		
-		<fs-mask v-model="visible"></fs-mask>
+		<fs-mask v-if="showMask" v-model="visible"></fs-mask>
 	</view>
 </template>
 
@@ -47,7 +53,9 @@ const props = defineProps({
 	iconSize: {
 		type: String,
 		default: '50rpx'
-	}
+	},
+	bgColor: String,
+	showMask: Boolean
 })
 
 const emits = defineEmits(['clickOption'])