From c9c263dc43ad90f95f24a036cee9e6b47afb596c Mon Sep 17 00:00:00 2001
From: skyouc
Date: 星期六, 21 十二月 2024 18:44:20 +0800
Subject: [PATCH] 新建盐城德森项目

---
 uni_modules/uni-fab/components/uni-fab/uni-fab.vue |  950 +++++++++++++++++++++++++++++-----------------------------
 1 files changed, 475 insertions(+), 475 deletions(-)

diff --git a/uni_modules/uni-fab/components/uni-fab/uni-fab.vue b/uni_modules/uni-fab/components/uni-fab/uni-fab.vue
index bef97f1..6143a05 100644
--- a/uni_modules/uni-fab/components/uni-fab/uni-fab.vue
+++ b/uni_modules/uni-fab/components/uni-fab/uni-fab.vue
@@ -1,475 +1,475 @@
-<template>
-	<view class="uni-cursor-point">
-		<view v-if="popMenu && (leftBottom||rightBottom||leftTop||rightTop) && content.length > 0" :class="{
-        'uni-fab--leftBottom': leftBottom,
-        'uni-fab--rightBottom': rightBottom,
-        'uni-fab--leftTop': leftTop,
-        'uni-fab--rightTop': rightTop
-      }" class="uni-fab">
-			<view :class="{
-          'uni-fab__content--left': horizontal === 'left',
-          'uni-fab__content--right': horizontal === 'right',
-          'uni-fab__content--flexDirection': direction === 'vertical',
-          'uni-fab__content--flexDirectionStart': flexDirectionStart,
-          'uni-fab__content--flexDirectionEnd': flexDirectionEnd,
-		  'uni-fab__content--other-platform': !isAndroidNvue
-        }" :style="{ width: boxWidth, height: boxHeight, backgroundColor: styles.backgroundColor }"
-				class="uni-fab__content" elevation="5">
-				<view v-if="flexDirectionStart || horizontalLeft" class="uni-fab__item uni-fab__item--first" />
-				<view v-for="(item, index) in content" :key="index" :class="{ 'uni-fab__item--active': isShow }"
-					class="uni-fab__item" @click="_onItemClick(index, item)">
-					<image :src="item.active ? item.selectedIconPath : item.iconPath" class="uni-fab__item-image"
-						mode="aspectFit" />
-					<text class="uni-fab__item-text"
-						:style="{ color: item.active ? styles.selectedColor : styles.color }">{{ item.text }}</text>
-				</view>
-				<view v-if="flexDirectionEnd || horizontalRight" class="uni-fab__item uni-fab__item--first" />
-			</view>
-		</view>
-		<view :class="{
-		  'uni-fab__circle--leftBottom': leftBottom,
-		  'uni-fab__circle--rightBottom': rightBottom,
-		  'uni-fab__circle--leftTop': leftTop,
-		  'uni-fab__circle--rightTop': rightTop,
-		  'uni-fab__content--other-platform': !isAndroidNvue
-		}" class="uni-fab__circle uni-fab__plus" :style="{ 'background-color': styles.buttonColor }" @click="_onClick">
-			<uni-icons class="fab-circle-icon" type="plusempty" :color="styles.iconColor" size="32"
-				:class="{'uni-fab__plus--active': isShow && content.length > 0}"></uni-icons>
-			<!-- <view class="fab-circle-v"  :class="{'uni-fab__plus--active': isShow && content.length > 0}"></view>
-			<view class="fab-circle-h" :class="{'uni-fab__plus--active': isShow  && content.length > 0}"></view> -->
-		</view>
-	</view>
-</template>
-
-<script>
-	let platform = 'other'
-	// #ifdef APP-NVUE
-	platform = uni.getSystemInfoSync().platform
-	// #endif
-
-	/**
-	 * Fab 鎮诞鎸夐挳
-	 * @description 鐐瑰嚮鍙睍寮�涓�涓浘褰㈡寜閽彍鍗�
-	 * @tutorial https://ext.dcloud.net.cn/plugin?id=144
-	 * @property {Object} pattern 鍙�夋牱寮忛厤缃」
-	 * @property {Object} horizontal = [left | right] 姘村钩瀵归綈鏂瑰紡
-	 * 	@value left 宸﹀榻�
-	 * 	@value right 鍙冲榻�
-	 * @property {Object} vertical = [bottom | top] 鍨傜洿瀵归綈鏂瑰紡
-	 * 	@value bottom 涓嬪榻�
-	 * 	@value top 涓婂榻�
-	 * @property {Object} direction = [horizontal | vertical] 灞曞紑鑿滃崟鏄剧ず鏂瑰紡
-	 * 	@value horizontal 姘村钩鏄剧ず
-	 * 	@value vertical 鍨傜洿鏄剧ず
-	 * @property {Array} content 灞曞紑鑿滃崟鍐呭閰嶇疆椤�
-	 * @property {Boolean} popMenu 鏄惁浣跨敤寮瑰嚭鑿滃崟
-	 * @event {Function} trigger 灞曞紑鑿滃崟鐐瑰嚮浜嬩欢锛岃繑鍥炵偣鍑讳俊鎭�
-	 * @event {Function} fabClick 鎮诞鎸夐挳鐐瑰嚮浜嬩欢
-	 */
-	export default {
-		name: 'UniFab',
-		emits: ['fabClick', 'trigger'],
-		props: {
-			pattern: {
-				type: Object,
-				default () {
-					return {}
-				}
-			},
-			horizontal: {
-				type: String,
-				default: 'left'
-			},
-			vertical: {
-				type: String,
-				default: 'bottom'
-			},
-			direction: {
-				type: String,
-				default: 'horizontal'
-			},
-			content: {
-				type: Array,
-				default () {
-					return []
-				}
-			},
-			show: {
-				type: Boolean,
-				default: false
-			},
-			popMenu: {
-				type: Boolean,
-				default: true
-			}
-		},
-		data() {
-			return {
-				fabShow: false,
-				isShow: false,
-				isAndroidNvue: platform === 'android',
-				styles: {
-					color: '#3c3e49',
-					selectedColor: '#007AFF',
-					backgroundColor: '#fff',
-					buttonColor: '#007AFF',
-					iconColor: '#fff'
-				}
-			}
-		},
-		computed: {
-			contentWidth(e) {
-				return (this.content.length + 1) * 55 + 15 + 'px'
-			},
-			contentWidthMin() {
-				return '55px'
-			},
-			// 鍔ㄦ�佽绠楀搴�
-			boxWidth() {
-				return this.getPosition(3, 'horizontal')
-			},
-			// 鍔ㄦ�佽绠楅珮搴�
-			boxHeight() {
-				return this.getPosition(3, 'vertical')
-			},
-			// 璁＄畻宸︿笅浣嶇疆
-			leftBottom() {
-				return this.getPosition(0, 'left', 'bottom')
-			},
-			// 璁＄畻鍙充笅浣嶇疆
-			rightBottom() {
-				return this.getPosition(0, 'right', 'bottom')
-			},
-			// 璁＄畻宸︿笂浣嶇疆
-			leftTop() {
-				return this.getPosition(0, 'left', 'top')
-			},
-			rightTop() {
-				return this.getPosition(0, 'right', 'top')
-			},
-			flexDirectionStart() {
-				return this.getPosition(1, 'vertical', 'top')
-			},
-			flexDirectionEnd() {
-				return this.getPosition(1, 'vertical', 'bottom')
-			},
-			horizontalLeft() {
-				return this.getPosition(2, 'horizontal', 'left')
-			},
-			horizontalRight() {
-				return this.getPosition(2, 'horizontal', 'right')
-			}
-		},
-		watch: {
-			pattern: {
-				handler(val, oldVal) {
-					this.styles = Object.assign({}, this.styles, val)
-				},
-				deep: true
-			}
-		},
-		created() {
-			this.isShow = this.show
-			if (this.top === 0) {
-				this.fabShow = true
-			}
-			// 鍒濆鍖栨牱寮�
-			this.styles = Object.assign({}, this.styles, this.pattern)
-		},
-		methods: {
-			_onClick() {
-				this.$emit('fabClick')
-				if (!this.popMenu) {
-					return
-				}
-				this.isShow = !this.isShow
-			},
-			open() {
-				this.isShow = true
-			},
-			close() {
-				this.isShow = false
-			},
-			/**
-			 * 鎸夐挳鐐瑰嚮浜嬩欢
-			 */
-			_onItemClick(index, item) {
-				this.$emit('trigger', {
-					index,
-					item
-				})
-			},
-			/**
-			 * 鑾峰彇 浣嶇疆淇℃伅
-			 */
-			getPosition(types, paramA, paramB) {
-				if (types === 0) {
-					return this.horizontal === paramA && this.vertical === paramB
-				} else if (types === 1) {
-					return this.direction === paramA && this.vertical === paramB
-				} else if (types === 2) {
-					return this.direction === paramA && this.horizontal === paramB
-				} else {
-					return this.isShow && this.direction === paramA ? this.contentWidth : this.contentWidthMin
-				}
-			}
-		}
-	}
-</script>
-
-<style lang="scss" >
-	$uni-shadow-base:0 1px 5px 2px rgba($color: #000000, $alpha: 0.3) !default;
-
-	.uni-fab {
-		position: fixed;
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		justify-content: center;
-		align-items: center;
-		z-index: 10;
-		border-radius: 45px;
-		box-shadow: $uni-shadow-base;
-	}
-
-	.uni-cursor-point {
-		/* #ifdef H5 */
-		cursor: pointer;
-		/* #endif */
-	}
-
-	.uni-fab--active {
-		opacity: 1;
-	}
-
-	.uni-fab--leftBottom {
-		left: 15px;
-		bottom: 30px;
-		/* #ifdef H5 */
-		left: calc(15px + var(--window-left));
-		bottom: calc(30px + var(--window-bottom));
-		/* #endif */
-		// padding: 10px;
-	}
-
-	.uni-fab--leftTop {
-		left: 15px;
-		top: 30px;
-		/* #ifdef H5 */
-		left: calc(15px + var(--window-left));
-		top: calc(30px + var(--window-top));
-		/* #endif */
-		// padding: 10px;
-	}
-
-	.uni-fab--rightBottom {
-		right: 15px;
-		bottom: 30px;
-		/* #ifdef H5 */
-		right: calc(15px + var(--window-right));
-		bottom: calc(30px + var(--window-bottom));
-		/* #endif */
-		// padding: 10px;
-	}
-
-	.uni-fab--rightTop {
-		right: 15px;
-		top: 30px;
-		/* #ifdef H5 */
-		right: calc(15px + var(--window-right));
-		top: calc(30px + var(--window-top));
-		/* #endif */
-		// padding: 10px;
-	}
-
-	.uni-fab__circle {
-		position: fixed;
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		justify-content: center;
-		align-items: center;
-		width: 55px;
-		height: 55px;
-		background-color: #3c3e49;
-		border-radius: 45px;
-		z-index: 11;
-		// box-shadow: $uni-shadow-base;
-	}
-
-	.uni-fab__circle--leftBottom {
-		left: 15px;
-		bottom: 30px;
-		/* #ifdef H5 */
-		left: calc(15px + var(--window-left));
-		bottom: calc(30px + var(--window-bottom));
-		/* #endif */
-	}
-
-	.uni-fab__circle--leftTop {
-		left: 15px;
-		top: 30px;
-		/* #ifdef H5 */
-		left: calc(15px + var(--window-left));
-		top: calc(30px + var(--window-top));
-		/* #endif */
-	}
-
-	.uni-fab__circle--rightBottom {
-		right: 15px;
-		bottom: 30px;
-		/* #ifdef H5 */
-		right: calc(15px + var(--window-right));
-		bottom: calc(30px + var(--window-bottom));
-		/* #endif */
-	}
-
-	.uni-fab__circle--rightTop {
-		right: 15px;
-		top: 30px;
-		/* #ifdef H5 */
-		right: calc(15px + var(--window-right));
-		top: calc(30px + var(--window-top));
-		/* #endif */
-	}
-
-	.uni-fab__circle--left {
-		left: 0;
-	}
-
-	.uni-fab__circle--right {
-		right: 0;
-	}
-
-	.uni-fab__circle--top {
-		top: 0;
-	}
-
-	.uni-fab__circle--bottom {
-		bottom: 0;
-	}
-
-	.uni-fab__plus {
-		font-weight: bold;
-	}
-
-	// .fab-circle-v {
-	// 	position: absolute;
-	// 	width: 2px;
-	// 	height: 24px;
-	// 	left: 0;
-	// 	top: 0;
-	// 	right: 0;
-	// 	bottom: 0;
-	// 	/* #ifndef APP-NVUE */
-	// 	margin: auto;
-	// 	/* #endif */
-	// 	background-color: white;
-	// 	transform: rotate(0deg);
-	// 	transition: transform 0.3s;
-	// }
-
-	// .fab-circle-h {
-	// 	position: absolute;
-	// 	width: 24px;
-	// 	height: 2px;
-	// 	left: 0;
-	// 	top: 0;
-	// 	right: 0;
-	// 	bottom: 0;
-	// 	/* #ifndef APP-NVUE */
-	// 	margin: auto;
-	// 	/* #endif */
-	// 	background-color: white;
-	// 	transform: rotate(0deg);
-	// 	transition: transform 0.3s;
-	// }
-
-	.fab-circle-icon {
-		transform: rotate(0deg);
-		transition: transform 0.3s;
-		font-weight: 200;
-	}
-
-	.uni-fab__plus--active {
-		transform: rotate(135deg);
-	}
-
-	.uni-fab__content {
-		/* #ifndef APP-NVUE */
-		box-sizing: border-box;
-		display: flex;
-		/* #endif */
-		flex-direction: row;
-		border-radius: 55px;
-		overflow: hidden;
-		transition-property: width, height;
-		transition-duration: 0.2s;
-		width: 55px;
-		border-color: #DDDDDD;
-		border-width: 1rpx;
-		border-style: solid;
-	}
-
-	.uni-fab__content--other-platform {
-		border-width: 0px;
-		box-shadow: $uni-shadow-base;
-	}
-
-	.uni-fab__content--left {
-		justify-content: flex-start;
-	}
-
-	.uni-fab__content--right {
-		justify-content: flex-end;
-	}
-
-	.uni-fab__content--flexDirection {
-		flex-direction: column;
-		justify-content: flex-end;
-	}
-
-	.uni-fab__content--flexDirectionStart {
-		flex-direction: column;
-		justify-content: flex-start;
-	}
-
-	.uni-fab__content--flexDirectionEnd {
-		flex-direction: column;
-		justify-content: flex-end;
-	}
-
-	.uni-fab__item {
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		flex-direction: column;
-		justify-content: center;
-		align-items: center;
-		width: 55px;
-		height: 55px;
-		opacity: 0;
-		transition: opacity 0.2s;
-	}
-
-	.uni-fab__item--active {
-		opacity: 1;
-	}
-
-	.uni-fab__item-image {
-		width: 20px;
-		height: 20px;
-		margin-bottom: 4px;
-	}
-
-	.uni-fab__item-text {
-		color: #FFFFFF;
-		font-size: 12px;
-		line-height: 12px;
-		margin-top: 2px;
-	}
-
-	.uni-fab__item--first {
-		width: 55px;
-	}
-</style>
+<template>
+	<view class="uni-cursor-point">
+		<view v-if="popMenu && (leftBottom||rightBottom||leftTop||rightTop) && content.length > 0" :class="{
+        'uni-fab--leftBottom': leftBottom,
+        'uni-fab--rightBottom': rightBottom,
+        'uni-fab--leftTop': leftTop,
+        'uni-fab--rightTop': rightTop
+      }" class="uni-fab">
+			<view :class="{
+          'uni-fab__content--left': horizontal === 'left',
+          'uni-fab__content--right': horizontal === 'right',
+          'uni-fab__content--flexDirection': direction === 'vertical',
+          'uni-fab__content--flexDirectionStart': flexDirectionStart,
+          'uni-fab__content--flexDirectionEnd': flexDirectionEnd,
+		  'uni-fab__content--other-platform': !isAndroidNvue
+        }" :style="{ width: boxWidth, height: boxHeight, backgroundColor: styles.backgroundColor }"
+				class="uni-fab__content" elevation="5">
+				<view v-if="flexDirectionStart || horizontalLeft" class="uni-fab__item uni-fab__item--first" />
+				<view v-for="(item, index) in content" :key="index" :class="{ 'uni-fab__item--active': isShow }"
+					class="uni-fab__item" @click="_onItemClick(index, item)">
+					<image :src="item.active ? item.selectedIconPath : item.iconPath" class="uni-fab__item-image"
+						mode="aspectFit" />
+					<text class="uni-fab__item-text"
+						:style="{ color: item.active ? styles.selectedColor : styles.color }">{{ item.text }}</text>
+				</view>
+				<view v-if="flexDirectionEnd || horizontalRight" class="uni-fab__item uni-fab__item--first" />
+			</view>
+		</view>
+		<view :class="{
+		  'uni-fab__circle--leftBottom': leftBottom,
+		  'uni-fab__circle--rightBottom': rightBottom,
+		  'uni-fab__circle--leftTop': leftTop,
+		  'uni-fab__circle--rightTop': rightTop,
+		  'uni-fab__content--other-platform': !isAndroidNvue
+		}" class="uni-fab__circle uni-fab__plus" :style="{ 'background-color': styles.buttonColor }" @click="_onClick">
+			<uni-icons class="fab-circle-icon" type="plusempty" :color="styles.iconColor" size="32"
+				:class="{'uni-fab__plus--active': isShow && content.length > 0}"></uni-icons>
+			<!-- <view class="fab-circle-v"  :class="{'uni-fab__plus--active': isShow && content.length > 0}"></view>
+			<view class="fab-circle-h" :class="{'uni-fab__plus--active': isShow  && content.length > 0}"></view> -->
+		</view>
+	</view>
+</template>
+
+<script>
+	let platform = 'other'
+	// #ifdef APP-NVUE
+	platform = uni.getSystemInfoSync().platform
+	// #endif
+
+	/**
+	 * Fab 鎮诞鎸夐挳
+	 * @description 鐐瑰嚮鍙睍寮�涓�涓浘褰㈡寜閽彍鍗�
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=144
+	 * @property {Object} pattern 鍙�夋牱寮忛厤缃」
+	 * @property {Object} horizontal = [left | right] 姘村钩瀵归綈鏂瑰紡
+	 * 	@value left 宸﹀榻�
+	 * 	@value right 鍙冲榻�
+	 * @property {Object} vertical = [bottom | top] 鍨傜洿瀵归綈鏂瑰紡
+	 * 	@value bottom 涓嬪榻�
+	 * 	@value top 涓婂榻�
+	 * @property {Object} direction = [horizontal | vertical] 灞曞紑鑿滃崟鏄剧ず鏂瑰紡
+	 * 	@value horizontal 姘村钩鏄剧ず
+	 * 	@value vertical 鍨傜洿鏄剧ず
+	 * @property {Array} content 灞曞紑鑿滃崟鍐呭閰嶇疆椤�
+	 * @property {Boolean} popMenu 鏄惁浣跨敤寮瑰嚭鑿滃崟
+	 * @event {Function} trigger 灞曞紑鑿滃崟鐐瑰嚮浜嬩欢锛岃繑鍥炵偣鍑讳俊鎭�
+	 * @event {Function} fabClick 鎮诞鎸夐挳鐐瑰嚮浜嬩欢
+	 */
+	export default {
+		name: 'UniFab',
+		emits: ['fabClick', 'trigger'],
+		props: {
+			pattern: {
+				type: Object,
+				default () {
+					return {}
+				}
+			},
+			horizontal: {
+				type: String,
+				default: 'left'
+			},
+			vertical: {
+				type: String,
+				default: 'bottom'
+			},
+			direction: {
+				type: String,
+				default: 'horizontal'
+			},
+			content: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			show: {
+				type: Boolean,
+				default: false
+			},
+			popMenu: {
+				type: Boolean,
+				default: true
+			}
+		},
+		data() {
+			return {
+				fabShow: false,
+				isShow: false,
+				isAndroidNvue: platform === 'android',
+				styles: {
+					color: '#3c3e49',
+					selectedColor: '#007AFF',
+					backgroundColor: '#fff',
+					buttonColor: '#007AFF',
+					iconColor: '#fff'
+				}
+			}
+		},
+		computed: {
+			contentWidth(e) {
+				return (this.content.length + 1) * 55 + 15 + 'px'
+			},
+			contentWidthMin() {
+				return '55px'
+			},
+			// 鍔ㄦ�佽绠楀搴�
+			boxWidth() {
+				return this.getPosition(3, 'horizontal')
+			},
+			// 鍔ㄦ�佽绠楅珮搴�
+			boxHeight() {
+				return this.getPosition(3, 'vertical')
+			},
+			// 璁＄畻宸︿笅浣嶇疆
+			leftBottom() {
+				return this.getPosition(0, 'left', 'bottom')
+			},
+			// 璁＄畻鍙充笅浣嶇疆
+			rightBottom() {
+				return this.getPosition(0, 'right', 'bottom')
+			},
+			// 璁＄畻宸︿笂浣嶇疆
+			leftTop() {
+				return this.getPosition(0, 'left', 'top')
+			},
+			rightTop() {
+				return this.getPosition(0, 'right', 'top')
+			},
+			flexDirectionStart() {
+				return this.getPosition(1, 'vertical', 'top')
+			},
+			flexDirectionEnd() {
+				return this.getPosition(1, 'vertical', 'bottom')
+			},
+			horizontalLeft() {
+				return this.getPosition(2, 'horizontal', 'left')
+			},
+			horizontalRight() {
+				return this.getPosition(2, 'horizontal', 'right')
+			}
+		},
+		watch: {
+			pattern: {
+				handler(val, oldVal) {
+					this.styles = Object.assign({}, this.styles, val)
+				},
+				deep: true
+			}
+		},
+		created() {
+			this.isShow = this.show
+			if (this.top === 0) {
+				this.fabShow = true
+			}
+			// 鍒濆鍖栨牱寮�
+			this.styles = Object.assign({}, this.styles, this.pattern)
+		},
+		methods: {
+			_onClick() {
+				this.$emit('fabClick')
+				if (!this.popMenu) {
+					return
+				}
+				this.isShow = !this.isShow
+			},
+			open() {
+				this.isShow = true
+			},
+			close() {
+				this.isShow = false
+			},
+			/**
+			 * 鎸夐挳鐐瑰嚮浜嬩欢
+			 */
+			_onItemClick(index, item) {
+				this.$emit('trigger', {
+					index,
+					item
+				})
+			},
+			/**
+			 * 鑾峰彇 浣嶇疆淇℃伅
+			 */
+			getPosition(types, paramA, paramB) {
+				if (types === 0) {
+					return this.horizontal === paramA && this.vertical === paramB
+				} else if (types === 1) {
+					return this.direction === paramA && this.vertical === paramB
+				} else if (types === 2) {
+					return this.direction === paramA && this.horizontal === paramB
+				} else {
+					return this.isShow && this.direction === paramA ? this.contentWidth : this.contentWidthMin
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" >
+	$uni-shadow-base:0 1px 5px 2px rgba($color: #000000, $alpha: 0.3) !default;
+
+	.uni-fab {
+		position: fixed;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		justify-content: center;
+		align-items: center;
+		z-index: 10;
+		border-radius: 45px;
+		box-shadow: $uni-shadow-base;
+	}
+
+	.uni-cursor-point {
+		/* #ifdef H5 */
+		cursor: pointer;
+		/* #endif */
+	}
+
+	.uni-fab--active {
+		opacity: 1;
+	}
+
+	.uni-fab--leftBottom {
+		left: 15px;
+		bottom: 30px;
+		/* #ifdef H5 */
+		left: calc(15px + var(--window-left));
+		bottom: calc(30px + var(--window-bottom));
+		/* #endif */
+		// padding: 10px;
+	}
+
+	.uni-fab--leftTop {
+		left: 15px;
+		top: 30px;
+		/* #ifdef H5 */
+		left: calc(15px + var(--window-left));
+		top: calc(30px + var(--window-top));
+		/* #endif */
+		// padding: 10px;
+	}
+
+	.uni-fab--rightBottom {
+		right: 15px;
+		bottom: 30px;
+		/* #ifdef H5 */
+		right: calc(15px + var(--window-right));
+		bottom: calc(30px + var(--window-bottom));
+		/* #endif */
+		// padding: 10px;
+	}
+
+	.uni-fab--rightTop {
+		right: 15px;
+		top: 30px;
+		/* #ifdef H5 */
+		right: calc(15px + var(--window-right));
+		top: calc(30px + var(--window-top));
+		/* #endif */
+		// padding: 10px;
+	}
+
+	.uni-fab__circle {
+		position: fixed;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		justify-content: center;
+		align-items: center;
+		width: 55px;
+		height: 55px;
+		background-color: #3c3e49;
+		border-radius: 45px;
+		z-index: 11;
+		// box-shadow: $uni-shadow-base;
+	}
+
+	.uni-fab__circle--leftBottom {
+		left: 15px;
+		bottom: 30px;
+		/* #ifdef H5 */
+		left: calc(15px + var(--window-left));
+		bottom: calc(30px + var(--window-bottom));
+		/* #endif */
+	}
+
+	.uni-fab__circle--leftTop {
+		left: 15px;
+		top: 30px;
+		/* #ifdef H5 */
+		left: calc(15px + var(--window-left));
+		top: calc(30px + var(--window-top));
+		/* #endif */
+	}
+
+	.uni-fab__circle--rightBottom {
+		right: 15px;
+		bottom: 30px;
+		/* #ifdef H5 */
+		right: calc(15px + var(--window-right));
+		bottom: calc(30px + var(--window-bottom));
+		/* #endif */
+	}
+
+	.uni-fab__circle--rightTop {
+		right: 15px;
+		top: 30px;
+		/* #ifdef H5 */
+		right: calc(15px + var(--window-right));
+		top: calc(30px + var(--window-top));
+		/* #endif */
+	}
+
+	.uni-fab__circle--left {
+		left: 0;
+	}
+
+	.uni-fab__circle--right {
+		right: 0;
+	}
+
+	.uni-fab__circle--top {
+		top: 0;
+	}
+
+	.uni-fab__circle--bottom {
+		bottom: 0;
+	}
+
+	.uni-fab__plus {
+		font-weight: bold;
+	}
+
+	// .fab-circle-v {
+	// 	position: absolute;
+	// 	width: 2px;
+	// 	height: 24px;
+	// 	left: 0;
+	// 	top: 0;
+	// 	right: 0;
+	// 	bottom: 0;
+	// 	/* #ifndef APP-NVUE */
+	// 	margin: auto;
+	// 	/* #endif */
+	// 	background-color: white;
+	// 	transform: rotate(0deg);
+	// 	transition: transform 0.3s;
+	// }
+
+	// .fab-circle-h {
+	// 	position: absolute;
+	// 	width: 24px;
+	// 	height: 2px;
+	// 	left: 0;
+	// 	top: 0;
+	// 	right: 0;
+	// 	bottom: 0;
+	// 	/* #ifndef APP-NVUE */
+	// 	margin: auto;
+	// 	/* #endif */
+	// 	background-color: white;
+	// 	transform: rotate(0deg);
+	// 	transition: transform 0.3s;
+	// }
+
+	.fab-circle-icon {
+		transform: rotate(0deg);
+		transition: transform 0.3s;
+		font-weight: 200;
+	}
+
+	.uni-fab__plus--active {
+		transform: rotate(135deg);
+	}
+
+	.uni-fab__content {
+		/* #ifndef APP-NVUE */
+		box-sizing: border-box;
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		border-radius: 55px;
+		overflow: hidden;
+		transition-property: width, height;
+		transition-duration: 0.2s;
+		width: 55px;
+		border-color: #DDDDDD;
+		border-width: 1rpx;
+		border-style: solid;
+	}
+
+	.uni-fab__content--other-platform {
+		border-width: 0px;
+		box-shadow: $uni-shadow-base;
+	}
+
+	.uni-fab__content--left {
+		justify-content: flex-start;
+	}
+
+	.uni-fab__content--right {
+		justify-content: flex-end;
+	}
+
+	.uni-fab__content--flexDirection {
+		flex-direction: column;
+		justify-content: flex-end;
+	}
+
+	.uni-fab__content--flexDirectionStart {
+		flex-direction: column;
+		justify-content: flex-start;
+	}
+
+	.uni-fab__content--flexDirectionEnd {
+		flex-direction: column;
+		justify-content: flex-end;
+	}
+
+	.uni-fab__item {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		width: 55px;
+		height: 55px;
+		opacity: 0;
+		transition: opacity 0.2s;
+	}
+
+	.uni-fab__item--active {
+		opacity: 1;
+	}
+
+	.uni-fab__item-image {
+		width: 20px;
+		height: 20px;
+		margin-bottom: 4px;
+	}
+
+	.uni-fab__item-text {
+		color: #FFFFFF;
+		font-size: 12px;
+		line-height: 12px;
+		margin-top: 2px;
+	}
+
+	.uni-fab__item--first {
+		width: 55px;
+	}
+</style>

--
Gitblit v1.9.1