|
|
@@ -0,0 +1,82 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <uni-fab ref="fab" :pattern="pattern" :content="content" :horizontal="horizontal" :vertical="vertical"
|
|
|
+ :direction="direction" @trigger="trigger" @fabClick="fabClick" />
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ horizontal: 'right',
|
|
|
+ vertical: 'top',
|
|
|
+ direction: 'horizontal',
|
|
|
+ pattern: {
|
|
|
+ color: '#7A7E83',
|
|
|
+ backgroundColor: '#fff',
|
|
|
+ selectedColor: '#007AFF',
|
|
|
+ buttonColor: '#c5c5c5',
|
|
|
+ iconColor: '#fff',
|
|
|
+ icon: 'closeempty'
|
|
|
+ },
|
|
|
+ content: [
|
|
|
+ /* {
|
|
|
+ iconPath: '/static/image.png',
|
|
|
+ selectedIconPath: '/static/image-active.png',
|
|
|
+ text: '相册',
|
|
|
+ active: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ iconPath: '/static/home.png',
|
|
|
+ selectedIconPath: '/static/home-active.png',
|
|
|
+ text: '首页',
|
|
|
+ active: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ iconPath: '/static/star.png',
|
|
|
+ selectedIconPath: '/static/star-active.png',
|
|
|
+ text: '收藏',
|
|
|
+ active: false
|
|
|
+ } */
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ trigger(e) {
|
|
|
+ /* console.log(e)
|
|
|
+ this.content[e.index].active = !e.item.active
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: `您${this.content[e.index].active ? '选中了' : '取消了'}${e.item.text}`,
|
|
|
+ success: function (res) {
|
|
|
+ if (res.confirm) {
|
|
|
+ console.log('用户点击确定')
|
|
|
+ } else if (res.cancel) {
|
|
|
+ console.log('用户点击取消')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }) */
|
|
|
+ },
|
|
|
+ fabClick() {
|
|
|
+ window.location.href = 'action://to_home/';
|
|
|
+ /* uni.showToast({
|
|
|
+ title: '点击了悬浮按钮',
|
|
|
+ icon: 'none'
|
|
|
+ }) */
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ /deep/ .uni-fab__circle {
|
|
|
+ opacity: 60%;
|
|
|
+ width: 35px;
|
|
|
+ height: 35px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .fab-circle-icon {
|
|
|
+ font-size: 20px !important;
|
|
|
+ }
|
|
|
+</style>
|