offset usage (sliding load)

Disclaimer: This article is a blogger original article, follow the CC 4.0 BY-SA copyright agreement, reproduced, please attach the original source link and this statement.
This link: https://blog.csdn.net/qq_42154707/article/details/90640910

First: select * from table limit 10,5;                 

The meaning of Article 10 // skip extracted five data read out from the start limit rear section 10, reads information 5, i.e. the data read 5

第二: select * from table limit 10 offset 5;      

// remove the meaning of Article 5 is started (exclusive) data from the data 10, 10 with the rear limit of data, the start offset is read from the back section 5, i.e., read the first article 6--10

The first Needless to say, today the Lord said second offset lower usage (paging), directly on the code:

 

From Loading, No data to (sliding load)

Page JS

<script>
    $(function(){
        var itemIndex = 0;
        var tab1LoadEnd = false;
        var page = 1;
        var type = '<?php echo Yii::$app->request->get("type") ? Yii::$app->request->get("type") : 1 ?>';

        // tab
        $('.gtable').on('scroll',function(){
            var $this = $(this);
            itemIndex = $this.index();
            // // 如果数据没有加载完
            if(!tab1LoadEnd){
                // 解锁
                dropload.unlock();
                dropload.noData(false);
            }else{
                // 锁定
                dropload.lock('down');
                dropload.noData();
            }
            // 重置
            dropload.resetload();
        });

        // dropload
        var dropload = $('#blockBuy').dropload({
            scrollArea : window,
            loadDownFn : function(me){
                // 加载菜单一的数据
                page++;
                var $url = '/trade/showadd.html?pay_type='+ type +'&page='+ page;
                $.ajax({
                    type: 'GET',
                    url: $url,
                    dataType: 'json',
                    success: function(data){
                        if(data.data != null && data.data.length > 0){
                            var result = '';
                            for(var i = 0; i < data.data.length; i++) {
                                result += '<li class="reitem"><div class="reile"><img src="/<?php echo $user_info['icon']; ?>" alt="" class="reilimg" /></div><div class="reilr"><p class="reilt"><span class="reilte"><?php echo $user_info['username']; ?></span><span class="reiltr on">' + data.data[i]['amount'] + '</span></p><p class="reilt"><span class="reilte">UID:<?php echo $user_info['userid']; ?></span><span class="reiltr">' + data.data[i]['created_at'] + '</span></p></div></li>';
                            }
                        }else{
                            // 数据加载完
                            tab1LoadEnd = true;
                            // 锁定
                            me.lock();
                            // 无数据
                            me.noData();
                        }
                        // 为了测试,延迟1秒加载
                        setTimeout(function(){
                            $('.lists').eq(itemIndex).append(result);
                            // 每次数据加载完,必须重置
                            me.resetload();
                        },1000);
                    },
                    error: function(err){
                        //alert('Ajax error!');
                        // 即使加载出错,也得重置
                        // me.resetload();
                    }
                });
            }
        });
    });
</script>

Controller

    public function actionShowrecord () {
        $this->layout = false;
        $type = HtmlPurifier::process(Yii::$app->request->get('type'));
        $userid = Yii::$app->user->id;
        $key = $userid."language";
        $lang = Yii::$app->cache->get($key);
        if($type == 1) {
            $event_type = 33;
            $wallet_type = 3;
            $html_type = 'fudou_record';
        } elseif ($type ==2) {
            $event_type = 34;
            $wallet_type = 4;
            $html_type = 'fubi_record';
        } else {
            echo "<script>alert('类型错误')</script>";
            exit;
        }
        $record = WB_UserWalletRecord::getMyRecord($userid,$event_type,$wallet_type);
        if($type == 1){
            $sendType = Yii::t("app","福豆记录");
        }else if($type == 2){
            $sendType = Yii::t("app","福币记录");
        }else{
            echo "<script>alert('类型错误')</script>";
            exit;
        }
        $user_info = WB_UserProfile::find()->where(['userid'=>$userid])->one();
        return $this->render('fudou_record',["record" => $record, 'title' => $sendType,'lang'=>$lang,'user_info'=>$user_info]);
    }
    //  转让福豆记录列表加载
    public function actionShowadd(){

        $userid = Yii::$app->user->id;
        $type = HtmlPurifier::process(Yii::$app->request->get('pay_type'));
        if($type == 1) {
            $event_type = 33;
            $wallet_type = 3;
        } elseif ($type ==2) {
            $event_type = 34;
            $wallet_type = 4;
        } else {
            echo "<script>alert('类型错误')</script>";
            exit;
        }
        // 获取订单列表
        $tradeList = WB_UserWalletRecord::getMyRecord($userid,$event_type,$wallet_type);
        return json_encode($tradeList, true);
    }

model

public static function getMyRecord($userid,$event_type,$wallet_type) {
        $query = WB_UserWalletRecord::find()->where("userid = :userid",[":userid"=>$userid])->orderBy("created_at desc");
        if ($event_type > 0) {
            $query->andFilterWhere(["=","event_type",$event_type]);
        }
        if ($wallet_type > 0) {
            $query->andFilterWhere(["=","wallet_type",$wallet_type]);
        }
        $countQuery = clone $query;
        $pagesize = 10;
        $pager = new \yii\data\Pagination(['totalCount' => $countQuery->count(), 'defaultPageSize' => $pagesize]);
        $offset = (Yii::$app->request->get("page")-1)*$pagesize;
        $limit = Yii::$app->request->get("limit",$pagesize);
        $res = $query->offset($offset)->limit($limit)->asArray()->all();
        $temp=[];
        foreach($res as $item){
            $temp[]=[
                "created_at"=>date("Y/m/d",$item['created_at']),
                "event_type"=> self::$event_type[$item["event_type"]],
                "amount"=>$item["pay_type"]==1?$item["amount"]:"-".$item["amount"],
                "wallet_type"=>self::$wallet_type[$item["wallet_type"]],
            ];
        }
        return ["pager" => $pager, "data" => $temp];
    }

This completes the loading effect of sliding, each load 10 (slide upward loading a plurality 10, until all loading).

Guess you like

Origin blog.csdn.net/qq_42154707/article/details/90640910
Recommended