抽奖页面

store/lottery/modules/sudoku.vue

@@ -6,14 +6,17 @@
             </navigator>
             <image class="bg-image"
                 src="https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405281716860202553Be55ba55.webp" />
-            <view class="lottery">
+            <view class="lottery" v-if="prizes.length && showPrizes">
                 <view>
                     <LuckyGrid ref="myLucky" width="590rpx" height="590rpx" :prizes="prizes" :buttons="buttons"
                         :defaultStyle="defaultStyle" @start="startCallBack" @end="endCallBack" />
                 </view>
             </view>
+            <view class="usable-count">
+                您还有<text class="count">{{ usableCount }}</text>抽奖机会
+            </view>
         </view>
-        <view class="winners-list">
+        <view class="winners-list" v-if="winningList.length">
             <image class="image"
                 src="https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405281716863577428B1faf5081.webp"
                 mode="widthFix" />
@@ -24,11 +27,13 @@
                     </view>
                 </view>
                 <swiper class="swiper" autoplay easing-function="linear" interval="1000" duration="1000" circular vertical
-                    display-multiple-items="7">
-                    <swiper-item v-for="(item, index) in 20" :key="index">
-                        <view class="swiper-item u-line-2">
-                            {{ item }}df sdf 、
+                    :display-multiple-items="7">
+                    <swiper-item v-for="item in winningList" :key="item.sa_awardmxid">
+                        <view v-if="item.createuserid" class="swiper-item u-line-2">
+                            {{ item.name ? item.name : '用户' + item.createuserid }} <text
+                                style="padding: 0 5px;">抽中了</text>{{ item.awardname }}
                         </view>
+                        <view v-else></view>
                     </swiper-item>
                 </swiper>
             </view>
@@ -50,16 +55,7 @@ export default {
     },
     data() {
         return {
-            prizes: [
-                { x: 0, y: 0, borderRadius: '20rpx' },
-                { x: 2, y: 0, borderRadius: '20rpx' },
-                { x: 0, y: 2, borderRadius: '20rpx' },
-                { x: 2, y: 2, borderRadius: '20rpx' },
-                { x: 1, y: 0, borderRadius: '20rpx' },
-                { x: 2, y: 1, borderRadius: '20rpx' },
-                { x: 1, y: 2, borderRadius: '20rpx' },
-                { x: 0, y: 1, borderRadius: '20rpx' },
-            ],
+            prizes: [],
             buttons: [{
                 background: 'rgba(0,0,0,0)',
                 x: 1, y: 1,
@@ -75,49 +71,182 @@ export default {
                 height: '183.34rpx',
             },
             usableCount: 0,
+            loading: false,
+            winningList: [],
+            tips: '',
+            showPrizes: true,
         }
     },
     methods: {
         init() {
             console.log("this.sa_awardid", this.sa_awardid)
-            this.$Http.basic({
-                "id": 20240514131402,
-                content: {
-                    "sa_awardid": this.sa_awardid,
-                    "where": {
-                        "condition": "",
-                        "type": ""
+            try {
+                this.$Http.basic({
+                    "id": 20240514131402,
+                    content: {
+                        "sa_awardid": this.sa_awardid,
+                        "where": {
+                            "condition": "",
+                            "type": ""
+                        }
                     }
-                }
+                }).then(res => {
+                    console.log("奖品列表", res)
+                    if (this.cutoff(res.msg)) return;
+                    let prizes = [
+                        { index: 0, x: 0, y: 0 },
+                        { index: 2, x: 2, y: 0 },
+                        { index: 6, x: 0, y: 2 },
+                        { index: 4, x: 2, y: 2 },
+                        { index: 1, x: 1, y: 0 },
+                        { index: 3, x: 2, y: 1 },
+                        { index: 5, x: 1, y: 2 },
+                        { index: 7, x: 0, y: 1 },
+                    ].map(v => {
+                        v.borderRadius = '20rpx';
+                        v.imgs = [{
+                            src: 'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405291716965428111B4602d616.webp',
+                            width: '50%',
+                            top: '20%'
+                        }]
+                        return v
+                    })
+                    res.data.forEach((v, i) => {
+                        v.imgs = v.attinfos.map(img => {
+                            return {
+                                src: img.url,
+                                width: '50%',
+                                top: '25%'
+                            }
+                        })
+                        prizes[i] = Object.assign(prizes[i], v);
+                    });
+                    this.prizes = prizes.sort((a, b) => {
+                        return a.index - b.index
+                    });
+                })
+            } catch (error) { }
+            this.queryAwardCount();
+            this.getWinningList();
+        },
+        startCallBack() {
+            let that = this;
+            if (this.tips) return uni.showToast({
+                title: this.tips,
+                icon: 'none',
+                duration: 1500,
+            });
+            if (this.loading || this.usableCount == 0) return;
+            this.loading = true;
+            this.$refs.myLucky.play()
+            that.$Http.basic({
+                "content": {
+                    "sa_awardid": that.sa_awardid,
+                    "shareuserid": that.shareuserid,
+                },
+                "id": 20240514134002,
             }).then(res => {
-                console.log("奖品列表", res)
-                if (this.cutoff(res.msg)) return;
+                console.log('抽奖结果', res)
+                if (this.cutoff(res.msg)) {
+                    this.showPrizes = false;
+                    setTimeout(() => {
+                        this.showPrizes = true;
+                    })
+                    that.queryAwardCount();
+                    that.getWinningList();
+                    return
+                };
+                const index = that.prizes.findIndex(v => v.sa_awarditemsid == res.data.sa_awarditemsid);
+                that.$refs.myLucky.stop(index)
+                that.queryAwardCount();
+                that.getWinningList();
+                setTimeout(() => {
+                    that.loading = false;
+                    that.showWinningResult(res.data, index);
+                }, 5000);
             })
-
-            this.$Http.basic({
-                "classname": "sysmanage.develop.datafunction.datafunction",
-                "method": "execute",
-                "content": {
-                    "functionname": "queryAwardCount",
-                    "parameter": {
-                        "sa_awardid": this.sa_awardid
+        },
+        showWinningResult(data, index) {
+            console.log("中奖结果", data)
+            let that = this;
+            uni.showModal({
+                title: '恭喜您抽中',
+                content: data.awardname,
+                showCancel: false,
+                confirmText: '选择地址',
+                success: function ({ confirm }) {
+                    if (confirm) {
+                        uni.navigateTo({
+                            url: '/store/deliveryAddress/index'
+                        })
+                        that.$Http.selectAddress = (item) => {
+                            uni.showModal({
+                                title: '提示',
+                                content: `是否确定选择“${item.address}”作为收货地址?`,
+                                success: (success) => {
+                                    if (success.confirm) that.$Http.basic({
+                                        id: "2024052910464202",
+                                        content: {
+                                            sa_awardmxid: item.sa_awardmxid,
+                                            name: item.name,
+                                            phonenumber: item.phonenumber,
+                                            province: item.province,
+                                            city: item.city,
+                                            county: item.county,
+                                            address: item.address,
+                                        }
+                                    }).then(s => {
+                                        if (that.cutoff(s.msg, '设置成功', true, '1000')) return;
+                                    })
+                                },
+                            })
+                        }
                     }
+                },
+                fail: (err) => {
+                    console.log(err)
                 }
+            });
+        },
+        getWinningList() {
+            this.$Http.basic({
+                "content": {
+                    "sa_awardid": this.sa_awardid,
+                    "pageNumber": 1,
+                    "pageSize": 20
+                },
+                "id": 20240514133902
             }).then(res => {
-                console.log("抽奖可用次数", res)
+                console.log("中奖人员", res)
                 if (this.cutoff(res.msg)) return;
-                this.usableCount = res.data.length ? res.data[0].count : 0;
+                if (res.data.length < 7) {
+                    let len = res.data.length;
+                    for (let index = 0; index < (7 - len); index++) {
+                        res.data.push({})
+                    }
+                }
+                this.winningList = res.data;
             })
         },
-        startCallBack() {
-            console.log("开始抽奖")
-            this.$refs.myLucky.play()
-            setTimeout(() => {
-                // 假设后端返回的中奖索引是0
-                const index = 0
-                // 调用stop停止旋转并传递中奖索引
-                this.$refs.myLucky.stop(index)
-            }, 3000)
+        queryAwardCount() {
+            if (uni.getStorageSync('userMsg').usertype == 99) {
+                this.$Http.basic({
+                    "classname": "sysmanage.develop.datafunction.datafunction",
+                    "method": "execute",
+                    "content": {
+                        "functionname": "queryAwardCount",
+                        "parameter": {
+                            "sa_awardid": this.sa_awardid
+                        }
+                    }
+                }).then(res => {
+                    console.log("抽奖可用次数", res)
+                    if (this.cutoff(res.msg)) return;
+                    this.usableCount = res.data.length ? res.data[0].count : 0;
+                })
+            } else {
+                this.tips = '内部人员不可参与抽奖';
+            }
         },
         endCallBack(prize) {
             console.log("抽到的奖品", prize)
@@ -164,15 +293,36 @@ export default {
             vertical-align: bottom;
         }
 
-
         .lottery {
             position: absolute;
             width: 100%;
             z-index: 2;
             top: 140px;
         }
+
+        .usable-count {
+            position: absolute;
+            bottom: 15px;
+            width: 100vw;
+            text-align: center;
+            font-family: Source Han Sans SC, Source Han Sans SC;
+            font-weight: bold;
+            font-size: 14px;
+            color: #FFFFFF;
+
+            .count {
+                height: 29px;
+                font-family: Source Han Sans SC, Source Han Sans SC;
+                font-weight: 800;
+                font-size: 20px;
+                color: #FAD96D;
+                padding: 0 10px;
+            }
+        }
     }
 
+
+
     .winners-list {
         width: 100vw;
         display: flex;
@@ -241,8 +391,5 @@ export default {
             }
         }
     }
-
-
-
 }
 </style>

store/lottery/shareable.vue

@@ -10,12 +10,13 @@ export default {
     components: { sudoku },
     data() {
         return {
-            sa_awardid: 2,
+            sa_awardid: 0,
             shareuserid: 0,
+            detail: {},
         }
     },
     onLoad(options) {
-        this.sa_awardid = options.id || 2;
+        this.sa_awardid = options.id || 0;
         this.shareuserid = options.userid || 0;
         uni.setNavigationBarTitle({
             title: '活动抽奖'
@@ -28,10 +29,26 @@ export default {
                 "sa_awardid": this.sa_awardid,
             }
         }).then(res => {
-            console.log("奖品详情", res)
+            console.log("抽奖详情", res)
             if (this.cutoff(res.msg)) return;
+            this.detail = res.data;
+            this.$refs.sudoku.init();
         })
-        this.$refs.sudoku.init();
+    }, methods: {
+        getSheraDate() {
+            let detail = this.detail;;
+            return {
+                title: detail.name, // 标题
+                path: "/store/lottery/shareable?sa_awardid=" + detail.sa_awardid + '&shareuserid=' + uni.getStorageSync('userMsg').userid, // 分享路径
+                imageUrl: ""// 分享图
+            };
+        }
+    },
+    onShareAppMessage() {
+        return this.getSheraDate()
+    },
+    onShareTimeline() {
+        return this.getSheraDate()
     }
 }
 </script>

store/lottery/unshareable.vue

@@ -1,6 +1,6 @@
 <template>
     <view>
-        <sudoku />
+        <sudoku ref="sudoku" :sa_awardid="sa_awardid" :shareuserid="shareuserid" />
     </view>
 </template>
 
@@ -10,14 +10,31 @@ export default {
     components: { sudoku },
     data() {
         return {
-
+            sa_awardid: 0,
+            shareuserid: 0,
+            detail: {},
         }
     },
-    onLoad() {
+    onLoad(options) {
+        this.sa_awardid = options.id || 0;
+        this.shareuserid = options.userid || 0;
         uni.setNavigationBarTitle({
             title: '活动抽奖'
         });
-    }
+    },
+    onShow() {
+        this.$Http.basic({
+            "id": 20240514101502,
+            "content": {
+                "sa_awardid": this.sa_awardid,
+            }
+        }).then(res => {
+            console.log("抽奖详情", res)
+            if (this.cutoff(res.msg)) return;
+            this.detail = res.data;
+            this.$refs.sudoku.init();
+        })
+    },
 }
 </script>