功能需求

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

         *备注内容不能为空

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

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

功能分析

流程图

 

 代码实现

一、ActivityRemarkMapper

1.ActivityRemarkMapper接口

     /**
     * 增加备注信息
     */
    int insertActivityRemark (ActivityRemark remark);

2.ActivityRemarkMapper映射文件

    <!--insertActivityRemark-->
    <insert id="insertActivityRemark">
        insert into tbl_activity_remark (id, note_content, create_time,
                                         create_by,edit_flag,activity_id)
        values (#{id}, #{noteContent}, #{createTime},
                #{createBy}, #{editFlag},#{activityId})
    </insert>

二、ActivityRemarkService

	/**
	 * 增加市场活动备注
	 */
	int saveCreateActivityRemark(ActivityRemark activityRemark);

	@Override
	public int saveCreateActivityRemark(ActivityRemark remark) {
		return activityRemarkMapper.insertActivityRemark(remark);
	}

三、ActivityRemarkController

	@RequestMapping("/workbench/activity/saveCreateActivityRemark.do")
	public @ResponseBody
	Object saveCreateActivityRemark(ActivityRemark remark, HttpSession session) {
		// 获取session
		User user = (User)session.getAttribute(Contants.SESSION_USER);
		// 封装参数
		remark.setId(UUIDUtils.getUUID());
		remark.setCreateTime(DateUtils.formateDateTime(new Date()));
		remark.setCreateBy(user.getId());
		remark.setEditFlag(Contants.RETURN_OBJECT_CODE_FAIL);
		// 调用service
		ReturnObject returnObject = new ReturnObject();
		try {
			int ret = activityRemarkService.saveCreateActivityRemark(remark);
			if (ret>0){
				//成功
				returnObject.setCode(Contants.RETURN_OBJECT_CODE_SUCCESS);
				returnObject.setRetDate(remark);
			}else {
				returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
				returnObject.setMessage("系统繁忙，稍后再试");
			}
		} catch (Exception e) {
			e.printStackTrace();
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("系统繁忙，稍后再试");
		}
		return returnObject;

	}

四、前端

2.detail.jsp

通过ajax发起异步请求，然后根据响应的data，进行备注的字符串拼接

            // 创建备注
            $("#saveBtn").click(function () {
                // 获取参数
                var noteContent = $("#remark").val();
                var activityId = '${activity.id}';// 从request请求域
                if (noteContent == "") {
                    alert("请输入备注内容");
                    return;
                }
                // 发送请求
                $.ajax({
                    url: 'workbench/activity/saveCreateActivityRemark.do',
                    data: {
                        noteContent: noteContent,
                        activityId: activityId
                    },
                    type: 'post',
                    // 处理响应
                    dataType: 'json',
                    success: function (data) {
                        if (data.code = "1") {
                            // 成功
                            // 清空
                            $("#remark").val("");
                            // 生成评论
                            var htmlStr = "";
                            htmlStr+="<div id=\"div_"+data.retDate.id+"\" class=\"remarkDiv\" style=\"height: 60px;\">";
                            htmlStr+="<img title=\"${sessionScope.sessionUser.name}\" src=\"image/user-thumbnail.png\" style=\"width: 34px; height:34px;\">";
                            htmlStr+="<div style=\"position: relative; top: -40px; left: 40px;width: 870px; \">";
                            htmlStr+="<small style=\"color: gray;\">@${sessionScope.sessionUser.name}:"+data.retDate.createTime+"创建</small>";
                            htmlStr+="<p>"+data.retDate.noteContent+"</p>";
                            htmlStr+="<div style=\"position: relative; left: 500px; top: -30px; height: 30px; width: 100px; display: none;\">";
                            htmlStr+="<a class=\"myHref\" name=\"editA\" remarkId=\""+data.retDate.id+"\" href=\"javascript:void(0);\"><span class=\"glyphicon glyphicon-edit\" style=\"font-size: 20px; color: #E6E6E6;\"></span></a>";
                            htmlStr+="&nbsp;&nbsp;&nbsp;&nbsp;";
                            htmlStr+="<a class=\"myHref\" name=\"deleteA\" remarkId=\""+data.retDate.id+"\" href=\"javascript:void(0);\"><span class=\"glyphicon glyphicon-remove\" style=\"font-size: 20px; color: #E6E6E6;\"></span></a>";
                            htmlStr+=" </div>";
                            htmlStr+=" </div>";
                            htmlStr+=" </div>";
                            $("#remarkDiv").before(htmlStr); // 以追加的方式增加备注

                        } else {
                            alert(data.message);
                        }

                    }
                });
            });