day15/下午/307-尚硅谷-尚融宝-借款人额度审核分页列表的前端整合

前段时间这块呢，呃，也比较简单，因为之前都是咱们学过的内容，咱们呢也是先定路由啊定路由的话呢，先把这个路由所需要连接的页面组件呢，给它创建出来，所以呢，Borrow下面创建list。那我们找到我们之前的。呃，S rbin啊，然后s rbin里面呢，Src里面，Views里面我们创建borrow，右键新建文件夹borrow，好，那么在这个borrow里面呢，我们创建一个list点。右键新建文件list.view好，然后接下来呢，在list view这个里面呢，我们复制一下，好把这个基本的结构给它写进去，然后再接下来呢，我们two.view。右键新建文件D点好，接下来呢，在这里面我们复制好，然后接下来呢，这个我们写好了之后呢，我们就把路由给它配一下，那么路由呢，就是下面这块，我们找到inex的GS，还是像以前一样，把路由给它粘过去就可以了。

UR。然后这边呢，我们在会员管理下面吧。粘一下好，然后接下来呢，我们来看一眼里面。还行。好，现在呢，这边就有个借款管理了，借款管理这块有个借款人列表，我们点进去，那接下来呢，我们要整合的就是这个借款用户列表，然后整合借款用户列表也是跟之前一样，我们呢有一个包点GS，把刚才我们写的这个远程的接口给他。创建出来对不对啊，这都是之前咱们学过的内容啊，咱们快速的把它写一下就不浪费时间了，所以号里面我们写一个文件叫包点GS，然后接下来呢，把这个直接粘回去就好。

啊，那这个地方呢，就get page list是吧，然后呢，Return request，然后min call borrow list page limit，然后get方式，我们传一个keyword参数过去啊好，那这块呢，就是我们。整个的一个啊，API的一个写法，那这块实际上相当于我们。传的也是一个对象过去的啊，只不过这就一个值，一个值的话，那么我们就相当于是这个意思啊，Keyword one keyw word，那这是键，这是值，这个值对应的是它这个其实就是一个键啊，是我们自己写的一个名字，那它俩如果正好一样的话，那我们是不是就省略了，就这样写就可以了啊，所以虽然一个值我们也是用整个的一个间值对的形式传过去的啊，然后如果是用整个的这个间值对形式传过去的话，它会表现成什么样子呢？就是真正在执行的时候，它就会变成这样，P word等于然后你输入的那个环境字啊，它是实际上本质是以这种形式传过去的，好，只不过我们写的时候呢，你这样写的当然了，你要是说我想这么传也行，你要这样传也行，Key word。

等于加，不用加哈，这样写。Word，然后这块就不用写了。所以这种写法和刚才的这种写法。是一致的啊，是一样的啊，产生的效果是一样，就是写法不一样而已，好那这个是我们定义的API，然后接下来呢，就是页面模板。因为模板这块呢，也是跟之前都是一样，我们前面呢有一个查询表单，然后接下来呢，有一个列表啊，然后列表后面呢，有一个分页组件啊，所以跟我们的用户管理是一模一样的，所以呢，我们也我不我也不做特殊的说明了啊，我就直接把它粘回来了。

S，然后呢，List啊，然后再我看一下啊，粘在这个位置叫template对吧，那我就直接把template给它替换掉，Temp好。那这块呢，就是我们整个的一个啊列表的一个实现，当然了，现在我们去看的话呢，可能还没有什么数据，因为呢，我们还没有去上后台去调用那个API，但是呢，我们现在已经可以看到这个啊上面这个查询表单了，还有下面这个分页啊，这个分页，尤其是分页啊，跟之前是一模一样的，我就不特殊说明了，然后查询表单这一块呢，我们主要就是一个input文本框，然后这一个input文本框呢，它直接就绑到keyword。啊，然后下面呢，是一个查询按钮和一个清空按钮，那这两个按钮的功能呢，和之前我们做用户管理的时候呢，都是一模一样的，然后接下来就是列表页，列表页这块也是都是一样的哈，所以这边就不做特殊的说明了，好然后一会我们把数据整合出来之后呢，我们来看一下它啊，这个能展示成什么样子，那所以下面这块呢，就是我们的页面脚本这一部分，页面脚本这一部分呢，也是跟之前都是一模一样的，所以这块呢，我我也不讲了，好吧，我就直接把它粘过来啊，就是查询的数据源不一样，就展示的形式是一模一样的，所以这块呢，就是咱们的这个列表页了，然后嗯。

这样的话呢，我们把这个数据就全都展示出来了，然后呢，分页这块咱们也我也不去测了，因为之前在这个会员管理里面呢，咱们都详细的讲过，也测试过了，所以呢，这边跟那边是一模一样的啊，然后查询这块咱们可以试一下，比如说查询。啊，137的这个用户，然后点查询查出来了哈，我查询138的用户，点查询那就查不出来，所以这个就是查询啊，然后另外呢，我有查询身份证号23010，这个查询也能查出来，对不对，如果不是这个身份证号，那也查不出来，对吧？还有呢，就查询这个名字也是一样的，我查这个人就能查出来，但如果查别的人，那可能就查出来啊，所以呢，就是这三个查询都可以，那另外呢，像这个地方呢，还有个清空，清空呢就是重置，重置查询表单，并且重新查询啊，就还原啊，就是查询，然后清空重置查询表单，并且重新查询，所以这个都跟以前的功能是一模一样的啊，然后呢，只不过最后这块呢，有一个审批按钮啊，有个审批按钮，我们先简单的来看一下这个审批按钮呢，它在。

在这个地方展示它有两个按钮，实际上只不过这两个按钮呢，是用FL做了一个互斥的这么一个展示，审批这块呢，就是当我们当前的这个数据呢，它的审批状态是一的时候，那就是呃，审核中对不对，申请中啊啊，那就是有审批按钮，其他的状态，那其实只要这个数据出现了，除了是一，那么就是申请成功和申请失败了，那么如果其他的申请成功和申请失败的状态的话呢，我们就直接查看就行了，就不再审批了，就审批一次啊好，所以审批结束之后就查看，如果没审批的话呢，就点击这个进行审批，当然了，审批的过程当中呢，我们会连接到这个URL地址当中去啊，Borrow detail，然后把当前的这个信息的ID传过去，然后呢，做一个信息的查看，去一点审批，然后会连到这个页，这一页呢，就是刚才我们创建的这个借款用户详情页，好在这个借款用户详情页里面呢，我们。

先查看这个接管用户的基本信息，然后再在下面呢，添加一个审批表单啊，所以这块呢，就是我们的列表页的一个实现。

那么大家会发现，其实这个项目呀，越做到最后，虽然业务稍微复杂了一点，但是具体实现的话呢，啊，越到最后你会发现用的技术呢，越是之前我们已经熟悉的技术了，所以在这个过程当中呢，只是业务啊的这个流程有所增加，但是技术点上看来的话呢，越往后写就是觉得越熟悉，对不对啊，所以这个项目哈，它就是这样的啊，写到最后的时候你会发现啊，只不过是用一些老的技术呢，来实现一些新的业务而已。