• CRM项目记录（七）

    目录：

    （1）导入市场活动需求分析

    （2）crm演示文件上传

    （3）crm演示使用apache-poi解析excel文件

    （4）crm设计导入市场活动 

    （5）crm实现导入市场活动Controller

    （6）crm实现导入市场活动Controller

    （7）crm实现导入市场活动前台页面

    （8）crm优化导入市场活动

    （9）下面做查看市场活动明细：

    （10） crm实现市场活动明细查询备注信息Mapper层和Serevice层controller层

    （11）crm实现查看市场活动明细前台页面

    （12）crm添加市场活动备注实现Mapper层和Service层

    （13）crm添加市场活动备注实现controller层

    （1）导入市场活动需求分析

    需求：它是导出的逆过程。

    用户在市场活动主页面,点击"导入"按钮,弹出导入市场活动的模态窗口;

             用户在导入市场活动的模态窗口选择要上传的文件,点击"导入"按钮,完成导入市场活动的功能.

             *只支持.xls

             *文件大小不超过5MB

             *导入成功之后,提示成功导入记录条数,关闭模态窗口,刷新市场活动列表,显示第一页数据,保持每页显示条数不变

             *导入失败,提示信息,模态窗口不关闭,列表也不刷新

     （2）crm演示文件上传

    先准备一个小例子：先创建一个fileuploadtest.jsp：

    1. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    2. <%
    3.     String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
    4. %>
    5. <html>
    6. <head>
    7.     <base href="<%=basePath%>">
    8.     <title>演示文件上传</title>
    9. </head>
    10. <body>
    11. <!--
    12.     文件上传的表单三个条件：
    13.     1.表单组件标签必须用：<input type="file">
    14.       <input type="text|password|radio|checkbox|hidden|button|submit|reset|file">
    15.                       <select>,<textarea>等
    16.     2.请求方式只能用：post
    17.       get：参数通过请求头提交到后台，参数放在URL后边；只能向后台提交文本数据；对参数长度有限制；数据不安全；效率高
    18.       post：参数通过请求体提交到后台；既能能提交文件数据，又能够提交二进制数据；理论上对参数长度没有限制；相对安全；效率相对较低
    19.     3.表单的编码格式只能用：multipart/form-data
    20.       根据HTTP协议的规定，浏览器每次向后台提交参数，都会对参数进行统一编码；默认采用的编码格式是urlencoded，这种编码格式只能对文本数据进行编码；
    21.       浏览器每次向后台提交参数，都会首先把所有的参数转换成字符串，然后对这些数据统一进行urlencoded编码；
    22.       文件上传的表单编码格式只能用multipart/form-data：enctype="multipart/form-data"
    23. -->
    24. <form action="workbench/activity/fileUpload.do" method="post" enctype="multipart/form-data">
    25.     <input type="file" name="myFile"><br>
    26.     <input type="text" name="userName"><br>
    27.     <input type="submit" value="提交">
    28. </form>
    29. </body>
    30. </html>

    controller不新建了，在ActivityController写就行了：

    1. //测试文件上传
    2.      @RequestMapping("/workbench/activity/fileUpload.do")
    3.     public @ResponseBody Object fileUpload(String userName, MultipartFile myFile) throws Exception{
    4.         //把文本数据打印到控制台
    5.         System.out.println("userName="+userName);
    6.         //把文件在服务指定的目录中生成一个同样的文件
    7.         String originalFilename=myFile.getOriginalFilename();//获取文件名
    8.         File file=new File("D:\\AnZhuang\\Java项目\\CRM\\serverDir\\",originalFilename);//路径必须手动创建好，文件如果不存在，会自动创建
    9.         myFile.transferTo(file);
    10.  
    11.         //返回响应信息
    12.         ReturnObject returnObject=new ReturnObject();
    13.         returnObject.setCode(Contants.RETURN_OBJECT_CODE_SUCCESS);
    14.         returnObject.setMessage("上传成功");
    15.         return returnObject;
    16.     }

    在springmvc配置文件中配置文件上传解析器：

    1.  <!-- 配置文件上传解析器 id:必须是multipartResolver-->
    2.     <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    3.         <property name="maxUploadSize" value="#{1024*1024*80}"/>
    4.         <property name="defaultEncoding" value="utf-8"/>
    5.     </bean>

     运行项目：需要先登录一下，在访问文件上传页面：

    选择上传文件：

    点击提交：

     

     

    （3）crm演示使用apache-poi解析excel文件

    ParseExcelTest： 

     创建测试类：

    1. package com.bjpowernode.crm.poi;
    2.  
    3. import com.bjpowernode.crm.commons.utils.HSSFUtils;
    4. import org.apache.poi.hssf.usermodel.HSSFCell;
    5. import org.apache.poi.hssf.usermodel.HSSFRow;
    6. import org.apache.poi.hssf.usermodel.HSSFSheet;
    7. import org.apache.poi.hssf.usermodel.HSSFWorkbook;
    8.  
    9. import java.io.FileInputStream;
    10. import java.io.InputStream;
    11.  
    12. /**
    13.  * 使用apache-poi解析excel文件
    14.  */
    15. public class ParseExcelTest {
    16.     public static void main(String[] args) throws Exception{
    17.         //根据excel文件生成HSSFWorkbook对象，封装了excel文件的所有信息
    18.         InputStream is=new FileInputStream("D:\\AnZhuang\\Java项目\\CRM\\serverDir\\activityList.xls");
    19.         HSSFWorkbook wb=new HSSFWorkbook(is);
    20.         //根据wb获取HSSFSheet对象，封装了一页的所有信息
    21.         HSSFSheet sheet=wb.getSheetAt(0);//页的下标，下标从0开始，依次增加
    22.         //根据sheet获取HSSFRow对象，封装了一行的所有信息
    23.         HSSFRow row=null;
    24.         HSSFCell cell=null;
    25.         for(int i=0;i<=sheet.getLastRowNum();i++) {//sheet.getLastRowNum()：最后一行的下标
    26.             row=sheet.getRow(i);//行的下标，下标从0开始，依次增加
    27.  
    28.             for(int j=0;j<row.getLastCellNum();j++) {//row.getLastCellNum():最后一列的下标+1
    29.                 //根据row获取HSSFCell对象，封装了一列的所有信息
    30.                 cell=row.getCell(j);//列的下标，下标从0开始，依次增加
    31.  
    32.                 //获取列中的数据
    33.                 System.out.print(HSSFUtils.getCellValueForStr(cell)+" ");;
    34.             }
    35.  
    36.             //每一行中所有列都打完，打印一个换行
    37.             System.out.println();
    38.         }
    39.     }
    40. }

    创建工具类：用来解析列的的属性类型，并获取属性值：

    创建工具类HSSFUtils：

    1. package com.bjpowernode.crm.commons.utils;
    2.  
    3. import org.apache.poi.hssf.usermodel.HSSFCell;
    4.  
    5. /**
    6.  * 关于excel文件操作的工具类
    7.  */
    8. public class HSSFUtils {
    9.     /**
    10.      * 从指定的HSSFCell对象中获取列的值
    11.      * @return
    12.      */
    13.     public static String getCellValueForStr(HSSFCell cell){
    14.         String ret="";
    15.         if(cell.getCellType()==HSSFCell.CELL_TYPE_STRING){
    16.             ret=cell.getStringCellValue();
    17.         }else if(cell.getCellType()==HSSFCell.CELL_TYPE_NUMERIC){
    18.             ret=cell.getNumericCellValue()+"";
    19.         }else if(cell.getCellType()==HSSFCell.CELL_TYPE_BOOLEAN){
    20.             ret=cell.getBooleanCellValue()+"";
    21.         }else if(cell.getCellType()==HSSFCell.CELL_TYPE_FORMULA){
    22.             ret=cell.getCellFormula();
    23.         }else{
    24.             ret="";
    25.         }
    26.  
    27.         return ret;
    28.     }
    29. }

     运行ParseExcelTest类：

    （4）crm设计导入市场活动 

     

    在ActivityMapper接口中：

     在AcvtivityMapper.xml中：

    1. <!--批量保存创建的市场活动-->
    2.   <insert id="insertActivityByList" parameterType="com.bjpowernode.crm.workbench.domain.Activity">
    3.     insert into tbl_activity(id, owner, name, start_date, end_date, cost, description, create_time, create_by)
    4.     values
    5.     <foreach collection="list" item="obj" separator=",">
    6.       (#{obj.id},#{obj.owner},#{obj.name},#{obj.startDate},#{obj.endDate},#{obj.cost},#{obj.description},#{obj.createTime},#{obj.createBy})
    7.     </foreach>
    8.   </insert>

     在ActivitySertvice接口：

    实现类：

    （6）crm实现导入市场活动Controller

    唯一id工具类： 

    1. package com.bjpowernode.crm.commons.utils;
    2.  
    3. import java.util.UUID;
    4.  
    5. public class UUIDUtils {
    6.     /**
    7.      * 回去uuid的值
    8.      * @return
    9.      */
    10.     public static String getUUID(){
    11.         return UUID.randomUUID().toString().replaceAll("-","");
    12.     }
    13. }

    时间格式化工具类

    1. package com.bjpowernode.crm.commons.utils;
    2.  
    3. import java.text.SimpleDateFormat;
    4. import java.util.Date;
    5.  
    6. /**
    7.  * 对Date类型数据进行处理的工具类
    8.  */
    9. public class DateUtils {
    10.     /**
    11.      * 对指定的date对象进行格式化: yyyy-MM-dd HH:mm:ss
    12.      * @param date
    13.      * @return
    14.      */
    15.     public static String formateDateTime(Date date){
    16.         SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
    17.         String dateStr=sdf.format(date);
    18.         return dateStr;
    19.     }
    20.  
    21.     /**
    22.      * 对指定的date对象进行格式化: yyyy-MM-dd
    23.      * @param date
    24.      * @return
    25.      */
    26.     public static String formateDate(Date date){
    27.         SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd");
    28.         String dateStr=sdf.format(date);
    29.         return dateStr;
    30.     }
    31.  
    32.     /**
    33.      * 对指定的date对象进行格式化: HH:mm:ss
    34.      * @param date
    35.      * @return
    36.      */
    37.     public static String formateTime(Date date){
    38.         SimpleDateFormat sdf=new SimpleDateFormat("HH:mm:ss");
    39.         String dateStr=sdf.format(date);
    40.         return dateStr;
    41.     }
    42. }

    在ActivityController：添加请求 

    1. //导入市场活动请求
    2.     @RequestMapping("/workbench/activity/importActivity.do")
    3.     public @ResponseBody Object importActivity(MultipartFile activityFile,String userName,HttpSession session){
    4.         System.out.println("userName="+userName);
    5.         User user=(User) session.getAttribute(Contants.SESSION_USER);
    6.         ReturnObject returnObject=new ReturnObject();
    7.         try {
    8.             //把excel文件写到磁盘目录中
    9.             String originalFilename = activityFile.getOriginalFilename();
    10.             File file = new File("D:\\AnZhuang\\Java项目\\CRM\\serverDir\\", originalFilename);//路径必须手动创建好，文件如果不存在，会自动创建
    11.             activityFile.transferTo(file);
    12.  
    13.             //解析excel文件，获取文件中的数据，并且封装成activityList
    14.             //根据excel文件生成HSSFWorkbook对象，封装了excel文件的所有信息
    15.             InputStream is=new FileInputStream("D:\\AnZhuang\\Java项目\\CRM\\serverDir\\"+originalFilename);
    16.  
    17.            
    18.             HSSFWorkbook wb=new HSSFWorkbook(is);
    19.             //根据wb获取HSSFSheet对象，封装了一页的所有信息
    20.             HSSFSheet sheet=wb.getSheetAt(0);//页的下标，下标从0开始，依次增加
    21.             //根据sheet获取HSSFRow对象，封装了一行的所有信息
    22.             HSSFRow row=null;
    23.             HSSFCell cell=null;
    24.             Activity activity=null;
    25.             List<Activity> activityList=new ArrayList<>();
    26.             for(int i=1;i<=sheet.getLastRowNum();i++) {//sheet.getLastRowNum()：最后一行的下标
    27.                 row=sheet.getRow(i);//行的下标，下标从0开始，依次增加
    28.                 activity=new Activity();
    29.                 activity.setId(UUIDUtils.getUUID());
    30.                 activity.setOwner(user.getId());
    31.                 activity.setCreateTime(DateUtils.formateDateTime(new Date()));
    32.                 activity.setCreateBy(user.getId());
    33.  
    34.                 for(int j=0;j
    35.                     //根据row获取HSSFCell对象，封装了一列的所有信息
    36.                     cell=row.getCell(j);//列的下标，下标从0开始，依次增加
    37.  
    38.                     //获取列中的数据 调用工具类HSSFUtils
    39.                     String cellValue= HSSFUtils.getCellValueForStr(cell);
    40.                     if(j==0){
    41.                         activity.setName(cellValue);
    42.                     }else if(j==1){
    43.                         activity.setStartDate(cellValue);
    44.                     }else if(j==2){
    45.                         activity.setEndDate(cellValue);
    46.                     }else if(j==3){
    47.                         activity.setCost(cellValue);
    48.                     }else if(j==4){
    49.                         activity.setDescription(cellValue);
    50.                     }
    51.                 }
    52.  
    53.                 //每一行中所有列都封装完成之后，把activity保存到list中
    54.                 activityList.add(activity);
    55.             }
    56.  
    57.             //调用service层方法，保存市场活动
    58.             int ret=activityService.saveCreateActivityByList(activityList);
    59.  
    60.             returnObject.setCode(Contants.RETURN_OBJECT_CODE_SUCCESS);
    61.             returnObject.setRetData(ret);//返回数据
    62.         }catch (Exception e){
    63.             e.printStackTrace();
    64.             returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
    65.             returnObject.setMessage("系统忙，请稍后重试....");
    66.         }
    67.  
    68.         return returnObject;
    69.     }

    （6）crm实现导入市场活动前台页面

     在市场活动index.jsp：

    文件上传ajax需要设置的参数： 

    processData:false,//设置ajax向后台提交参数之前，是否把参数统一转换成字符串：true--是,false--不是,默认是true
contentType:false,//设置ajax向后台提交参数之前，是否把所有的参数统一按urlencoded编码：true--是,false--不是，默认是true
    1. //给"批量导出"按钮添加单击事件
    2. 			$("#exportActivityAllBtn").click(function () {
    3. 				//发送同步请求
    4. 				window.location.href="workbench/activity/exportAllActivitys.do";
    5. 			});
    6.  
    7. 			//给"导入"按钮添加单击事件
    8. 			$("#importActivityBtn").click(function () {
    9. 				//收集参数
    10. 				var activityFileName=$("#activityFile").val();
    11. 				var suffix=activityFileName.substr(activityFileName.lastIndexOf(".")+1).toLocaleLowerCase();//xls,XLS,Xls,xLs,....
    12. 				if(suffix!="xls"){
    13. 					alert("只支持xls文件");
    14. 					return;
    15. 				}
    16.  
    17. 				//获取文件
    18. 				var activityFile=$("#activityFile")[0].files[0];
    19. 				if(activityFile.size>5*1024*1024){
    20. 					alert("文件大小不超过5MB");
    21. 					return;
    22. 				}
    23.  
    24. 				//FormData是ajax提供的接口,可以模拟键值对向后台提交参数;
    25. 				//FormData最大的优势是不但能提交文本数据，还能提交二进制数据
    26. 				var formData=new FormData();
    27. 				formData.append("activityFile",activityFile);
    28. 				formData.append("userName","张三");
    29.  
    30. 				//发送请求
    31. 				$.ajax({
    32. 					url:'workbench/activity/importActivity.do',
    33. 					data:formData,
    34. 					processData:false,//设置ajax向后台提交参数之前，是否把参数统一转换成字符串：true--是,false--不是,默认是true
    35. 					contentType:false,//设置ajax向后台提交参数之前，是否把所有的参数统一按urlencoded编码：true--是,false--不是，默认是true
    36. 					type:'post',
    37. 					dataType:'json',
    38. 					success:function (data) {
    39. 						if(data.code=="1"){
    40. 							//提示成功导入记录条数
    41. 							alert("成功导入"+data.retData+"条记录");
    42. 							//关闭模态窗口
    43. 							$("#importActivityModal").modal("hide");
    44. 							//刷新市场活动列表,显示第一页数据,保持每页显示条数不变
    45. 							queryActivityByConditionForPage(1,$("#demo_pag1").bs_pagination('getOption', 'rowsPerPage'));
    46. 						}else{
    47. 							//提示信息
    48. 							alert(data.message);
    49. 							//模态窗口不关闭
    50. 							$("#importActivityModal").modal("show");
    51. 						}
    52. 					}
    53. 				});
    54. 			});
    55. 		});

    我们上传的文件格式都是跟客户约束好的：

    点击上传表数据：

    选择文件：

     

    点击导入：

     

     （8）crm优化导入市场活动

    这一行 代码效率是非常低的，它把内存中的数据写到磁盘上 ，这一过程效率是低的

    File file = new File("D:\\AnZhuang\\Java项目\\CRM\\serverDir\\", originalFilename);//路径必须手动创建好，文件如果不存在，会自动创建
activityFile.transferTo(file);

    下面的代码效率也低，它需要把磁盘上的数据，读 到内存

    InputStream is=new FileInputStream("D:\\AnZhuang\\Java项目\\CRM\\serverDir\\"+originalFilename);

HSSFWorkbook wb=new HSSFWorkbook(is);

    让他直接从内存读到内存，不进行读磁盘了，更改代码：ActivityController中的代码：

    1. //导入市场活动请求
    2.     @RequestMapping("/workbench/activity/importActivity.do")
    3.     public @ResponseBody Object importActivity(MultipartFile activityFile,String userName,HttpSession session){
    4.         System.out.println("userName="+userName);
    5.         User user=(User) session.getAttribute(Contants.SESSION_USER);
    6.         ReturnObject returnObject=new ReturnObject();
    7.         try {
    8.             //把excel文件写到磁盘目录中
    9.             /*String originalFilename = activityFile.getOriginalFilename();
    10.             File file = new File("D:\\AnZhuang\\Java项目\\CRM\\serverDir\\", originalFilename);//路径必须手动创建好，文件如果不存在，会自动创建
    11.             activityFile.transferTo(file);*/
    12.  
    13.             //解析excel文件，获取文件中的数据，并且封装成activityList
    14.             //根据excel文件生成HSSFWorkbook对象，封装了excel文件的所有信息
    15.             //InputStream is=new FileInputStream("D:\\AnZhuang\\Java项目\\CRM\\serverDir\\"+originalFilename);
    16.  
    17.             InputStream is=activityFile.getInputStream();
    18.             HSSFWorkbook wb=new HSSFWorkbook(is);
    19.             //根据wb获取HSSFSheet对象，封装了一页的所有信息
    20.             HSSFSheet sheet=wb.getSheetAt(0);//页的下标，下标从0开始，依次增加
    21.             //根据sheet获取HSSFRow对象，封装了一行的所有信息
    22.             HSSFRow row=null;
    23.             HSSFCell cell=null;
    24.             Activity activity=null;
    25.             List<Activity> activityList=new ArrayList<>();
    26.             for(int i=1;i<=sheet.getLastRowNum();i++) {//sheet.getLastRowNum()：最后一行的下标
    27.                 row=sheet.getRow(i);//行的下标，下标从0开始，依次增加
    28.                 activity=new Activity();
    29.                 activity.setId(UUIDUtils.getUUID());
    30.                 activity.setOwner(user.getId());
    31.                 activity.setCreateTime(DateUtils.formateDateTime(new Date()));
    32.                 activity.setCreateBy(user.getId());
    33.  
    34.                 for(int j=0;j
    35.                     //根据row获取HSSFCell对象，封装了一列的所有信息
    36.                     cell=row.getCell(j);//列的下标，下标从0开始，依次增加
    37.  
    38.                     //获取列中的数据 调用工具类HSSFUtils
    39.                     String cellValue= HSSFUtils.getCellValueForStr(cell);
    40.                     if(j==0){
    41.                         activity.setName(cellValue);
    42.                     }else if(j==1){
    43.                         activity.setStartDate(cellValue);
    44.                     }else if(j==2){
    45.                         activity.setEndDate(cellValue);
    46.                     }else if(j==3){
    47.                         activity.setCost(cellValue);
    48.                     }else if(j==4){
    49.                         activity.setDescription(cellValue);
    50.                     }
    51.                 }
    52.  
    53.                 //每一行中所有列都封装完成之后，把activity保存到list中
    54.                 activityList.add(activity);
    55.             }
    56.  
    57.             //调用service层方法，保存市场活动
    58.             int ret=activityService.saveCreateActivityByList(activityList);
    59.  
    60.             returnObject.setCode(Contants.RETURN_OBJECT_CODE_SUCCESS);
    61.             returnObject.setRetData(ret);//返回数据
    62.         }catch (Exception e){
    63.             e.printStackTrace();
    64.             returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
    65.             returnObject.setMessage("系统忙，请稍后重试....");
    66.         }
    67.  
    68.         return returnObject;
    69.     }

    重新运行项目：更改导入内容：

     

     （9）下面做查看市场活动明细：

    点击某个市场活动跳到详细的市场活动的页面：

     需求：

    用户在市场活动主页面,点击市场活动名称超级链接,跳转到明细页面,完成查看市场活动明细的功能.

             *在市场活动明细页面,展示:

               -市场活动的基本信息

               -该市场活动下所有的备注信息

     

     

    在ActivityMapper接口中添加方法：

     ActivityMapper.xml：中写sql语句：

    1.   
    2.   <select id="selectActivityForDetailById" parameterType="string" resultMap="BaseResultMap">
    3.       select a.id,u1.name as owner,a.name,a.start_date,a.end_date,a.cost,a.description,a.create_time,u2.name as create_by,
    4.           a.edit_time,u3.name as edit_by
    5.       from tbl_activity a
    6.       join tbl_user u1 on a.owner=u1.id
    7.       join tbl_user u2 on a.create_by=u2.id
    8.       left join tbl_user u3 on a.edit_by=u3.id
    9.       where a.id=#{id}
    10.   select>

     在ActivitySeervice接口中添加：

    实现类：

    （10） crm实现市场活动明细查询备注信息Mapper层和Serevice层controller层

    通过Mybatis逆向工程生成市场活动备注 对应的Mapper等代码：

    修改Mybatis逆向工程的配置文件，只修改注释表的信息

     运行：就生成了响应的代码， 生成备注的实体类：ActivityRemmark、备注的ActivityRemarkMapper接口、ActivityRemarkMappe.xml备注的配置文件

    在ActivityRemarkMappe接口里添加一个方法：

    1. /**
    2.      * 根据activityId查询该市场活动下所有备注的明细信息
    3.      * @param activityId
    4.      * @return
    5.      */
    6.     List selectActivityRemarkForDetailByActivityId(String activityId);

     在ActivityRemarkMappe.xml中写sql语句：

    2.

     创建ActivityRemarkService接口

    1. package com.bjpowernode.crm.workbench.service;
    2.  
    3. import com.bjpowernode.crm.workbench.domain.ActivityRemark;
    4.  
    5. import java.util.List;
    6.  
    7. public interface ActivityRemarkService {
    8.     //根据activityId查询该市场活动下所有备注的明细信息
    9.     List queryActivityRemarkForDetailByActivityId(String activityId);
    10.  
    11.    
    12. }

     实现类：

    1. package com.bjpowernode.crm.workbench.service.impl;
    2.  
    3. import com.bjpowernode.crm.workbench.domain.ActivityRemark;
    4. import com.bjpowernode.crm.workbench.mapper.ActivityRemarkMapper;
    5. import com.bjpowernode.crm.workbench.service.ActivityRemarkService;
    6. import org.springframework.beans.factory.annotation.Autowired;
    7. import org.springframework.stereotype.Service;
    8.  
    9. import java.util.List;
    10.  
    11. @Service("activityRemarkService")
    12. public class ActivityRemarkServiceImpl implements ActivityRemarkService {
    13.  
    14.     @Autowired
    15.     private ActivityRemarkMapper activityRemarkMapper;
    16.  
    17.     @Override
    18.     public List queryActivityRemarkForDetailByActivityId(String activityId) {
    19.         return activityRemarkMapper.selectActivityRemarkForDetailByActivityId(activityId);
    20.     }
    21.  
    22.    
    23. }

    ActivityController：

    1.  //根据activityId查询该市场活动和所有备注的明细信息请求
    2.      @RequestMapping("/workbench/activity/detailActivity.do")
    3.     public String detailActivity(String id,HttpServletRequest request){
    4.         //调用service层方法，查询数据
    5.         Activity activity=activityService.queryActivityForDetailById(id);
    6.         //查看备注信息
    7.         List<ActivityRemark> remarkList=activityRemarkService.queryActivityRemarkForDetailByActivityId(id);
    8.         //把数据保存到request中
    9.         request.setAttribute("activity",activity);
    10.         request.setAttribute("remarkList",remarkList);
    11.         //请求转发
    12.         return "workbench/activity/detail";
    13.     }

    把detail.html改为detail.jsp：

    修改从作用域获取数据： 

    1. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    2. <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    3. <%
    4. 	String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
    5. %>
    7. <head>
    8. 	"<%=basePath%>">
    9. 	"UTF-8">
    10.  
    11. 	<link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
    12. 	
    13. 	
    14.  
    15. 	
    16.  
    19.  
    21. "modal fade" id="editRemarkModal" role="dialog">
    22. 	<%-- 备注的id --%>
    23. 	type="hidden" id="remarkId">
    24. 	
      "modal-dialog" role="document" style="width: 40%;">
    25. 		
      "modal-content">
    26. 			
      "modal-header">
    27. 				
    28. 					"true">×
    29. 				
    30. 				
      "modal-title" id="myModalLabel">修改备注
    31.
  • "modal-body">
  • "form-horizontal" role="form">
  • type="hidden" id="edit-id">
  • "form-group">
  • "col-sm-10" style="width: 81%;">
  • "modal-footer">
  • "position: relative; top: 35px; left: 10px;">
  • "javascript:void(0);" onclick="window.history.back();">"glyphicon glyphicon-arrow-left" style="font-size: 20px; color: #DDDDDD">
  • "position: relative; left: 40px; top: -30px;">
  • "page-header">

  • 市场活动-${activity.name} ${activity.startDate} ~ ${activity.endDate}




  • "position: relative; top: -70px;">
  • "position: relative; left: 40px; height: 30px;">
  • "width: 300px; color: gray;">所有者
  • "width: 300px;position: relative; left: 200px; top: -20px;">${activity.owner}
  • "width: 300px;position: relative; left: 450px; top: -40px; color: gray;">名称
  • "width: 300px;position: relative; left: 650px; top: -60px;">${activity.name}
  • "height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -60px;">
  • "height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -60px; left: 450px;">
  • "position: relative; left: 40px; height: 30px; top: 10px;">
  • "width: 300px; color: gray;">开始日期
  • "width: 300px;position: relative; left: 200px; top: -20px;">${activity.startDate}
  • "width: 300px;position: relative; left: 450px; top: -40px; color: gray;">结束日期
  • "width: 300px;position: relative; left: 650px; top: -60px;">${activity.endDate}
  • "height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -60px;">
  • "height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -60px; left: 450px;">
  • "position: relative; left: 40px; height: 30px; top: 20px;">
  • "width: 300px; color: gray;">成本
  • "width: 300px;position: relative; left: 200px; top: -20px;">${activity.cost}
  • "height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -20px;">
  • "position: relative; left: 40px; height: 30px; top: 30px;">
  • "width: 300px; color: gray;">创建者
  • "width: 500px;position: relative; left: 200px; top: -20px;">${activity.createBy}  "font-size: 10px; color: gray;">${activity.createTime}
  • "height: 1px; width: 550px; background: #D5D5D5; position: relative; top: -20px;">
  • "position: relative; left: 40px; height: 30px; top: 40px;">
  • "width: 300px; color: gray;">修改者
  • "width: 500px;position: relative; left: 200px; top: -20px;">${activity.editBy}  "font-size: 10px; color: gray;">${activity.editTime}
  • "height: 1px; width: 550px; background: #D5D5D5; position: relative; top: -20px;">
  • "position: relative; left: 40px; height: 30px; top: 50px;">
  • "width: 300px; color: gray;">描述
  • "width: 630px;position: relative; left: 200px; top: -20px;">
  • ${activity.description}
  • "height: 1px; width: 850px; background: #D5D5D5; position: relative; top: -20px;">
  • id="remarkDivList" style="position: relative; top: 30px; left: 40px;">
  • "page-header">

  • 备注

  • "${remarkList}" var="remark">
  • id="div_${remark.id}" class="remarkDiv" style="height: 60px;">
  • "${remark.createBy}" src="image/user-thumbnail.png" style="width: 30px; height:30px;">
  • "position: relative; top: -40px; left: 40px;" >
  • ${remark.noteContent}
  • "gray">市场活动 "gray">- ${activity.name} "color: gray;"> ${remark.editFlag=='1'?remark.editTime:remark.createTime} 由${remark.editFlag=='1'?remark.editBy:remark.createBy}${remark.editFlag=='1'?'修改':'创建'}
  • "position: relative; left: 500px; top: -30px; height: 30px; width: 100px; display: none;">
  • "myHref" name="editA" remarkId="${remark.id}" href="javascript:void(0);">"glyphicon glyphicon-edit" style="font-size: 20px; color: #E6E6E6;">
  •     
  • "myHref" name="deleteA" remarkId="${remark.id}" href="javascript:void(0);">"glyphicon glyphicon-remove" style="font-size: 20px; color: #E6E6E6;">
  • <%--
    "remarkDiv" style="height: 60px;">
  • "zhangsan" src="image/user-thumbnail.png" style="width: 30px; height:30px;">
  • "position: relative; top: -40px; left: 40px;" >
  • 哎呦！
  • "gray">市场活动 "gray">- 发传单 "color: gray;"> 2017-01-22 10:10:10 由zhangsan
  • "position: relative; left: 500px; top: -30px; height: 30px; width: 100px; display: none;">
  • "myHref" href="javascript:void(0);">"glyphicon glyphicon-edit" style="font-size: 20px; color: #E6E6E6;">
  •     
  • "myHref" href="javascript:void(0);">"glyphicon glyphicon-remove" style="font-size: 20px; color: #E6E6E6;">
  • --%>
  • <%--
    "remarkDiv" style="height: 60px;">
  • "zhangsan" src="image/user-thumbnail.png" style="width: 30px; height:30px;">
  • "position: relative; top: -40px; left: 40px;" >
  • 呵呵！
  • "gray">市场活动 "gray">- 发传单 "color: gray;"> 2017-01-22 10:20:10 由zhangsan
  • "position: relative; left: 500px; top: -30px; height: 30px; width: 100px; display: none;">
  • "myHref" href="javascript:void(0);">"glyphicon glyphicon-edit" style="font-size: 20px; color: #E6E6E6;">
  •     
  • "myHref" href="javascript:void(0);">"glyphicon glyphicon-remove" style="font-size: 20px; color: #E6E6E6;">
  • --%>
  • id="remarkDiv" style="background-color: #E6E6E6; width: 870px; height: 90px;">
  • "form" style="position: relative;top: 10px; left: 10px;">

  • id="cancelAndSaveBtn" style="position: relative;left: 737px; top: 10px; display: none;">

  • "height: 200px;">

    • （11）crm实现查看市场活动明细前台页面

     添加市场活动备注需求：

    用户在市场活动明细页面,输入备注内容,点击"保存"按钮,完成添加市场活动备注的功能.

             *备注内容不能为空

             *添加成功之后,清空输入框,刷新备注列表

             *添加失败,提示信息,输入框不清空,列表也不刷新

     （12）crm添加市场活动备注实现Mapper层和Service层

     在ActivityRemarkMapper接口里添加方法：

     ActivityRemarkMapper.xml中添加sql语句：

    1. <!--保存创建的市场活动备注-->
    2.   <insert id="insertActivityRemark" parameterType="com.bjpowernode.crm.workbench.domain.ActivityRemark">
    3.     insert into tbl_activity_remark(id, note_content, create_time, create_by, edit_flag, activity_id)
    4.     values(#{id},#{ noteContent},#{ createTime},#{ createBy},#{ editFlag},#{ activityId})
    5.   </insert>

     在ActivityRemarkService接口添加：

     实现类：

    （13）crm添加市场活动备注实现controller层

     创建ActivityRemarkController类：添加请求

    1.  
    2.     //保存创建的市场活动备注请求
    3.     @RequestMapping("/workbench/activity/saveCreateActivityRemark.do")
    4.     public @ResponseBody Object saveCreateActivityRemark(ActivityRemark remark, HttpSession session){
    5.         User user=(User) session.getAttribute(Contants.SESSION_USER);
    6.         //封装参数
    7.         remark.setId(UUIDUtils.getUUID());
    8.         remark.setCreateTime(DateUtils.formateDateTime(new Date()));
    9.         remark.setCreateBy(user.getId());
    10.         remark.setEditFlag(Contants.REMARK_EDIT_FLAG_NO_EDITED);//Contants.REMARK_EDIT_FLAG_NO_EDITED:表示常量备注的修改标记
    11.  
    12.         ReturnObject returnObject=new ReturnObject();
    13.         try {
    14.             //调用service层方法，保存创建的市场活动备注
    15.             int ret = activityRemarkService.saveCreateActivityRemark(remark);
    16.  
    17.             if(ret>0){
    18.                 returnObject.setCode(Contants.RETURN_OBJECT_CODE_SUCCESS);
    19.                 returnObject.setRetData(remark);
    20.             }else{
    21.                 returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
    22.                 returnObject.setMessage("系统忙，请稍后重试....");
    23.             }
    24.         }catch (Exception e){
    25.             e.printStackTrace();
    26.             returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
    27.             returnObject.setMessage("系统忙，请稍后重试....");
    28.         }
    29.  
    30.         return returnObject;
    31.     }

     给detail.jsp的保存按钮添加事件：

    首先给按钮添加一个id：

     

    1. //给"保存"按钮添加单击事件
    2. 			$("#saveCreateActivityRemarkBtn").click(function () {
    3. 				//收集参数
    4. 				var noteContent=$.trim($("#remark").val());
    5. 				var activityId='${activity.id}';
    6. 				//表单验证
    7. 				if(noteContent==""){
    8. 					alert("备注内容不能为空");
    9. 					return;
    10. 				}
    11. 				//发送请求
    12. 				$.ajax({
    13. 					url:'workbench/activity/saveCreateActivityRemark.do',
    14. 					data:{
    15. 						noteContent:noteContent,
    16. 						activityId:activityId
    17. 					},
    18. 					type:'post',
    19. 					dateType:'json',
    20. 					success:function (data) {
    21. 						if(data.code=="1"){
    22. 							//清空输入框
    23. 							$("#remark").val("");
    24. 							//刷新备注列表
    25. 							var htmlStr="";
    26. 							htmlStr+="
      div_"+data.retData.id+"\" class=\"remarkDiv\" style=\"height: 60px;\">";
    27. 							htmlStr+="${sessionScope.sessionUser.name}\" src=\"image/user-thumbnail.png\" style=\"width: 30px; height:30px;\">";
    28. 							htmlStr+="
      position: relative; top: -40px; left: 40px;\" >";
    29. 							htmlStr+="
      "+data.retData.noteContent+"
      "      ;
    30. 							htmlStr+="gray\">市场活动 gray\">- ${activity.name} color: gray;\"> "+data.retData.createTime+" 由${sessionScope.sessionUser.name}创建";
    31. 							htmlStr+="
      position: relative; left: 500px; top: -30px; height: 30px; width: 100px; display: none;\">";
    32. 							htmlStr+="myHref\" name=\"editA\" remarkId=\""+data.retData.id+"\" href=\"javascript:void(0);\">glyphicon glyphicon-edit\" style=\"font-size: 20px; color: #E6E6E6;\">";
    33. 							htmlStr+="    ";
    34. 							htmlStr+="myHref\" name=\"deleteA\" remarkId=\""+data.retData.id+"\" href=\"javascript:void(0);\">glyphicon glyphicon-remove\" style=\"font-size: 20px; color: #E6E6E6;\">";
    35. 							htmlStr+="
      ";
    36. 							htmlStr+="
      ";
    37. 							htmlStr+="
      ";
    38. 							$("#remarkDiv").before(htmlStr);//追加显示到指定标签的后面
    39. 						}else{
    40. 							//提示信息
    41. 							alert(data.message);
    42. 						}
    43. 					}
    44. 				});
    45. 			});

     

    点击第一条测试：i测试07 

    添加备注：

     点击保存：

     

  • 相关阅读:
    探索Kubernetes的高可用性：单master集群和多master节点集群方案
    vscode c/c++ 检测到 #include 错误。请更新 includePath。
    web网页设计期末课程大作业 基于HTML+CSS+JavaScript响应式环保科技公司网站模板(环保主题网站设计)
    使用 Apache Camel 和 Quarkus 的微服务（一）
    GPT-SoVITS声音克隆训练和推理（新手教程,附整合包）
    Unable to find GatewayFilterFactory with name TokenRelay
    安装dai li
    Apache Doris 快速入门
    【毕业设计】基于单片机的智能饮水机系统 - stm32 物联网 嵌入式
    SOLID之DIP-依赖反转原则
  • 原文地址：https://blog.csdn.net/dengfengling999/article/details/127092960