每一天登录达成

日历界面.png

  69元的稻草人钱包不要钱啊有木有→_→

3.Js实现

最主如若签到点击,历史签到收获,日历切换3片段

 $(function () {

            var isSwiper = true;

            var calendar = new DuCalendar('signDate');
            calendar.init();

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $(".qiandao-btn").on("click", ".qd-btn", function (e) {
                e.preventDefault();
                if (!$(".qd-btn").hasClass("disabled")) {

                    $.ajax({
                        method: "POST",
                        url: "/sign_in",
                        dataType: "json",
                        success: function (data) {

                            if (data.success) {
                                $(".continue > span > em").html(parseInt($(".continue > span > em").html()) + 1);
                                $(".sum > span > em").html(parseInt($(".sum > span > em").html()) + 1);
                                $(".read > span > em").html(parseInt($(".read > span > em").html()) + 1);


                                $(".qd-btn").addClass("disabled").html("已签到");

                                var tip = $(".qd-btn").parent().find(".hasqiandao");
                                tip.addClass("active");
                                var timeout = setTimeout(function () {
                                    tip.removeClass("active");
                                }, 2000);
                            } else {
                                alert(data.msg);
                            }
                        },
                        error: function (xhr, type) {
                            alert("未连接到服务器");
                        }
                    });
                } else {
                    return;
                }
            });

            var myswiper = new Swiper('.swiper-container', {
                direction: 'vertical',
                height: window.innerHeight,
                onSlideChangeEnd: function (swiper) {
                    if (swiper.isEnd) {
                        $(".jiantou").hide();
                        $(".jiantou2").show();

                        if (isSwiper) {
                            var overlay = iosOverlay({
                                text: "Loading",
                                duration: 20e3,
                                icon: "/packages/common/iosOverlay/img/load.gif"
                            });

                            $.ajax({
                                method: "POST",
                                data: {month: calendar.month},
                                url: "/sign_calendar",
                                dataType: "json",
                                success: function (data) {

                                    if (data.success) {
                                        var signs = data.data;
                                        var ids = "#day_8888";
                                        for (var i = 0; i < signs.length; i++) {
                                            var date = new Date(signs[i].created_at);
                                            ids = ids + " ,#day_" + date.getDate();
                                        }
                                        $(ids).remove("today");
                                        $(ids).addClass("today");

                                        overlay.update({
                                            icon: "/packages/common/iosOverlay/img/check.png",
                                            text: data.msg
                                        });
                                        isSwiper = false;

                                    } else {
                                        overlay.update({
                                            icon: "/packages/common/iosOverlay/img/cross.png",
                                            text: data.msg
                                        });
                                    }
                                },
                                error: function (xhr, type) {
                                    overlay.update({
                                        icon: "/packages/common/iosOverlay/img/cross.png",
                                        text: "服务器连接错误"
                                    });
                                }
                            });
                        }
                    } else {
                        $(".jiantou2").hide();
                        $(".jiantou").show();
                    }
                },
            });

        });

日历切换获得历史数据rxhluck写的早已封装的基本上了,扩大一下就好

//初始化属性数据
DuCalendar.prototype.getData = function () {
    var overlay = iosOverlay({
        text: "Loading",
        duration: 20e3,
        icon: "/packages/common/iosOverlay/img/load.gif"
    });

    $.ajax({
        method: "POST",
        data: {month: this.month},
        url: "/sign_calendar",
        dataType: "json",
        success: function(data){

            if(data.success){
                var signs = data.data;
                var ids = "#day_8888";
                for (var i = 0;i<signs.length;i++){
                    var date =  new Date(signs[i].created_at);
                    ids = ids+" ,#day_"+ date.getDate();
                }
                $(ids).remove("today");
                $(ids).addClass("today");

                overlay.update({
                    icon: "/packages/common/iosOverlay/img/check.png",
                    text: data.msg
                });

            }else{
                overlay.update({
                    icon: "/packages/common/iosOverlay/img/cross.png",
                    text: data.msg
                });
            }


        },
        error: function(xhr, type){
            overlay.update({
                icon: "/packages/common/iosOverlay/img/cross.png",
                text: "服务器连接错误"
            });
        }
    });
}

//左键
    this.leftBtn.onclick=function(){
        _tag--
        var dateObj;
        if(_tag == 0){
            dateObj = new Date();
        }else{
            var y = parseInt(This.year);
            var m = parseInt(This.month)-1;
            if(m<0){
                m = 11 ;
                y--;
            }
            dateObj = new Date(y,m,1);
        }

        This.addProDate(dateObj);
        This.showType();
        This.addTable();
        This.getData();
    }



    //右键
    this.rightBtn.onclick=function(){
         _tag++
        var dateObj;
        if(_tag == 0){
            dateObj = new Date();
        }else{
            var y = parseInt(This.year);
            var m = parseInt(This.month)+1;
            if(m>11){
                m = 0;
                y++;
            }
            var dateObj = new Date(y,m,1);
        }

        This.addProDate(dateObj);
        This.showType();
        This.addTable();
        This.getData();
    }

图片 1

签到页面.png

 
这个都以抵扣的货物,货已收取,品质都很好。以后果子的淘金币基本上就清零了每一日起来签到啊啊啊啊,可是自身也希看着下1次的移位,一起加油吧,盆友们。

4.后端Laravel写接口

界面起始化

/***
     * 每日签到查询
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function sign(){
        $title = '每日签到';

        $user = session('user');
        $user = Users::find($user->id);
        if($user->apply_state != 5){
            return redirect()->route('returnBlade', ['您还不是党员,需要先进行报道。', 'dybd']);
        }

        $f_countsign = DB::select('SELECT f_countsign_days(:id,:date) as countsign', ['id' => $user->id,'date'=> date("Y-m-d ", time())]);

        $f_countsign = $f_countsign[0]->countsign;

        $countYear = Signs::where('users_id','=',$user->id)->whereBetween('created_at', [
            date("Y",time())."-01-01 00:00:00",
            date("Y",strtotime("+1 year"))."-12-31 23:59:59"
        ])->count();
        $countMonth = Signs::where('users_id','=',$user->id)->whereBetween('created_at', [
            date("Y-m-01",time())." 00:00:00",
            date("Y-m-t",time())." 23:59:59"
        ])->count();
        $countSigns = Signs::where('users_id','=',$user->id)->whereBetween('created_at', [
            date("Y-m-d",time()),
            date("Y-m-d",strtotime("+1 day"))
        ])->count();

        if($countSigns>0){
            $f_countsign++;
        }

        return view('mobile.sign', [
            'title'=>$title,
            'user'=>$user,
            'f_countsign'=>$f_countsign,
            'countSigns'=>$countSigns,
            'countYear'=>$countYear,
            'countMonth'=>$countMonth]);
    }

签到Ajax

/***
     * 每日签到
     * @return array
     */
    public function sign_in(){

        $user = session('user');
        $countSigns = Signs::where('users_id','=',$user->id)->whereBetween('created_at', [
            date("Y-m-d",time()),
            date("Y-m-d",strtotime("+1 day"))
        ])->count();
        if($countSigns == 0){

            DB::transaction(function () use ($user) {
                $integral =  new Integrals();
                $integral->name = config('bgjd.sign')[0]['name'];
                $integral->integral = config('bgjd.sign')[0]['integral'];
                $integral->users_id = $user->id;
                $integral->save();

                $sign = new Signs();
                $sign->name = config('bgjd.sign')[0]['name'];
                $sign->users_id = $user->id;
                $sign->integrals_id = $integral->id;
                $sign->save();
            });

            $res = ['success'=>true,'msg'=>'签到成功'];

        }else{
            $res = ['success'=>false,'msg'=>'已签到'];
        }
        return $res;
    }

历史月份的登录数据

/***
     * 历史签到查询
     * @param Request $request
     * @return array
     */
    public function sign_calendar(Request $request){

        $data = $request->all();
        $rules = [
            'month'    => 'required'
        ];
        $messages = [
            'month.required'    => '月份必须填写'
        ];

        $validator = Validator($data, $rules, $messages);
        if ($validator->passes()){

            $user = session('user');
            $Signs = Signs::where('users_id','=',$user->id)->whereBetween('created_at', [
                date("Y",time())."-".($data['month']+1)."-01 00:00:00",
                date("Y",time())."-".($data['month']+1)."-".date("t",time())." 23:59:59"
            ])->get();
            if($Signs){
                $res = ['success'=>true,'msg'=>($data['month']+1).'月签到','data'=>$Signs];
            }else{
                $res = ['success'=>false,'msg'=>'已签到'];
            }

        }else{
            $res = ['success'=>false,'msg'=>$validator->messages()->first()];

        }
        return $res;
    }

图片 2

Html手提式有线电话机端上贯彻每一天登录的功能,感激GitHub上的那两位的贡献 ( ^ _ ^
)
签到
https://github.com/zhicaizhu123/qiandao
日历
https://github.com/rxhluck/signDate

   
后天曾有一个淘金币抵扣百分之99的运动,那是什么样概念?也正是不要钱啊啊啊啊…今年自作者只怕率先次看见有那几个运动。如雷贯耳,这种活动,一般人都是在座不了,抢不到的,刚早先抢的时候自个儿也只是抱着试一试的心境,但是依然抢!到!了!后来就邀约广大百姓Honda盆友们一齐参预,才驾驭她们的淘金币不够,参预不了,那也是自己能抢到的缘由之一,别的人淘金币不够,抵扣也抵扣不了。接下来看一下毕竟有多划算。

5.老是签到数据库方法

那么些依旧相比较关键的,所以提一下

BEGIN  
    DECLARE days INT;  
    DECLARE flag INT;  
    DECLARE previous_day DATE;  
    SET days := 0;  
    SET flag := 1;  
    SET previous_day := DATE_SUB(end_time,INTERVAL 1 DAY);  

    WHILE flag>0 DO  
        SELECT COUNT(DISTINCT(DATE(created_at))) INTO flag  FROM  signs   
        WHERE users_id = id   
        AND DATE(created_at) = previous_day ;  
        IF flag > 0 THEN   
            SET days := days + 1;  
            SET previous_day := DATE_SUB(previous_day,INTERVAL 1 DAY);  
        END IF;  
    END WHILE;   
    RETURN days;  
    END

骨干那样就整个完了了,Css就不依附了。

图片 3

1.思路

签到—中重点是用swiper兑现上下滑动切换
日历—中驷马难追是一个钱打二拾6个结了并创设table的当月日历,仍可以左右切换

图片 4

上海体育地方镇楼:

图片 5

2.html界面

    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide">
                <div class="qiandao">
                    <div class="qiandao-content">
                        <div class="qiandao-icon">
                            <div class="hangxian">

                            </div>
                            <div class="icon-circle">
                                <img class="icon-avatar" src="{{$user->avatar}}">
                            </div>
                            <div class="hangxian">

                            </div>
                        </div>
                        <div class="qiandao-text">
                            <p>{{$user->name}}</p>
                        </div>
                        <div class="qiandao-btn">
                            @if($countSigns == 0)
                                <a href="javascript:;" class="qd-btn">点击签到</a>
                            @else
                                <a href="javascript:;" class="qd-btn disabled">已签到</a>
                            @endif

                            <div class="hasqiandao">
                                签到成功

                            </div>
                        </div>
                    </div>
                    <div class="qiandao-desc">
                        <p>每个好习惯都始于点滴积累</p>
                        <p>加入党员之家,蜕变更好的自己。</p>
                    </div>
                    <div class="qiandao-info">
                        <ul>
                            <li class="time continue">
                                <em>{{$f_countsign}}</em>天
                                连续签到
                            </li>
                            <li class="time sum">
                                <em>{{$countMonth}}</em>天
                                当月签到
                            </li>
                            <li class="time read">
                                <em>{{$countYear}}</em>天
                                共计签到
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="swiper-slide">
                <div class="qiandao">
                    <div class="qiandao-detail qiandao-content">
                        <div class="qiandao-icon">
                            <div class="hangxian">

                            </div>
                            <div class="icon-circle">
                                <img class="icon-avatar" src="{{$user->avatar}}">
                            </div>
                            <div class="hangxian">

                            </div>
                        </div>
                        <div class="qiandao-text">
                            <p>{{$user->name}}</p>
                        </div>
                        <div class="qiandao-btn">
                            @if($countSigns == 0)
                                <a href="javascript:;" class="qd-btn">点击签到</a>
                            @else
                                <a href="javascript:;" class="qd-btn disabled">已签到</a>
                            @endif
                            <div class="hasqiandao">
                                签到成功

                            </div>
                        </div>
                    </div>
                    <div class="qiandao-calendar">
                        <div id="signDate">
                            <div class="monthAndyear">



                            </div>
                            <table></table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="jiantou"></div>
    <div class="jiantou2"></div>

    <link rel="stylesheet" href="{{url('packages/common/Swiper-3.3.1/css/swiper.min.css')}}">
    <link rel="stylesheet" href="{{url('packages/common/signDate/css/signDate.css')}}"/>
    <link rel="stylesheet" href="{{url('/packages/common/iosOverlay/css/iosOverlay.css')}}">

    <script src="{{url('packages/common/signDate/js/Calendar.js')}}"></script>
    <script src="{{url('packages/common/Swiper-3.3.1/js/swiper.min.js')}}"></script>
    <script src="packages/common/iosOverlay/js/iosOverlay.js"></script>

本条墙画大概了,真的一级划算,可是买了它之后,小编的淘金币剩下没多少个…

图片 6