Laravel开发excel信息查询系统过程（前台）

上一文章已完成后台的设计，接下来是前台的设计。前台的关键是模板如何美观，且适应不同大小的屏幕。有三个页面：查询首页项目列表，查询输入页，查询结果页。

补充一点，后台的数据库需要将cxtj和备注改为text类型，不然无法存储太多的文字，容易报错。其迁移文件修改为：现在开始设计前台查询首页，首先是修改公用模板app.blade.php，引入jq，加一最小高度，防止底部空白，加入一个标题继承以动态改变网页标题。

    //小程序关联查询
    public function glcx(Request $request)
    {
        if(!$id = $request->id)return response()->json(['code'=>'500','msg'=>'该项目不存在']);
        $bgsx = Bgsx::find($id);
        $bm = $bgsx->bm;
        $zds = $bgsx->zd;//字段组 k1=>姓名
        $mrzid = Userzb::find(Auth::user()->yhz)->id;//当前用户组id
        $kfcx = $bgsx->kfcx[$mrzid];//开放查询字段
        $glcx = $bgsx->glcx;//如name phone 
        $glzds = ['name'=>'姓名','email'=>'邮箱','phone'=>'手机'];
        $glzd = $glzds[$glcx] ?? null;//关联字段如姓名
        if(!$glzd or !in_array($glzd,array_values($zds))){
            return response()->json(['code'=>'500','msg'=>'关联设置错误']);
        }
        $key = array_search($glzd,$zds) ?? null;//k0 k1
        if(!$key)return response()->json(['code'=>'500','msg'=>'关联字段不存在']);
        $cxjgs = DB::table($bm)->where($key,Auth::user()->$glcx)->get(array_merge(['id'],$kfcx));
        if($cxjgs->count() < 1)return response()->json(['code'=>'500','msg'=>'该表没有你的数据']);
        return response()->json(['code'=>'200','cxjgs'=>$cxjgs,'zd'=>$zds,'xmmc'=>$bgsx->xmmc,'zdsz'=>json_decode($bgsx->zdsz,true)]);
    }

查询首页采取和博客类似的8/4比例，手机不显示右边。列出开放的查询项目，给用户点击查询。点击后用ajax方式获取查询条件，模态框弹出输入框给用户输入，点击确认后，post提交到结果页显示。结果显示采用pc和phone独立模板，通过判断，如果是pc，则横向显示查询结果；如果是手机，则纵向显示查询结果，更加美观实用。

控制器设计，首页需要提取5条数据传递给模板，如果超过5条，则分页显示。具体代码如下：