xiamen-sb-uniapp/components/my-add-button/my-add-button.vue

<template>
    <view>
        <view class="p-fixed add" @tap="handleClick">
            <image src="/static/images/add.png" mode="widthFix"></image>
        </view>

        <u-action-sheet v-if="isBatch" @click="click" :list="buttonList" v-model="show"></u-action-sheet>
    </view>
</template>

<script>
export default {
    props: {
        isBatch: {
            type: Boolean,
            default: false
        },
        buttonList: {
            type: Array,
            default: () => [
                {
                    text: '扫码'
                },
                {
                    text: '添加'
                },
                {
                    text: '批量修改'
                },
                {
                    text: '批量复制'
                }
            ]
        }
    },
    data() {
        return {
            show: false
        };
    },
    methods: {
        handleClick() {
            if (this.isBatch) {
                this.show = true;
                return;
            }
            this.$emit('handleClick')
        },
        scanCode() {
            uni.scanCode({
                success(e) {
                    console.log(e.result);
                    if (e.result) {
                        uni.navigateTo({
                            url:
                                '/pages/equipment-detail/equipment-detail?detailId=' +
                                e.result
                        });
                    }
                }
            });
        },
        click(index) {
            this.$emit('handleClick', this.buttonList[index])
            this.show = false
            /* console.log(index);
            switch (index) {
            case 0:

                break;
            case 1:
                this.$emit('handleClick');
                break;
            case 2:
                uni.navigateTo({
                    url: '/pages/running/ceshi'
                });
                break;
            } */
        }
    }
};
</script>

<style lang="less" scoped>
.add {
  right: 50rpx;
  bottom: 170rpx;
  z-index: 10000;
  width: 128rpx;
  height: 128rpx;
  background-color: #fff;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;

  image {
    width: 128rpx;
    height: 128rpx;
  }
}
</style>