TP5 layui 陣列表格 分頁(返回全部資料，再加上陣列分頁)
阿新 • • 發佈：2018-12-14
layui 陣列表格 分頁問題，如果返回是全部資料,layui分頁就不能用,
因為layui是通過介面只會取得需要的那一頁的資料，不會多返回其它陣列
一、用例子說明：
4.5 獲取課堂錄製下的所有課件
展示互動返回直播的所有回放列表，展示互動是直接返回該直播的所有回放列表，不能讀哪一頁資料返回那一頁資料
所以要分頁，就要用到PHP本身的陣列分頁功能
1.模板
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <title>直播加放視訊列表</title> <link rel="stylesheet" href="__STATIC__/layui/css/layui.css" media="all"> <script src="__STATIC__/layui/layui.js"></script> </head> <body style="background-color: #FFFFFF;"> <!-- 你的HTML程式碼 --> <!-- 表格 --> <div class="layui-fluid" > <div class="demoTable" style="margin:20px 0"> <div class="layui-inline"> <input class="layui-input" name="limit" id="limit" style="width: 50px;" placeholder="行數" value="{empty name="limit"}10{else /}{$limit}{/empty}" > </div> <div class="layui-inline layui-form"> <select name="sotype" id="sotype" lay-search> <option value="">請選擇搜尋型別</option> <option value="title" {if $sotype == "title" }selected {/if}>標題</option> </select> </div> <div class="layui-inline"> <input class="layui-input" name="sotitle" id="sotitle" value="{$sotitle}"> </div> <button class="layui-btn" id="sear" data-type="reload" type="button">搜尋</button> </div> <div class="layui-btn-group demoTable" style="margin-top: 10px;"> <table class="layui-hide" id="demo" lay-filter="demo"></table> <script type="text/html" id="switchTpl"> <!-- 這裡的 checked 的狀態只是演示 --> <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="女|男" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}> </script> <script type="text/html" id="checkboxTpl"> <!-- 這裡的 checked 的狀態只是演示 --> <input type="checkbox" name="lock" value="{{d.id}}" title="鎖定" lay-filter="lockDemo" {{ d.id == 10006 ? 'checked' : '' }}> </script> </div> <script type="text/html" id="barDemo"> <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="distributionuser">分配</a> <a class="layui-btn layui-btn-xs" lay-event="edit">編輯</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" onclick="{:url('del',array('id'=>$admin['id']))}')">刪除</a> </script> </div> <!-- 表格end --> <script> layui.use(['layer', 'form','jquery','table'], function(){ var layer = layui.layer ,form = layui.form ,$= layui.$ ,table=layui.table; table.render({ elem: '#demo' ,url: '{:url('look_live_video_list')}' ,where:{action:'liveroomtable',id:{$id}} //,limit:2 ,cellMinWidth: 80 ,cols: [[ {type:'numbers'} ,{field:'id', title:'課件ID', width:70} ,{field:'number', title:'編號', width:120} ,{field:'url', title:'課件的URL', width:120} ,{field:'subject', title:'課件名字', width:120} ,{field:'roomId', title:'所屬課堂名稱', width:120} ,{field:'recordId', title:' 資源ID', width:120} ,{field:'token', title:'課件口令', width:120} ,{field:'createdTime', title:'建立時間', width:120} ]] ,page: true }); //排序 table.on('sort(demo)', function(obj){ //注：tool是工具條事件名，test是table原始容器的屬性 lay-filter="對應的值" //儘管我們的 table 自帶排序功能，但並沒有請求服務端。 //有些時候，你可能需要根據當前排序的欄位，重新向服務端傳送請求，如： table.reload('demo', { initSort: obj //記錄初始排序，如果不設的話，將無法標記表頭的排序狀態。 layui 2.1.1 新增引數 ,where: { //請求引數 field: obj.field //排序欄位 ,order: obj.type //排序方式 } }); }); //監聽工具條 table.on('tool(demo)', function(obj){ var data = obj.data; if(obj.event === 'look'){ //layer.alert('編輯行：<br>'+ JSON.stringify(data)) layer.ready(function(){ layer.open({ type: 2, title: '編輯', maxmin: false, area: ['80%', '70%'], content: '{:url('edit')}?id='+data.id, cancel: function(){ //重新整理網頁 //table.reload('idTest');//重新載入表格資料 self.location='{:url('index')}'; } }); }); } }); var $ = layui.$, active = { //搜尋 reload: function(){ var demoReload = $('#sotitle').val(); table.reload('demo', { where: { sotype: $("#sotype").val() ,limit: $('#limit').val() ,sotitle: $('#sotitle').val() ,starttime: $('#starttime').val()/*建立 開始時間*/ ,enttime: $('#enttime').val()/*建立 結束時間*/ } }); } }; $('.demoTable .layui-btn').on('click', function(){ //$(document).on('click','#sear',function(){ var type = $(this).data('type'); active[type] ? active[type].call(this) : ''; }); //按enter鍵進行查詢 $(document).keyup(function(event){ if(event.keyCode==13){ var type = $("#sear").data('type'); active[type] ? active[type].call(this) : ''; } }); }); </script> </body> </html>
2.控制器
/** * 回放列表-伺服器返回的資料 觀看直播回放 */ public function look_live_video_list(){ $id=input('id'); $page=input('page'); $limit=input('limit'); $this->assign('id',$id); $action=input('action'); if(!$id){ echo "錯誤：必要引數不能為空！";die; } if($action=="liveroomtable"){ //判斷是否已經生成回放/取得實時課堂ID $rs_live=Db::name('live_course')->where('id',$id)->find(); //先判斷是那個直播供應商 1展視互動 2保利威視 $live_type=checkRepeat('system_setup',5,1,'value',1);//點播初始化 if($live_type==1){// 1展視互動 $roomid=$rs_live['field1'];//實時課堂ID if(!$roomid){ echo "錯誤：直播課堂ID為空,沒有生成直播間！";die; } //4.5 獲取課堂錄製下的所有課件 取得伺服器上的課件ID //取得帳號、密碼、介面路徑 $loginName=checkRepeat('system_setup',2,1,'value',1);//展視互動 loginName $password=checkRepeat('system_setup',3,1,'value',1);//展視互動 password $url_1=checkRepeat('system_setup',4,1,'value',1);//展視互動 介面網址 //獲取課堂錄製下的所有課件 只要取得課件ID // $url = 'http://jysjsz.gensee.com/integration/site/training/room/deleted'; $url1=$url_1;//http://jysjsz.gensee.com/integration/site/ $url2="training/courseware/list";//介面路徑 獲取課堂錄製下的所有課 $url =$url1.$url2;//組合成完整介面網址 //dump($password); $post_data = array ( 'loginName' => $loginName,//登入名 'password' => $password,//密碼 'roomId' => $roomid,//實時課堂ID 刪除專用 ); $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $url); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); // 設定請求為post型別 curl_setopt($ch, CURLOPT_POST, 1); // 新增post資料到請求中 curl_setopt($ch, CURLOPT_POSTFIELDS, $post_data); // 執行post請求，獲得回覆 $response= curl_exec($ch); curl_close($ch); //echo $response; //錯誤資訊提示 if ($response === FALSE) {//沒有取得返回資料 echo "cURL 具體出錯資訊: " . curl_error($ch);die; } //取得返回陣列 $jsonStr=$response; $arr = json_decode($jsonStr, true); $code = $arr['code'];//返回結果程式碼 $count =count($arr['coursewares']); // $live_12 =$arr['coursewares'][0]['number'];//課件編號 // $live_13 =$arr['coursewares'][0]['url'];//課件的 URL if($code!=0){//0等於成功 echo "錯誤".$code."：獲取課件ID失敗,原因:".$arr['message'];die; //exit; } //取得錄播記錄陣列 $array = $arr['coursewares']; $data=page_array($limit,$page,$array,0); //$count=1000; json(0,'資料返回成功',$count,$data); //dump($arr) ;die; // return $arr;die; }elseif($live_type==2){//2保利威視 }else{ } } return view(look_live_video); }
注意：php陣列分頁函式
$data=page_array($limit,$page,$array,0);
/** * 陣列分頁函式 核心函式 array_slice * 用此函式之前要先將資料庫裡面的所有資料按一定的順序查詢出來存入陣列中 * $count 每頁多少條資料 * $page 當前第幾頁 * $array 查詢出來的所有陣列 * order 0 - 不變 1- 反序 */ function page_array($count,$page,$array,$order){ global $countpage; #定全域性變數 $page=(empty($page))?'1':$page; #判斷當前頁面是否為空 如果為空就表示為第一頁面 $start=($page-1)*$count; #計算每次分頁的開始位置 if($order==1){ $array=array_reverse($array); } $totals=count($array); $countpage=ceil($totals/$count); #計算總頁面數 $pagedata=array(); $pagedata=array_slice($array,$start,$count); return $pagedata; #返回查詢資料 }