day08【课程发布-课程大纲和课程发布】/15-尚硅谷-谷粒学院-课程管理-添加和删除小节

那这个怎么实现呢？首先这里强调啊，就是我们在小节加的时候呢，它除了小节本身还需要有两个值，一个叫做课程ID，一个叫做章节ID，就这两个值它也是需要的，所以两个值咱需要做设置，那我在里边我就设置一下啊。因为咱们刚才在弹框的时候，把章节ID已经传过来了，所以第一个我先设置一下这个。章节ID到咱那个video里面去，那我们做个设置啊，就写一个叫。这四点。Video点上那个章节ID，章节ID呢，到这个位置，咱看一下它那个名字。就这video里边它叫ID。把这个写下啊，然后等于里边这个开D，因为这ID是我们从方法中传过来的，所以在里边咱来设置一下它这个就是。商机ID，这个我们完成一个设置。

各位啊，把这知道，然后这个做好之后，现在咱就可以弹出来这么一个弹框部分，然后弹出来之后呢，在这个弹框里边，我们可以输入一些相关的信息，包括你的什么小节标题小节排序等等，最后咱点确定，它可以加到数据库，那咱写下这个确定的方法，我就写到这个位置。这个方法叫save or update video。在方法中咱做这个最终的一个添加。然后添加呢，咱肯定也是调用我们这个就是video中的添加方法啊，那这方法我就写到外边，因为里边啊肯定还有一个修改。这是。添加小节，我们叫A的。Video。这个方法啊，在里边我们来做个调用啊，这个位置咱先调一下啊，就是c.a的video。然后在里边我们写一个叫video，点上这个名字叫a video添加小节里边传入我们那个小节的一个对象。

最终加上这么一个。点赞，然后加一个response。箭头函数就是我们添加成功，添加成功之后，跟我们之前章节一样，咱们也是。关闭弹框提示信息，并且刷新页面，我把这个复制再用它就改一下了啊。你都一样的。这个拿过来，第一个关弹框，但是它不是这个弹框，然后换成这个小节，弹框是这个video等于false，第二个提示信息，我们叫添加小结成功，第三个刷新页面就可以了，但是这里边还有一个问题啊，咱刚才只设置了章节ID，他还需要有一个课程ID，其实课程ID你在这里设置也可以啊，我就写到这位置了。咱再设置一个课程ID，他也需要。这次点video，点上里面的课程ID，就这个COD。

然后课程ID等于就是这次点cos这个我们做这个设置，所以现在这个小节添加我们就做到了，各位注意里边需要章节ID和课程ID2值在小节中都是需要的，所以在里边这是设置的章节，这是设置的课程，而章节ID咱是通过在这位置给他。传过来的做了一个操作，这样的话咱就完成了添加功能。然后完成之后，最后我们把它试一下啊，然后在这个接口中有一个地方咱也需要改一下啊，就是这个地方，就这个时间咱也需要加上那个。自动填充啊。之前没有加上啊，给他加上。这是insert。然后下面那是insert update。加上啊。所以这样的话，我们就完成了，完成之后最后咱们把这个添加效果，我们就来试一下，看一下最终结果是什么样的啊，咱看最终效果。

我们来测试啊。先把它启动。前端已经启动起来了，我们先启动接口。然后启用之后，咱们来到这个页面中，我们测试，我先CTRL5刷新。刷新之后，我现在点添加小节弹个框，在弹框里边呢，咱输入小节的名称，包括其他一些内容，比如说我就写一个第一节啊。这些随便写些值，然后这视频明天咱会完善，现在我点确定，大家看提示咱们。是不是成功了，然后你看里边小节是不加进去了，在章节下边有小节，那比如说我们可以再试一个，咱再加一个啊，当然它同样有一个问题。这问题我就不在课上解决了，这位各位去做到啊，你注意啊，第一次加小节没有错，但是第二次我再点是不是还是上次数据啊，所以咱需要把这值是不是给它清空一下，就是你在这个弹框里边把这值给它清空，就是在这个方法中清空里边的值，这我就不清了，各位给它完成，跟咱刚才说那个添加章节一样，咱添加章节是不在这里情况小节同样啊，各位把这个完成出来，我就不写这个了啊。

因为咱们这个比较简单，我就把核心做到细节各位去做了，那我再加一个啊，咱来一个第二节，比如说这边写一个值啊，就是它了，然后咱点确定。这是不是可以，所以现在小结我们就加出来了，章节中可以加小结，这是我们做的添加功能，各位把这做到啊，然后这个细节各位去完善，包括表单清空等等。然后这个做到之后呢，咱下面小节中肯定有修改和删除功能，这个功能跟章节是一样的，包括修改，包括删除，这修改我就不做了，各位去完成，你参考章节，做到跟章节是一模一样的，只是说现在改的是小节，我就做一个删除，就为了咱们后面做准备，因为咱删除后面还有删视频，那最后给大家加一个删除啊，就是这个功能。

那删除怎么做呢？跟删除修改都一样，咱就在这个小节的后面加上按钮就可以了，那按钮咱给它加一下，我就用这个咱改一下啊。加到应该是这个位置。就是这个地方啊。比如说现在我就给它加上两个按钮。一个是编辑，一个是删除，然后这个各位给他去文案出来这个修改小结，我就做这个删除，删除里边呢，我们也是绑定一个事件，叫这个video，在里边传入你那个小节ID就是video.id这是一个方法，然后写完之后，下面把这个remove video这个方法咱在下面做一个定义。

我就定义到这个位置。写到这里啊。他就是。删除小结是这个方法里边传入一个小节的ID就叫ID。然后写完之后在删除的时候呢，咱肯定也是要有个确认框，就是确定取消，最后调接口做到确认框，咱刚才章节中刚写过，我就把这个复制，咱就快速改一下。就是他。拿过来。把名字提示都改成我们现在这个小结。然后下面调用方法，调这个方法，咱就调这个video里边的删除小节方法删除叫delete video。然后里边传一个ID。最后啊，如果删除成功，咱就提示他删除，比如叫删除小结成功，最后刷新页面。这样的话，这功能我们就做到了啊，这就是删除小结，所以咱们就完成了，各位把里边几个细节，比如说表单清空这些问题，包括修改小结，各位给他筛出来，参考章节都一样的，我就做个删除了。

那做到之后，最后咱们把效果我们试一下啊，比如现在我就删这个第一节，我点删除弹购框取消，肯定什么都不做，然后点确定咱们看。是不是删掉了，这样的话，咱们把这个做到了啊，关于我们的章节和小节管理，咱们快速完成这过程中啊，没有什么难点，主要是咱们一个最基本的过程，你先写接口这些功能，然后前端做调用，前端中咱要用个弹框，只有几点注意咱在操作中需要把一些值需要咱们手动传递，比如说章节中需要课程ID，小节里边需要章节和课程的两个ID，这里边我们都做了传递。另外就是。我们每次弹框上一次数据不能清空，咱需要手动给它清空一下，这个章节中我写到了，就是里边每次清空可以把小结按这种方式给他解释清空一下。

所以这个啊，关于就是我们的课程大纲部分，我们做到了，它总体上就是课程大纲列表章节的操作和小结操作，这个啊咱们现出来了。