美年旅游项目自记录Day04

一、自由行模块的后续

1.自由行项的删除（删）

        通过ajax-get请求获取要删除项的id，然后Controller->Service->Dao进行删除后，Controller返回响应信息，前段判断删除成功与否

2.自由行项的编辑（改）

        首先需要表单回显，前端点击编辑按钮，触发事件（表单弹出，get请求中提供要修改项的id， 然后Controller->Service->Dao查询该id项信息并封装为bean，作为响应数据返回给前端作表单回显）。然后表单的确定操作与添加操作类似，不再赘述。

总结：对于不涉及前端设计来说，该模块只是练习了简单的CRUD，但在此过程中出现sql语句以及Mybatis的动态sql的不熟练，都需要多加练习，还有项目的xml配置文件也需要多练多记忆。

二、跟团游模块

与上一个模块相比是多对多的关系，多对多数据的CURD操作

准备Controller、Service、Dao一套组件

1.跟团游的添加

与自由行不同，跟团游的添加表单中需回显自由行的数据，前段代码需要用一个列表绑定该数据进行回显，在新增事件中通过ajax-get请求获取自由行数据，并将响应数据赋值于绑定列表，通过对列表元素的迭代进行表单显示。

 然后其跟团游信息的添加与自由行相同，只是需要额外对跟团游与自由行的id中间表进行添加操作

2.跟团游的分页

与自由行类似

3.跟团游的编辑

难点1：需要作三次回显 回显跟团游信息，回显自由行信息，并且回显复选框中跟团游与自由行的关联信息，三次回显操作串行

//1.回显表单数据
axios.get("/travelGroup/getById.do?id=" + row.id).then((resp) => {
    if (resp.data.flag) {
        this.activeName = "first"
        this.formData = resp.data.data;
        this.dialogFormVisible4Edit = true;
        this.$message.success(resp.data.message);
        
        //2.回显自由行数据
        axios.get("/travelItem/findAll.do").then((resp) => {
            if (resp.data.flag) {
                this.tableData = resp.data.data

                //3.回显跟团友和自由行关联数据，复选框打勾
                // var travelGroupId = row.id
                axios.get("/travelGroup/getTravelItemIdsByTravelGroupId.do?travelGroupId=" + row.id).then((resp) => {
                    this.travelItemIds = resp.data.data
                })
            } else {
                this.$message.error(resp.data.message);
            }
        })

    } else {
        this.$message.error(resp.data.message);
    }
})

难点2：修改的时候自由行的勾选，要对中间表进行增删操作，难在数据该如何回传

 因为存在不作改动的，删除的，添加的数据，一个解决方法是全部删除，然后对勾选项进行添加。

3.跟游团的删除

删除功能较上述功能简单，只需将跟团游表以及中间表中相应id的数据项删除即刻

到此跟团游模块结束