博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
CI 结合 vue.js 的搜索功能模块
阅读量:5816 次
发布时间:2019-06-18

本文共 5598 字,大约阅读时间需要 18 分钟。

 

CI 结合 vue.js 的搜索功能模块

   最近在有优化公司后台的某个模块的搜索功能优化

    原先的是这个样子的,很是单调:

       

    

    老大给我找个图希望我能弄成这样子:

  

 

    经过不断修改,最后成了这样子

 

  是不是比以前好看了,虽然页面出了,单是功能却不是那么好做,我页面的请求是用ajax get 方式进行的,这里是vue 的前端页面

新增

  前端的js

search:function(){                    var _seft = this;                    //拼接cur                    if(_seft.lid){ var lid = "&lid="+_seft.lid;           }else{  var lid = "&lid="+'';       }                    if(_seft.pname){ var pname = "&pname="+_seft.pname;   }else{  var pname = "&pname="+'';   }                    if(_seft.title){ var title = "&title="+_seft.title;   }else{  var title = "&title="+'';   }                    if(_seft.uid){   var uid = "&uid="+_seft.uid;         }else{  var uid = "&uid="+'';       }                    if(_seft.line_star){  var line_star = "&line_star="+_seft.line_star;         }                    //拼接导航                                        var url = "
"+lid+pname+title+uid+line_star; _seft.showdata(url,1); },

 

这里是后端的逻辑代码

public function Apilists(){        $get = $this->input->get();        $this->load->model('MemberModel','Member_model');        //根据线路ID        if(!empty($get['lid'])){            $where = "lid like '%{$get['lid']}%' ";        }        //根据供应商        if(!empty($get['pname']) && !empty($get['lid'])){             $where =  $where." AND pname like '%{$get['pname']}%' ";        }        if(!empty($get['pname']) && empty($get['lid'])){             $where =  " pname like '%{$get['pname']}%' ";        }                //根据标题        if(!empty($get['title']) && !empty($get['pname'])){             $where =  $where." AND mainname like '%{$get['title']}%' ";        }        if(!empty($get['title']) && empty($get['lid']) && empty($get['pname'])){             $where =  " mainname like '%{$get['title']}%' ";        }        //根据发布人        if(!empty($get['uid'])  && !empty($get['title'])) {             $resu = $this->Member_model->GetinfoByname($get['uid']);             $where =  $where." AND uid = '{$resu['uid']}' ";        }        if(!empty($get['uid']) && empty($get['lid']) && empty($get['pname']) && empty($get['title'])){             $resu = $this->Member_model->GetinfoByname($get['uid']);             $where =  " uid = '{$resu['uid']}' ";        }        if( $this->userinfo['username'] != 'admin' ){            if(!empty($where)){                 $where =  $where.' And uid = '.$this->userinfo['uid'];             }else{                 $where =  ' uid = '.$this->userinfo['uid'];             }        }        //是否上线        if($get['line_star']=='2' && !empty($get['title']) ){             $where =  $where." AND status = '0' ";        }        if($get['line_star']=='1' && !empty($get['title']) ){             $where =  $where." AND status = '1' ";        }        if($get['line_star']=='2' && empty($get['pname']) && empty($get['title'])){             $where = " status = 0 ";        }        if($get['line_star']=='1' && empty($get['pname']) && empty($get['title'])){             $where = " status = 1 ";        }        //如果没有条件就全部查询        if(empty($get['lid']) && empty($get['pname']) && empty($get['title']) && empty($get['uid']) && $get['line_star']!='2' && $get['line_star']!='1' ){            $where = "1 = 1";        }        //分页        $page  = isset($get['page'])? $get['page']:1;               $totalCount  = $this->Line_model->Count_by($where);        $pagenums = 18;        $data['pageCount'] =  ceil($totalCount/$pagenums);//总页数        $lists = $this->Line_model->Limit( $pagenums,($page-1)*$pagenums )->order_by("addtime",'desc')->getlist_by($where);        // var_dump($this->db->last_query());        $data['lists'] = array();                foreach ( $lists as $k => $v) {            $data['lists'][$k]['lid']     = $v['lid'];            $data['lists'][$k]['pname']   = $v['pname'];            $data['lists'][$k]['title']   = $v['mainname'];            $data['lists'][$k]['uid']     = $this->Member_model->GetNameByUid($v['uid'],'username');            $data['lists'][$k]['typeid']  = $this->Linetype_model->TypeNameBytid($v['typeid']);            $data['lists'][$k]['status']  = $v['status'];            $data['lists'][$k]['market_price']  = $v['market_price'];            $data['lists'][$k]['tui']     = biaoqian($v['tui']);            $data['lists'][$k]['addtime'] = date("Y-m-d H:i:s",$v['addtime']);        }                 $this->ajaxReturn($data);    }

 

 这里想讨论一个问题就是结合搜索 , 一样一样的搜索,那样不难 ,但是想在搜索ID 的同搜索 name 或者是 搜索title ,这种拼就麻烦了, 笔者这里就有搜索的条件有七八个,产生的搜索拼接 条件绝对有二三十种,或许不止,我这也没有什么好的办法,比较常用的给  写了下。

还有就是导航栏的active的跳转

//导航栏切换    var oL=document.querySelectorAll('.myUL li');    for(var i=0;i

 

这里的时间花的也有点长,还是请教公司的前端才出来的,这里记录下。

QQ:1160643896    欢迎一起讨论,共同进步

 

转载于:https://www.cnblogs.com/liubaoqing/p/6953095.html

你可能感兴趣的文章
3个概念,入门 Vue 组件开发
查看>>
没有JS的前端:体积更小、速度更快!
查看>>
数据指标/表现度量系统(Performance Measurement System)综述
查看>>
GitHub宣布推出Electron 1.0和Devtron,并将提供无限制的私有代码库
查看>>
论模式在领域驱动设计中的重要性
查看>>
微软将停止对 IE 8、9和10的支持
查看>>
微服务架构会和分布式单体架构高度重合吗
查看>>
《The Age of Surge》作者访谈
查看>>
测试人员的GitHub
查看>>
Spring Web Services 3.0.4.RELEASE和2.4.3.RELEASE发布
查看>>
有关GitHub仓库分支的几个问题
查看>>
无服务器计算的黑暗面:程序移植没那么容易
查看>>
云原生的浪潮下,为什么运维人员适合学习Go语言?
查看>>
EAServer 6.1 .NET Client Support
查看>>
锐捷交换机密码恢复(1)
查看>>
Kali linux virtualbox rc=1908 错误解决办法
查看>>
linux软件包管理之三(源代码安装)
查看>>
数据库三范式是什么?
查看>>
[转载]设置Ubuntu自动连接无线,无须再输入密钥环和无线密码
查看>>
九叔Xen App测试报告
查看>>