LayUI搜索優化、列表顯示和刪除功能 [TOC] ## 一、列表顯示優化 ### 1、后臺處理 影片列表 ~~~ public function index(){ $data['pageSize'] = 15; $data['page'] = max(1,(int)input('get.page')); $data['wd'] = trim(input('get.wd')); $where = array(); $data['wd'] && $where = 'title like "%'.$data['wd'].'%"'; $data['data'] = $this->db->table('video')->where($where)->order('id desc')->pages($data['pageSize']); // 關聯查詢公共屬性名稱 $label_ids = []; foreach ($data['data']['lists'] as $item) { !in_array($item['channel_id'],$label_ids) && $label_ids[] = $item['channel_id']; !in_array($item['charge_id'],$label_ids) && $label_ids[] = $item['charge_id']; !in_array($item['area_id'],$label_ids) && $label_ids[] = $item['area_id']; } $label_ids && $data['labels'] = $this->db->table('video_label')->where('id in('.implode(',',$label_ids).')')->cates('id'); $this->assign('data',$data); return $this->fetch(); } ~~~ ### 2、模板渲染 ~~~ <tbody> {volist name="data.data.lists" id='vo'} <tr> <td>{$vo.id}</td> <td>{:isset($data['labels'][$vo['channel_id']])?$data['labels'][$vo['channel_id']]['title']:''}</td> <td>{:isset($data['labels'][$vo['charge_id']])?$data['labels'][$vo['charge_id']]['title']:''}</td> <td>{:isset($data['labels'][$vo['area_id']])?$data['labels'][$vo['area_id']]['title']:''}</td> <td>{$vo.title}</td> <td>{$vo.pv}</td> <td>{$vo.score}</td> <td>{$vo.status==0?'<span style="color:red">下線</span>':'正常'}</td> <td>{:date('Y-m-d H:i:s',$vo.add_time)}</td> <td> <button class="layui-btn layui-btn-xs" onclick="add({$vo.id})">編輯</button> <button class="layui-btn layui-btn-danger layui-btn-xs" onclick="del({$vo.id})">刪除</button> </td> </tr> {/volist} </tbody> ~~~ ## 二、刪除 刪除前彈出確認按鈕 ### 1、HTML結構 ~~~ <tbody> {volist name="data.data.lists" id='vo'} <tr> <td>{$vo.id}</td> <td>{:isset($data['labels'][$vo['channel_id']])?$data['labels'][$vo['channel_id']]['title']:''}</td> <td>{:isset($data['labels'][$vo['charge_id']])?$data['labels'][$vo['charge_id']]['title']:''}</td> <td>{:isset($data['labels'][$vo['area_id']])?$data['labels'][$vo['area_id']]['title']:''}</td> <td>{$vo.title}</td> <td>{$vo.pv}</td> <td>{$vo.score}</td> <td>{$vo.status==0?'<span style="color:red">下線</span>':'正常'}</td> <td>{:date('Y-m-d H:i:s',$vo.add_time)}</td> <td> <button class="layui-btn layui-btn-xs" onclick="add({$vo.id})">編輯</button> <button class="layui-btn layui-btn-danger layui-btn-xs" onclick="del({$vo.id})">刪除</button> </td> </tr> {/volist} </tbody> ~~~ ### 2、功能實現 ~~~ <script type="text/javascript"> layui.use(['layer','laypage'],function(){ layer = layui.layer; $ = layui.jquery; }); // 刪除 function del(id){ layer.confirm('確定要刪除嗎？', { icon:3, btn: ['確定','取消'] }, function(){ $.post('/admins.php/admins/video/delete',{'id':id},function(res){ if(res.code>0){ layer.alert(res.msg,{icon:2}); }else{ layer.msg(res.msg); setTimeout(function(){window.location.reload();},1000); } },'json'); }); } </script> ~~~