更新记录

1.0.1(2021-01-28) 下载此版本

修改大转盘旋转角度的BUG

1.0.0(2021-01-28) 下载此版本

第一版


平台兼容性

示例小程序:

小程序

一、大转盘:

<turntable-reward ref="turntableChild" :listArr="turntableList" :widthNum="turntableWidthNum"
         :resultIndex="resultIndex" :rewardInstruction="rewardInstruction" @goPlayReward="goPlayReward">
</turntable-reward>
import TurntableReward from '@/components/xtcj-com/circle/turntable-reward.vue'
export default {
        components: {
            TurntableReward
        }
}

参数说明:

参数名 必选 类型 说明
turntableList 是 array 抽奖内容数组
turntableWidthNum 是 int 内容宽度
resultIndex 是 int 中奖INDEX
rewardInstruction 否 string 抽奖规则
goPlayReward 是 function 抽奖方法

二、九宫格

<nine-box ref="nineChild" :circleList="circleList" :awardList="awardList" :rewardInstruction="rewardInstruction" 
        @goPlayReward="goPlayReward">
import NineBox from '@/components/xtcj-com/nine/nine-box.vue'
export default {
        components: {
            NineBox
        }
}

参数说明:

参数名 必选 类型 说明
circleList 是 array 大转盘内容数组
awardList 是 array 奖品图数组
rewardInstruction 否 string 抽奖规则
goPlayReward 是 function 抽奖方法

三、刮刮乐:

<scratch-card ref="scratchChild"
                         :percentage="56"
                         :touchSize="15"
                         fillColor='#ddd'
                         watermark="刮一刮"
                         watermarkColor="#c5c5c5"
                         :watermarkSize="14"
                         title="刮一刮开奖"
                         titleColor="#888"
                         :titleSize="24"
                         :disabled="false"
                         rewardStr=" "
                         :rewardInstruction="rewardInstruction"
                         :cantManageFlag="cantManageFlag"
                         @goPlayReward="goPlayReward">
import ScratchCard from '@/components/xtcj-com/scratch/scratch-card.vue'
export default {
        components: {
            ScratchCard
        }
}

参数说明:

参数名 必选 类型 说明
percentage 否 int 刮到多少百分比开奖
touchSize 否 int 刮的画笔尺寸
fillColor 否 string 填充颜色
watermark 否 string 开始打开上面的水印字
watermarkColor 否 string 开始打开上面的水印字的颜色
title 否 string 开始打开上面的字
titleColor 否 string 开始打开上面的字的颜色
titleSize 否 int 开始打开上面的字的尺寸
disabled 否 boolean 是否不可以刮
rewardStr 否 string 中将内容
rewardInstruction 否 string 抽奖规则
cantManageFlag 是 function 改变是否可以刮的标识
goPlayReward 是 function 抽奖方法

四、摇一摇

<shake ref="shakeChild" :audioCtxObj="shakeAudioCtx" :windowHeight="shakeHeight"
         @shakeHand="shakeHand" @goPlayReward="goPlayReward" :rewardInstruction="rewardInstruction" ></shake>
import ShakeComponent from '@/components/xtcj-com/scratch/scratch-card.vue'
export default {
        components: {
            ShakeComponent
        },
        data() {
            return {
                shakeAudioCtx:null,
                shakeHeight:0
            }
        },
        onLoad(){
            // 设置显示区域高度
            this.shakeHeight = uni.getSystemInfoSync().windowHeight;
            // 声明音频实例
            this.shakeAudioCtx = uni.createInnerAudioContext();
            uni.onAccelerometerChange(this.$refs.shakeChild.starshake);
        }
}        

参数说明:

参数名 必选 类型 说明
shakeAudioCtx 是 int 音频实例 (uni.createInnerAudioContext())
shakeHeight 是 float 窗口宽度(uni.getSystemInfoSync().windowHeight)
shakeHand 是 function 摇动手机后调用的方法
rewardInstruction 否 string 抽奖规则
goPlayReward 是 function 抽奖方法

五、抽牌

<poker-card  ref="pokerChild" :card="cardAttr" :extractNum="extractNum" @open="openCard"
         :rewardInstruction="rewardInstruction" @goPlayReward="goPlayReward">
        </poker-card>
import PokerCard from '@/components/xtcj-com/poker/poker-card.vue'
export default {
        components: {
            PokerCard
        }
}

参数说明:

参数名 必选 类型 说明
cardAttr 是 array 卡牌数组
extractNum 是 int 可抽奖次数
openCard 是 function 抽牌后的方法
rewardInstruction 否 string 抽奖规则
goPlayReward 是 function 抽奖方法

隐私、权限声明

1. 本插件需要申请的系统权限列表:

重力感应 声音

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

无

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

无

许可协议

MIT协议