day14/下午/293-尚硅谷-尚融宝-借款额度页面的创建

那么有了刚才步骤导航的一个经验的话呢，我再把这个地方拷过来的话呢，大家可能就了解了啊，我把这个先复制过来。啊，复制到这个位置，你看这是不是就是steps呀，只不过我们这steps就是有这个借款人信息提交平台审核，等待认证结果，这几个步骤啊，这三个步骤啊，这三个步骤，然后再接下来呢，我们来看一眼。你看借款人信息提交平台审核，等待认证结果啊，就是刚才我的这三个步骤，当然他和上面有一个40像素的距离，要不他俩紧紧的挨着呢，也不太好看，好然后再接下来呢，就是下面这块，我写了这样的几个内容，那首先这个地方叫active等于零对吧，那很显然它就是什么呀，它就是第一个步骤嘛，好，我先把它复制过来。好，第一个步骤呢，就在这儿了，然后这里面呢，包含个人基本信息，联系人信息，身份认证信息，其他信息啊，当然未来个人信息，联系人信息，身份证信息，其他信息我们都要依次的给它丰满起来啊，很多下拉列表啊啊然后这个里面还有什么上传呀等等，都都要给它丰富起来，然后最后呢，咱们在这个步骤有一个提交按钮啊，这个提交按钮就是属于这个步骤的，所以呢，我们就把这个按钮呢写到这个步骤里面，好，主要就是主要就是它啊，就是个按钮，然后上面这块其实就是做一个样式而已啊，没有什么特别的，然后那个绑定一个serve方法，然后这个是方式重复提交的，好，然后接下来呢，我们再来看。

现在我们的这个步骤就变成这样了啊，虽然比较这个呃聊就是这个不是特别好看吧，但是呢，它的第一个步骤的内容呢，已经有了啊啊还没有填充完啊，填充完就好看了，好然后接下来呢，我们来看第二个步骤，那这个呢，就是我们的第二个步骤的内容，把它复制过来。啊，复制到这个位置。

啊，所以当active等于一的时候，那么我们就会有这样的一个消息展示出来，说我们将在两小时内完成审核，审核时间，然后您的认证申请已经成功提交，请耐心等待，这个E乐就是一个高量显示的一个提示信息啊啊，那么他点击提交啊，刷新一下啊啊，当我点击提交，那肯定就是要修改什么呀，修改谁修改active的值了，所以上一步的提交按钮就是这个save，肯定呢，就是要修改这个X等于一，所以我们可以在下面完善一个save。先简单的去给它改一下这个流程，This点等于一。然后接下来点提交，好，那么就到这一步了，您的审申请已经提交，请耐心等待明白吧，啊就是这样的，然后这个时候呢，后台管理员呢，他就会审核，后台管理员审核完了之后呢，他就会对咱们的这个呃，整个的这个申请的状态进行修改，审核成功，那申请的状态就是已审批，审核失败，那么他申请的状态就未审批。

对吧，没审核呢，那申请的状态就是未审核对不对？好然后呢，下一次用户呢，比如说隔了两个小时，用户再来看的时候，他呢，有可能进入到还未审核的状态，有可能进入到等待认证结果与成功的状态，也有可能进入到等待认证结果已失败的状态啊那么这个第三个步骤呢，就是这样的。就是X等于二的时候。我们把它呢，放在这个位置。这啊，别写错地方，对方和一个D是平行的，放到这当然了，必须得active等于二，那active等于二呢，不是我们由用户在前端操作的了，是由谁来操作的，是由管理员在后台操作的，操作完了之后呢，我们会判断我们用户的这个不同的状态，然后将active的值变成R，那接下来呢，我们就试着看一看，当active假设说我们先给它初始化为二，对吧。

数字化为二呢，它就应该能够直接展示那个那个结果了，但是现在有问题，为什么会有问题啊，那我们页面当中有好多东西都还没有时间定义好啊，然后所以他现在的问题呢，就是啊好像这个div哈有问题我看一下啊。你先把我刚才考的这个先先删一下，删一下，然后我先来看一下啊。这样没有我看一下啊。这样没问题啊，这个submit button还没定义呢，这个先不影响没事，然后接下来呢，我看我S等于一的div应该是在这是吧。在这儿啊，然后呢，Di看一看啊。这是这个点位，对，然后呢，我再重新拷贝一下，可能刚才拷贝的。

刚才拷贝的这个。应该是拷贝到这，应该是一二，我看一下啊，后面剩几个一二就剩两个，那这面的一二剩两个对吧，拷贝到这，你拷贝的话，你就直接不用像我这样一个一个考了，你就直接从头一直考到尾，就不会出错了，明白吧，我是想给你们把它讲明白，就一个一个考，那一定要考对哈，好考完了之后呢，再把它粘过来。对吧，你看一下啊。这回对了。这是第三个步骤，然后我呢，先把这个地方改成三，就先啊先手工的改成第三个步骤，那就是第三个步骤是二。好，那么这边就是等待认证结果了，等待认证结果他要展示内容的话，必须是什么呢？我们还有一个状态就是审申这个啊，借款额度申请的borrow status是不是一啊，Borrow是一，那么就会展示它，Borrow status是负一，那么就会展示它，所以呢，我先把这个borrow呢先给它应编码一下啊，在这个地方我给它定义一下，比如说borrow status是一。

那么未来呢，就会展示您的认证审批已通过，比如说borrow status是负一，那么未来呢，就会展示。您的认证审批未通过。明白吧，啊，所以那我们在写这个代码的时候，无非就是从后台获取数据，把这些值给它填充上啊，填充完了之后等于啥，那么他就展示什么了，只不过现在我们还没有从后台获取数据，那这些呢，都是我们人工啊进行干预的，对不对，人工测了一下啊好，然后呢，这块呢，就是我们整个的。这样的一个页面的一个定义了，那好，那这个页面定义完了之后呢，后后面我们再编写程序的时候呢，还要定义一些变量啊，那这些变量都在哪呢？啊，都在这块定义的呢，啊就是这些其实是我们在这个页面当中还是需要啊的一些其他的一些啊数据值啊，然后呢，这些东西我们明天再说，所以呢啊到今天为止呢，大家就能够把这个整个的这个页面给它展示出来就可以了，当然了，我再给它还原到。

零的状态哈，然后这个呢，还没有状态呢，我先给他一个那的状态啊，就先暂时这样，然后当然明天这块还得进行调整，还得进行进一步的编程，所以今天咱们先把这个页面写到这。行吧。我看一下啊。行，先写到这吧，啊，其他的其他的这个咱们再给它粘一下啊，就是这这块没有啥，全都是静态信息给他粘过来啊，二第二部分借款人信息页面，个人基本信息啊，来给它粘过来，个人基本信息这块从这一直到这一粘，粘到哪呢？我们给它粘到。

这个位置替换啊，这是个人基本信息好吧，啊，然后细节的东西大家自己先看一看，然后明天我再讲，然后加完了之后呢，嗯，它就就会报错了，为什么会报错呢？因为这里面有数据没有定义，我们绑定数据了，比如说像age这个数据。你看这个地方是不是把borrow age了，对吧，它没定义，没定义怎么办，你得在下面给它定义出来，所以呢，在这个地方你们得先把这个数据啊，没定义的数据啊，先给它定义出来啊，把这个贝塔里面的这个内容呢，咱们都给它考一下啊，那具体定义的是什么意思，明天我们再具体的去说，但是今天一定要给它定义出来。然后呢，这面呢，我们把它替换到这个下面这个data里，目前为止只有两个active和foreigns，我们把其他的对吧，也给它定义进来啊，然后接下来呢，MYS这块。

我们呢，这边有一个就是防止表单重复提交的，一点击这个按钮马上把它禁用掉啊把这个按钮禁用掉，这个跟之前我们后端讲的那个是一样的，所以就直接粘过来就行了，好然后接下来呢，我们再来看这个页面。好，这样的话呢，看个人基本信息这块，年龄啊，性别呀，婚否啊，学历呀，行业呀，月收入啊，收款还款来源就都有了，当然了这个下拉列表，这个下拉列表还没有数据，这个明天我们要从后台去取数据啊，这是下拉列表这一块，然后接下来呢啊，就是我们个人基本信息已经粘完了，看联系人信息也是直接粘过来就可以了。然后粘到哪呢？粘到这个联系人信息这个位置粘贴好，然后我们来看一下，好联系人信息这面就有内容了啊，当然这个下拉列表也是从数据字典里取出来的，这个我们明天再做，然后再接下来呢，就是身份认证信息，从这一直粘到这。

好，身份认证信息，把它替换一下。对吧，然后再来看。其实就是两个上传组件啊，然后再来呢，就是其他信息。其他信息从这一直粘到这，好，然后把这个替换一下。好，然后接下来呢，我来看其他信息也是两个上传组件。明白哈，所以这块呢，就是其他信息的部分的内容了，然后剩下的内容就是关于脚本部分的内容了，我们明天讲，所以大家看一看，今天我们这个页面其实创建完了之后还是蛮长的，代码还是蛮多的，所以如果一次性的给到大家的话呢，大家可能就是接受起来有点困难，那这样的话呢，我把这个页面能拆分成几个部分给大家逐渐的填充进去，那希望呢，能够降低大家对这个页面的理解的难度啊，总之这个页面其实就是这样几个步骤了，Active等于零。

Active等于一。和active等于二对吧，然后active等于零的上面就是导航，然后active等于零的里面就是每一个，比如说个人基本信息部分，还有联系人信息部分，还有身份认证信息部分，以及其他信息部分，最后。按钮部分明白吧，所以这页面再大，我们把它拆分开来，这样的话呢，就比较好理解了。好吧，啊，然后那今天咱们就说到这儿。