用户在线索明细页面,点击"关联市场活动"按钮,弹出线索关联市场活动的模态窗口;
用户在线索关联市场活动的模态窗口,输入搜索条件,每次键盘弹起,根据名称模糊查询市场活动,把所有符合条件的市场活动显示到列表中;用户选择要关联的市场活动,点击"关联"按钮,完成线索关联市场活动的功能.
*每次至少关联一个市场活动
*同一个市场活动只能跟同一个线索关联一次
*关联成功之后,关闭模态窗口,刷新已经关联过的市场活动列表
*关联失败,提示信息,模态窗口不关闭,已经关联过的市场活动列表也不刷新
1. 给关联市场活动按钮添加单击事件 （初始化工作，清空搜索框） 每次点击都清空搜索框
2.清空搜索市场活动列表
3. 弹出“线索关联市场活动的模态窗口
4.给市场活动搜索框添加键盘弹起事件（键盘弹出触发事件 搜索查询）
根据线索id和输入的市场活动名称 activityName 和clueId 查询
收集参数 var activityName=this.value
var clueId='${clue.id}'; //从线索主页面收集到的线索信息 clue 发送到作用域request 中
发送请求ajax：
到url： ’workbench/clue/queryActivityForDetailByNameClueId.do'
把收集到的数据封装好 传到后端controller层
//给"关联市场活动"按钮添加单击事件
$("#bundActivityBtn").click(function () {
//初始化工作
//清空搜索框
$("#searchActivityTxt").val("");
//清空搜索的市场活动列表
$("#tBody").html("");
//弹出"线索关联市场活动"的模态窗口
$("#bundModal").modal("show");
});
//给市场活动搜索框添加键盘弹起事件
$("#searchActivityTxt").keyup(function () {
//收集参数
var activityName=this.value;
var clueId='${clue.id}';
//发送请求
$.ajax({
url:'workbench/clue/queryActivityForDetailByNameClueId.do',
data:{
activityName:activityName,
clueId:clueId
},
type:'post',
dataType:'json',
success:function (data) {
//遍历data，显示搜索到的市场活动列表
var htmlStr="";
$.each(data,function (index,obj) {
htmlStr+="<tr>";
htmlStr+="<td><input type=\"checkbox\" value=\""+obj.id+"\"/></td>";
htmlStr+="<td>"+obj.name+"</td>";
htmlStr+="<td>"+obj.startDate+"</td>";
htmlStr+="<td>"+obj.endDate+"</td>";
htmlStr+="<td>"+obj.owner+"</td>";
htmlStr+="</tr>";
});
$("#tBody").html(htmlStr);
}
});
});controller层
在线索详情页面绑定市场活动中通过活动名模糊查询市场活动
把activityName和clueId封装成map
调用service层的 根据
/*根据name模糊查询市场活动 并且把已经跟clueId关联过的 * 市场活动排除*/ List<Activity> selectActivityForDetailByNameAndClueId(Map<String ,Object> map);查询出满足条件的市场活动列表 activityList 把数据以json格式发送到前端
前端ajax请求 执行回调函数success
遍历activityList列表，拼接html到tBody盒子中
/*在线索详情页面绑定市场活动中通过市场活动名模糊查询市场活动*/
@RequestMapping("/workbench/clue/queryActivityForDetailByNameClueId.do")
@ResponseBody
public Object queryActivityForDetailByNameClueId(String activityName,String clueId){
//分装参数
Map<String,Object> map=new HashMap<>();
map.put("activityName",activityName);
map.put("clueId",clueId);
List<Activity> activityList=activityService.selectActivityForDetailByNameAndClueId(map);
return activityList;
}mapper
List<Activity> selectActivityForDetailByNameAndClueId(Map<String ,Object> map);
关联市场活动页面 模糊查询未关联的市场活动-->
<select id="selectActivityForDetailByNameAndClueId" parameterType="map" resultMap="BaseResultMap">
select a.id,a.name,a.start_date,a.end_date,u.name as owner
from tbl_activity a
join tbl_user u on a.owner=u.id
where a.name like '%' #{activityName} '%' and a.id not in (
select activity_id
from tbl_clue_activity_relation
where clue_id=#{clueId}
)
</select>
根据搜索到的列表给关联按钮添加事件
1.收集参数 获取列表中所有被选中的checkbox
var checkIds=$("#tBody input[type='checkbox']:checked");
2.获取被选中的列表框checkbox 进行表单验证 如果个数为0 提示信息
3.拼接字符串
var ids="";
$.each(checkIds，function(){
ids+='' activityId="+this.value+"&";);
ids+="clueId=${clue.id};
前端把获取到的参数 checkbox的id和线索id 收集起来
把参数ajax发送给后台
url:'workbench/clue/saveBund.do'
//给"关联"按钮添加单击事件
$("#saveBundActivityBtn").click(function () {
//收集参数
//获取列表中所有被选中的checkbox
var chckedIds=$("#tBody input[type='checkbox']:checked");
//表单验证
if(chckedIds.size()==0){
alert("请选择要关联的市场活动");
return;
}
var ids="";
$.each(chckedIds,function () {//activityId=xxxx&activityId=xxxx&....&activityId=xxxx&
ids+="activityId="+this.value+"&";
});
ids+="clueId=${clue.id}";//activityId=xxxx&activityId=xxxx&....&activityId=xxxx&clueId=xxxxx
//发送请求
$.ajax({
url:'workbench/clue/saveBund.do',
data:ids,
type:'post',
dataType:'json',
success:function (data) {
if(data.code=="1"){
//关闭模态窗口
$("#bundModal").modal("hide");
//刷新已经关联过的市场活动列表
var htmlStr="";
$.each(data.retDate,function (index,obj) {
htmlStr+="<tr id=\"tr_"+obj.id+"\">";
htmlStr+="<td>"+obj.name+"</td>";
htmlStr+="<td>"+obj.startDate+"</td>";
htmlStr+="<td>"+obj.endDate+"</td>";
htmlStr+="<td>"+obj.owner+"</td>";
htmlStr+="<td><a href=\"javascript:void(0);\" activityId=\""+obj.id+"\" style=\"text-decoration: none;\"><span class=\"glyphicon glyphicon-remove\"></span>解除关联</a></td>";
htmlStr+="</tr>";
});
$("#relationedTBody").append(htmlStr);
}else{
//提示信息
alert(data.message);
//模态窗口不关闭
$("#bundModal").modal("show");
}
}
});
});
controller层
接收id参数数组 activityId和线索id
把activityId中的每一个市场活动id 和线索id 封装成一个线索活动关系表
car =new ClueActivityRelation();
relationList.add(car);
调用service层方法 批量保存线索市场活动关联关系
int ret = clueActivityRelationService.insertClueActivityRelationByList(relationList);
前端ajax接受到请求 success
关闭模态窗口，刷新关联过的市场活动列表
@RequestMapping("/workbench/clue/saveBund.do")
@ResponseBody
public Object saveBound(String[] activityId,String clueId){
//封装参数
ClueActivityRelation car=null;
List<ClueActivityRelation> relationList=new ArrayList<>();
for(String ai:activityId){
car =new ClueActivityRelation();
car.setActivityId(ai);
car.setClueId(clueId);
car.setId(UUID.randomUUID().toString().replaceAll("-",""));
relationList.add(car);
}
ReturnObject returnObject=new ReturnObject();
try{
//调用service方法 批量保存线索和市场活动的关联关系
int ret = clueActivityRelationService.insertClueActivityRelationByList(relationList);
if(ret>0){
returnObject.setCode("1");
List<Activity> activityList= activityService.selectActivityForDetailByIds(activityId);
returnObject.setRetDate(activityList);
}else {
returnObject.setCode("0");
returnObject.setMessage("批量保存有误 稍后");
}
}catch (Exception e){
e.printStackTrace();
returnObject.setCode("0");
returnObject.setMessage("批量保存有误 稍后");
}
return returnObject;
}mapper
<!-- int insertClueActivityRelationByList(List<ClueActivityRelation> list);
-->
<insert id="insertClueActivityRelationByList" parameterType="com.bjpowernode.crm.workbench.domain.ClueActivityRelation">
insert into tbl_clue_activity_relation(id,clue_id,activity_id)
values
<foreach collection="list" item="obj" separator=",">
(#{obj.id},#{obj.clueId},#{obj.activityId})
</foreach>
</insert>
扫一扫
3994
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
