030开发日志(创建ManyToMany的column5)
现在对于这个字段来说，还剩最后一个功能了，那就是可以修改ManyToMany的值了。在grid的inline操作里面，是可以直接删除已有值，但是如果要新增的话，就必须要有一个新的界面了。下面来看看开发修改ManyToMany字段所需要的步骤。
1、创建一个修改窗口，在里面创建一个可check的树；
2､到后台请求数据，读取当前记录的所有的ManyToMany的可选项，并把已经选中的打勾；
3､根据读取到的数据更新树；
4､用户操作check 和 uncheck；
5､保存修改，使用ajax 将修改过后的ManyToMany中打勾的选项发送到后台，执行保存功能；
6､刷新当前记录，显示正确的ManyToMany值。
在以上的步骤中可以看出，对于所有的ManyToMany字段的修改都是用这一个办法。上面步骤中比较难的就是如何根据前台的请求生成模块该记录的ManyToMany的所有选项并把已经选中的打勾，以及保存修改过后的值。对于本系统而言，所有的方法尽量都是通用的，因此有些功能的开发比较困难。
在进行第2步操作时，前台应传给后台的参数应该有：当前模块名称，当前记录id，ManyToMany的模块名称，中间模块的名称。
同样在进行第5步操作的时候，也要传给后台第2步的参数，并加上当前所有选中ManyToMany的值。
接着前一节的ManyToManyColumn.js，来修改一下当用户单击修改按钮的时候要进行的操作。
processEvent : function(type, view, cell, recordIndex, cellIndex, e,
record, row) {
var me = this;
if (type === 'click') {
var module = this.up('modulegrid').module;
if (e.getTarget().className === 'manyToManyContext') {
app.modules.showModuleRecord(this.manyToManyModuleName, e
.getTarget().getAttribute('_id'));
} else if (Ext.String.startsWith(e.getTarget().className,
'manyToManyContextClose')) {
// 点击了删除按钮，先找到前面一个节点，里面包含了要删除的信息
var target = e.getTarget().previousElementSibling;
var text = module.tf_title + ' ' + record.getTitleTpl() + ' 的 '
+ this.manyToManyModuleTitle + '【' + target.innerHTML + '】';
Ext.MessageBox.confirm('确定删除', '确定要删除' + text + '吗?', function(
btn) {
if (btn == 'yes') {
// 使用module里面批量删除的ajax
Ext.Ajax.request({
url : 'rest/module/removerecords.do',
params : {
moduleName : me.fieldDefine.tf_joinTable,
ids : target.getAttribute('_joinid'),
titles : target.innerHTML
},
success : function(response) {
var info = Ext.decode(response.responseText, true);
if (info.resultCode == 0) {
Ext.toastInfo(text + ' 已成功被删除。');
// 删除记录后，刷新当前记录
me.up('modulegrid').refreshSelectedRecord();
} else {
Ext.MessageBox.show({
title : '删除结果',
msg : text + '删除失败：<br/><br/>'
+ info.errorMessageList,
buttons : Ext.MessageBox.OK,
icon : Ext.MessageBox.ERROR
});
}
},
failure : function() {
window.alert('删除时，服务器返回返回错误');
}
})
}
});
} else if (Ext.String.startsWith(e.getTarget().className,
'manyToManyEdit')) {
//编辑当前记录的manyToMany字段;
Ext.widget(
'manytomanyeditwindow',
{
grid : me.up('modulegrid'),
title : module.tf_title + '【' + record.getTitleTpl()
+ '】的' + this.manyToManyModuleTitle,
moduleName : module.tf_moduleName,
idvalue : record.getIdValue(),
manyToManyModuleName : me.manyToManyModuleName,
linkModuleName : me.fieldDefine.tf_joinTable
}).show();
}
}
}在上面的代码中可以看出，如果单击了修改按钮，会去创建一个manytomanyeditwindow。在这个window中完成上面的6步操作。
/**
* 修改记录的manyToMany字段的窗口，在窗口中完成选择操作，并可保存。
*/
Ext.define('app.module.widget.window.ManyToManyEditWindow', {
extend : 'Ext.window.Window',
alias : 'widget.manytomanyeditwindow',
requires : [ 'app.lib.CheckTreePanel' ],
width : 450,
height : 600,
modal : true,
maximizable : true,
layout : 'fit',
buttons : [ '->', {
text : '保存',
iconCls : 'fa fa-save',
handler : function(button) {
var window = button.up('window');
var tree = window.down('treepanel');
var selected = []
tree.getRootNode().cascadeBy(function(node) {
// 所有选中的 ManyToMany 的值
if (node.data.checked == true && node.data.leaf == true) {
selected.push(node.data.fieldvalue);
}
});
// 提交ajax请求后台修改
Ext.Ajax.request({
url : 'modulemanytomany/setmanytomanydetail.do',
params : {
moduleName : window.moduleName,
id : window.idvalue,
manyToManyModuleName : window.manyToManyModuleName,
linkModuleName : window.linkModuleName,
selected : selected.join(',')
},
success : function(response) {
var info = Ext.decode(response.responseText, true);
if (info.success) {
Ext.toastInfo(window.titlemess + ' 已保存。');
window.grid.refreshSelectedRecord();
window.close();
} else
Ext.toastError(window.titlemess + ' 保存失败。<br>' + '原因：' + info.msg);
}
})
}
}, {
text : '关闭',
iconCls : 'fa fa-close',
handler : function(button) {
button.up('window').close();
}
}, '->' ],
initComponent : function() {
var me = this;
this.titlemess = this.title;
this.title = '设置 ' + this.titlemess;
this.items = [ {
xtype : 'checktreepanel',
autoLoad : false,
rootVisible : false,
root : {},
store : Ext.create('Ext.data.TreeStore', {
proxy : {
type : 'ajax',
url : 'modulemanytomany/getmanytomanydetail.do',
extraParams : {
moduleName : me.moduleName,
id : me.idvalue,
manyToManyModuleName : me.manyToManyModuleName,
linkModuleName : me.linkModuleName
}
}
})
} ];
this.callParent(arguments);
}
})这是前台的界面操作的代码，那么后台要处理上面所述的第2,第5步。需要新增一个Controller类来接收ajax请求。下面这个是控制类：
package com.jfok.cfcmms.controller;
import java.util.List;
import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.jfok.cfcmms.service.ModuleManyToManyService;
import com.jfok.cfcmms.share.TreeNodeRecordChecked;
import com.jfok.cfcmms.util.ActionResult;
/**
* 用来管理模块的ManyToMany数据的读取和修改的保存
*
* @author jiangfeng
*
* 2016-01-11
*
*/
@Controller
@RequestMapping("/modulemanytomany")
public class ModuleManyToManyController {
@Resource
private ModuleManyToManyService moduleManyToManyService;
/**
*
* @param request
* @param moduleName
* 当前模块名称
* @param id
* 当前记录id
* @param manyToManyModuleName
* manyToMany的模块名称
* @param linkModuleName
* 中间模块名称
* @return 返回所有manyToManyModuleName的记录数据，并把当前记录已有的manyToMany值的checked置为true
*/
@RequestMapping("/getmanytomanydetail.do")
public @ResponseBody List<TreeNodeRecordChecked> genManyToManyDetail(HttpServletRequest request,
String moduleName, String id, String manyToManyModuleName, String linkModuleName) {
return moduleManyToManyService.getManyToManyDetail(request, moduleName, id,
manyToManyModuleName, linkModuleName);
}
/**
*
* @param request
* @param moduleName
* 当前模块名称
* @param id
* 当前记录id
* @param manyToManyModuleName
* manyToMany的模块名称
* @param linkModuleName
* 中间模块名称
* @param selected
* 所有选中的值，以逗号分隔
* @return 返回所有manyToManyModuleName的记录数据，并把当前记录已有的manyToMany值的checked置为true
*/
@RequestMapping("/setmanytomanydetail.do")
public @ResponseBody ActionResult setManyToManyDetail(HttpServletRequest request,
String moduleName, String id, String manyToManyModuleName, String linkModuleName,
String selected) {
return moduleManyToManyService.setManyToManyDetail(request, moduleName, id,
manyToManyModuleName, linkModuleName, selected.split(","));
}
}
最后一个就是用来处理请求的Service类了，这个类也是这个功能的关键。由他来完成系统中所有的类似的ManyToMany字段读取和修改的操作。
package com.jfok.cfcmms.service;
import java.util.ArrayList;
import java.util.List;
import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Propagation;
import org.springframework.transaction.annotation.Transactional;
import com.jfok.cfcmms.DAO.ModuleDAO;
import com.jfok.cfcmms.DAO.SystemBaseDAO;
import com.jfok.cfcmms.core.module.SqlGenerator;
import com.jfok.cfcmms.core.module.SqlModuleFilter;
import com.jfok.cfcmms.hibernate.system.module._Module;
import com.jfok.cfcmms.share.TreeNodeRecord;
import com.jfok.cfcmms.share.TreeNodeRecordChecked;
import com.jfok.cfcmms.share.ValueText;
import com.jfok.cfcmms.util.ActionResult;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
@Service
public class ModuleManyToManyService {
@Resource
private SystemBaseDAO systemBaseDAO;
@Resource
private ModuleDAO moduleDAO;
@Resource
private ModuleService moduleService;
/**
*
* @param request
* @param moduleName
* 当前模块名称
* @param id
* 当前记录id
* @param manyToManyModuleName
* manyToMany的模块名称
* @param linkModuleName
* 中间模块名称
* @return 返回所有manyToManyModuleName的记录数据，并把当前记录已有的manyToMany值的checked置为true
*/
@Transactional(propagation = Propagation.REQUIRED, readOnly = true)
public List<TreeNodeRecordChecked> getManyToManyDetail(HttpServletRequest request,
String moduleName, String id, String manyToManyModuleName, String linkModuleName) {
_Module module = SystemAndLoginInfoService.getModuleWithName(moduleName);
_Module manyToManyModule = SystemAndLoginInfoService.getModuleWithName(manyToManyModuleName);
List<TreeNodeRecord> result = new ArrayList<TreeNodeRecord>();
// 首先读取manyToManyModuleName中的所有权限可视范围之内的数据
List<ValueText> allTreeItems = moduleDAO.getModuleWithComboDataWithQuery(manyToManyModuleName,
null, request);
for (ValueText vt : allTreeItems) {
TreeNodeRecordChecked record = new TreeNodeRecordChecked();
record.setFieldvalue(vt.getValue());
record.setText(vt.getText());
record.setLeaf(true);
result.add(record);
}
// 在linkModuleName中读取当前id的manyToMany的值,在数据可视涠之内
List<SqlModuleFilter> filters = new ArrayList<SqlModuleFilter>();
SqlModuleFilter moduleIdFilter = new SqlModuleFilter();
moduleIdFilter.setModuleName(module.getTf_moduleName());
moduleIdFilter.setTableAsName(module.getTableAsName());
moduleIdFilter.setPrimarykey(module.getTf_primaryKey());
moduleIdFilter.setEqualsValue(id);
filters.add(moduleIdFilter);
SqlGenerator generator = new SqlGenerator(linkModuleName, request);
generator.setModuleFilters(filters);
JSONArray dataArray = moduleDAO.getData(generator, -1, 0);
// 生成TreeNodeRecordChecked,并加入checked标志
for (int i = 0; i < dataArray.size(); i++) {
String manytomanyid = dataArray.getJSONObject(i).getString(
manyToManyModule.getTableAsName() + "___" + manyToManyModule.getTf_primaryKey());
for (TreeNodeRecord record : result) {
if (record.getFieldvalue().equals(manytomanyid))
((TreeNodeRecordChecked) record).setChecked(true);
}
}
// 返回结果
List<TreeNodeRecordChecked> root = new ArrayList<TreeNodeRecordChecked>();
TreeNodeRecordChecked rootrecord = new TreeNodeRecordChecked();
rootrecord.setText(manyToManyModule.getTf_title());
rootrecord.setChildren(result);
rootrecord.setExpanded(true);
root.add(rootrecord);
return root;
}
public ActionResult setManyToManyDetail(HttpServletRequest request, String moduleName, String id,
String manyToManyModuleName, String linkModuleName, String[] selected) {
_Module module = SystemAndLoginInfoService.getModuleWithName(moduleName);
_Module manyToManyModule = SystemAndLoginInfoService.getModuleWithName(manyToManyModuleName);
_Module linkedModule = SystemAndLoginInfoService.getModuleWithName(linkModuleName);
// 在linkModuleName中读取当前id的manyToMany的值,在数据可视涠之内
List<SqlModuleFilter> filters = new ArrayList<SqlModuleFilter>();
SqlModuleFilter moduleIdFilter = new SqlModuleFilter();
moduleIdFilter.setModuleName(module.getTf_moduleName());
moduleIdFilter.setTableAsName(module.getTableAsName());
moduleIdFilter.setPrimarykey(module.getTf_primaryKey());
moduleIdFilter.setEqualsValue(id);
filters.add(moduleIdFilter);
SqlGenerator generator = new SqlGenerator(linkModuleName, request);
generator.setModuleFilters(filters);
JSONArray dataArray = moduleDAO.getData(generator, -1, 0);
// 如果原来有，现在selected里面没有了，那么就要删除了
for (int i = 0; i < dataArray.size(); i++) {
String manytomanyid = dataArray.getJSONObject(i).getString(
manyToManyModule.getTableAsName() + "___" + manyToManyModule.getTf_primaryKey());
boolean isfound = false;
for (String selectedid : selected) {
if (manytomanyid.equals(selectedid)) {
isfound = true;
break;
}
}
if (!isfound) {
// 需要删除这个manyTomany，调用系统Service的remove，会判断能否删除的逻辑，会记入日志
// 尚未做出错处理
moduleService.remove(linkModuleName,
dataArray.getJSONObject(i).getString(linkedModule.getTf_primaryKey()), request);
}
}
// 如果原来没有，现在selected里面有了，那么就要增加进去
for (String selectedid : selected) {
if (selectedid.length() > 0) {
boolean isfound = false;
for (int i = 0; i < dataArray.size(); i++) {
String manytomanyid = dataArray.getJSONObject(i).getString(
manyToManyModule.getTableAsName() + "___" + manyToManyModule.getTf_primaryKey());
if (manytomanyid.equals(selectedid)) {
isfound = true;
break;
}
}
if (!isfound) {
JSONObject object = new JSONObject();
object.put(
manyToManyModule.getTableAsName() + "___" + manyToManyModule.getTf_primaryKey(),
selectedid);
object.put(module.getTableAsName() + "___" + module.getTf_primaryKey(), id);
// 需要新增这个manyTomany,调用系统Service的add ,会判断是否能新增等逻辑，会记入日志
// 尚未做出错处理
moduleService.add(linkModuleName, object.toString(), request);
}
}
}
ActionResult result = new ActionResult();
return result;
}
}
经过以上代码的协同工作，我们可以打开人员的设置权限的窗口来进行权限设置了。
修改一些用户操作角色，然后保存。
至此用户的ManyToMany字段操作角色的修改即可完成。
对于操作角色来说，用户也是一个ManyToMany字段，同样也适用于这样操作。
至此ManyToMany字段的定义、显示、操作都基本完成。
进阶设想：
对于选择tree的改进。在我现在的系统里，在用户模块中，有一个设置权限的按钮，其实就是完成了ManyToMany字段的选择与保存，有了这个字段功能之后，这个设置权限的按钮就可以不要了。但是有一点是不一样的，看看下面的截图：
在上图的选择角色的窗口的tree中，角色是按照角色分组来进行分类的，这样在选择的时候可以更直观。以后的ManyToMany字段的选择树也要做成可以配置成这样的结构。这里我大体先写一下思路：
1､在模块配置中新增一个配置字段：ManyToMany选择时候的树形模块路径；
2､在某个模块被当作ManyToMany字段来选择的时候，读取其模块路径，然后把当前模块的值都加在相应的节点之下。
比如对于角色来选择人员来说，可以把部门作为人员的模块路径，这样在选择树中，先是部门的值，然后人员会挂在相应的部门之下来进行选择。
（这个功能以后有时间再做了）
8372
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
