当前位置:网站首页>Lottery applet, mother no longer have to worry about who does the dishes (assign tasks), so easy

Lottery applet, mother no longer have to worry about who does the dishes (assign tasks), so easy

2022-04-23 19:19:00 "Technology makes customers"

background

Who's cooking today , Who does the dishes , Who buys vegetables … ah ,Boss Say draw lots , So here's the picture

 draw

This has the problem of cheating ( Remember the characteristics of the stick , Who first? , Who smokes later... Wait ) So there's this little lottery program ( Of course, I control the applet alone , Whether I want to cheat depends on my mood )

brief introduction

Sweep code experience

Data services , Storage

This project uses wechat cloud development , Cloud database declares a lottery chouqianList Assemble ( Cloud development provides developers with complete native cloud support and wechat service support , Weakening back end and O & M concepts , There's no need to set up a server , Use the... Provided by the platform API Develop core business , Fast online and iterative )

Preparation before operation

(1) Sign up for wechat applet , obtain appid, Replace this item project.config.json Inside appid

(2) Open the cloud development of small programs

Concrete realization

home page

 home page

The home page has the theme of drawing lots from top to bottom , Lottery options , Initiate a draw , Often draw lots , The main function of this page is to initiate the drawing of lots , Save the contents of the lottery in the database .

Wechat audit tips

To solve this problem, add content to call this method ( Applet content security api, Cloud development can call )

  isCheckMsg: function (msg) {
        return new Promise(function (n, s) {
            wx.cloud.callFunction({
                name: 'msg',
                data: ({
                    text: msg
                })
            }).then(res => {
                if (res.result.errCode === 87014) {
                    //  Failed to pass 
                    n(false) 
                } else {
                    // (" adopt ")
                    n(true)
                }
            });
        });
    },

Random draw

 //  Recursive random return of lottery items 
    edchouqian() {
        let that = this;
        return new Promise(function (n, s) {
            const db = wx.cloud.database()
            //  Query all of the current user's  chouqianList
            db.collection('chouqianList').where({
                _id: that.data.drawlotsId
            }).get({
                success: res => {
                    that.setData({
                        detail: res.data[0].detail,
                    });
                    let nullDetail = res.data[0].detail.filter(item => item.openid == "");// Find out the options without drawing lots 
                    let arrIndex = Math.floor((Math.random() * nullDetail.length));// Choose one option at random from options that don't have lots 
                    let objindex = nullDetail[arrIndex].index;
                    n(objindex)
                },
                fail: err => {
                    wx.showToast({
                        icon: 'none',
                        title: ' Query record failed '
                    })
                    console.error('[ database ] [ Query log ]  Failure :', err);
                    s(err);
                }
            })
        });
    },

Lottery page

 Lottery page

The drawing tab has the function of drawing lots , Show the draw results , The main functions of this page , Query from the database whether the lot has been drawn , Lots have been drawn to show the results of the draw , Random allocation of lots without drawing lots ( Or show that the number of lots has been used up ).

For the problem of repeated lottery, use function anti shake or throttling

Draw results page

 Draw results page

Draw results page , Show all the people who drew the lot and the results ( The results are obtained from the database according to the results of the drawing table id Inquire about )

That's it Source code address

Conclusion :

Because the hair time is relatively short , page 、 The function needs to be improved slowly , The released features also have some areas to be improved , Welcome the same like-minded coders to give more advice and exchange .ヾ(*╹◡╹)ノ~

Front end learning bosses 493671066, Many beauties . Old driver, get in the car , It's too late to explain .

Author correlation Vue article

be based on Vue2.0 Realize the authority control of background system

vue2.0- be based on elementui Skin peeler ( Custom theme )

Front end document summary

VUE2.0 Add, delete, change, check, attach, edit, add model( bounced ) Component sharing

Reward Heartfelt thanks

 Reward

版权声明
本文为["Technology makes customers"]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/04/202204210559121039.html