93.后台系统-营销管理-优惠券前端原创

刚才呢，咱们完成了优惠券相关信息的接口都已经做到了，那下面呢，咱们开始整合前端整合之前特别提到啊，咱们目前呢，要测试功能，至少要启动的应该有这么多服务，首先网关服务必须要启动，另外里边有我们的vod模块，O的模块，营销模块，还有最后这个右侧模块，目前咱要启动项目需要有这么五个模块都需要启动，所以我现在把这些模块咱们先启动起来，然后最终我们进行前端整合，然后完成最终的测试。那咱们等他先启动。包括这些都给它启动下，下面啊，咱们开始先整合前端，然后看到最终的结果，咱们先弄前端。那前端怎么做呢？我们看啊，首先第一步咱们先建JS文件，把我们的接口在里边做定义，那我们来做个创建，首先第一个啊，我这么来做，在am目录下，咱们建个新的文件夹，或者说新的目录，我们叫做activity，这是第一个，然后创建之后，在activity里边我们建个JS文件，叫这个comp.JS。

把这个做个创建。这个来不来，然后创建之后，在JS文件中，咱们把它相关的接口在里边定义一下，这接口部分，我从课件中直接复利下，把这接口都给他拿过来。咱们放到这里，然后大家一看，目前应该在里边都完成定义，因为接口路径我跟这个课件中应该都一致啊，所以目前应该不需要做什么特别的修改，现在这个步骤完成，完成之后咱再下一个操作，现在是一个新的模块，所以咱们在路由里边加上一个新的一个路由，这个我同样复制过来。来到路由页面中route里边的in JS这里边。

加上咱们新的这个路由，这个名字我们叫营销管理模块。然后里边有它切换部分，这个做到做到之后呢，下面咱们开始建它的页面啊，这里报错院没有创建，那咱们开始建页面，页面部分呢，来到views里边，就这位置这里。在views里边的，咱们先建个文件夹，叫这个activity，或者说按照课件中图来创建，第二个叫comp info，这是第二部分是再建文件夹啊，当然可以在里面直接建页面，根据自己的习惯，我就这么来做了啊，在建文件夹，然后建完之后在里边我们来创建页面，咱目前有三个页面，一个是form，一个是list，一个是show，那把三个页面在里边创建出来。我来写一下啊。第一个叫form，点不。

然后第二个页面叫list.vouee做列表的，第三个叫受点vuee做详情显示的，目前这部分我们应该就都完成了，就把它的基本结构创建，创建之后呢，在页面中加内容，第一个我们先加这个list的，在这里边把内容咱们复制过来，咱们就检查下啊，首先。路径应该正确，然后在里边response date后面的名字，你跟我们基本上应该都一致啊，就是咱们里面这个名字。所以现在啊，List部分完成，完成之后我们继续复制，下面再来复制里边这个form页面，就是表单页面，把这段代码直接拿过来放到form页面中去，里边做添加，包括修改的这个行为内容。这个啊，咱看一下路径应该也是一样的，然后最后一个页面就是售点vuee做咱们详情显示页面，把这一部分咱们最终复制到受点V中，包括路径啊，应该基本上都是一样的。

所以咱们现在啊，就完成了优惠券管理，或者说营销管理中，优惠券里边的相关的功能前端完成整合，这个我们就做到这里，然后这个做到这里之后，咱们最后把这个效果做个测试，看一下最终结果。前端后端我都启动下啊，这是前端，然后看后端啊，咱把这几个服务都启动，刚才提到我们目前要做测试，需要启动有五个微负模块，加上网关啊，包括里边的VO do user activity这五个微都需要启动。咱们等它启动，然后最终做个测试。目前啊前端可以了，然后咱看这口部分。等他清起来。啊，这还没有启动啊，等它启动它就不报错了。

我们稍等一下啊。啊，咱们看啊，目前应该是都启动了，前端也启动了，我们首先先登录，咱先登录进去，登录之后大家看啊，里边有一个叫营销管理，咱们把它点开看一下啊，在里边第一部分显示列表，就是条件查询，这里边啊就是一个列表功能，然后在里边我们可以有这个添加修改，包括删除功能，咱们进一步来做一下测试。下面咱们试一下里面这个添加功能。咱们点击添加到表单页面，然后在里边输入第一个优惠券名称，咱们测试一下，我就写一个test，第二个它的类型，第三个发行数量，我写个十，包括领取时间，就是什么时间开始领取。比如在这个时间，然后有一个过期时间，最后有一个详情，我们先随便加个值点保存，大家看T是不是加进来了，这是第一个添加，然后第二个修改，咱们可以改变里面内容，比如说改一个名称。

加个一是不是也修改了，然后下面有一个详情，详情里面要得到就是用户已经使用这个就是优惠券的信息，包括他的其他信息，但是我这里边应该没有数据啊，咱们找一个有数据的看一下啊。这条记录应该是之前有数据，咱们看到里面的效果。这是优惠券的基本信息，下面是已经使用的信息，就是谁用过这优惠券里边都有，所以这个也做到了，然后包括最后还有一个删除功能，点删除，我们看这条数据是不是也删掉了，所以以上就完成了营销管理中能优惠券新闻功能，包括它的增加、修改、删除列表，还有已经使用的优惠券的列表功能。以上是咱完成的这个模块，营销管理模块。