CRM客户关系管理系统开发第十八讲——实现客户拜访记录管理模块中保存客户拜访记录的功能

冷不防 2023-06-04 09:58 31阅读 0赞

# 跳转到客户拜访记录添加页面 #

要想实现客户拜访记录管理模块中的保存客户拜访记录的功能，首要前提就是点击新增客户拜访超链接之后要能跳转到客户拜访记录添加页面。前面我们都做完两个模块了，做到这一点还不是依葫芦画瓢、分分钟的事！

## 在左侧的菜单页面（menu.jsp）中修改提交路径 ##

![在这里插入图片描述][20191025115325267.png]

## 编写SaleVisitAction中的saveUI方法 ##

首先，在SaleVisitAction类中编写一个如下的saveUI方法。

/* * 跳转到拜访记录添加页面的方法 */
    public String saveUI() { 
        return "saveUI";
    }

该方法写的特别简单，就返回了一个字符串。我把该方法写的如此简单，也是有一定原因的。试想，在点击新增客户拜访超链接跳转到客户拜访记录添加页面之后，所拜访的客户以及业务员名称下拉列表中的数据要能立马加载出来。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70]  
那么问题来了，所拜访的客户以及业务员名称下拉列表中的数据从何而来呢？传统的方式是在Action的方法里面编写代码，从客户表以及用户表中查询到那些需要的数据，然后在客户拜访记录添加页面上用下拉列表给展示出来，注意这是同步查询。除了这种办法之外，还有没有其他办法呢？其实还有一种办法，我们可以异步去查询客户表以及用户表中的数据，就是在客户拜访记录添加页面跳转过来以后，在加载这个页面时，就异步去查询客户表以及用户表中的数据，然后给它加载到相应的下拉列表上。很显然，在这里，我采用的是异步查询这种方式。  
然后，我们还得在Struts2配置文件中（即struts.xml）对SaleVisitAction进行如下的配置，即配置页面的跳转。  
![在这里插入图片描述][20191025115341178.png]  
哎呀！我们还没有这个客户拜访记录添加页面啊！那咋办？没有就创建一个呗！

## 创建客户拜访记录添加页面 ##

复制一份联系人添加页面（add.jsp），将其存放到WebContent/jsp/salevisit目录下，以此作为客户拜访记录添加页面，并且，咱还要对该页面做一个比较大的修改，先改成下面这样。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 1]  
此时，发布我们的项目到Tomcat服务器并启动，然后访问该项目的首页，点击新增客户拜访超链接之后就能跳转到客户拜访记录添加页面了。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 2]

# 编写代码实现保存客户拜访记录的功能 #

现在终于要写代码实现保存客户拜访记录的功能了！在这之前，我们还要在客户拜访记录添加页面上异步加载所拜访客户以及业务员名称对应的下拉列表中所需数据。

## 在客户拜访记录添加页面上异步加载数据 ##

首先，在客户拜访记录添加页面上引入jQuery的JS库文件。然后，在其中编写异步加载所拜访客户以及业务员名称对应的下拉列表中所需数据的方法。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 3]  
接着，就要分别加载所拜访客户以及业务员名称对应的下拉列表中所需数据了。

### 异步加载所拜访客户对应的下拉列表中的所需数据 ###

首先，在CustomerAction类中编写一个如下的findAllCustomer方法。

public String findAllCustomer() throws IOException { 
        List<Customer> list = customerService.findAll();
        //将List集合转成JSON
        JsonConfig jsonConfig = new JsonConfig();
        jsonConfig.setExcludes(new String[]{ "linkMans", "baseDictSource", "baseDictIndustry", "baseDictLevel"});
        //转成JSON
        JSONArray jsonArray = JSONArray.fromObject(list, jsonConfig);
        ServletActionContext.getResponse().setContentType("text/html;charset=UTF-8");
        ServletActionContext.getResponse().getWriter().println(jsonArray.toString());
        return NONE;
    }

在编写以上方法时，一定要注意一点，那就是在List集合转JSON数组时，Customer实体类中的linkMans这个属性不要给转了。如果你转了的话，那么就特别容易弄出死循环！什么情况下会出现死循环呢？假设现在我们查询出了所有客户，接着是不是要把所有客户的信息给遍历出来啊！但客户实体类里面有一个联系人的集合，json-lib也会把这个联系人的集合给转成JSON数组，与此同时，联系人实体类里面又有客户对象，json-lib又会把联系人实体类里面的客户对象给转成JSON格式的数据，客户实体类里面又有一个联系人的集合…，如此循环往复，就出现了死循环这种情况。所以，不管啥东东在转JSON格式的数据时，一定要把一些没有必要的属性给它去掉，要不然，很容易出现死循环这种情况！！！  
然后，在CustomerService接口中添加一个查询所有客户的方法声明，如下：

package com.meimeixia.crm.service;
    
    import java.util.List;
    
    import org.hibernate.criterion.DetachedCriteria;
    
    import com.meimeixia.crm.domain.Customer;
    import com.meimeixia.crm.domain.PageBean;
    
    /** * 客户管理类的业务层的接口 * @author liayun * */
    public interface CustomerService { 
    
    	void save(Customer customer);
    
    	PageBean<Customer> fingByPage(DetachedCriteria detachedCriteria, Integer currentPage, Integer pageSize);
    
    	Customer findById(Long cust_id);
    
    	void delete(Customer customer);
    
    	void update(Customer customer);
    
    	List<Customer> findAll();
    
    }

接着，在以上接口的一个实现类（CustomerServiceImpl.java）中实现查询所有客户的方法。

//业务层查询所有客户的方法
    @Override
    public List<Customer> findAll() { 
        return customerDao.findAll();
    }

紧接着，发布我们的项目到Tomcat服务器并启动，然后访问该项目的首页，点击新增客户拜访超链接跳转到客户拜访记录添加页面之后，在所拜访客户对应的下拉列表中就能看到所有的客户了。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 4]

### 异步加载业务员名称对应的下拉列表中的所需数据 ###

首先，在UserAction类中编写一个如下的findAllUser方法。

public String findAllUser() throws IOException { 
        List<User> list = userService.findAll();
        JSONArray jsonArray = JSONArray.fromObject(list);
        ServletActionContext.getResponse().setContentType("text/html;charset=UTF-8");
        ServletActionContext.getResponse().getWriter().println(jsonArray.toString());
        return NONE;
    }

然后，在UserService接口中添加一个查询所有用户的方法声明，如下：

package com.meimeixia.crm.service;
    
    import java.util.List;
    
    import com.meimeixia.crm.domain.User;
    
    /** * 用户管理的业务层的接口 * @author liayun * */
    public interface UserService { 
    
    	void regist(User user);
    
    	User login(User user);
    
    	List<User> findAll();
    
    }

接着，在以上接口的一个实现类（UserServiceImpl.java）中实现查询所有用户的方法。

@Override
    public List<User> findAll() { 
        return userDao.findAll();
    }

紧接着，发布我们的项目到Tomcat服务器并启动，然后访问该项目的首页，点击新增客户拜访超链接跳转到客户拜访记录添加页面之后，在业务员名称对应的下拉列表中就能看到所有的用户了。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 5]

## 在客户拜访记录添加页面上添加一个日期插件 ##

在客户拜访记录添加页面中填写客户拜访记录相关的信息时，我们要在拜访时间以及下次拜访时间对应的文本框中输入准确的时间，这可不能让我们自己手动瞎输入，应该弹出一个日历小窗口，让我们选择对应的时间，就像下面这样。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 6]  
如果想要实现这样的效果，那么需要在客户拜访记录添加页面上添加一个日期插件。这样的日期插件可以从网上随便下载一个，笔者也在这里提供了一个，如有需要可以从CRM客户关系管理系统开发第一讲中提供的百度网盘连接地址进行下载，需要说明一点的是，这里是以笔者提供的日期插件为例进行演示的。  
那么问题来了，这样的日期插件该怎样使用呢？首先，将下载下来的日期插件中的jquery目录复制到CRM项目下的WebContent目录中。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 7]  
然后，在客户拜访记录添加页面中导入日期插件所需要的样式文件和js文件。  
![在这里插入图片描述][20191025154758386.png]  
接着，给拜访时间以及下次拜访时间对应的文本框添加一个id属性，除此之外，还应将文本框的readonly属性置为true，因为这样一来该文本框就变成只读的了，用户一旦在文本框中输入了某个值，就不能随意对其进行修改了。

*  拜访时间对应的文本框应修改为：  
    ![在这里插入图片描述][20191025154807512.png]
 *  下次拜访时间对应的文本框应修改为：  
    ![在这里插入图片描述][20191025154821528.png]

最后，在客户拜访记录添加页面中编写如下一段js代码，就能在页面中使用日期插件了。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 8]

## 修改客户拜访记录添加页面中的表单提交路径 ##

![在这里插入图片描述][20191025160809920.png]

## 编写SaleVisitAction中的save方法 ##

首先，在SaleVisitAction类中编写如下的一个保存客户拜访记录的save方法。

/* * 保存客户拜访记录的方法 */
    public String save() { 
        //调用业务层
        saleVisitService.save(saleVisit);
        return "saveSuccess";
    }

然后，我们还得在Struts2配置文件中（即struts.xml）对SaleVisitAction进行如下的配置，即保存客户拜访记录成功后，直接重定向到客户拜访记录列表展示页面中。  
![在这里插入图片描述][20191025160819294.png]

## 编写service层 ##

首先，在SaleVisitService接口中添加一个保存客户拜访记录的方法声明，如下：

package com.meimeixia.crm.service;
    
    import org.hibernate.criterion.DetachedCriteria;
    
    import com.meimeixia.crm.domain.PageBean;
    import com.meimeixia.crm.domain.SaleVisit;
    
    /** * 客户拜访记录的业务层的接口 * @author liayun * */
    public interface SaleVisitService { 
    
    	PageBean<SaleVisit> findByPage(DetachedCriteria detachedCriteria, Integer currentPage, Integer pageSize);
    
    	void save(SaleVisit saleVisit);
    
    }

然后，在以上接口的一个实现类（SaleVisitServiceImpl.java）中实现保存客户拜访记录的方法。

@Override
    public void save(SaleVisit saleVisit) { 
        saleVisitDao.save(saleVisit);
    }

### 添加事务 ###

这里一定得记得要在业务层中的实现类（SaleVisitServiceImpl）上添加@Transactional注解。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 9]  
至此，保存客户拜访记录的功能，我们就已经实现了，至于测试的话，我就不再这里测试了（偷懒了），反正是好使的！

[20191025115325267.png]: /images/20230601/57f1ad75f1074f2cb6b992cbbf00bcb2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70]: /images/20230601/fd264c82a248479e8c0bffa4573725b9.png
[20191025115341178.png]: /images/20230601/32cc73d48c6b494fa05c344474442cc0.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 1]: /images/20230601/433300836bdf4959a4965381944239e3.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 2]: /images/20230601/54cb59425ba14df88f2aa92cc719a7bc.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 3]: /images/20230601/019cc17124a6495bb74912bb45eebd87.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 4]: /images/20230601/3cacc5e416a04bf6b2aa3d3352553d7c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 5]: /images/20230601/70681fe8ae7b4610a18e396cc33b5f44.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 6]: /images/20230601/12e97a5f89464c31898f8fc27e380a41.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 7]: /images/20230601/90054effa6ab45cfa521bc1c8533b24f.png
[20191025154758386.png]: /images/20230601/5bb23bb5749e43af8b938f040959bdec.png
[20191025154807512.png]: /images/20230601/5a668e72d8f347748d96b3ef8f851ea6.png
[20191025154821528.png]: /images/20230601/4731f626145f4a5fb7f75c331a73e487.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 8]: /images/20230601/fa7a0599b3654d84b9c1e2da22c9afc8.png
[20191025160809920.png]: /images/20230601/4ef4bdc0377f4b2489797e9b27f66382.png
[20191025160819294.png]: /images/20230601/4c50e5b14ece4e158f8c63ab5d2dfbfe.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llcmVueXVhbl9wa3U_size_16_color_FFFFFF_t_70 9]: /images/20230601/201b19de6eee4f6783bdf5cc64b9b8cb.png